.counsel_wrapper .counseling_form {
display: flex;
width: 960px;
height: 104px;
margin-left: -480px;
position: absolute;
left: 50%;
top: 80%;
z-index: 4;
align-items: center;
border-radius: 70px;
background-color: var(--C-19212d);
}
.counsel_wrapper .counseling_form .input_name {
width: 140px;
height: 58px;
margin-left: 20px;
padding: 0 20px;
font-size: var(--f-19);
color: var(--C-aaaab3);
font-weight: 500;
box-sizing: border-box;
text-align: center;
border-radius: 50px;
border: none;
}
.counsel_wrapper .counseling_form .input_phone {
width: 170px;
height: 58px;
margin-left: 13px;
padding: 0 20px;
font-size: var(--f-19);
color: var(--C-aaaab3);
font-weight: 500;
box-sizing: border-box;
text-align: center;
border-radius: 50px;
border: none;
}
.counsel_wrapper .counseling_form .select_field {
width: 180px;
height: 58px;
margin-left: 13px;
padding-left: 25px;
font-size: var(--f-19);
color: var(--C-aaaab3);
font-weight: 500;
box-sizing: border-box;
border-radius: 50px;
outline: none;
border: none;
appearance: none;
-webkit-appearance: none;
-moz-appearance: none;
background: var(--C-ffffff)
url(//image.idhospital.com/www/rn_2025/common/icon_select_field.png)
no-repeat right 29px center;
}
.counsel_wrapper .counseling_form .clausewrap {
margin-left: 13px;
margin-bottom: 0;
font-size: var(--f-13);
color: var(--C-ffffff);
}
.counsel_wrapper .counseling_form .checkbox_style {
display: inline-flex;
align-items: center;
cursor: pointer;
user-select: none;
}
.counsel_wrapper .counseling_form .checkbox_style input[type="checkbox"] {
display: none;
}
.counsel_wrapper .counseling_form .checkbox_style .box {
display: inline-block;
width: 24px;
height: 24px;
margin-right: 9px;
position: relative;
border-radius: 4px;
background-color: var(--C-ffffff);
}
.counsel_wrapper .counseling_form .checkbox_style input[type="checkbox"]:checked + .box {
background: var(--C-ffffff)
url(//image.idhospital.com/www/rn_2025/common/icon_checkbox_check.png)
no-repeat center center;
}
.counsel_wrapper .counseling_form .clausewrap a {
margin-left: 2px;
font-size: var(--f-13);
color: var(--C-aaaab3);
vertical-align: 9px;
border-bottom: 1px solid var(--C-aaaab3);
}
.counsel_wrapper .counseling_form .btn_request {
display: flex;
width: 180px;
height: 100%;
position: absolute;
right: -3px;
top: 0;
font-size: var(--f-24);
color: var(--C-ffffff);
font-weight: 800;
cursor: pointer;
align-items: center;
justify-content: center;
border: none;
border-radius: 70px;
/* background-color: var(--C-f66fd6); */
}
.counsel_wrapper .counseling_form .btn_request br {
display: none;
}
.counsel_wrapper .counseling_form .clause {
margin-left: 13px;
margin-bottom: 0;
font-size: var(--f-13);
color: var(--C-ffffff);
}
.counsel_wrapper .counseling_form .clause a {
margin-left: 2px;
font-size: var(--f-13);
color: var(--C-aaaab3);
vertical-align: 9px;
border-bottom: 1px solid var(--C-aaaab3);
}
.counsel_wrapper .counseling_form .clausewrap_wrap {
display: none;
width: 100%;
position: absolute;
left: 0;
top: 100%;
padding: 3%;
box-sizing: border-box;
background-color: var(--C-ffffff);
}
.counsel_wrapper .counseling_form .clausewrap_wrap.on {
display: block;
}
.counsel_wrapper .counseling_form .clausewrap_content {
margin: 45px 0 40px;
border-top: 1px solid var(--C-e3e3e3);
border-bottom: 2px solid var(--C-e3e3e3);
}
.counsel_wrapper .counseling_form .clausewrap_content .item {
display: none;
}
.counsel_wrapper .counseling_form .clausewrap_content .item.on {
display: block;
}
.counsel_wrapper .counseling_form .clausewrap_content .clausewrap_box {
display: flex;
padding: 40px 0;
border-top: 1px solid var(--C-e3e3e3);
border-bottom: 1px solid var(--C-e3e3e3);
}
.counsel_wrapper .counseling_form .clausewrap_content .clausewrap_box p {
font-size: var(--f-20);
color: var(--C-000b17);
font-weight: 500;
}
.counsel_wrapper .counseling_form .clausewrap_content .clausewrap_box p i {
color: var(--C-f172ac);
}
.counsel_wrapper .counseling_form .clausewrap_content .clausewrap_box label {
margin-left: 30px;
}
.counsel_wrapper .counseling_form .clausewrap_content .clausewrap_title {
padding: 30px 0 10px;
font-size: var(--f-17);
color: var(--C-000b17);
font-weight: 800;
}
.counsel_wrapper .counseling_form .clausewrap_content .clausewrap_table {
display: grid;
grid-template-columns: 1fr 2fr 1.2fr;
border: 1px solid var(--C-737380);
border-top: 2px solid var(--C-45474d);
}
.counsel_wrapper .counseling_form .clausewrap_content .clausewrap_table .item {
display: contents;
}
.counsel_wrapper .counseling_form .clausewrap_content .clausewrap_table .th {
padding: 20px;
font-size: var(--f-15);
color: var(--C-000b17);
border-right: 1px solid var(--C-737380);
border-bottom: 1px solid var(--C-737380);
}
.counsel_wrapper .counseling_form .clausewrap_content .clausewrap_table .th:last-child {
border-right: none;
}
.counsel_wrapper .counseling_form .clausewrap_content .clausewrap_table .td {
padding: 20px;
font-size: var(--f-15);
color: var(--C-737380);
border-right: 1px solid var(--C-737380);
}
.counsel_wrapper .counseling_form .clausewrap_content .clausewrap_table .td:last-child {
border-right: none;
}
.counsel_wrapper .counseling_form .clausewrap_content .clausewrap_text {
height: 160px;
margin-top: 5px;
overflow: auto;
padding: 25px 30px;
box-sizing: border-box;
border-radius: 10px;
background-color: var(--C-f4f4f4);
}
.counsel_wrapper .counseling_form .clausewrap_wrap .btn_close {
display: block;
width: 112px;
height: 46px;
margin: 30px auto 0;
font-size: var(--f-21);
color: var(--C-e46ea4);
font-weight: 800;
border-radius: 50px;
border: 1px solid var(--C-e46ea4);
background: none;
}
.counsel_wrapper .counseling_form .btn_request_mo {
display: none;
}
.clause_wrap {
display: none;
width: 100%;
position: absolute;
left: 0;
top: 100%;
padding: 3%;
box-sizing: border-box;
background-color: var(--C-ffffff);
}
.clause_wrap.on {
display: block;
}
/* ===================== 1024px ì´í•˜ ===================== */
@media (max-width: 1024px) {
.counsel_wrapper .counseling_form {
width: 680px;
margin-left: -340px;
flex-direction: row;
flex-wrap: wrap;
}
.counsel_wrapper .counseling_form .input_name {
height: 38px;
margin-left: 40px;
font-size: var(--f-17);
}
.counsel_wrapper .counseling_form .input_phone {
height: 38px;
font-size: var(--f-17);
}
.counsel_wrapper .counseling_form .select_field {
height: 38px;
font-size: var(--f-17);
}
.counsel_wrapper .counseling_form .clause {
display: flex;
width: 100%;
margin-left: 80px;
}
.counsel_wrapper .counseling_form .clausewrap {
display: flex;
width: 100%;
margin-left: 80px;
}
.counsel_wrapper .counseling_form .clausewrap div {
margin-right: 20px;
}
.counsel_wrapper .counseling_form .btn_request {
width: 104px;
font-size: var(--f-20);
}
.counsel_wrapper .counseling_form .btn_request br {
display: block;
}
}
/* ===================== 1020px ì´í•˜ ===================== */
@media (max-width: 1020px) {
.counsel_wrapper .counseling_form .clausewrap_content {
margin: 4% 0 4%;
}
.counsel_wrapper .counseling_form .clausewrap_content .clausewrap_box {
flex-direction: row;
flex-wrap: wrap;
justify-content: flex-end;
}
.counsel_wrapper .counseling_form .clausewrap_content .clausewrap_box p {
width: 100%;
padding-bottom: 10px;
}
}
/* ===================== 720px ì´í•˜ ===================== */
@media (max-width: 720px) {
/*.counsel_wrapper .counseling_form {*/
/* !* display: none; *!*/
/* width: 96%;*/
/* height: auto;*/
/* padding: 15px;*/
/* border-radius: 20px;*/
/* flex-wrap: wrap;*/
/* box-sizing: border-box;*/
/* flex-direction: row;*/
/* flex-wrap: wrap;*/
/*}*/
.counsel_wrapper .counseling_form .item {
margin-bottom: 15px;
flex: 1 1 30%;
}
.counsel_wrapper .counseling_form .input_name {
width: 95%;
margin-left: 0;
}
.counsel_wrapper .counseling_form .input_phone {
width: 95%;
margin: 0;
}
.counsel_wrapper .counseling_form .select_field {
/*width: 100%;*/
/*min-width: 200px;*/
/*max-width: 220px;*/
/*margin: 0;*/
}
.counsel_wrapper .counseling_form .clausewrap {
flex: 100%;
margin-left: 0;
padding: 0 0 20px;
flex-direction: row;
flex-wrap: wrap;
}
.counsel_wrapper .counseling_form .btn_request {
/*display: none;*/
/*width: auto;*/
/*margin: 0 auto;*/
/*padding: 10px 20px;*/
/*position: relative;*/
/*font-weight: 600;*/
}
.counsel_wrapper .counseling_form .btn_request br {
display: none;
}
.counsel_wrapper .counseling_form .clausewrap_content .item {
padding-bottom: 6%;
}
.counsel_wrapper .counseling_form .clausewrap_content .clausewrap_box {
padding: 6% 0;
}
.counsel_wrapper .counseling_form .clausewrap_content .clausewrap_box p {
font-size: 4vw;
}
.counsel_wrapper .counseling_form .clausewrap_content .clausewrap_box label {
font-size: 4vw;
}
.counsel_wrapper .counseling_form .clausewrap_content .clausewrap_title {
font-size: 4vw;
}
.counsel_wrapper .counseling_form .clausewrap_content .clausewrap_table .th {
font-size: 3vw;
}
.counsel_wrapper .counseling_form .clausewrap_content .clausewrap_table .td {
font-size: 3vw;
}
.counsel_wrapper .counseling_form .clausewrap_content .clausewrap_text {
padding: 3% 5%;
font-size: 3.5vw;
}
/* MOBILE */
.counsel_wrapper .counseling_form {
position: fixed;
left: 0;
right: 0;
bottom: 0;
margin: 0;
height: 21.11vw; /*152px*/
top: auto;
width: 100%;
/*z-index: 100;*/
padding: 2.78vw 2.78vw 4.17vw 2.78vw; /* 20px 20px 30px 20px */
border-top-left-radius: 4.44vw; /*32px*/
border-top-right-radius: 4.44vw; /*32px*/
border-bottom-left-radius: 0;
border-bottom-right-radius: 0;
gap: 0 var(--vw13);
flex-direction: row;
flex-wrap: wrap;
background-color: rgba(0, 11, 23, 0.7);
}
.counsel_wrapper .counseling_form .item {
margin-bottom: var(--vw13);
flex: 1 1 calc(20% - var(--vw13));
}
/* ì´ë¦„ */
.counsel_wrapper .counseling_form .item.name {
flex: 1 1 calc(12% - var(--vw13));
}
/* ì—°ë½ì²˜ */
.counsel_wrapper .counseling_form .item.ph_numb {
flex: 1 1 calc(16% - var(--vw13));
}
/* ìˆ˜ìˆ ë¶€ìœ„ ì„ íƒ */
.counsel_wrapper .counseling_form .item.select_box {
flex: 1 1 calc(24% - var(--vw13));
}
.counsel_wrapper .counseling_form .clause {
padding: 0;
font-size: var(--vw20);
letter-spacing: -0.07vw;
max-width: 79.44vw; /* 572px */
margin: 0 auto;
display: flex;
align-items: center;
flex: 1 1 auto;
}
.counsel_wrapper .counseling_form .clause a {
font-size: var(--vw20);
}
.counsel_wrapper .counseling_form .checkbox_style .box {
width: var(--vw24);
height: var(--vw24);
margin-right: var(--vw9);
border-radius: var(--vw4);
}
.counsel_wrapper .counseling_form .checkbox_style input[type="checkbox"]:checked + .box {
background-size: var(--vw17);
}
.counseling_form .clause > * {
flex: 1 1 auto;
display: flex;
align-items: center;
}
.counsel_wrapper .counseling_form .clause div {
margin: 0;
}
.counsel_wrapper .counseling_form .btn_request_mo {
display: block;
margin-bottom: var(--vw13);
flex: 1 1 calc(20% - var(--vw13));
line-height: 8.06vw; /* 58px */
height: 8.06vw; /* 58px */
top: auto;
padding: 0 var(--vw10);
border-radius: 4.03vw; /* 29px */
justify-content: center;
color: var(--C-ffffff);
cursor: pointer;
border: none;
font-size: 3.33vw; /* 24px */
font-weight: 800;
letter-spacing: -0.07vw;
}
.counsel_wrapper .counseling_form .btn_request {
display: none;
line-height: var(--vw44);
height: var(--vw44);
top: auto;
padding: 0 var(--vw10);
border-radius: var(--vw8);
margin: 0;
font-size: var(--vw20);
justify-content: center;
}
.counsel_wrapper .counseling_form .input_phone,
.counsel_wrapper .counseling_form .input_name,
.counsel_wrapper .counseling_form .select_field {
border-radius: 4.03vw; /* 29px*/
width: 100%;
height: 8.06vw; /* 52px*/
font-size: var(--vw24);
padding: 0 1.39vw; /*0 10px*/
}
.counsel_wrapper .counseling_form .select_field {
background-position: 91% center;
background-size: var(--vw17);
min-width: 0;
width: 100%;
margin: 0;
padding: 0 var(--vw20);
}
.counsel_wrapper .counseling_form .btn_request span {
display: none;
}
.clause_wrap {
position: fixed;
top: 0;
bottom: 0;
right: 0;
left: 0;
width: auto;
z-index: 1000;
background-color: transparent;
}
.clause_wrap::before {
content: "";
background-color: var(--C-000000);
position: fixed;
left: 0;
right: 0;
top: 0;
bottom: 0;
opacity: 0.5;
}
.clause_content {
max-width: 98%;
margin: 0 auto;
display: flex;
flex-direction: column;
padding: 3%;
height: 100%;
position: relative;
background-color: var(--C-ffffff);
overflow: auto;
box-sizing: border-box;
font-size: var(--vw14);
}
.clause_content .clause_text {
height: auto;
overflow: auto;
}
.clause_content .clause_box p,
.clause_content .clause_box label,
.clause_content .clause_title {
font-size: var(--vw20);
}
.clause_content .clause_text,
.imp_text {
font-size: var(--vw18);
}
.clause_wrap .btn_close {
height: var(--vw46);
font-size: var(--vw21);
}
}
@media (max-width: 720px) {
/* MOBILE */
.counseling_form {
position: fixed;
left: 0;
right: 0;
bottom: 0;
margin: 0;
top: auto;
width: 100%;
z-index: 100;
background-color: rgba(25, 33, 45, 0.7);
padding: var(--vw10);
border-radius: 0;
gap: 0 var(--vw13);
}
.counseling_form .item {
margin-bottom: var(--vw13);
flex: 1 1 calc(33% - var(--vw13));
}
.counseling_form .clause {
padding: 0;
font-size: var(--vw16);
margin: 0;
display: flex;
align-items: center;
flex: 1 1 auto;
}
.counseling_form .clause a {
font-size: var(--vw17);
}
.counseling_form .checkbox_style .box {
width: var(--vw24);
height: var(--vw24);
margin-right: var(--vw9);
border-radius: var(--vw4);
}
.counseling_form .checkbox_style input[type="checkbox"]:checked + .box {
background-size: var(--vw17);
}
.counseling_form .clause > * {
flex: 1 1 auto;
display: flex;
align-items: center;
}
.counseling_form .clause div {
margin: 0;
}
.counseling_form .btn_request {
padding: 0;
line-height: var(--vw44);
height: var(--vw44);
top: auto;
padding: 0 var(--vw10);
border-radius: var(--vw8);
margin: 0;
font-size: var(--vw20);
justify-content: center;
}
.counseling_form .input_phone,
.counseling_form .input_name,
.counseling_form .select_field {
border-radius: var(--vw8);
width: 100%;
height: var(--vw44);
font-size: var(--vw17);
}
.counseling_form .select_field {
background-position: 95% center;
padding-left: var(--vw20);
background-size: var(--vw17);
min-width: 0;
}
.counseling_form .btn_request span {
display: none;
}
.clause_wrap {
position: fixed;
left: auto;
top: 0;
bottom: 0;
right: 0;
left: 0;
width: auto;
z-index: 1000;
background-color: transparent;
}
.clause_wrap::before {
content: "";
background-color: var(--C-000000);
position: fixed;
left: 0;
right: 0;
top: 0;
bottom: 0;
opacity: 0.5;
}
.clause_content .clause_text {
height: auto;
overflow: auto;
}
.clause_content .clause_box p,
.clause_content .clause_box label,
.clause_content .clause_title {
font-size: var(--vw20);
}
.clause_content .clause_text,
.imp_text {
font-size: var(--vw18);
}
.clause_wrap .btn_close {
height: var(--vw46);
font-size: var(--vw21);
}
}
/* CBU 별 버튼 컬러 */
/* ë©”ì¸ */
.counsel_wrapper .counseling_form .btn_request,
.counsel_wrapper .counseling_form .btn_request_mo {
background-color: #ff77b9;
}
/* 눈 */
.eye .counsel_wrapper .counseling_form .btn_request_mo,
.eye_center .counsel_wrapper .counseling_form .btn_request_mo,
.eye_center .C-visual .counsel_wrapper .counseling_form .btn_request,
.eye .C-visual .counsel_wrapper .counseling_form .btn_request {
background-color: #f25ace;
}
/* 중년 눈 */
.middle_age .counsel_wrapper .counseling_form .btn_request_mo,
.middle_age .C-visual .counsel_wrapper .counseling_form .btn_request {
background-color: #e7538a;
}
/* ì½” */
.nose .counsel_wrapper .counseling_form .btn_request_mo,
.nose .C-visual .counsel_wrapper .counseling_form .btn_request {
background-color: #3bbc1d;
}
/* ì´ë¹„ì¸í›„ê³¼ */
.functional .counsel_wrapper .counseling_form .btn_request_mo,
.functional .C-visual .counsel_wrapper .counseling_form .btn_request {
background-color: #00a06b;
}
/* 안면윤곽 */
.contour .counsel_wrapper .counseling_form .btn_request_mo,
.contour_center .counsel_wrapper .counseling_form .btn_request_mo,
.contour_center .C-visual .counsel_wrapper .counseling_form .btn_request,
.contour .C-visual .counsel_wrapper .counseling_form .btn_request {
background-color: #04cad7;
}
/* 리프팅 */
.lifting .counsel_wrapper .counseling_form .btn_request_mo,
.lifting_center .counsel_wrapper .counseling_form .btn_request_mo,
.lifting .C-visual .counsel_wrapper .counseling_form .btn_request,
.lifting_center .C-visual .counsel_wrapper .counseling_form .btn_request{
background-color: #ff7f1a;
}
/* 가슴 */
.breast .counsel_wrapper .counseling_form .btn_request_mo,
.breast .C-visual .counsel_wrapper .counseling_form .btn_request {
background-color: #ea32ab;
}
/* 가슴 모티바 */
.motiva.breast .counsel_wrapper .counseling_form .btn_request_mo,
.motiva.breast .C-visual .counsel_wrapper .counseling_form .btn_request {
background-color: #c200d9;
}
/* 남ìžì„±í˜• */
.man .counsel_wrapper .counseling_form .btn_request_mo,
.man .C-visual .counsel_wrapper .counseling_form .btn_request {
background-color: #385eee;
}
/* ì–‘ì•…ìˆ˜ìˆ */
.twojaw .counsel_wrapper .counseling_form .btn_request_mo,
.twojaw .C-visual .counsel_wrapper .counseling_form .btn_request {
background-color: #7b44f5;
}
/* include_selfie_swiper */
.include_selfie_swiper{
padding: 0 0 110px;
}
@media(max-width:720px){
.include_selfie_swiper{
padding: 0 0 12.5vw;
}
}
.C-RealSelfiegram .include_selfie_swiper .swiper-slide{
width: 242px;
height: 431px;
position: relative;
border-radius: 30px 30px 0 30px;
overflow: hidden;
}
.include_selfie_swiper .swiper-slide .item{
display: flex;
position: absolute;
left: 31px;
right: 31px;
top: 29px;
bottom: 25px;
justify-content: space-between;
flex-direction: column;
}
.include_selfie_swiper .swiper-slide .item .id_icon{
width: 23px;
height: 24px;
background: url(//image.idhospital.com/www/rn_2025/common/RealSelfiegram_icon_id.png) no-repeat left top;
}
.include_selfie_swiper .swiper-slide .item .info{
text-align: center;
}
.C-RealSelfiegram .include_selfie_swiper .swiper-slide .item .info .name{
font-size: 25px;
color: var(--C-ffffff);
font-weight: 700;
}
.C-RealSelfiegram .include_selfie_swiper .swiper-slide .item .info .tag{
font-size: 16px;
color: var(--C-bcb2ae);
}
.include_selfie_swiper .swiper-button-prev{
width: 86px;
height: 86px;
left: 50%;
margin-left: -30%;
border-radius: 50%;
background: var(--C-ffffff-50) url(//image.idhospital.com/www/rn_2025/common/btn_swiper.png) no-repeat center center;
}
@media(max-width:1600px){
.include_selfie_swiper .swiper-button-prev{
left: 10%;
margin-left: 0;
}
}
@media(max-width:1024px){
.include_selfie_swiper .swiper-button-prev{
left: 5%;
}
}
@media(max-width:720px){
.include_selfie_swiper .swiper-button-prev{
display: none;
width: 60px;
height: 60px;
left: 1%;
}
.C-RealSelfiegram .include_selfie_swiper .swiper-slide{
width: 33.61vw;
height: 59.86vw;
border-radius: 4.17vw 4.17vw 0 4.17vw;
/*margin-right: 6.94vw!important;*/
}
.C-RealSelfiegram .include_selfie_swiper .swiper-slide .item .info .name{
font-size: 3.47vw;
}
.C-RealSelfiegram .include_selfie_swiper .swiper-slide .item .info .tag{
font-size: 2.22vw;
}
}
.include_selfie_swiper .swiper-button-prev::after{
display: none;
}
.include_selfie_swiper .swiper-button-next{
width: 86px;
height: 86px;
right: 50%;
margin-right: -30%;
transform: rotate(180deg);
border-radius: 50%;
background: var(--C-ffffff-50) url(//image.idhospital.com/www/rn_2025/common/btn_swiper.png) no-repeat center center;
}
@media(max-width:1600px){
.include_selfie_swiper .swiper-button-next{
right: 10%;
margin-right: 0;
}
}
@media(max-width:1024px){
.include_selfie_swiper .swiper-button-next{
right: 5%;
}
}
@media(max-width:720px){
.include_selfie_swiper .swiper-button-next{
display: none;
width: 60px;
height: 60px;
right: 1%;
}
}
.include_selfie_swiper .swiper-button-next::after{
display: none;
}
.breast_aftercare_cont{text-align: center;letter-spacing: -1px;margin-bottom: 105px;}
.aftercare_tit{font-size: 40px;color:#000; font-weight: 900;margin-bottom: 75px;}
.aftercare_tit span{color:#ea32ab;}
.aftercare_list{display: flex;gap: 60px 65px;max-width: 960px;justify-content: center;flex-wrap: wrap;align-items: flex-start;margin: 0 auto;}
.aftercare_list li{}
.aftercare_list li img{max-width: 100%;}
.aftercare_list li dl{padding-top: 25px;}
.aftercare_list li dl dt{font-size: 25px; color:#b00071; font-weight: 900;margin-bottom: 15px;line-height: 1;}
.aftercare_list li dl dd{font-size: 20px; color:#111113; font-weight: 400;}
@media screen and (max-width: 1024px) {
.aftercare_list{gap:60px 30px;}
.aftercare_list li{width: 45%;}
}
@media screen and (max-width: 720px) {
.breast_aftercare_cont{padding: 0 4.16vw;letter-spacing: -0.1vw;margin-bottom: 12.5vw;}
.aftercare_tit{font-size: 5.5vw;letter-spacing: -0.2vw;margin-bottom: 4.16vw;}
.aftercare_list {gap: 5.5vw 4.16vw;}
.aftercare_list li{width: 47%;}
.aftercare_list li dl {padding-top: 2.9vw;}
.aftercare_list li dl dt {font-size: 3.47vw;margin-bottom: 2.3vw;}
.aftercare_list li dl dd {font-size: 2.36vw;}
}
.C-BeforeAfter {
padding: 0;
}
.C-BeforeAfter .include_bna_swiper {
padding-bottom: 0;
}
.include_bna_swiper .tab_list {
display: flex;
height: 72px;
gap: 10px;
padding-bottom: 50px;
justify-content: center;
}
.include_bna_swiper .img > div > a > img {
width: 100%;
height: 100%;
object-fit: cover;
}
@media (max-width: 720px) {
.include_bna_swiper .tab_list {
height: auto;
padding: 3% 0 5%;
flex-direction: row;
flex-wrap: wrap;
}
}
@media (max-width: 720px) {
.C-BeforeAfter .include_bna_swiper .img .left .login_dim .text p {
font-size: 4.5vw;
}
}
.include_bna_swiper .tab_list a {
display: inline-flex;
min-width: 50px;
height: 100%;
padding: 0 30px;
font-size: var(--f-25);
color: var(--C-737380);
border-radius: 40px;
align-items: center;
justify-content: center;
background-color: var(--C-f4f4f4);
}
@media (max-width: 720px) {
.include_bna_swiper .tab_list a {
padding: 8px 15px;
font-size: 3.4vw;
}
}
.include_bna_swiper .tab_list a:hover {
color: var(--C-ffffff);
font-weight: 800;
background-color: var(--C-ff77b9);
}
.include_bna_swiper .tab_list a.on {
color: var(--C-ffffff);
font-weight: 800;
background-color: var(--C-ff77b9);
}
.C-BeforeAfter .include_bna_swiper .swiper-slide {
/*width: 960px;*/
width: 745px;
}
@media (max-width: 1024px) {
.C-BeforeAfter .include_bna_swiper .swiper-slide {
width: 680px;
}
}
@media (max-width: 720px) {
.C-BeforeAfter .include_bna_swiper .swiper-slide {
width: 82.78vw;
}
}
.C-BeforeAfter .include_bna_swiper .img {
display: flex;
height: 372px;
overflow: hidden;
justify-content: space-evenly;
border-radius: 300px;
background-color: var(--C-f8f8f8);
}
@media (max-width: 1024px) {
.include_bna_swiper .img {
height: 340px;
}
}
@media (max-width: 720px) {
.C-BeforeAfter .include_bna_swiper .img {
/*height: auto;*/
height: 41.39vw;
/* height: 48.06vw; */
}
}
@media (max-width: 1024px) {
.include_bna_swiper .img img {
width: auto;
height: 100%;
}
}
@media (max-width: 720px) {
.include_bna_swiper .img img {
width: 100%;
height: 100%;
}
}
.include_bna_swiper .img .left {
width: 50%;
position: relative;
text-align: center;
}
@media (max-width: 720px) {
.include_bna_swiper .img .left {
width: 50%;
}
}
.include_bna_swiper .img .left img {
filter: blur(15px);
}
.include_bna_swiper .img .left.login img {
filter: none;
}
.C-BeforeAfter .include_bna_swiper .img .left .login_dim {
display: flex;
position: absolute;
left: 0;
top: 0;
right: 0;
bottom: 0;
justify-content: center;
align-items: flex-end;
background-color: var(--C-000000-50);
}
.include_bna_swiper .img .left.login .login_dim {
display: none;
}
@media (max-width: 720px) {
.include_bna_swiper .img .left .login_dim {
align-items: center;
}
}
.C-BeforeAfter .include_bna_swiper .img .left .login_dim .text {
padding-bottom: 92px;
margin-left: 19px;
}
@media (max-width: 720px) {
.C-BeforeAfter .include_bna_swiper .img .left .login_dim .text {
padding-bottom: 10.28vw;
/*padding-top: 5.69vw;*/
margin-left: 2.64vw;
}
}
.C-BeforeAfter .include_bna_swiper .img .left .login_dim .text p {
padding-bottom: 32px;
font-size: 17px;
color: var(--C-ffffff);
font-weight: 400;
line-height: 1.35;
letter-spacing: -0.5px;
}
@media (max-width: 1024px) {
.C-BeforeAfter .include_bna_swiper .img .left .login_dim .text p {
font-size: var(--f-25);
}
}
@media (max-width: 720px) {
.C-BeforeAfter .include_bna_swiper .img .left .login_dim .text p {
font-size: 2.08vw;
padding-bottom: 3.75vw;
letter-spacing: -0.07vw;
}
}
.C-BeforeAfter .include_bna_swiper .img .left .login_dim .text p strong {
font-weight: 700;
color: #f25ace;
letter-spacing: 0;
}
@media (max-width: 720px) {
.include_bna_swiper .img .left .login_dim .text p strong {
font-weight: 700;
}
}
.include_bna_swiper .img .left .text .btn_login.bna_login {
height: 40px;
line-height: 40px;
display: inline-block;
padding: 0 34px;
font-size: 15px;
color: var(--C-111113);
font-weight: 800;
cursor: pointer;
letter-spacing: -1px;
border-radius: 50px;
border: none;
background-color: var(--C-ffffff);
}
@media (max-width: 720px) {
.include_bna_swiper .img .left .text .btn_login.bna_login {
height: 4.31vw;
line-height: 4.31vw;
letter-spacing: -0.14vw;
padding: 0 3.61vw;
font-size: 1.67vw;
border-radius: 2.22vw;
}
}
@media (max-width: 1024px) {
.include_bna_swiper .img .left .text .btn_login {
height: 65px;
padding: 0 60px;
}
}
@media (max-width: 720px) {
.include_bna_swiper .img .left .text .btn_login {
font-size: 4vw;
height: initial;
padding: 10px 5vw;
}
}
.include_bna_swiper .img .right {
width: 50%;
position: relative;
text-align: center;
}
@media (max-width: 720px) {
.include_bna_swiper .img .right {
width: 50%;
}
}
.C-BeforeAfter .include_bna_swiper .item .info {
padding-top: 25px;
text-align: center;
}
@media (max-width: 720px) {
.C-BeforeAfter .include_bna_swiper .item .info {
padding-top: 1.08vw;
}
}
.C-BeforeAfter .include_bna_swiper .item .info .name {
font-size: 20px;
letter-spacing: -1px;
color: #45474d;
line-height: 1;
padding-bottom: 12px;
}
@media (max-width: 720px) {
.C-BeforeAfter .include_bna_swiper .item .info .name{
font-size: 4.4vw;
letter-spacing: -0.14vw;
padding-bottom: 1.67vw;
}
}
.C-BeforeAfter .include_bna_swiper .item .info .name strong {
font-size: 20px;
font-weight: 900;
}
@media (max-width: 720px) {
.C-BeforeAfter .include_bna_swiper .item .info .name strong {
font-size: 2.78vw;
}
}
.C-BeforeAfter .include_bna_swiper .item .info .tag {
font-size: 17px;
letter-spacing: -1px;
line-height: 1;
color: var(--C-45474d);
}
@media (max-width: 720px) {
.C-BeforeAfter .include_bna_swiper .item .info .tag {
padding: 0 3%;
font-size: 2.36vw;
letter-spacing: -0.14vw;
}
}
.C-BeforeAfter .include_bna_swiper .swiper-button {
display: flex;
width: 720px;
height: 30px;
margin: 42px auto 0;
position: relative;
justify-content: center;
align-items: center;
}
@media (max-width: 720px) {
.C-BeforeAfter .include_bna_swiper .swiper-button {
width: 100%;
margin-top: 6.39vw;
height: 4.17vw;
}
}
.C-BeforeAfter .include_bna_swiper .swiper-button-prev {
width: 13px;
height: 21px;
margin: 0;
margin-right: 20px;
position: relative;
left: initial;
top: initial;
background: url(//image.idhospital.com/www/rn_2025/common/btn_swiper_c000b17.png)
no-repeat left top;
background-size: contain;
}
@media (max-width: 720px) {
.C-BeforeAfter .include_bna_swiper .swiper-button-prev {
width: 1.81vw;
height: 2.92vw;
margin-right: 2%;
background-size: 100%;
}
}
.include_bna_swiper .swiper-button-prev::after {
display: none;
}
.C-BeforeAfter .include_bna_swiper .swiper-button-next {
width: 13px;
height: 21px;
margin: 0;
margin-left: 20px;
position: relative;
right: initial;
top: initial;
transform: rotate(180deg);
background: url(//image.idhospital.com/www/rn_2025/common/btn_swiper_c000b17.png)
no-repeat left top;
background-size: contain;
}
@media (max-width: 720px) {
.C-BeforeAfter .include_bna_swiper .swiper-button-next {
width: 1.81vw;
height: 2.92vw;
margin-left: 2%;
background-size: 100%;
}
}
.include_bna_swiper .swiper-button-next::after {
display: none;
}
.include_bna_swiper .swiper-pagination {
width: auto;
height: 20px;
position: relative;
top: 0;
}
@media (max-width: 720px) {
.include_bna_swiper .swiper-pagination {
display: flex;
height: 2.92vw;
align-items: center;
}
}
.C-BeforeAfter .include_bna_swiper .swiper-pagination-bullet {
width: 15px;
height: 15px;
margin: 0 7px !important;
opacity: 1;
background-color: var(--C-aaaab3);
}
@media (max-width: 720px) {
.C-BeforeAfter .include_bna_swiper .swiper-pagination-bullet {
width: 2.08vw;
height: 2.08vw;
margin: 0 1vw !important;
}
}
.include_bna_swiper .swiper-pagination-bullet-active {
background-color: var(--C-ff77b9);
}
.C-BeforeAfter .include_bna_swiper .swiper {
padding-top: 71px;
}
@media screen and (max-width: 720px) {
.C-BeforeAfter .include_bna_swiper .swiper {
padding-top: 5.28vw;
}
}
/******* cbu 별 swiper-pagination-bullet CSS 0619 *******/
/* 중년 눈*/
.middle_age .C-BeforeAfter .include_bna_swiper .swiper-pagination-bullet-active {background-color: #98214e;}
.middle_age .C-BeforeAfter .include_bna_swiper .img .left .login_dim .text p strong {
color: #e7538a;
}
/* ì½” */
.nose .C-BeforeAfter .include_bna_swiper .swiper-pagination-bullet-active {background-color: #376b2b;}
.nose .C-BeforeAfter .include_bna_swiper .img .left .login_dim .text p strong {
color: #3bbc1d;
}
/*ì´ë¹„ì¸í›„ê³¼ ì½”*/
.functional .C-BeforeAfter .include_bna_swiper .swiper-pagination-bullet-active {background-color: #046444;}
.functional .C-BeforeAfter .include_bna_swiper .img .left .login_dim .text p strong {
color: #00a06b;
}
/* 리프팅 */
.lifting_center .C-BeforeAfter .include_bna_swiper .swiper-pagination-bullet-active,
.lifting .include_bna_swiper .swiper-pagination-bullet-active {background-color: #e94700;}
.lifting_center .C-BeforeAfter .include_bna_swiper .img .left .login_dim .text p strong,
.lifting .C-BeforeAfter .include_bna_swiper .img .left .login_dim .text p strong {
color: #ff7f1a;
}
/*안면윤곽*/
.contour .include_bna_swiper .swiper-pagination-bullet-active,
.center.contour_center .C-BeforeAfter .swiper-pagination-bullet-active { background-color: #00636a;}
.contour_center .C-BeforeAfter .include_bna_swiper .img .left .login_dim .text p strong,
.contour .C-BeforeAfter .include_bna_swiper .img .left .login_dim .text p strong {
color: #00abb6;
}
/*가슴*/
.breast .include_bna_swiper .swiper-pagination-bullet-active { background-color: #b21d7f;}
.breast .C-BeforeAfter .include_bna_swiper .img .left .login_dim .text p strong {
color: #f958c2;
}
/*가슴 - 모티바페ì´ì§€*/
.breast.motiva .include_bna_swiper .swiper-pagination-bullet-active { background-color: #5b0b5d;}
.breast.motiva .C-BeforeAfter .include_bna_swiper .img .left .login_dim .text p strong {
color: #e9ccef;
}
/*가슴 - ë©˜í† */
.breast.mentor .include_bna_swiper .swiper-pagination-bullet-active { background-color: #1818ca;}
.breast.mentor .C-BeforeAfter .include_bna_swiper .img .left .login_dim .text p strong {
color: #78cde5;
}
/*ì–‘ì•…ìˆ˜ìˆ */
.twojaw .include_bna_swiper .swiper-pagination-bullet-active { background-color: #4305b5;}
.twojaw .C-BeforeAfter .include_bna_swiper .img .left .login_dim .text p strong {
color: #9c85ff;
}
/*ë‚¨ìž ì„±í˜•*/
.man .include_bna_swiper .swiper-pagination-bullet-active { background-color: #385eee;}
.man .C-BeforeAfter .include_bna_swiper .img .left .login_dim .text p strong {
color: #a6c3ff;
}
.breast_promotion_list {
padding-bottom: 109px;
}
.breast_promotion_list .swiper {
width: 100%;
height: 100%;
overflow: visible;
}
.breast_promotion_list .swiper-slide {
background: #fff;
max-width: 343px;
/*height: 432px;*/
border-radius: 14px;
box-shadow: 0px 4px 10px 5px rgba(0, 0, 0, 0.1);
}
.breast_promotion_list .swiper-slide a {
display: block;
color: #000b17;
}
.breast_promotion_list .swiper-slide img {
display: block;
max-width: 100%;
}
.breast_promotion_list .swiper-wrapper .swiper-slide:first-child {
/*margin-left: 40px;*/
}
.breast_promotion_list .swiper-slide .slide_inner {
padding: 29px 23px 22px;
letter-spacing: -1.5px;
}
.breast_promotion_list .swiper-slide .slide_inner img {
max-width: 100%;
}
.breast_promotion_list .swiper-slide .slide_text {
padding-bottom: 18px;
}
.breast_promotion_list .swiper-slide .pro_tit {
height: 74px;
display: flex;
flex-direction: column;
align-items: flex-start;
row-gap: 10px;
}
.breast_promotion_list .swiper-slide .pro_tit .pro_name {
font-size: 23px;
font-weight: 800;
}
.breast_promotion_list .swiper-slide .pro_tit .pro_text {
font-size: 17px;
font-weight: 500;
line-height: 1.2;
}
.breast_promotion_list .swiper-slide .price_text {
padding-top: 13px;
font-size: 25px;
}
.breast_promotion_list .swiper-slide .price_text .price_tit {
display: inline-block;
font-size: 47px;
font-weight: 800;
color: #e847b1;
}
.motiva .breast_promotion_list .swiper-slide .price_text .price_tit {
color: #c200d9;
}
.breast_promotion_list .cont_swiper .swiper-button-prev {
width: 86px;
height: 86px;
left: 33%;
margin-left: -30%;
border-radius: 50%;
background: var(--C-ffffff-50)
url(//image.idhospital.com/www/rn_2025/common/btn_swiper.png) no-repeat
center center;
}
.breast_promotion_list .cont_swiper .swiper-button-next {
width: 86px;
height: 86px;
right: 33%;
margin-right: -30%;
transform: rotate(180deg);
border-radius: 50%;
background: var(--C-ffffff-50)
url(//image.idhospital.com/www/rn_2025/common/btn_swiper.png) no-repeat
center center;
}
.breast_promotion_list .cont_swiper .swiper-button-next:after,
.breast_promotion_list .cont_swiper .swiper-button-prev:after {
display: none;
}
/* text */
.breast_promotion_list .text::before {
content: "[";
position: absolute;
left: 0;
bottom: 10px;
font-size: 68px;
color: #ffabe2;
font-weight: 900;
}
.breast_promotion_list .text::after {
content: "]";
position: absolute;
right: 0;
bottom: 10px;
font-size: 68px;
color: #ffabe2;
font-weight: 900;
}
.motiva .breast_promotion_list .text::before,
.motiva .breast_promotion_list .text::after {
color: #e58aff;
}
.breast_promotion_list .text {
display: flex;
width: 514px;
height: 110px;
margin: 0 auto 57px;
position: relative;
padding-left: 38px;
flex-direction: column;
justify-content: center;
box-sizing: border-box;
background: url(//image.idhospital.com/www/rn_2025/promotion/onsale/tit_breast_250718.png)
no-repeat right 38px center;
background-size: contain;
}
.motiva .breast_promotion_list .text {
background: url(//image.idhospital.com/www/rn_2025/include/breast_promotion_list/include_tit_motiva_breast_bg.png) no-repeat right 38px center;
}
.breast_promotion_list .text h2 {
display: block;
color: #ea32ab;
font-weight: 900;
font-size: 48px;
line-height: 1.2;
letter-spacing: -1px;
}
.motiva .breast_promotion_list .text h2 {
color: #c200d9;
}
.breast_promotion_list .text span {
color: #737380;
line-height: 1.2;
font-size: 26px;
letter-spacing: -0.5px;
}
@media (max-width: 1024px) {
.breast_promotion_list .swiper-slide .pro_tit .pro_name {
font-size: 2.8vw;
}
.breast_promotion_list .swiper-slide .pro_tit .pro_text {
font-size: 1.8vw;
}
.breast_promotion_list .swiper-slide .price_text {
font-size: 2.8vw;
}
.breast_promotion_list .swiper-slide .price_text .price_tit {
font-size: 5vw;
}
.breast_promotion_list .swiper-slide {
width: 296px!important;
}
}
@media (max-width: 720px) {
.breast_promotion_list {
padding-bottom: 12.5vw;
}
.breast_promotion_list .swiper-slide {
/*width: 41.94vw;*/
width: 41.94vw!important;
max-width: inherit;
height: auto;
border-radius: 1.94vw;
box-shadow: 0 0.56vw 1.39vw 0.69vw rgba(0, 0, 0, 0.1);
}
.breast_promotion_list .swiper-slide .slide_inner {
padding: 3.06vw;
letter-spacing: -0.21vw;
}
.breast_promotion_list .swiper-slide .slide_text {
padding-bottom: 1.94vw;
}
.breast_promotion_list .swiper-slide .pro_tit {
height: 9.17vw;
row-gap: 1.11vw;
}
.breast_promotion_list .swiper-slide .pro_tit .pro_name {
font-size: 2.78vw;
}
.breast_promotion_list .swiper-slide .pro_tit .pro_text {
font-size: 2.08vw;
}
.breast_promotion_list .swiper-slide .price_text {
padding-top: 1.94vw;
font-size: 3.06vw;
}
.breast_promotion_list .swiper-slide .price_text .price_tit {
font-size: 5.69vw;
}
.breast_promotion_list .cont_swiper .swiper-button-prev,
.breast_promotion_list .cont_swiper .swiper-button-next {
display: none;
}
/* text */
.breast_promotion_list .text::before {
bottom: 2.39vw;
font-size: 9.58vw;
}
.breast_promotion_list .text::after {
bottom: 2.39vw;
font-size: 9.58vw;
}
.breast_promotion_list .text {
width: 72.92vw;
height: 16.94vw;
margin: 0 auto 2.64vw;
padding-left: 5.28vw;
background-position: right 5.28vw center;
background-size: 24.03vw;
}
.motiva .breast_promotion_list .text {
background-position: right 5.28vw center;
background-size: 24.03vw;
}
.breast_promotion_list .text h2 {
font-size: 6.67vw;
letter-spacing: -0.14vw;
}
.breast_promotion_list .text span {
font-size: 3.61vw;
letter-spacing: -0.07vw;
}
}
/* include_youtube_swiper */
.include_youtube_swiper {
padding: 0;
text-align: center;
}
@media (max-width: 720px) {
.include_youtube_swiper {
/*padding: 0 0 2%;*/
padding: 0;
}
}
.C-idYoutube .include_youtube_swiper .swiper-slide {
width: 620px;
}
@media (max-width: 720px) {
.C-idYoutube .include_youtube_swiper .swiper-slide {
/*width: 90%;*/
width: 59.58vw;
}
}
@media (max-width: 720px) {
.include_youtube_swiper .swiper-slide img {
width: 100%;
}
}
.include_youtube_swiper .swiper-button-prev {
width: 86px;
height: 86px;
left: 50%;
margin-left: -30%;
border-radius: 50%;
background: var(--C-ffffff-50)
url(//image.idhospital.com/www/rn_2025/common/btn_swiper.png) no-repeat
center center;
}
@media (max-width: 1024px) {
.include_youtube_swiper .swiper-button-prev {
left: 5%;
margin-left: 0;
}
}
@media (max-width: 720px) {
.include_youtube_swiper .swiper-button-prev {
display: none;
width: 60px;
height: 60px;
left: 1%;
}
}
.include_youtube_swiper .swiper-button-prev::after {
display: none;
}
.include_youtube_swiper .swiper-button-next {
width: 86px;
height: 86px;
right: 50%;
margin-right: -30%;
transform: rotate(180deg);
border-radius: 50%;
background: var(--C-ffffff-50)
url(//image.idhospital.com/www/rn_2025/common/btn_swiper.png) no-repeat
center center;
}
@media (max-width: 1024px) {
.include_youtube_swiper .swiper-button-next {
right: 5%;
margin-right: 0;
}
}
@media (max-width: 720px) {
.include_youtube_swiper .swiper-button-next {
display: none;
width: 60px;
height: 60px;
right: 1%;
}
}
.include_youtube_swiper .swiper-button-next::after {
display: none;
}
.include_youtube_swiper .btn_youtube_page {
display: inline-flex;
height: 80px;
margin-top: 60px;
padding: 0 80px;
font-size: var(--f-24);
color: var(--C-111113);
font-weight: 800;
border-radius: 50px;
align-items: center;
background-color: var(--C-ffb5e8);
}
@media (max-width: 720px) {
.include_youtube_swiper .btn_youtube_page {
height: auto;
margin-top: 5%;
padding: 3% 11%;
font-size: 4vw;
}
}
/******* cbu 별 버튼 색깔 CSS 0619 *******/
/*기본 css*/
.C-idYoutube .btn_youtube_page {
display: inline-flex;
height: 45px;
line-height: 45px;
margin-top: 40px;
flex-direction: column;
justify-content: center;
width: 176px;
font-size: 17px;
color: var(--C-ffffff);
font-weight: 800;
border-radius: 23px;
align-items: center;
background-color: var(--C-376b2b);
}
/* 눈, 가슴 */
.eye .C-idYoutube .btn_youtube_page {background-color: #ffc1f4;color: #111113;}
.breast .C-idYoutube .btn_youtube_page {background-color: #ffabe2;color: #111113;}
/* 가슴 - 모티바 */
.motiva.breast .C-idYoutube .btn_youtube_page{background-color: #dcb5ff;color: #111113;}
/* 중년 눈*/
.middle_age .C-idYoutube .btn_youtube_page {color: #111113;background-color: #fcacc9;}
/* ì½” */
.nose .C-idYoutube .btn_youtube_page {background-color: #acd39a;color: #111113;}
/* ì´ë¹„ì¸í›„ê³¼ */
.functional .C-idYoutube .btn_youtube_page {background-color: #addfc3;color: #111113;}
/* 리프팅 */
.lifting .C-idYoutube .btn_youtube_page,
.lifting_center .C-idYoutube .btn_youtube_page {color: #111113; background-color: #ffae4e!important;}
/* 안면윤곽 */
.contour .C-idYoutube .btn_youtube_page,
.contour_center .C-idYoutube .btn_youtube_page {color: #111113; background-color: #89e2e8!important;}
/* 안면윤곽 */
.twojaw .C-idYoutube .btn_youtube_page,
.twojaw_center .C-idYoutube .btn_youtube_page {color: #111113; background-color: #b9a9ff!important;}
/***************************************/
/* breast_banner */
.breast_banner {
padding-bottom: 110px;
}
.breast_banner img {
max-width: 100%;
}
.breast_banner a {
display: block;
}
.breast_banner ul {
}
.breast_banner li {
display: flex;
width: 714px;
height: auto;
}
/*swiper-button-prev*/
/*swiper-button-next*/
.banner_swiper_area .swiper-button-prev {
width: 58px;
height: 58px;
left: 47%;
top: 41%;
margin-left: -21.5%;
border-radius: 50%;
background: rgba(255,255,255,0.5)
url(//image.idhospital.com/www/rn_2025/common/btn_swiper.png) no-repeat
center center;
}
.banner_swiper_area .swiper-button-next {
width: 58px;
height: 58px;
right: 47%;
top: 41%;
margin-right: -21.5%;
transform: rotate(180deg);
border-radius: 50%;
background: rgba(255,255,255,0.5)
url(//image.idhospital.com/www/rn_2025/common/btn_swiper.png) no-repeat
center center;
}
.banner_swiper_area .swiper-button-next:after,
.banner_swiper_area .swiper-button-prev:after,
.banner_swiper_area .swiper-pagination {
display: none;
}
@media (max-width: 1100px) {
/*swiper-button-prev*/
/*swiper-button-next*/
.banner_swiper_area .swiper-button-prev {
left: 27%;
top: 41%;
margin-left: -21.5%;
}
.banner_swiper_area .swiper-button-next {
right: 27%;
top: 41%;
margin-right: -21.5%;
}
}
@media (max-width: 1024px) {
.breast_banner ul {
width: 100%;
/*padding: 0 4%;*/
/*gap: 3vw;*/
}
.breast_banner li {
width: 100%;
height: 20vw;
}
}
@media (max-width: 720px) {
.breast_banner {
padding-bottom: 12.5vw;
}
.breast_banner li {
width: 92.22vw;
}
.banner_swiper_area .swiper-button {
display: flex;
width: 100%;
height: 4.17vw;
margin: 5.56vw auto 0;
position: relative;
justify-content: center;
align-items: center;
}
.banner_swiper_area .swiper-button-prev {
width: 1.81vw;
height: 2.92vw;
margin-top: 0;
margin-right: 2%;
position: relative;
left: initial;
top: initial;
background: url(//image.idhospital.com/www/rn_2025/common/btn_swiper_c000b17.png) no-repeat left top;
background-size: 100%;
}
.banner_swiper_area .swiper-button-next {
width: 1.81vw;
height: 2.92vw;
margin-top: 0;
margin-left: 2%;
position: relative;
right: initial;
top: initial;
transform: rotate(180deg);
background: url(//image.idhospital.com/www/rn_2025/common/btn_swiper_c000b17.png) no-repeat left top;
background-size: 100%;
}
.banner_swiper_area .swiper-pagination {
display: flex;
width: auto;
height: 2.92vw;
position: relative;
top: 0;
align-items: center;
}
.banner_swiper_area .swiper-pagination-bullet {
width: 2.08vw;
height: 2.08vw;
margin: 0 1vw !important;
opacity: 1;
background-color: #aaaab3;
}
.banner_swiper_area .swiper-pagination-bullet-active {
background-color: #b21d7f;
}
.motiva .banner_swiper_area .swiper-pagination-bullet-active {
background-color: #5b0b5d;
}
.mentor .banner_swiper_area .swiper-pagination-bullet-active {
background-color: #1818ca;
}
}
/* idHospitalInfo */
.C-idHospitalInfo ul {
display: flex;
flex-direction: row;
flex-wrap: wrap;
}
.C-idHospitalInfo li {
width: 25%;
position: relative;
}
@media (max-width: 720px) {
.C-idHospitalInfo li {
width: 50%;
}
}
.C-idHospitalInfo img {
width: 100%;
vertical-align: top;
}
.C-idHospitalInfo strong {
display: flex;
width: 100%;
height: 100%;
position: absolute;
left: 0;
top: 0;
font-size: var(--f-32);
color: var(--C-ffffff);
font-weight: 700;
line-height: 1.2;
text-align: center;
justify-content: center;
align-items: center;
}
@media (max-width: 1300px) {
.C-idHospitalInfo strong {
font-size: 2vw;
}
}
@media (max-width: 720px) {
.C-idHospitalInfo strong {
font-size: 4vw;
}
}
.C-visual .img_area img {
max-width: 100%;
}
.mo_img,
.mo_ver {
display: none;
}
.breast .C-visual {
background: none;
}
.breast.reduction #container {
background: none;
background-color: #fff7fa;
}
.reduction img {max-width: 100%;}
.reduction .thoracoplasty_info .text {
display: -webkit-box;
display: -ms-flexbox;
display: flex;
width: 538px;
height: 111px;
margin: 0 auto 0;
position: relative;
padding-left: 37px;
-webkit-box-orient: vertical;
-webkit-box-direction: normal;
-ms-flex-direction: column;
flex-direction: column;
-webkit-box-pack: center;
-ms-flex-pack: center;
justify-content: center;
-webkit-box-sizing: border-box;
box-sizing: border-box;
}
.reduction .thoracoplasty_info .text strong {
display: block;
font-size: 48px;
color: #e747b0;
font-weight: 900;
line-height: 1.1;
letter-spacing: -1px;
position: relative;
z-index: 2;
}
.reduction .thoracoplasty_info .text .info_img {
width: 171px;
right: 36px;
position: absolute;
top: 50%;
-webkit-transform: translateY(-50%);
transform: translateY(-50%);
z-index: 1;
}
.reduction .thoracoplasty_info .text::before {
content: "[";
position: absolute;
left: 0;
bottom: 12px;
font-size: 68px;
color: #ffc7ee;
font-weight: 900;
}
.reduction .thoracoplasty_info .text::after {
content: "]";
position: absolute;
right: 0;
bottom: 12px;
font-size: 68px;
color: #ffc7ee;
font-weight: 900;
}
.img {line-height: 0;}
.breast .container_wrapper img {max-width: 100%; width: 100%; }
.reduction .container_wrapper {max-width: 960px; margin: 0 auto; text-align: center;line-height: 1;}
.title_area p {font-size: 25px; letter-spacing: -1px;color: #000;padding-bottom: 10px;font-weight: 500;}
.title_area h3 {font-size: 40px; letter-spacing: -0.5px; font-weight: 900;line-height: 1.2; color:#000;}
.title_area h3 span {color: #ea32ab;}
.section01 {margin: 50px auto 106px;}
.section01 .table_img {margin-top: 77px;}
.section01 .table_text {font-size: 20px; letter-spacing: -1px; padding-top: 30px; color: #111113;line-height: 1.3;font-weight: 600;}
.section01 ul {margin-top: 78px; display: flex; flex-wrap: nowrap;column-gap: 32px;}
.section01 .text-box .tit {font-size: 24px; padding: 29px 0 18px;color: #b00071;font-weight: 800;}
.section01 .text-box .text {font-size: 20px; letter-spacing: -0.5px; color: #111113; line-height: 1.2; font-weight: 500;}
.section02 {margin: 0 auto 100px;}
.section02 h2 {font-size: 48px; letter-spacing: -1px; color: #ea32ac;font-weight: 900;}
.section02 ul {display: flex;flex-wrap: nowrap;margin-top: 79px;column-gap: 30px;}
.section02 li .text strong {font-size: 24px; letter-spacing: -1px; padding: 28px 0 15px; display: block; color: #b10072;font-weight: 800;}
.section02 li .text p {font-size: 19px; letter-spacing: -1px; color: #111113; line-height: 1.4; font-weight: 500;}
@media screen and (max-width: 1024px) {
.section01 .text-box .tit {font-size: 2.34vw; padding: 2.83vw 0 1.76vw;}
.section01 .text-box .text {font-size: 1.95vw;}
.section02 li .text strong {font-size: 2.44vw; padding: 2.83vw 0 1.66vw;}
.section02 li .text p {font-size: 1.66vw;}
}
@media screen and (max-width: 720px) {
.pc_ver {
display: none;
}
.mo_img,
.mo_ver {
display: block;
}
.reduction .thoracoplasty_info .text {
margin-top: -24px;
width: 74.72vw;
height: 15.42vw;
padding-left: 5.14vw;
}
.reduction .thoracoplasty_info .text strong {
font-size: 6.67vw;
letter-spacing: -0.28vw;
}
.reduction .thoracoplasty_info .text::before,
.reduction .thoracoplasty_info .text::after {
bottom: 1.67vw;
font-size: 9.44vw;
}
.reduction .thoracoplasty_info .text .info_img img {
max-width: 100%;
}
.reduction .thoracoplasty_info .text .info_img {
width: 23.75vw;
right: 5vw;
}
.reduction .container_wrapper {max-width: 100%; padding: 0 4.17vw;}
.title_area p {font-size: 3.47vw; letter-spacing: -0.1vw; padding-bottom: 1.3vw;}
.title_area h3 {font-size: 5.5vw; letter-spacing: -0.2vw; }
.section01 {margin: 8.72vw auto 12.5vw;}
.section01 .table_img {margin-top: 6.67vw;}
.section01 .table_text {font-size: 3.47vw; letter-spacing: -0.14vw; padding-top: 4.58vw; color: #45474d;font-weight: 500;}
.section01 ul {margin-top: 10vw; flex-direction: column; column-gap: 0; row-gap: 5.28vw;}
.section01 ul li .img{width: 64.58vw;margin: 0 auto;}
.section01 .text-box .tit {font-size: 3.3vw; padding: 4vw 0 2vw;}
.section01 .text-box .text {font-size: 2.78vw; letter-spacing: -0.07vw; color: #020202;}
.section02 {margin: 0 auto 13.89vw;}
.section02 h2 {font-size: 6.67vw; letter-spacing: -0.14vw;}
.section02 ul {margin-top: 5.83vw; flex-direction: column; column-gap: 0; row-gap: 5vw;}
.section02 li .text strong {font-size: 4.17vw; letter-spacing: -0.07vw; padding: 3.89vw 0 1.11vw;}
.section02 li .text p {font-size: 2.36vw; letter-spacing: -0.14vw; color: #000; line-height: 1.4;}
}
@charset "utf-8";
/**** layout_main.css start ****/
#wrap {
overflow: hidden;
}
@media (max-width: 1024px) {
/* TABLET */
}
@media (max-width: 720px) {
/* MOBILE */
}
/* container */
#container {
position: relative;
z-index: 1;
}
/*!* header *!*/
/*#header {*/
/* width: 100%;*/
/* position: relative;*/
/* z-index: 6;*/
/* border-bottom: 2px solid var(--C-f4f4f4);*/
/* background-color: var(--C-ffffff);*/
/*}*/
/*#header > .inner {*/
/* display: flex;*/
/* max-width: 1920px;*/
/* margin: 0 auto;*/
/* justify-content: space-around;*/
/* align-items: flex-end;*/
/*}*/
/*@media (max-width: 1690px) {*/
/* #header > .inner {*/
/* position: relative;*/
/* max-width: initial;*/
/* padding: 0 20px;*/
/* }*/
/*}*/
/*@media (max-width: 720px) {*/
/* #header > .inner {*/
/* padding: 25px 3%;*/
/* justify-content: space-between;*/
/* align-items: center;*/
/* }*/
/*}*/
/*#header .menu_open {*/
/* display: none;*/
/* width: 5.4vw;*/
/* height: 5.3vw;*/
/* position: absolute;*/
/* top: 35%;*/
/* left: 3%;*/
/* cursor: pointer;*/
/*}*/
/*@media (max-width: 720px) {*/
/* #header .menu_open {*/
/* display: block;*/
/* width: 6.5vw;*/
/* }*/
/*}*/
/*#header .menu_open i {*/
/* width: 100%;*/
/* height: 4px;*/
/* position: absolute;*/
/* left: 0;*/
/* background-color: var(--C-45474d);*/
/*}*/
/*#header .menu_open i:nth-child(1) {*/
/* top: 0;*/
/*}*/
/*#header .menu_open i:nth-child(2) {*/
/* top: 14px;*/
/*}*/
/*#header .menu_open i:nth-child(3) {*/
/* top: 28px;*/
/*}*/
/*@media (max-width: 720px) {*/
/*#header .menu_open i{height: 0.7vw;}*/
/*#header .menu_open i:nth-child(2) {top: 50%;transform: translate(0,-50%);}*/
/*#header .menu_open i:nth-child(3) {top: initial;bottom: 0;}*/
/* */
/* */
/*}*/
/*#header h1 {*/
/* padding: 24px 0 22px;*/
/*}*/
/*@media (max-width: 720px) {*/
/* #header h1 {*/
/* padding: 0 0 0 9vw;*/
/* }*/
/*}*/
/*#header h1 a {*/
/* display: flex;*/
/*}*/
/*#header h1 img {*/
/* width: 129px;*/
/* vertical-align: top;*/
/*}*/
/*@media (max-width: 720px) {*/
/* #header h1 img {*/
/* width: 29vw;*/
/* margin-top: -1.8vw;*/
/* }*/
/*}*/
/*#header .menu {*/
/* height: 79px;*/
/* position: relative;*/
/*}*/
/*@media (max-width: 1400px) {*/
/* #header .menu {*/
/* width: 70%;*/
/* overflow: hidden;*/
/* flex-wrap: nowrap;*/
/* white-space: nowrap;*/
/* }*/
/*}*/
/*@media (max-width: 1170px) {*/
/* #header .menu {*/
/* width: 60%;*/
/* }*/
/*}*/
/*@media (max-width: 1024px) {*/
/* #header .menu {*/
/* width: 40%;*/
/* }*/
/*}*/
/*@media (max-width: 720px) {*/
/* #header .menu {*/
/* display: none;*/
/* }*/
/*}*/
/*#header .menu ul {*/
/* display: flex;*/
/* height: 100%;*/
/* align-items: stretch;*/
/*}*/
/*@media (max-width: 1690px) {*/
/* #header .menu ul {*/
/* padding-right: 20px;*/
/* box-sizing: border-box;*/
/* }*/
/*}*/
/*#header .menu ul li {*/
/* display: flex;*/
/* padding: 0 14px 20px;*/
/* cursor: pointer;*/
/* align-items: flex-end;*/
/*}*/
/*#header .menu ul li a {*/
/* color: var(--C-474748);*/
/* font-weight: 500;*/
/*}*/
/*#header .menu ul li.on a {*/
/* color: var(--C-000b17);*/
/* font-weight: 900;*/
/*}*/
/*#header .menu .menu_hidden_open {*/
/* display: none;*/
/* width: 50px;*/
/* height: 100%;*/
/* position: absolute;*/
/* right: 0;*/
/* top: 0;*/
/* gap: 5px;*/
/* justify-content: center;*/
/* align-items: flex-end;*/
/* background-color: var(--C-ffffff);*/
/*}*/
/*@media (max-width: 1400px) {*/
/* #header .menu .menu_hidden_open {*/
/* display: flex;*/
/* }*/
/*}*/
/*#header .menu .menu_hidden_open i {*/
/* display: inline-block;*/
/* width: 5px;*/
/* height: 5px;*/
/* margin-bottom: 30px;*/
/* border-radius: 10px;*/
/* background-color: var(--C-000b17);*/
/*}*/
/*#header .right {*/
/* padding-bottom: 20px;*/
/*}*/
/*@media (max-width: 720px) {*/
/* #header .right {*/
/* padding-bottom: 0;*/
/* }*/
/*}*/
/*#header .right button {*/
/* margin-left: 16px;*/
/* color: var(--C-000b17);*/
/* cursor: pointer;*/
/* border: none;*/
/* background: none;*/
/*}*/
/*@media (max-width: 720px) {*/
/* #header .right button{margin-left: 2vw;}*/
/* #header .right .btn_logout {*/
/* display: none;*/
/* }*/
/*}*/
/*#header .right .btn_search {*/
/* margin-left: 27px;*/
/*}*/
/*#header .right .btn_search {*/
/* width: 21px;*/
/* height: 21px;*/
/* text-indent: -1000em;*/
/* background: url(//image.idhospital.com/www/rn_2025/common/header_icon_search.png)*/
/* no-repeat left top;*/
/* background-size: 100%;*/
/*}*/
/*@media (max-width: 720px) {*/
/* #header .right .btn_search {*/
/* width: 5.7vw;*/
/* height: 5.7vw;*/
/* }*/
/*}*/
/*#header .right .btn_language {*/
/* width: 21px;*/
/* height: 21px;*/
/* text-indent: -1000em;*/
/* background: url(//image.idhospital.com/www/rn_2025/common/header_icon_language.png)*/
/* no-repeat left top;*/
/* background-size: 100%;*/
/*}*/
/*@media (max-width: 720px) {*/
/* #header .right .btn_language {*/
/* width: 5.7vw;*/
/* height: 5.7vw;*/
/* }*/
/*}*/
/*#header .right .btn_menu {*/
/* width: 18px;*/
/* height: 16px;*/
/* position: relative;*/
/* transition: background 0.3s;*/
/*}*/
/*@media (max-width: 720px) {*/
/* #header .right .btn_menu {*/
/* display: none;*/
/* }*/
/*}*/
/*#header .right .btn_menu i {*/
/* width: 18px;*/
/* height: 2px;*/
/* position: absolute;*/
/* left: 0;*/
/* background-color: var(--C-45474d);*/
/* transition: transform 0.3s, opacity 0.3s;*/
/*}*/
/*#header .right .btn_menu i:nth-child(1) {*/
/* top: 0;*/
/*}*/
/*#header .right .btn_menu i:nth-child(2) {*/
/* top: 7px;*/
/*}*/
/*#header .right .btn_menu i:nth-child(3) {*/
/* top: 14px;*/
/*}*/
/*!* Xìž ë³€í™˜ *!*/
/*#header .right .btn_menu.on i:nth-child(1) {*/
/* transform: translateY(7px) rotate(45deg);*/
/*}*/
/*#header .right .btn_menu.on i:nth-child(2) {*/
/* opacity: 0;*/
/*}*/
/*#header .right .btn_menu.on i:nth-child(3) {*/
/* transform: translateY(-7px) rotate(-45deg);*/
/*}*/
/*!* gnb *!*/
/*.gnb {*/
/* display: none;*/
/* width: 100%;*/
/* position: absolute;*/
/* left: 0;*/
/* top: 81px;*/
/* padding: 30px 0;*/
/* background-color: var(--C-ffffff);*/
/* box-shadow: -7px 4px 10px rgba(0, 0, 0, 0.1); */
/*}*/
/*.gnb.on {*/
/* display: block;*/
/*}*/
/*.gnb .inner {*/
/* display: flex;*/
/* width: 985px;*/
/* margin: 0 auto;*/
/* justify-content: space-between;*/
/*}*/
/*@media (max-width: 1060px) {*/
/* .gnb .inner {*/
/* width: auto;*/
/* padding: 0 5%;*/
/* }*/
/*}*/
/*.gnb nav {*/
/* display: flex;*/
/* margin-left: 45px;*/
/*}*/
/*.gnb ul {*/
/* display: none;*/
/* flex-direction: column;*/
/*}*/
/*.gnb nav ul.on {*/
/* display: flex;*/
/*}*/
/*.gnb nav ul li {*/
/* position: relative;*/
/* padding: 5px 0;*/
/* opacity: 0;*/
/* transform: translateX(30px);*/
/* animation: gnbLiIn 0.4s cubic-bezier(0.4, 0, 0.2, 1) forwards;*/
/*}*/
/*.gnb nav ul.on li:nth-child(1) {*/
/* animation-delay: 0.02s;*/
/*}*/
/*.gnb nav ul.on li:nth-child(2) {*/
/* animation-delay: 0.04s;*/
/*}*/
/*.gnb nav ul.on li:nth-child(3) {*/
/* animation-delay: 0.06s;*/
/*}*/
/*.gnb nav ul.on li:nth-child(4) {*/
/* animation-delay: 0.08s;*/
/*}*/
/*.gnb nav ul.on li:nth-child(5) {*/
/* animation-delay: 0.1s;*/
/*}*/
/*.gnb nav ul.on li:nth-child(6) {*/
/* animation-delay: 0.12s;*/
/*}*/
/*.gnb nav ul.on li:nth-child(7) {*/
/* animation-delay: 0.14s;*/
/*}*/
/*.gnb nav ul.on li:nth-child(8) {*/
/* animation-delay: 0.16s;*/
/*}*/
/*.gnb nav ul.on li:nth-child(9) {*/
/* animation-delay: 0.18s;*/
/*}*/
/*.gnb nav ul.on li:nth-child(10) {*/
/* animation-delay: 0.2s;*/
/*}*/
/*.gnb nav ul.on li:nth-child(11) {*/
/* animation-delay: 0.22s;*/
/*}*/
/*@keyframes gnbLiIn {*/
/* to {*/
/* opacity: 1;*/
/* transform: translateX(0);*/
/* }*/
/*}*/
/*.gnb nav ul li a {*/
/* font-size: var(--f-16);*/
/* color: var(--C-000b17);*/
/* font-weight: 600;*/
/*}*/
/*.gnb nav ul li.on a {*/
/* font-weight: 800;*/
/*}*/
/*.gnb nav ul li .dep3 {*/
/* display: none;*/
/* min-width: 160px;*/
/* position: absolute;*/
/* left: 110%;*/
/* top: 0;*/
/* gap: 5px;*/
/* flex-direction: column;*/
/*}*/
/*.gnb nav ul li .dep3 a {*/
/* font-size: var(--f-13);*/
/* color: var(--C-737380);*/
/* font-weight: 500;*/
/* opacity: 0;*/
/* transform: translateX(20px);*/
/* animation: gnbLiIn 0.3s cubic-bezier(0.4, 0, 0.2, 1) forwards;*/
/*}*/
/*.gnb nav ul li.on .dep3 a:nth-child(1) {*/
/* animation-delay: 0.02s;*/
/*}*/
/*.gnb nav ul li.on .dep3 a:nth-child(2) {*/
/* animation-delay: 0.04s;*/
/*}*/
/*.gnb nav ul li.on .dep3 a:nth-child(3) {*/
/* animation-delay: 0.06s;*/
/*}*/
/*.gnb nav ul li.on .dep3 a:nth-child(4) {*/
/* animation-delay: 0.08s;*/
/*}*/
/*.gnb nav ul li.on .dep3 a:nth-child(5) {*/
/* animation-delay: 0.1s;*/
/*}*/
/*.gnb nav ul li.on .dep3 a:nth-child(6) {*/
/* animation-delay: 0.12s;*/
/*}*/
/*.gnb nav ul li.on .dep3 a:nth-child(7) {*/
/* animation-delay: 0.14s;*/
/*}*/
/*.gnb nav ul li.on .dep3 a:nth-child(8) {*/
/* animation-delay: 0.16s;*/
/*}*/
/*.gnb nav ul li .dep3 a::before {*/
/* content: "- ";*/
/*}*/
/*.gnb nav ul li.on .dep3 {*/
/* display: flex;*/
/*}*/
/*.gnb .right ul {*/
/* display: inline-flex;*/
/* gap: 7px;*/
/* position: relative;*/
/*}*/
/*.gnb .right ul li a {*/
/* font-size: var(--f-16);*/
/* color: var(--C-474748);*/
/*}*/
/*.gnb .right ul li.on {*/
/* font-weight: 900;*/
/*}*/
/*.gnb .right ul li .dep3 {*/
/* display: none;*/
/* min-width: 160px;*/
/* position: absolute;*/
/* left: 120%;*/
/* top: 0;*/
/* gap: 5px;*/
/* flex-direction: column;*/
/*}*/
/*.gnb .right ul li .dep3 a {*/
/* font-size: var(--f-13);*/
/* color: var(--C-737380);*/
/* font-weight: 500;*/
/* opacity: 0;*/
/* transform: translateX(20px);*/
/* animation: gnbLiIn 0.3s cubic-bezier(0.4, 0, 0.2, 1) forwards;*/
/*}*/
/*.gnb .right ul li.on .dep3 a:nth-child(1) {*/
/* animation-delay: 0.02s;*/
/*}*/
/*.gnb .right ul li.on .dep3 a:nth-child(2) {*/
/* animation-delay: 0.04s;*/
/*}*/
/*.gnb .right ul li.on .dep3 a:nth-child(3) {*/
/* animation-delay: 0.06s;*/
/*}*/
/*.gnb .right ul li.on .dep3 a:nth-child(4) {*/
/* animation-delay: 0.08s;*/
/*}*/
/*.gnb .right ul li.on .dep3 a:nth-child(5) {*/
/* animation-delay: 0.1s;*/
/*}*/
/*.gnb .right ul li.on .dep3 a:nth-child(6) {*/
/* animation-delay: 0.12s;*/
/*}*/
/*.gnb .right ul li.on .dep3 a:nth-child(7) {*/
/* animation-delay: 0.14s;*/
/*}*/
/*.gnb .right ul li .dep3 a::before {*/
/* content: "- ";*/
/*}*/
/*.gnb .right ul li.on .dep3 {*/
/* display: flex;*/
/*}*/
/*.gnb .right .tel {*/
/* padding-top: 25px;*/
/* font-size: var(--f-32);*/
/* color: var(--C-474748);*/
/* font-weight: 900;*/
/* line-height: 1.1;*/
/*}*/
/*.gnb .banner {*/
/* padding-top: 20px;*/
/*}*/
/*.gnb .banner img {*/
/* vertical-align: top;*/
/*}*/
/*!* search *!*/
/*.search {*/
/* display: none;*/
/* width: 100%;*/
/* position: absolute;*/
/* left: 0;*/
/* top: 0;*/
/* padding: 30px 0;*/
/* background-color: var(--C-ffffff);*/
/*}*/
/*.search.on {*/
/* display: block;*/
/*}*/
/*.search .inner {*/
/* display: flex;*/
/* max-width: 1680px;*/
/* margin: 0 auto;*/
/* position: relative;*/
/* justify-content: space-between;*/
/* flex-wrap: wrap;*/
/* flex-direction: column;*/
/*}*/
/*.search .input_form {*/
/* width: 905px;*/
/* height: 52px;*/
/* margin: 0 auto;*/
/* border-radius: 15px;*/
/* background: var(--C-f4f4f4)*/
/* url(//image.idhospital.com/www/rn_2025/common/header_icon_search.png)*/
/* no-repeat 20px center;*/
/*}*/
/*.search .input_form input {*/
/* width: 100%;*/
/* height: 100%;*/
/* padding: 0 55px;*/
/* box-sizing: border-box;*/
/* border: none;*/
/* background: none;*/
/*}*/
/*.search .recomm_search {*/
/* display: flex;*/
/* width: 905px;*/
/* margin: 0 auto;*/
/* padding-top: 27px;*/
/* position: relative;*/
/*}*/
/*.search .recomm_search::before {*/
/* content: "추천 검색어";*/
/* padding-right: 40px;*/
/* font-size: var(--f-15);*/
/* color: var(--C-000b17);*/
/* font-weight: 900;*/
/*}*/
/*.search .recomm_search ol {*/
/* display: flex;*/
/* min-height: 240px;*/
/* padding-left: 20px;*/
/* gap: 5px;*/
/* flex-direction: column;*/
/* border-left: 1px solid var(--C-bdbdc9);*/
/*}*/
/*.search .recomm_search ol li {*/
/* font-size: var(--f-13);*/
/* color: var(--C-000b17);*/
/* font-weight: 500;*/
/*}*/
/*.search .recomm_search .banner {*/
/* position: absolute;*/
/* right: 0;*/
/* bottom: 30px;*/
/*}*/
/*.search .recomm_search .banner img {*/
/* vertical-align: top;*/
/*}*/
/*.search_close {*/
/* width: 18px;*/
/* height: 18px;*/
/* cursor: pointer;*/
/* position: absolute;*/
/* right: 0;*/
/* top: 0;*/
/*}*/
/*.search_close i {*/
/* display: block;*/
/* width: 100%;*/
/* height: 3px;*/
/* position: absolute;*/
/* left: 0;*/
/* top: 0;*/
/* transform: rotate(40deg);*/
/* background-color: var(--C-45474d);*/
/*}*/
/*.search_close i:last-child {*/
/* transform: rotate(130deg);*/
/*}*/
/*!* sitemap *!*/
/*.sitemap {*/
/* width: 100%;*/
/* position: absolute;*/
/* left: 0;*/
/* top: 81px;*/
/* padding: 30px 0;*/
/* background-color: var(--C-ffffff);*/
/* opacity: 0;*/
/* transform: translateY(-20px);*/
/* transition: opacity 0.4s cubic-bezier(0.4, 0, 0.2, 1),*/
/* transform 0.4s cubic-bezier(0.4, 0, 0.2, 1);*/
/* pointer-events: none;*/
/* display: block; !* display: block으로 ë‘ê³ JSì—ì„œ on/off는 opacityë¡œ ì œì–´ *!*/
/* box-shadow: -7px 4px 10px rgba(0, 0, 0, 0.1);*/
/*}*/
/*@media (max-width: 720px) {*/
/* .sitemap {*/
/* display: none;*/
/* }*/
/*}*/
/*.sitemap.on {*/
/* opacity: 1;*/
/* transform: translateY(0);*/
/* pointer-events: auto;*/
/*}*/
/*.sitemap .inner {*/
/* display: flex;*/
/* width: 985px;*/
/* margin: 0 auto;*/
/* justify-content: space-between;*/
/* flex-direction: row;*/
/* flex-wrap: wrap;*/
/* gap: 35px 0;*/
/*}*/
/*@media (max-width: 1060px) {*/
/* .sitemap .inner {*/
/* width: auto;*/
/* padding: 0 5%;*/
/* }*/
/*}*/
/*.sitemap .inner .item {*/
/* flex: 1 1 14.5%;*/
/*}*/
/*@media (max-width: 1060px) {*/
/* .sitemap .inner .item {*/
/* flex: 1 1 20%;*/
/* max-width: 20%;*/
/* }*/
/*}*/
/*@media (max-width: 860px) {*/
/* .sitemap .inner .item {*/
/* flex: 1 1 25%;*/
/* max-width: 25%;*/
/* }*/
/*}*/
/*@media (max-width: 1060px) {*/
/* .sitemap .inner .item:last-child {*/
/* max-width: 25%;*/
/* }*/
/*}*/
/*.sitemap .inner .item h4 {*/
/* padding-bottom: 4px;*/
/* font-size: var(--f-13);*/
/* color: var(--C-737380);*/
/*}*/
/*.sitemap .inner .item li a {*/
/* font-size: var(--f-15);*/
/* color: var(--C-000b17);*/
/* font-weight: 500;*/
/*}*/
/*.sitemap .inner .item li p a {*/
/* font-weight: 400;*/
/*}*/
/*.sitemap .inner .item li p a {*/
/* font-weight: 400;*/
/*}*/
/*.sitemap .inner .item .side_link {*/
/* display: flex;*/
/* flex-direction: column;*/
/* gap: 5px;*/
/*}*/
/*.sitemap .inner .item .side_link li a {*/
/* font-weight: 700;*/
/* color: var(--C-474748);*/
/*}*/
/*.sitemap .inner .item .tel {*/
/* font-size: var(--f-30);*/
/* color: var(--C-474748);*/
/* font-weight: 900;*/
/* line-height: 1.1;*/
/*}*/
/*!* gnb ëª¨ë°”ì¼ *!*/
/*.gnb_mb {*/
/* display: none;*/
/* padding: 70px 30px 100px;*/
/* position: fixed;*/
/* left: 0;*/
/* right: 0;*/
/* top: 0;*/
/* bottom: 0;*/
/* background: var(--C-ffffff);*/
/*}*/
/*.gnb_mb.on {*/
/* display: block;*/
/*}*/
/*@media (max-width: 720px) {*/
/* .gnb_mb {*/
/* overflow: auto;*/
/* }*/
/*}*/
/*.gnb_mb .dep1 li {*/
/* padding: 10px 0;*/
/* opacity: 0;*/
/* transform: translateX(30px);*/
/* animation: gnbLiIn 0.4s cubic-bezier(0.4, 0, 0.2, 1) forwards;*/
/*}*/
/*.gnb_mb.on .dep1 li:nth-child(1) {*/
/* animation-delay: 0.02s;*/
/*}*/
/*.gnb_mb.on .dep1 li:nth-child(2) {*/
/* animation-delay: 0.04s;*/
/*}*/
/*.gnb_mb.on .dep1 li:nth-child(3) {*/
/* animation-delay: 0.06s;*/
/*}*/
/*.gnb_mb.on .dep1 li:nth-child(4) {*/
/* animation-delay: 0.08s;*/
/*}*/
/*.gnb_mb.on .dep1 li:nth-child(5) {*/
/* animation-delay: 0.1s;*/
/*}*/
/*.gnb_mb.on .dep1 li:nth-child(6) {*/
/* animation-delay: 0.12s;*/
/*}*/
/*.gnb_mb.on .dep1 li:nth-child(7) {*/
/* animation-delay: 0.14s;*/
/*}*/
/*.gnb_mb.on .dep1 li:nth-child(8) {*/
/* animation-delay: 0.16s;*/
/*}*/
/*.gnb_mb.on .dep1 li:nth-child(9) {*/
/* animation-delay: 0.18s;*/
/*}*/
/*.gnb_mb.on .dep1 li:nth-child(10) {*/
/* animation-delay: 0.2s;*/
/*}*/
/*.gnb_mb.on .dep1 li:nth-child(11) {*/
/* animation-delay: 0.22s;*/
/*}*/
/*.gnb_mb.on .dep1 li:nth-child(12) {*/
/* animation-delay: 0.24s;*/
/*}*/
/*@media (max-width: 400px) {*/
/* .gnb_mb .dep1 li {*/
/* padding: 7px 0;*/
/* }*/
/*}*/
/*.gnb_mb .dep1 a {*/
/* font-size: var(--f-20);*/
/* color: var(--C-474748);*/
/* font-weight: 600;*/
/*}*/
/*@media (max-width: 400px) {*/
/* .gnb_mb .dep1 a {*/
/* font-size: var(--f-20);*/
/* }*/
/*}*/
/*.gnb_mb .dep2 {*/
/* display: none;*/
/*}*/
/*.gnb_mb .dep2.on {*/
/* display: block;*/
/*}*/
/*.gnb_mb .dep2 .btn_dep_back {*/
/* width: 23px;*/
/* height: 37px;*/
/* cursor: pointer;*/
/* position: absolute;*/
/* left: 30px;*/
/* top: 15px;*/
/*}*/
/*.gnb_mb .dep2 .btn_dep_back i {*/
/* position: absolute;*/
/* left: 0;*/
/* top: 50%;*/
/* width: 100%;*/
/* height: 5px;*/
/* background-color: var(--C-45474d);*/
/* transform-origin: left center;*/
/*}*/
/*.gnb_mb .dep2 .btn_dep_back i:first-child {*/
/* margin-top: -2px;*/
/* transform: translateY(-50%) rotate(45deg);*/
/*}*/
/*.gnb_mb .dep2 .btn_dep_back i:last-child {*/
/* margin-top: 1px;*/
/* transform: translateY(-50%) rotate(-45deg);*/
/*}*/
/*.gnb_mb .dep2 ul {*/
/* display: none;*/
/* flex-direction: column;*/
/* gap: 20px;*/
/*}*/
/*.gnb_mb .dep2 ul.on {*/
/* display: flex;*/
/*}*/
/*.gnb_mb .dep2 > ul > li {*/
/* opacity: 0;*/
/* transform: translateX(30px);*/
/* animation: gnbLiIn 0.4s cubic-bezier(0.4, 0, 0.2, 1) forwards;*/
/*}*/
/*.gnb_mb .dep2.on > ul > li {*/
/* opacity: 0;*/
/*}*/
/*.gnb_mb .dep2.on > ul > li:nth-child(1) {*/
/* animation-delay: 0.02s;*/
/*}*/
/*.gnb_mb .dep2.on > ul > li:nth-child(2) {*/
/* animation-delay: 0.04s;*/
/*}*/
/*.gnb_mb .dep2.on > ul > li:nth-child(3) {*/
/* animation-delay: 0.06s;*/
/*}*/
/*.gnb_mb .dep2.on > ul > li:nth-child(4) {*/
/* animation-delay: 0.08s;*/
/*}*/
/*.gnb_mb .dep2.on > ul > li:nth-child(5) {*/
/* animation-delay: 0.1s;*/
/*}*/
/*.gnb_mb .dep2.on > ul > li:nth-child(6) {*/
/* animation-delay: 0.12s;*/
/*}*/
/*.gnb_mb .dep2.on > ul > li:nth-child(7) {*/
/* animation-delay: 0.14s;*/
/*}*/
/*.gnb_mb .dep2.on > ul > li:nth-child(8) {*/
/* animation-delay: 0.16s;*/
/*}*/
/*.gnb_mb .dep2.on > ul > li:nth-child(9) {*/
/* animation-delay: 0.18s;*/
/*}*/
/*.gnb_mb .dep2.on > ul > li:nth-child(10) {*/
/* animation-delay: 0.2s;*/
/*}*/
/*.gnb_mb .dep2.on > ul > li:nth-child(11) {*/
/* animation-delay: 0.22s;*/
/*}*/
/*.gnb_mb .dep2.on > ul > li:nth-child(12) {*/
/* animation-delay: 0.24s;*/
/*}*/
/*.gnb_mb .dep2.on > ul > li:nth-child(13) {*/
/* animation-delay: 0.26s;*/
/*}*/
/*.gnb_mb .dep2 ul a {*/
/* font-size: var(--f-20);*/
/* color: var(--C-474748);*/
/* font-weight: 800;*/
/*}*/
/*@media (max-width: 400px) {*/
/* .gnb_mb .dep2 ul a {*/
/* font-size: var(--f-20);*/
/* }*/
/*}*/
/*.gnb_mb .dep2 ul .dep3 {*/
/* display: flex;*/
/* padding-top: 20px;*/
/* flex-direction: column;*/
/* align-items: flex-start;*/
/* gap: 20px;*/
/*}*/
/*.gnb_mb .dep2 ul .dep3 a {*/
/* font-size: var(--f-13);*/
/* color: var(--C-737380);*/
/* font-weight: 600;*/
/*}*/
/*@media (max-width: 400px) {*/
/* .gnb_mb .dep2 ul .dep3 a {*/
/* font-size: var(--f-13);*/
/* }*/
/*}*/
/*.gnb_mb .dep2 ul .dep3 a::before {*/
/* content: "-";*/
/* padding-right: 15px;*/
/*}*/
/*.gnb_mb .b_dep1 li {*/
/* opacity: 0;*/
/* transform: translateX(30px);*/
/* animation: gnbLiIn 0.4s cubic-bezier(0.4, 0, 0.2, 1) forwards;*/
/*}*/
/*.gnb_mb.on .b_dep1 li:nth-child(1) {*/
/* animation-delay: 0.02s;*/
/*}*/
/*.gnb_mb.on .b_dep1 li:nth-child(2) {*/
/* animation-delay: 0.04s;*/
/*}*/
/*.gnb_mb.on .b_dep1 li:nth-child(3) {*/
/* animation-delay: 0.06s;*/
/*}*/
/*.gnb_mb.on .b_dep1 li:nth-child(4) {*/
/* animation-delay: 0.08s;*/
/*}*/
/*.gnb_mb.on .b_dep1 li:nth-child(5) {*/
/* animation-delay: 0.1s;*/
/*}*/
/*.gnb_mb.on .b_dep1 li:nth-child(6) {*/
/* animation-delay: 0.12s;*/
/*}*/
/*.gnb_mb.on .b_dep1 li:nth-child(7) {*/
/* animation-delay: 0.14s;*/
/*}*/
/*.gnb_mb.on .b_dep1 li:nth-child(8) {*/
/* animation-delay: 0.16s;*/
/*}*/
/*.gnb_mb.on .b_dep1 li:nth-child(9) {*/
/* animation-delay: 0.18s;*/
/*}*/
/*.gnb_mb.on .b_dep1 li:nth-child(10) {*/
/* animation-delay: 0.2s;*/
/*}*/
/*.gnb_mb.on .b_dep1 li:nth-child(11) {*/
/* animation-delay: 0.22s;*/
/*}*/
/*.gnb_mb.on .b_dep1 li:nth-child(12) {*/
/* animation-delay: 0.24s;*/
/*}*/
/*.gnb_mb .b_dep2 {*/
/* display: none;*/
/* position: relative;*/
/*}*/
/*.gnb_mb .b_dep2.on {*/
/* display: block;*/
/*}*/
/*.gnb_mb .b_dep2 .btn_dep_back {*/
/* width: 23px;*/
/* height: 37px;*/
/* cursor: pointer;*/
/* position: absolute;*/
/* right: 0;*/
/* top: 9px;*/
/* z-index: 1;*/
/*}*/
/*.gnb_mb .b_dep2 .btn_dep_back i {*/
/* position: absolute;*/
/* left: 0;*/
/* top: 50%;*/
/* width: 100%;*/
/* height: 5px;*/
/* background-color: var(--C-45474d);*/
/* transform-origin: left center;*/
/*}*/
/*.gnb_mb .b_dep2 .btn_dep_back i:first-child {*/
/* margin-top: -2px;*/
/* transform: translateY(-50%) rotate(45deg);*/
/*}*/
/*.gnb_mb .b_dep2 .btn_dep_back i:last-child {*/
/* margin-top: 1px;*/
/* transform: translateY(-50%) rotate(-45deg);*/
/*}*/
/*.gnb_mb .b_dep2 ul {*/
/* display: none;*/
/*}*/
/*.gnb_mb .b_dep2 ul.on {*/
/* display: block;*/
/*}*/
/*.gnb_mb .b_dep2 a {*/
/* font-size: var(--f-40);*/
/* color: var(--C-474748);*/
/*}*/
/*@media (max-width: 400px) {*/
/* .gnb_mb .b_dep2 a {*/
/* font-size: var(--f-30);*/
/* }*/
/*}*/
/*.gnb_mb .b_dep2 > ul > li {*/
/* opacity: 0;*/
/* transform: translateX(30px);*/
/* animation: gnbLiIn 0.4s cubic-bezier(0.4, 0, 0.2, 1) forwards;*/
/*}*/
/*.gnb_mb .b_dep2.on > ul > li {*/
/* opacity: 0;*/
/*}*/
/*.gnb_mb .b_dep2.on > ul > li:nth-child(1) {*/
/* animation-delay: 0.02s;*/
/*}*/
/*.gnb_mb .b_dep2.on > ul > li:nth-child(2) {*/
/* animation-delay: 0.04s;*/
/*}*/
/*.gnb_mb .b_dep2.on > ul > li:nth-child(3) {*/
/* animation-delay: 0.06s;*/
/*}*/
/*.gnb_mb .b_dep2.on > ul > li:nth-child(4) {*/
/* animation-delay: 0.08s;*/
/*}*/
/*.gnb_mb .b_dep2.on > ul > li:nth-child(5) {*/
/* animation-delay: 0.1s;*/
/*}*/
/*.gnb_mb .b_dep2.on > ul > li:nth-child(6) {*/
/* animation-delay: 0.12s;*/
/*}*/
/*.gnb_mb .b_dep2.on > ul > li:nth-child(7) {*/
/* animation-delay: 0.14s;*/
/*}*/
/*.gnb_mb .b_dep2.on > ul > li:nth-child(8) {*/
/* animation-delay: 0.16s;*/
/*}*/
/*.gnb_mb .b_dep2.on > ul > li:nth-child(9) {*/
/* animation-delay: 0.18s;*/
/*}*/
/*.gnb_mb .b_dep2.on > ul > li:nth-child(10) {*/
/* animation-delay: 0.2s;*/
/*}*/
/*.gnb_mb .b_dep2.on > ul > li:nth-child(11) {*/
/* animation-delay: 0.22s;*/
/*}*/
/*.gnb_mb .b_dep2.on > ul > li:nth-child(12) {*/
/* animation-delay: 0.24s;*/
/*}*/
/*.gnb_mb .b_dep2.on > ul > li:nth-child(13) {*/
/* animation-delay: 0.26s;*/
/*}*/
/*.gnb_mb .bottom .dep3 {*/
/* display: flex;*/
/* padding: 15px 0 20px;*/
/* gap: 15px;*/
/* flex-direction: column;*/
/*}*/
/*.gnb_mb .bottom .dep3 a {*/
/* font-size: var(--f-32);*/
/* color: var(--C-737380);*/
/* font-weight: 600;*/
/*}*/
/*@media (max-width: 400px) {*/
/* .gnb_mb .bottom .dep3 a {*/
/* font-size: var(--f-23);*/
/* }*/
/*}*/
/*.gnb_mb .bottom .dep3 a::before {*/
/* content: "-";*/
/* padding-right: 15px;*/
/*}*/
/*.gnb_mb .bottom {*/
/* padding-top: 50px;*/
/*}*/
/*.gnb_mb .bottom a {*/
/* font-size: var(--f-16);*/
/* color: var(--C-474748);*/
/*}*/
/*!* @media (max-width: 400px) {*/
/* .gnb_mb .bottom a {*/
/* font-size: var(--f-16);*/
/* }*/
/*} *!*/
/*.gnb_mb .bottom .tel {*/
/* padding-top: 50px;*/
/* font-size: var(--f-30);*/
/* color: var(--C-474748);*/
/* font-weight: 800;*/
/* line-height: 1.2;*/
/*}*/
/*!* @media (max-width: 400px) {*/
/* .gnb_mb .bottom .tel {*/
/* font-size: var(--f-40);*/
/* }*/
/*} *!*/
/*.gnb_mb .bottom .banner {*/
/* margin-top: 40px;*/
/*}*/
/*@media (max-width: 400px) {*/
/* .gnb_mb .bottom .banner {*/
/* margin-top: 7%;*/
/* }*/
/*}*/
/*.gnb_mb .bottom .banner img {*/
/* width: 100%;*/
/* max-width: 540px;*/
/*}*/
/*.gnb_mb .gnb_mb_close {*/
/* width: 37px;*/
/* height: 37px;*/
/* cursor: pointer;*/
/* position: absolute;*/
/* left: 30px;*/
/* top: 13px;*/
/*}*/
/*.gnb_mb .gnb_mb_close i {*/
/* display: block;*/
/* width: 100%;*/
/* height: 5px;*/
/* position: absolute;*/
/* left: 0;*/
/* top: 50%;*/
/* transform: rotate(45deg);*/
/* background-color: var(--C-45474d);*/
/*}*/
/*.gnb_mb .gnb_mb_close i:last-child {*/
/* transform: rotate(-45deg);*/
/*}*/
/*!* footer *!*/
/*#footer {*/
/* width: 100%;*/
/* position: relative;*/
/* z-index: 1;*/
/* border-top: 1px solid var(--C-f4f4f4);*/
/*}*/
/*@media (max-width: 720px) {*/
/* #footer {*/
/* border-width: 2px;*/
/* }*/
/*}*/
/*#footer::before {*/
/* content: "";*/
/* width: 100%;*/
/* height: 1px;*/
/* position: absolute;*/
/* left: 0;*/
/* top: 83px;*/
/* background-color: var(--C-f4f4f4);*/
/*}*/
/*@media (max-width: 1024px) {*/
/* #footer::before {*/
/* top: 60px;*/
/* }*/
/*}*/
/*@media (max-width: 720px) {*/
/* #footer::before {*/
/* height: 2px;*/
/* top: 16vw;*/
/* }*/
/*}*/
/*#footer::after {*/
/* content: "";*/
/* width: 100%;*/
/* height: 1px;*/
/* position: absolute;*/
/* left: 0;*/
/* top: 251px;*/
/* background-color: var(--C-f4f4f4);*/
/*}*/
/*@media (max-width: 1024px) {*/
/* #footer::after {*/
/* top: initial;*/
/* bottom: 50px;*/
/* }*/
/*}*/
/*@media (max-width: 720px) {*/
/* #footer::after {*/
/* bottom: 10.6vw;*/
/* }*/
/*}*/
/*#footer .inner {*/
/* width: 960px;*/
/* margin: 0 auto;*/
/*}*/
/*@media (max-width: 1024px) {*/
/* #footer .inner {*/
/* width: initial;*/
/* padding: 0 20px;*/
/* }*/
/*}*/
/*@media (max-width: 720px) {*/
/* #footer .inner {*/
/* padding: 0 5%;*/
/* }*/
/*}*/
/*#footer .link_box {*/
/* display: flex;*/
/* height: 83px;*/
/* justify-content: space-between;*/
/* align-items: center;*/
/* flex-direction: row-reverse;*/
/*}*/
/*@media (max-width: 1024px) {*/
/* #footer .link_box {*/
/* height: 60px;*/
/* }*/
/*}*/
/*@media (max-width: 720px) {*/
/* #footer .link_box {*/
/* height: auto;*/
/* flex-direction: column;*/
/* }*/
/*}*/
/*#footer .link_box .sns_link {*/
/* display: flex;*/
/* gap: 30px;*/
/* line-height: 0;*/
/*}*/
/*@media (max-width: 1024px) {*/
/* #footer .link_box .sns_link {*/
/* gap: 20px;*/
/* }*/
/*}*/
/*@media (max-width: 720px) {*/
/* #footer .link_box .sns_link {*/
/* height: 16vw;*/
/* gap: 9vw;*/
/* align-items: center;*/
/* }*/
/*}*/
/*#footer .link_box .sns_link .btn_Youtube img {*/
/* width: 29px;*/
/* margin-top: 2px;*/
/*}*/
/*@media (max-width: 720px) {*/
/* #footer .link_box .sns_link .btn_Youtube img {*/
/* width: 8vw;*/
/* margin-top: 0;*/
/* }*/
/*}*/
/*#footer .link_box .sns_link .btn_Instagram img {*/
/* width: 23px;*/
/*}*/
/*@media (max-width: 720px) {*/
/* #footer .link_box .sns_link .btn_Instagram img {*/
/* width: 6.5vw;*/
/* }*/
/*}*/
/*#footer .link_box .sns_link .btn_Facebook img {*/
/* width: 13px;*/
/*}*/
/*@media (max-width: 720px) {*/
/* #footer .link_box .sns_link .btn_Facebook img {*/
/* width: 3.5vw;*/
/* }*/
/*}*/
/*#footer .link_box .sns_link .btn_Kakao img {*/
/* width: 24px;*/
/*}*/
/*@media (max-width: 720px) {*/
/* #footer .link_box .sns_link .btn_Kakao img {*/
/* width: 6.5vw;*/
/* }*/
/*}*/
/*@media (max-width: 720px) {*/
/* #footer .link_box .id_link {*/
/* width: 100%;*/
/* padding: 5vw 0 5vw;*/
/* }*/
/*}*/
/*#footer .link_box .id_link ul {*/
/* display: flex;*/
/* gap: 30px;*/
/*}*/
/*@media (max-width: 1024px) {*/
/* #footer .link_box .id_link ul {*/
/* gap: 20px;*/
/* }*/
/*}*/
/*@media (max-width: 720px) {*/
/* #footer .link_box .id_link ul {*/
/* gap: 5vw 0;*/
/* flex-direction: row;*/
/* flex-wrap: wrap;*/
/* }*/
/*}*/
/*@media (max-width: 720px) {*/
/* #footer .link_box .id_link ul li {*/
/* width: auto;*/
/* padding-right: 7vw;*/
/* }*/
/*}*/
/*#footer .link_box .id_link ul li a {*/
/* display: inline-block;*/
/* padding: 2px 0 0 30px;*/
/* font-size: var(--f-19);*/
/* color: var(--C-737380);*/
/* font-weight: 900;*/
/* background: url(//image.idhospital.com/www/rn_2025/common/footer_icon_id.png)*/
/* no-repeat left top;*/
/* background-size: 23px auto;*/
/*}*/
/*@media (max-width: 1024px) {*/
/* #footer .link_box .id_link ul li a {*/
/* font-size: var(--f-17);*/
/* padding: 0 0 0 22px;*/
/* background-size: 18px auto;*/
/* }*/
/*}*/
/*@media (max-width: 720px) {*/
/* #footer .link_box .id_link ul li a {*/
/* padding: 0 0 0 5.5vw;*/
/* font-size: 4vw;*/
/* background-size: 4.5vw auto;*/
/* }*/
/*}*/
/*#footer .link_box .id_link ul li:last-child a {*/
/* background: none;*/
/* padding-left: 0;*/
/*}*/
/*#footer .company_info {*/
/* height: 167px;*/
/* display: flex;*/
/* font-size: var(--f-19);*/
/* color: var(--C-737380);*/
/* justify-content: space-between;*/
/* align-items: center;*/
/* flex-direction: row-reverse;*/
/*}*/
/*@media (max-width: 1024px) {*/
/* #footer .company_info {*/
/* height: 140px;*/
/* font-size: var(--f-17);*/
/* }*/
/*}*/
/*@media (max-width: 720px) {*/
/* #footer .company_info {*/
/* height: auto;*/
/* padding-bottom: 3vw;*/
/* align-items: flex-start;*/
/* flex-direction: column;*/
/* }*/
/*}*/
/*#footer .company_info .left {*/
/* display: flex;*/
/* gap: 10px;*/
/* flex-direction: column;*/
/*}*/
/*@media (max-width: 1024px) {*/
/* #footer .company_info .left {*/
/* gap: 5px;*/
/* }*/
/*}*/
/*@media (max-width: 720px) {*/
/* #footer .company_info .left {*/
/* padding-bottom: 3vw;*/
/* flex-direction: row;*/
/* flex-wrap: wrap;*/
/* }*/
/*}*/
/*@media (max-width: 720px) {*/
/* #footer .company_info .left p {*/
/* margin-right: 5.4vw;*/
/* }*/
/*}*/
/*@media (max-width: 720px) {*/
/* #footer .company_info .left p:first-child {*/
/* width: 100%;*/
/* margin-right: 0;*/
/* }*/
/*}*/
/*#footer .company_info .left p span {*/
/* margin-right: 27px;*/
/* font-weight: 500;*/
/*}*/
/*@media (max-width: 720px) {*/
/* #footer .company_info .left p span {*/
/* margin-right: 3vw;*/
/* font-size: 3.4vw;*/
/* }*/
/*}*/
/*#footer .company_info .left p b {*/
/* font-size: var(--f-32);*/
/* color: var(--C-45474d);*/
/* letter-spacing: -1.5px;*/
/* font-weight: 800;*/
/*}*/
/*@media (max-width: 720px) {*/
/* #footer .company_info .left p b {*/
/* font-size: 5.4vw;*/
/* }*/
/*}*/
/*#footer .company_info .left p strong {*/
/* font-size: var(--f-19);*/
/* color: var(--C-45474d);*/
/* letter-spacing: -1px;*/
/* font-weight: 800;*/
/*}*/
/*@media (max-width: 720px) {*/
/* #footer .company_info .left p strong {*/
/* font-size: 4vw;*/
/* }*/
/*}*/
/*#footer .company_info .right {*/
/* display: flex;*/
/* gap: 15px;*/
/* flex-direction: column;*/
/*}*/
/*@media (max-width: 1024px) {*/
/* #footer .company_info .right {*/
/* gap: 10px;*/
/* }*/
/*}*/
/*@media (max-width: 720px) {*/
/* #footer .company_info .right {*/
/* font-size: 3.8vw;*/
/* gap: 3vw;*/
/* }*/
/*}*/
/*#footer .company_info .right .link ul {*/
/* display: flex;*/
/*}*/
/*#footer .company_info .right .link li::after {*/
/* content: "";*/
/* display: inline-block;*/
/* width: 1px;*/
/* height: 16px;*/
/* margin: 0 15px;*/
/* color: var(--C-f4f4f4);*/
/* vertical-align: -2px;*/
/*}*/
/*#footer .company_info .right .link li:last-child::after {*/
/* display: none;*/
/*}*/
/*#footer .company_info .right .link a {*/
/* color: var(--C-737380);*/
/*}*/
/*@media (max-width: 720px) {*/
/* #footer .company_info .right .link a {*/
/* font-size: 3.8vw;*/
/* }*/
/*}*/
/*#footer .copy {*/
/* display: flex;*/
/* height: 77px;*/
/* font-size: var(--f-15);*/
/* color: var(--C-aaaab2);*/
/* align-items: center;*/
/*}*/
/*@media (max-width: 1024px) {*/
/* #footer .copy {*/
/* height: 50px;*/
/* }*/
/*}*/
/*@media (max-width: 720px) {*/
/* #footer .copy {*/
/* height: 10.6vw;*/
/* font-size: 3.5vw;*/
/* }*/
/*}*/
/* quick */
/*.quick {*/
/* width: 87px;*/
/* position: fixed;*/
/* right: 50%;*/
/* bottom: 10%;*/
/* margin-right: -750px;*/
/* z-index: 5;*/
/* transition: all 1s ease;*/
/*}*/
/*@media (max-width: 1500px) {*/
/* .quick {*/
/* width: auto;*/
/* right: 2%;*/
/* margin-right: 0;*/
/* }*/
/*}*/
/*@media (max-width: 720px) {*/
/* .quick {*/
/* bottom: 100px;*/
/* top: initial;*/
/* }*/
/*}*/
/*.quick.hidden {*/
/* display: none;*/
/*}*/
/*.quick .btn_box {*/
/* display: flex;*/
/* width: 88px;*/
/* height: 147px;*/
/* position: relative;*/
/* margin-bottom: 10px;*/
/* flex-direction: column;*/
/* align-items: center;*/
/* justify-content: space-evenly;*/
/* border-radius: 50px;*/
/* background-color: var(--C-000b17);*/
/* transition: all 0.3s ease;*/
/* overflow: hidden;*/
/*}*/
/*@media (max-width: 1500px) {*/
/* .quick .btn_box {*/
/* width: 70px;*/
/* height: 100px;*/
/* }*/
/*}*/
/*.quick .btn_box::after {*/
/* content: "";*/
/* position: absolute;*/
/* width: 48px;*/
/* height: 2px;*/
/* top: 73px;*/
/* z-index: 1;*/
/* background-color: var(--C-33373f);*/
/*}*/
/*@media (max-width: 1500px) {*/
/* .quick .btn_box::after {*/
/* width: 30px;*/
/* top: 50px;*/
/* }*/
/*}*/
/*.quick .btn_box a {*/
/* color: var(--C-aaaab3);*/
/*}*/
/*.quick .btn_box a:hover {*/
/* color: var(--C-ffffff);*/
/*}*/
/*.quick .btn_box .menu_open {*/
/* display: flex;*/
/* width: 100%;*/
/* height: 100%;*/
/* color: var(--C-aaaab3);*/
/* cursor: pointer;*/
/* flex-direction: column;*/
/* justify-content: space-evenly;*/
/* border: none;*/
/* background: none;*/
/* opacity: 1;*/
/* transform: translateY(0px);*/
/* transition: all 0.3s ease;*/
/*}*/
/*@media (max-width: 720px) {*/
/* .quick .btn_box .menu_open {*/
/* font-size: 3vw;*/
/* }*/
/*}*/
/*.quick .btn_box .menu_open:hover {*/
/* color: var(--C-ffffff);*/
/*}*/
/*.quick .btn_box .menu_open i {*/
/* display: block;*/
/*}*/
/*.quick .btn_box .btn_list {*/
/* width: 88px;*/
/* padding: 40px 0;*/
/* position: absolute;*/
/* bottom: 0;*/
/* left: 0;*/
/* z-index: 2;*/
/* flex-direction: column;*/
/* align-items: center;*/
/* justify-content: space-evenly;*/
/* border-radius: 50px;*/
/* background-color: var(--C-000b17);*/
/* opacity: 0;*/
/* pointer-events: none;*/
/* transform: translateY(0);*/
/* transition: all 0.3s ease;*/
/* height: 80%;*/
/*}*/
/*@media (max-width: 1500px) {*/
/* .quick .btn_box .btn_list {*/
/* width: 70px;*/
/* }*/
/*}*/
/*.quick .btn_box .btn_list .tel {*/
/* padding-top: 30px;*/
/* margin-top: 80px;*/
/* font-size: var(--f-17);*/
/* color: var(--C-aaaab3);*/
/* font-weight: 500;*/
/* line-height: 1.2;*/
/* text-align: center;*/
/* filter: brightness(0.5);*/
/* background: url(//image.idhospital.com/www/rn_2025/common/quick_icon_tel.png)*/
/* no-repeat center top;*/
/*}*/
/*.quick .btn_box .btn_list .tel:hover {*/
/* filter: brightness(1);*/
/*}*/
/*.quick .btn_box .btn_list .tel:hover i {*/
/* color: var(--C-ffffff);*/
/*}*/
/*.quick .btn_box .btn_list ul {*/
/* display: flex;*/
/* flex-direction: column;*/
/* align-items: center;*/
/*}*/
/*.quick .btn_box .btn_list li::before {*/
/* display: block;*/
/* content: "";*/
/* width: 48px;*/
/* height: 1px;*/
/* margin: 13px auto;*/
/* background-color: var(--C-33373f);*/
/*}*/
/*@media (max-width: 1500px) {*/
/* .quick .btn_box .btn_list li::before {*/
/* width: 30px;*/
/* }*/
/*}*/
/*.quick .btn_box .btn_list li a {*/
/* display: inline-block;*/
/* font-size: var(--f-13);*/
/* color: var(--C-aaaab3);*/
/*}*/
/*.quick .btn_box .btn_list li a:hover {*/
/* color: var(--C-ffffff);*/
/*}*/
/*.quick .btn_box .btn_list li a i {*/
/* display: block;*/
/* height: 30px;*/
/* width: 100%;*/
/* filter: brightness(0.5);*/
/* background-repeat: no-repeat;*/
/* background-position: center top;*/
/*}*/
/*.quick .btn_box .btn_list li:nth-child(1) a i {*/
/* background-image: url(//image.idhospital.com/www/rn_2025/common/quick_icon_kakao.png);*/
/*}*/
/*.quick .btn_box .btn_list li:nth-child(2) a i {*/
/* background-image: url(//image.idhospital.com/www/rn_2025/common/quick_icon_cost.png);*/
/*}*/
/*.quick .btn_box .btn_list li:nth-child(3) a i {*/
/* background-image: url(//image.idhospital.com/www/rn_2025/common/quick_icon_online.png);*/
/*}*/
/*.quick .btn_box .btn_list li:nth-child(4) a i {*/
/* background-image: url(//image.idhospital.com/www/rn_2025/common/quick_icon_reservation.png);*/
/*}*/
/*.quick .btn_box .btn_list li a:hover i {*/
/* filter: brightness(1);*/
/*}*/
/*.quick .btn_box.on {*/
/* height: 410px;*/
/* padding: 50px 0;*/
/*}*/
/*.quick .btn_box.on .btn_list {*/
/* display: flex;*/
/* pointer-events: auto;*/
/* opacity: 1;*/
/* height: 100%;*/
/* transform: translateY(0);*/
/*}*/
/*.quick .btn_box.on .menu_open {*/
/* opacity: 0;*/
/* height: 100%;*/
/*}*/
/*.quick .btn_top {*/
/* display: flex;*/
/* width: 88px;*/
/* height: 88px;*/
/* color: var(--C-aaaab3);*/
/* cursor: pointer;*/
/* align-items: center;*/
/* justify-content: center;*/
/* border-radius: 50px;*/
/* background-color: var(--C-000b17);*/
/*}*/
/*@media (max-width: 1500px) {*/
/* .quick .btn_top {*/
/* width: 70px;*/
/* height: 70px;*/
/* }*/
/*}*/
/*@media (max-width: 720px) {*/
/* .quick .btn_top {*/
/* font-size: 3vw;*/
/* display: none;*/
/* }*/
/*}*/
/*.quick .btn_top:hover {*/
/* color: var(--C-ffffff);*/
/*}*/
/*@media (max-width: 720px) {*/
/* .quick .btn_box .btn_list .tel {*/
/* display: none;*/
/* }*/
/* .quick .btn_box .btn_list li:nth-child(1)::before {*/
/* display: none;*/
/* }*/
/* .quick .btn_box .btn_list li:nth-child(4) {*/
/* display: none;*/
/* }*/
/* .quick .btn_box.on {*/
/* height: 210px;*/
/* }*/
/* .quick .btn_box .btn_list {*/
/* padding: 0;*/
/* }*/
/* .quick .btn_box.on {*/
/* padding: 30px 0;*/
/* }*/
/*}*/
/**** layout_main.css end ****/
/* top */
/****** gnb.css start ******/
#wrap {
position: relative;
}
.header_deem {
position: absolute;
top: 0;
left: 0;
right: 0;
bottom: 0;
background: #6d6d6d4f;
z-index: 6;
display: none;
backdrop-filter: blur(8px);
-webkit-backdrop-filter: blur(8px);
}
.header_deem.on {
display: block;
}
#header.fixed {
position: fixed;
top: 0;
left: 0;
width: 100%;
z-index: 1000;
box-shadow: 0 2px 8px rgba(0, 0, 0, 0.08);
background: #fff;
transition: box-shadow 0.2s, background 0.2s;
}
/* headerê°€ fixedì¼ ë•Œ ë³¸ë¬¸ì´ ë°€ë¦¬ì§€ ì•Šë„ë¡ íŒ¨ë”© 추가 */
body.header-fixed-padding {
padding-top: 120px; /* headerì˜ ì‹¤ì œ 높ì´ì— 맞게 ì¡°ì • */
}
/* ì „í™”ê±¸ê¸° a 태그 ìŠ¤íƒ€ì¼ */
.tel a {
color: #000b17;
}
#header .gnb_info {
display: flex;
align-items: center;
}
#header .right .btn_login {
width: 21px;
height: 21px;
text-indent: -1000em;
background: url(//image.idhospital.com/www/rn_2025/common/header_icon_login.png?v=1)
no-repeat left top;
background-size: 100%;
}
#header .right .btn_login a {
display: block;
}
#header .menu ul li {
display: flex;
padding: 0 14px !important;
cursor: pointer;
align-items: flex-end;
margin-bottom: 20px !important;
}
#header .right .btn_mypage {
width: 21px;
height: 21px;
text-indent: -1000em;
background: url(//image.idhospital.com/www/rn_2025/common/header_icon_mypage.png)
no-repeat left top;
background-size: 100%;
}
#header .right .btn_mypage a {
display: block;
}
#header .right .btn_logout {
display: block !important;
width: 60px;
height: 21px;
text-indent: -1000em;
background: url(//image.idhospital.com/www/rn_2025/common/header_icon_logout.png)
no-repeat left top;
background-size: 100%;
}
#header .right .btn_logout a {
display: block;
}
.language_all {
position: absolute;
top: 82px;
width: 200px;
display: none;
background-color: #fff;
z-index: 2;
}
.language_all ul li a {
background: #fff;
padding: 10px 0 10px 25px;
clear: both;
font-size: 15px;
font-weight: 500;
color: #1a1a1a;
position: relative;
display: block;
}
.language_all ul li a:hover {
background: #002f6b;
color: #fff;
}
.img_countury {
background: url(//image.idhospital.com/www/rn_2025/common/gnb/language_bg.png)
left top no-repeat;
width: 29px;
height: 19px;
display: inline-block;
text-indent: -9999px;
vertical-align: middle;
margin-right: 7px;
}
.img_countury.korea {
background-position: 0 0;
}
.img_countury.eng {
background-position: 0 -37px;
}
.img_countury.japan {
background-position: 0 -74px;
}
.img_countury.china {
background-position: 0 -111px;
}
.img_countury.vietanam {
background-position: 0 -148px;
}
.img_countury.thai {
background-position: 0 -185px;
}
.img_countury.spain {
background-position: 0 -222px;
}
.img_countury.mongo {
background-position: 0 -259px;
}
.img_countury.indo {
background-position: 0 -296px;
}
.img_countury.rusia {
background-position: 0 -333px;
}
.img_countury.arabic {
background-position: 0 -370px;
}
#header.on .gnb_menu_2depth {
display:none;
}
.gnb_menu_2depth {
display: none;
position:relative;
z-index: 1;
}
#header .menu ul li.active a {
font-weight: 800;
}
.gnb nav ul li.active a {
font-weight: 800;
}
.gnb nav ul li.active .dep3 a.active {
font-weight: 800;
}
.gnb nav ul li.active .dep3 {
display: flex;
}
.sitemap .inner .item:nth-of-type(12){order:0;}
.sitemap .inner .item:nth-of-type(7){order:1; margin-left: 14.2%;}
.sitemap .inner .item:nth-of-type(8){order:1;}
.sitemap .inner .item:nth-of-type(9){order:1;}
.sitemap .inner .item:nth-of-type(10){order:1;}
.sitemap .inner .item:nth-of-type(11){order:1;}
.sitemap .inner .item:nth-of-type(13){order:1;}
.sitemap .item .banner img {
width: 100%;
height: auto;
vertical-align: top;
}
.gnb_mb .on .menu_title {
font-weight: 800;
}
.gnb_mb .dep3 {
display: none;
padding-top: 18px;
}
.gnb_mb div.menu_title_wrap {
display: flex;
justify-content: space-between;
align-items: center;
width: 100%;
}
.gnb_mb div.menu_title_wrap .menu_title {
font-size: 32px;
color: #000b17;
font-weight: 500;
}
.dep1 > ul > li > div.on .menu_title {
font-weight: 800;
}
.gnb_mb div.menu_title_wrap .menu_arrow {
width: 27px;
height: 15px;
background: url(//image.idhospital.com/www/rn_2025/common/gnb/mo_gnb_menu_arrow.png) no-repeat;
background-size: contain;
}
/*.gnb_mb li .active div.menu_title_wrap .menu_arrow {*/
/* transform: rotate(-180deg);*/
/*}*/
.gnb_mb .dep1 .dep2 > li > div.on > .menu_title_wrap > .menu_arrow {
transform: rotate(-180deg);
}
/* .gnb_mb .dep1 .dep2 > li > div.on > .menu_title_wrap > .menu_arrow {
transform: rotate(-180deg);
} */
.gnb_mb .dep1 > ul > li > div.on .menu_title {
font-weight: 800;
}
.gnb_mb .dep1 > ul > li > div.on >.menu_title_wrap > .menu_arrow {
transform: rotate(-180deg);
}
/* .gnb_mb .dep1 > ul > li > div.active >.menu_title_wrap > .menu_arrow {
transform: rotate(-180deg);
} */
.gnb_mb .dep1 > ul > li > div.on .dep2 {
display: block;
padding-top: 18px;
}
/* .gnb_mb .dep1 > ul > li > div.active .dep2 {
display: block;
padding-top: 18px;
} */
.gnb_mb .dep2 > li > div.on .dep3 {
display: flex;
flex-direction: column;
/*padding-top: 18px;*/
}
.gnb_mb .dep2 > li.on .dep3 {
display: flex;
flex-direction: column;
/*padding-top: 18px;*/
}
.gnb_mb .dep1 .dep2 a {
/*font-size: 15px;*/
font-size: 32px;
color: #000b17;
padding-left: 35px;
font-weight: 500;
}
.gnb_mb .dep1 .dep2 > li.on > a {
font-weight: 800;
}
.gnb_mb .dep1 .dep2 div.on .menu_title a {
font-weight: 800;
}
.gnb_mb .dep1 .dep2 > li.on .menu_title a {
font-weight: 800;
}
.gnb_mb .dep1 .dep2 .dep3 a.current {
font-weight: 800;
}
.gnb_mb .dep1 .dep2 .dep3 a {
font-size: 32px;
color: #000b17;
font-weight: normal;
margin-left: 35px;
padding: 18px 0;
}
.gnb_mb .dep1 .dep2 li {
/*padding:0 !important;*/
padding: 18px 0;
}
.gnb_mb .dep1 .dep2 li a.current {
font-weight: 800;
}
@media (max-width: 720px) {
#header .right .btn_login {
width: 5.7vw;
height: 5.7vw;
}
.language_all {
top: 102%;
width: 45vw;
right: 0;
}
.language_all ul li a {
padding: 1.5vw 0 1.5vw 4vw;
font-size: 3.5vw;
}
.header_deem {
display: none !important;
}
.gnb_menu_2depth.hidden {
display: none;
}
/*gnb_menu_2depth*/
.gnb_menu_2depth {
display: block;
/*height: 11.11vw;*/
background: #fdfdfe;
border-top: 0.28vw solid var(--C-f4f4f4);
width: 100%;
}
.gnb_menu_2depth_inner {
/*padding-top: 3.75vw;*/
/*white-space: nowrap;*/
line-height: 11.11vw;
display: block;
}
.gnb_menu_2depth_inner::after {
content: "";
display: block;
clear: both;
}
/*home_menu*/
.home_menu {
display: inline-block;
padding: 0 4.17vw;
margin-top: 0.42vw;
}
.home_menu a {
display: block;
}
.home_menu .home_icon {
display: inline-block;
width: 4.03vw;
height: 3.89vw;
background: url(//image.idhospital.com/www/rn_2025/common/gnb/icon_home.png)
no-repeat;
background-size: contain;
}
.home_menu,
.depth2_ul {
float: left;
}
.depth2_ul a {
display: block;
}
.depth2_ul ul {
width: 100%;
}
.depth2_ul li {
display: inline-block;
position: relative;
line-height: 1;
padding: 0 2.78vw;
}
.depth2_ul li::before {
content: "";
display: inline-block;
width: 0.28vw;
height: 4.31vw;
background-color: #aaaab3;
position: absolute;
left: 0;
top: 50%;
transform: translateY(-50%);
}
.depth2_ul li p {
font-size: 3.19vw;
letter-spacing: -0.14vw;
color: #000;
display: flex;
align-items: center;
}
.depth2_ul li p .name {
display: inline-block;
}
.depth2_ul li .menu_arrow {
display: inline-block;
width: 2.08vw;
height: 1.11vw;
background: url(//image.idhospital.com/www/rn_2025/common/gnb/icon_arrow.png)
no-repeat;
background-size: contain;
margin-left: 1.94vw;
}
.depth2_ul li.active .menu_arrow {
transform: rotate(180deg);
}
/* depth3_menu_box*/
.depth2_ul li .depth3_menu_box {
display: none;
}
.depth2_ul li .depth3_menu_box p {
display: block;
text-align: center;
font-size: 3.19vw;
letter-spacing: -0.14vw;
padding-bottom: 3.19vw;
}
.depth2_ul li .depth3_menu_box p:last-child {padding-bottom: 0;}
.depth2_ul li .depth3_menu_box a {
color: #fff;
display: block;
}
.depth2_ul li .depth3_menu_box.active {
display: block;
text-align: center;
color: #fff;
min-width: 29.17vw;
border-radius: 1.39vw;
background: #262626;
position: absolute;
top: 4.17vw;
left: 0;
z-index: 1;
padding: 4.17vw 1.39vw;
}
}
/**
*
*
250804
common css ì´ë™
*
*
**/
/* header */
#header {
width: 100%;
position: relative;
z-index: 8;
border-bottom: 2px solid var(--C-f4f4f4);
background-color: var(--C-ffffff);
}
#header > .inner {
display: flex;
max-width: 1920px;
margin: 0 auto;
justify-content: space-around;
align-items: flex-end;
}
#header .menu_open {
display: none;
width: 5.4vw;
height: 5.3vw;
position: absolute;
top: 35%;
left: 3%;
cursor: pointer;
}
#header .menu_open i {
width: 100%;
height: 4px;
position: absolute;
left: 0;
background-color: var(--C-45474d);
}
#header .menu_open i:nth-child(1) {
top: 0;
}
#header .menu_open i:nth-child(2) {
top: 14px;
}
#header .menu_open i:nth-child(3) {
top: 28px;
}
#header h1 {
padding: 24px 0 22px;
}
#header h1 a {
display: flex;
}
#header h1 img {
width: 129px;
vertical-align: top;
}
#header .menu {
height: 79px;
position: relative;
}
#header .menu ul {
display: flex;
height: 100%;
align-items: stretch;
}
#header .menu ul li a {
color: var(--C-474748);
font-weight: 500;
font-size: 16px;
}
#header .menu ul li.on a {
color: var(--C-000b17);
font-weight: 900;
}
#header .menu .menu_hidden_open {
display: none;
width: 50px;
height: 100%;
position: absolute;
right: 0;
top: 0;
gap: 5px;
justify-content: center;
align-items: flex-end;
background-color: var(--C-ffffff);
}
#header .menu .menu_hidden_open i {
display: inline-block;
width: 5px;
height: 5px;
margin-bottom: 30px;
border-radius: 10px;
background-color: var(--C-000b17);
}
#header .right {
padding-bottom: 20px;
}
#header .right button {
margin-left: 16px;
color: var(--C-000b17);
cursor: pointer;
border: none;
background: none;
}
#header .right .btn_search {
margin-left: 27px;
}
#header .right .btn_search {
width: 21px;
height: 21px;
text-indent: -1000em;
background: url(//image.idhospital.com/www/rn_2025/common/header_icon_search.png)
no-repeat left top;
background-size: 100%;
}
#header .right .btn_language {
width: 21px;
height: 21px;
text-indent: -1000em;
background: url(//image.idhospital.com/www/rn_2025/common/header_icon_language.png)
no-repeat left top;
background-size: 100%;
}
#header .right .btn_menu {
width: 18px;
height: 16px;
position: relative;
transition: background 0.3s;
}
#header .right .btn_menu i {
width: 18px;
height: 2px;
position: absolute;
left: 0;
background-color: var(--C-45474d);
transition: transform 0.3s, opacity 0.3s;
}
#header .right .btn_menu i:nth-child(1) {
top: 0;
}
#header .right .btn_menu i:nth-child(2) {
top: 7px;
}
#header .right .btn_menu i:nth-child(3) {
top: 14px;
}
/* Xìž ë³€í™˜ */
#header .right .btn_menu.on i:nth-child(1) {
transform: translateY(7px) rotate(45deg);
}
#header .right .btn_menu.on i:nth-child(2) {
opacity: 0;
}
#header .right .btn_menu.on i:nth-child(3) {
transform: translateY(-7px) rotate(-45deg);
}
/* gnb */
.gnb {
display: none;
width: 100%;
position: absolute;
left: 0;
top: 81px;
padding: 30px 0;
background-color: var(--C-ffffff);
box-shadow: -7px 4px 10px rgba(0, 0, 0, 0.1);
}
.gnb.on {
display: block;
}
/*.gnb.on .inner {*/
/* max-width: 1200px!important;*/
/*}*/
.gnb .inner {
display: flex;
width: 1195px;
margin: 0 auto;
justify-content: space-between;
/*border: 1px solid;*/
}
.gnb nav {
display: flex;
margin-left: 26px;
}
.gnb ul {
display: none;
flex-direction: column;
}
.gnb ul h4 {
font-size: 13px;
padding-bottom: 2px;
color: #737380;
}
.gnb nav ul.on {
display: flex;
}
.gnb nav ul li {
position: relative;
padding: 3px 0;
opacity: 0;
transform: translateX(30px);
animation: gnbLiIn 0.4s cubic-bezier(0.4, 0, 0.2, 1) forwards;
}
.gnb nav ul.on li:nth-child(1) {
animation-delay: 0.02s;
}
.gnb nav ul.on li:nth-child(2) {
animation-delay: 0.04s;
}
.gnb nav ul.on li:nth-child(3) {
animation-delay: 0.06s;
}
.gnb nav ul.on li:nth-child(4) {
animation-delay: 0.08s;
}
.gnb nav ul.on li:nth-child(5) {
animation-delay: 0.1s;
}
.gnb nav ul.on li:nth-child(6) {
animation-delay: 0.12s;
}
.gnb nav ul.on li:nth-child(7) {
animation-delay: 0.14s;
}
.gnb nav ul.on li:nth-child(8) {
animation-delay: 0.16s;
}
.gnb nav ul.on li:nth-child(9) {
animation-delay: 0.18s;
}
.gnb nav ul.on li:nth-child(10) {
animation-delay: 0.2s;
}
.gnb nav ul.on li:nth-child(11) {
animation-delay: 0.22s;
}
@keyframes gnbLiIn {
to {
opacity: 1;
transform: translateX(0);
}
}
.gnb nav ul li a {
font-size: var(--f-16);
color: var(--C-000b17);
font-weight: 600;
}
.gnb nav ul li.on a {
font-weight: 800;
}
.gnb nav ul li .dep3 {
display: none;
min-width: 160px;
position: absolute;
gap: 5px;
flex-direction: column;
top: 5px;
left: 114%;
}
.gnb nav ul li .dep3::before {
content: '';
display: inline-block;
width: 7px;
height: 14px;
background: url(//image.idhospital.com/www/rn_2025/common/gnb/gnb_nav_ul_li_arrow.png) no-repeat;
background-size: contain;
position: absolute;
left: -11px;
top: 3px;
}
.gnb nav ul li .dep3 a {
font-size: var(--f-15);
color: #000b17;
font-weight: 500;
opacity: 0;
transform: translateX(20px);
animation: gnbLiIn 0.3s cubic-bezier(0.4, 0, 0.2, 1) forwards;
}
.gnb nav ul li .dep3 a:hover {
font-weight: 900;
}
.gnb nav ul li.on .dep3 a:nth-child(1) {
animation-delay: 0.02s;
}
.gnb nav ul li.on .dep3 a:nth-child(2) {
animation-delay: 0.04s;
}
.gnb nav ul li.on .dep3 a:nth-child(3) {
animation-delay: 0.06s;
}
.gnb nav ul li.on .dep3 a:nth-child(4) {
animation-delay: 0.08s;
}
.gnb nav ul li.on .dep3 a:nth-child(5) {
animation-delay: 0.1s;
}
.gnb nav ul li.on .dep3 a:nth-child(6) {
animation-delay: 0.12s;
}
.gnb nav ul li.on .dep3 a:nth-child(7) {
animation-delay: 0.14s;
}
.gnb nav ul li.on .dep3 a:nth-child(8) {
animation-delay: 0.16s;
}
.gnb nav ul li .dep3 a::before {
content: "- ";
}
.gnb nav ul li.on .dep3 {
display: flex;
}
.gnb .right ul {
display: inline-flex;
gap: 7px;
position: relative;
}
.gnb .right ul li a {
font-size: var(--f-16);
color: var(--C-474748);
}
.gnb .right ul li.on {
font-weight: 900;
}
.gnb .right ul li .dep3 {
display: none;
min-width: 160px;
position: absolute;
left: 120%;
top: 0;
gap: 5px;
flex-direction: column;
}
.gnb .right ul li .dep3 a {
font-size: var(--f-13);
color: var(--C-737380);
font-weight: 500;
opacity: 0;
transform: translateX(20px);
animation: gnbLiIn 0.3s cubic-bezier(0.4, 0, 0.2, 1) forwards;
}
.gnb .right ul li.on .dep3 a:nth-child(1) {
animation-delay: 0.02s;
}
.gnb .right ul li.on .dep3 a:nth-child(2) {
animation-delay: 0.04s;
}
.gnb .right ul li.on .dep3 a:nth-child(3) {
animation-delay: 0.06s;
}
.gnb .right ul li.on .dep3 a:nth-child(4) {
animation-delay: 0.08s;
}
.gnb .right ul li.on .dep3 a:nth-child(5) {
animation-delay: 0.1s;
}
.gnb .right ul li.on .dep3 a:nth-child(6) {
animation-delay: 0.12s;
}
.gnb .right ul li.on .dep3 a:nth-child(7) {
animation-delay: 0.14s;
}
.gnb .right ul li .dep3 a::before {
content: "- ";
}
.gnb .right ul li.on .dep3 {
display: flex;
}
.gnb .right .tel {
padding-top: 25px;
font-size: var(--f-32);
color: #000b17;
font-weight: 900;
line-height: 1.1;
}
.gnb .banner img {
vertical-align: top;
}
/* search */
.search {
display: none;
width: 100%;
position: absolute;
left: 0;
top: 0;
padding: 30px 0;
background-color: var(--C-ffffff);
}
.search.on {
display: block;
}
.search .inner {
display: flex;
max-width: 1680px;
margin: 0 auto;
position: relative;
justify-content: space-between;
flex-wrap: wrap;
flex-direction: column;
}
.search .input_form {
width: 905px;
height: 52px;
margin: 0 auto;
border-radius: 15px;
background: var(--C-f4f4f4) url(../images/common/header_icon_search.png)
no-repeat 20px center;
}
.search .input_form input {
width: 100%;
height: 100%;
padding: 0 55px;
box-sizing: border-box;
border: none;
background: none;
}
.search .recomm_search {
display: flex;
width: 905px;
margin: 0 auto;
padding-top: 27px;
position: relative;
}
.search .recomm_search::before {
content: "추천 검색어";
padding-right: 40px;
font-size: var(--f-15);
color: var(--C-000b17);
font-weight: 900;
}
.search .recomm_search ol {
display: flex;
min-height: 240px;
padding-left: 20px;
gap: 5px;
flex-direction: column;
border-left: 1px solid var(--C-bdbdc9);
}
.search .recomm_search ol li {
font-size: var(--f-13);
color: var(--C-000b17);
font-weight: 500;
}
.search .recomm_search .banner {
position: absolute;
right: 0;
bottom: 30px;
}
.search .recomm_search .banner img {
vertical-align: top;
}
.search_close {
width: 18px;
height: 18px;
cursor: pointer;
position: absolute;
right: 0;
top: 0;
}
.search_close i {
display: block;
width: 100%;
height: 3px;
position: absolute;
left: 0;
top: 0;
transform: rotate(40deg);
background-color: var(--C-45474d);
}
.search_close i:last-child {
transform: rotate(130deg);
}
/* sitemap */
.sitemap {
width: 100%;
position: absolute;
left: 0;
top: 81px;
padding: 24px 0;
background-color: var(--C-ffffff);
opacity: 0;
transform: translateY(-20px);
transition: opacity 0.4s cubic-bezier(0.4, 0, 0.2, 1),
transform 0.4s cubic-bezier(0.4, 0, 0.2, 1);
pointer-events: none;
display: block; /* display: block으로 ë‘ê³ JSì—ì„œ on/off는 opacityë¡œ ì œì–´ */
box-shadow: -7px 4px 10px rgba(0, 0, 0, 0.1);
}
.sitemap.on {
opacity: 1;
transform: translateY(0);
pointer-events: auto;
}
.sitemap .inner {
display: flex;
width: 1326px;
margin: 0 auto;
justify-content: space-between;
flex-direction: row;
flex-wrap: wrap;
gap: 35px 0;
position: relative;
}
.sitemap .inner .item {
flex: 1 1 13%;
}
.sitemap .inner .item h4 {
padding-bottom: 4px;
font-size: var(--f-13);
color: var(--C-737380);
}
.sitemap .inner .item li{
margin-bottom: 4px;
}
.sitemap .inner .item li a {
font-size: var(--f-15);
color: var(--C-000b17);
font-weight: 500;
}
.sitemap .inner .item li p a {
font-weight: 400;
}
.sitemap .inner .item li p a {
font-weight: 400;
}
.sitemap .inner .item .side_link {
display: flex;
flex-direction: column;
gap: 5px;
}
.sitemap .inner .item .side_link li a {
font-weight: 700;
color: var(--C-474748);
}
.sitemap .inner .sitemap_tel{
position: absolute;
top:496px;
right: -11px;
font-size: 32px;
color:#000b17;
font-weight: 800;
line-height: 1.2;
}
.sitemap .inner .sitemap_tel a{color:#000b17;}
.sitemap .inner .sitemap_banner{
position: absolute;
top: 160px;
right: -9px;
}
/* gnb ëª¨ë°”ì¼ */
.gnb_mb {
display: none;
padding: 113px 55px 100px;
position: fixed;
left: 0;
right: 0;
top: 0;
bottom: 0;
background: var(--C-ffffff);
}
#header.on {
z-index: 10;
}
.on .gnb_mb {
display: block;
z-index: 2;
}
.gnb_mb .dep1 ul {
/*padding-top: 14px;*/
}
.gnb_mb .dep1 li {
line-height: 1;
/*padding: 12px 0;*/
padding: 23px 0;
opacity: 0;
transform: translateX(30px);
animation: gnbLiIn 0.4s cubic-bezier(0.4, 0, 0.2, 1) forwards;
}
.gnb_mb.on .dep1 li:nth-child(1) {
animation-delay: 0.02s;
}
.gnb_mb.on .dep1 li:nth-child(2) {
animation-delay: 0.04s;
}
.gnb_mb.on .dep1 li:nth-child(3) {
animation-delay: 0.06s;
}
.gnb_mb.on .dep1 li:nth-child(4) {
animation-delay: 0.08s;
}
.gnb_mb.on .dep1 li:nth-child(5) {
animation-delay: 0.1s;
}
.gnb_mb.on .dep1 li:nth-child(6) {
animation-delay: 0.12s;
}
.gnb_mb.on .dep1 li:nth-child(7) {
animation-delay: 0.14s;
}
.gnb_mb.on .dep1 li:nth-child(8) {
animation-delay: 0.16s;
}
.gnb_mb.on .dep1 li:nth-child(9) {
animation-delay: 0.18s;
}
.gnb_mb.on .dep1 li:nth-child(10) {
animation-delay: 0.2s;
}
.gnb_mb.on .dep1 li:nth-child(11) {
animation-delay: 0.22s;
}
.gnb_mb.on .dep1 li:nth-child(12) {
animation-delay: 0.24s;
}
.gnb_mb .dep1 a {
font-size: var(--f-20);
color: var(--C-474748);
font-weight: 500;
}
.gnb_mb .dep2 {
display: none;
}
.gnb_mb .dep2.on {
display: block;
}
.gnb_mb .dep2 .btn_dep_back {
width: 23px;
height: 37px;
cursor: pointer;
position: absolute;
left: 30px;
top: 15px;
}
.gnb_mb .dep2 .btn_dep_back i {
position: absolute;
left: 0;
top: 50%;
width: 100%;
height: 5px;
background-color: var(--C-45474d);
transform-origin: left center;
}
.gnb_mb .dep2 .btn_dep_back i:first-child {
margin-top: -2px;
transform: translateY(-50%) rotate(45deg);
}
.gnb_mb .dep2 .btn_dep_back i:last-child {
margin-top: 1px;
transform: translateY(-50%) rotate(-45deg);
}
.gnb_mb .dep2 ul {
display: none;
flex-direction: column;
gap: 20px;
}
.gnb_mb .dep2 ul.on {
display: flex;
}
.gnb_mb .dep2 > ul > li {
opacity: 0;
transform: translateX(30px);
animation: gnbLiIn 0.4s cubic-bezier(0.4, 0, 0.2, 1) forwards;
}
.gnb_mb .dep2.on > ul > li {
opacity: 0;
}
.gnb_mb .dep2.on > ul > li:nth-child(1) {
animation-delay: 0.02s;
}
.gnb_mb .dep2.on > ul > li:nth-child(2) {
animation-delay: 0.04s;
}
.gnb_mb .dep2.on > ul > li:nth-child(3) {
animation-delay: 0.06s;
}
.gnb_mb .dep2.on > ul > li:nth-child(4) {
animation-delay: 0.08s;
}
.gnb_mb .dep2.on > ul > li:nth-child(5) {
animation-delay: 0.1s;
}
.gnb_mb .dep2.on > ul > li:nth-child(6) {
animation-delay: 0.12s;
}
.gnb_mb .dep2.on > ul > li:nth-child(7) {
animation-delay: 0.14s;
}
.gnb_mb .dep2.on > ul > li:nth-child(8) {
animation-delay: 0.16s;
}
.gnb_mb .dep2.on > ul > li:nth-child(9) {
animation-delay: 0.18s;
}
.gnb_mb .dep2.on > ul > li:nth-child(10) {
animation-delay: 0.2s;
}
.gnb_mb .dep2.on > ul > li:nth-child(11) {
animation-delay: 0.22s;
}
.gnb_mb .dep2.on > ul > li:nth-child(12) {
animation-delay: 0.24s;
}
.gnb_mb .dep2.on > ul > li:nth-child(13) {
animation-delay: 0.26s;
}
.gnb_mb .dep2 ul a {
font-size: var(--f-20);
color: var(--C-474748);
font-weight: 500;
}
.gnb_mb .dep2 ul .dep3 {
display: flex;
padding-top: 20px;
flex-direction: column;
align-items: flex-start;
gap: 20px;
}
.gnb_mb .dep2 ul .dep3 a {
font-size: var(--f-16);
color: var(--C-737380);
font-weight: 500;
}
.gnb_mb .dep2 ul .dep3 a::before {
content: "-";
padding-right: 15px;
}
.gnb_mb .b_dep1 li {
opacity: 0;
transform: translateX(30px);
animation: gnbLiIn 0.4s cubic-bezier(0.4, 0, 0.2, 1) forwards;
}
.gnb_mb.on .b_dep1 li:nth-child(1) {
animation-delay: 0.02s;
}
.gnb_mb.on .b_dep1 li:nth-child(2) {
animation-delay: 0.04s;
}
.gnb_mb.on .b_dep1 li:nth-child(3) {
animation-delay: 0.06s;
}
.gnb_mb.on .b_dep1 li:nth-child(4) {
animation-delay: 0.08s;
}
.gnb_mb.on .b_dep1 li:nth-child(5) {
animation-delay: 0.1s;
}
.gnb_mb.on .b_dep1 li:nth-child(6) {
animation-delay: 0.12s;
}
.gnb_mb.on .b_dep1 li:nth-child(7) {
animation-delay: 0.14s;
}
.gnb_mb.on .b_dep1 li:nth-child(8) {
animation-delay: 0.16s;
}
.gnb_mb.on .b_dep1 li:nth-child(9) {
animation-delay: 0.18s;
}
.gnb_mb.on .b_dep1 li:nth-child(10) {
animation-delay: 0.2s;
}
.gnb_mb.on .b_dep1 li:nth-child(11) {
animation-delay: 0.22s;
}
.gnb_mb.on .b_dep1 li:nth-child(12) {
animation-delay: 0.24s;
}
.gnb_mb .b_dep2 {
display: none;
position: relative;
}
.gnb_mb .b_dep2.on {
display: block;
}
.gnb_mb .b_dep2 .btn_dep_back {
width: 23px;
height: 37px;
cursor: pointer;
position: absolute;
right: 0;
top: 9px;
z-index: 1;
}
.gnb_mb .b_dep2 .btn_dep_back i {
position: absolute;
left: 0;
top: 50%;
width: 100%;
height: 5px;
background-color: var(--C-45474d);
transform-origin: left center;
}
.gnb_mb .b_dep2 .btn_dep_back i:first-child {
margin-top: -2px;
transform: translateY(-50%) rotate(45deg);
}
.gnb_mb .b_dep2 .btn_dep_back i:last-child {
margin-top: 1px;
transform: translateY(-50%) rotate(-45deg);
}
.gnb_mb .b_dep2 ul {
display: none;
}
.gnb_mb .b_dep2 ul.on {
display: block;
}
.gnb_mb .b_dep2 a {
font-size: var(--f-20);
color: var(--C-474748);
}
.gnb_mb .b_dep2 > ul > li {
opacity: 0;
transform: translateX(30px);
animation: gnbLiIn 0.4s cubic-bezier(0.4, 0, 0.2, 1) forwards;
}
.gnb_mb .b_dep2.on > ul > li {
opacity: 0;
}
.gnb_mb .b_dep2.on > ul > li:nth-child(1) {
animation-delay: 0.02s;
}
.gnb_mb .b_dep2.on > ul > li:nth-child(2) {
animation-delay: 0.04s;
}
.gnb_mb .b_dep2.on > ul > li:nth-child(3) {
animation-delay: 0.06s;
}
.gnb_mb .b_dep2.on > ul > li:nth-child(4) {
animation-delay: 0.08s;
}
.gnb_mb .b_dep2.on > ul > li:nth-child(5) {
animation-delay: 0.1s;
}
.gnb_mb .b_dep2.on > ul > li:nth-child(6) {
animation-delay: 0.12s;
}
.gnb_mb .b_dep2.on > ul > li:nth-child(7) {
animation-delay: 0.14s;
}
.gnb_mb .b_dep2.on > ul > li:nth-child(8) {
animation-delay: 0.16s;
}
.gnb_mb .b_dep2.on > ul > li:nth-child(9) {
animation-delay: 0.18s;
}
.gnb_mb .b_dep2.on > ul > li:nth-child(10) {
animation-delay: 0.2s;
}
.gnb_mb .b_dep2.on > ul > li:nth-child(11) {
animation-delay: 0.22s;
}
.gnb_mb .b_dep2.on > ul > li:nth-child(12) {
animation-delay: 0.24s;
}
.gnb_mb .b_dep2.on > ul > li:nth-child(13) {
animation-delay: 0.26s;
}
.gnb_mb .bottom .dep3 {
display: flex;
padding: 15px 0 20px;
gap: 15px;
flex-direction: column;
}
.gnb_mb .bottom .dep3 a {
font-size: var(--f-16);
color: var(--C-737380);
font-weight: 500;
}
.gnb_mb .bottom .dep3 a::before {
content: "-";
padding-right: 15px;
}
.gnb_mb .bottom {
padding-top: 25px;
}
.gnb_mb .bottom .tel a {
color: #000b17;
display: block;
padding-top: 18px;
}
.gnb_mb .bottom .tel {
padding-top: 50px;
font-size: 50px;
color: #000b17;
font-weight: 800;
line-height: 1;
}
.gnb_mb .bottom .banner {
line-height: 0;
}
.gnb_mb .bottom .banner img {
width: 100%;
max-width: 612px;
}
.gnb_mb .gnb_mb_close {
width: 50px;
height: 50px;
cursor: pointer;
position: absolute;
left: 30px;
top: 32px;
}
.gnb_mb .gnb_mb_close i {
display: block;
width: 100%;
height: 7px;
position: absolute;
left: 0;
top: 50%;
transform: rotate(45deg);
background-color: var(--C-45474d);
}
.gnb_mb .gnb_mb_close i:last-child {
transform: rotate(-45deg);
}
@media (max-width: 1690px) {
.sitemap .inner{
width: 90%;
}
.sitemap .inner .sitemap_banner{
width: 12.7vw;
right: 0;
}
.sitemap .inner .sitemap_banner img{
width: 100%;
}
.sitemap .inner .sitemap_tel{
right: 0.3vw;
font-size: 2vw;
}
#header > .inner {
position: relative;
max-width: initial;
padding: 0 20px;
}
#header .menu ul {
padding-right: 20px;
box-sizing: border-box;
}
}
@media (max-width: 1600px) {
#header .menu {
width: 70%;
overflow: hidden;
flex-wrap: nowrap;
white-space: nowrap;
}
/*
20250805 최진호팀장요ì²
#header .menu .menu_hidden_open {
display: flex;
} */
}
@media (max-width: 1170px) {
#header .menu {
width: 60%;
}
.gnb .inner {
width: auto;
padding: 0 5%;
}
}
@media (max-width: 1060px) {
/*.gnb .inner {*/
/* width: auto;*/
/* padding: 0 5%;*/
/*}*/
.sitemap .inner {
width: auto;
padding: 0 5%;
}
.sitemap .inner .item {
/*flex: 1 1 20%;*/
max-width: 20%;
}
.sitemap .inner .sitemap_banner{
width: 18vw;
}
.sitemap .inner .sitemap_tel {
right: 0;
font-size: 2.8vw;
}
.sitemap .inner .item li {
margin-bottom: 0;
}
.sitemap .inner .item li a {
font-size: 14px;
}
.sitemap .inner .item:last-child {
max-width: 25%;
}
}
@media (max-width: 1024px) {
#header .menu {
width: 40%;
}
}
@media (max-width: 860px) {
.sitemap .inner{
padding: 0 3%;
}
.sitemap .inner .item {
max-width: 25%;
}
.sitemap .inner .item li a {
font-size: 12px;
}
.sitemap .inner .sitemap_banner {
width: 140px;
right: 14px;
top: 143px;
}
.sitemap .inner .sitemap_banner img {
max-width: 100%;
}
.sitemap .inner .sitemap_tel {
right: 11px;
font-size: 22px;
top: 453px;
}
}
@media (max-width: 720px) {
#header > .inner {
padding: 25px 3%;
/*padding: 3.47vw 3%;*/
justify-content: space-between;
align-items: center;
}
#header > .inner.hidden {
display:none;
}
#header .menu_open {
display: block;
width: 6.5vw;
}
#header .menu_open i{height: 0.7vw;}
#header .menu_open i:nth-child(2) {top: 50%;transform: translate(0,-50%);}
#header .menu_open i:nth-child(3) {top: initial;bottom: 0;}
#header h1 {
padding: 0 0 0 9vw;
}
#header h1 img {
width: 29vw;
margin-top: -1.8vw;
}
#header .menu {
display: none;
}
#header .right {
padding-bottom: 0;
}
#header .right {
padding-bottom: 0;
}
#header .right button{margin-left: 2vw;}
#header .right .btn_logout {
display: none;
}
#header .right .btn_search {
width: 5.7vw;
height: 5.7vw;
}
#header .right .btn_language {
width: 5.7vw;
height: 5.7vw;
}
#header .right .btn_menu {
display: none;
}
.sitemap {
display: none;
}
.gnb_mb {
overflow: auto;
padding: 15.69vw 7.64vw 13.89vw;
}
.gnb_mb div.menu_title_wrap .menu_title {
font-size: 4.44vw;
}
.gnb_mb .dep1 li {
padding: 3.19vw 0;
}
.gnb_mb .dep1 .dep2 li {
padding: 2.5vw 0;
}
.gnb_mb .dep1 .dep2 a {
font-size: 4.44vw;
padding-left: 4.86vw;
}
.gnb_mb div.menu_title_wrap .menu_arrow {
width: 3.75vw;
height: 2.08vw;
}
.dep1 > ul > li > div.on .dep2 {
padding-top: 2.5vw;
}
.dep1 > ul > li > div.active .dep2 {
padding-top: 2.5vw;
}
/*.dep2 > li.active .dep3 {*/
.gnb_mb .dep3 {
padding-top: 2.5vw;
}
.gnb_mb .dep1 .dep2 .dep3 a {
font-size: 4.44vw;
padding: 2.5vw 0 2.5vw 4.86vw;
margin-left: 4.86vw;
}
.gnb_mb .dep1 .dep2 .dep3 a:last-child {
padding-bottom: 0;
}
.gnb_mb .gnb_mb_close {
width: 6.94vw;
height: 6.94vw;
left: 4.17vw;
top: 4.44vw;
}
.gnb_mb .gnb_mb_close i {
height: 0.97vw;
}
.gnb_mb .bottom {
padding-top: 3.47vw;
}
.gnb_mb .bottom .tel a {
padding-top: 2.5vw;
}
.gnb_mb .bottom .tel {
padding-top: 6.94vw;
font-size: 6.94vw;
}
.gnb_mb .bottom .banner img {
max-width: 85vw;
}
}
/****** gnb.css end ******/
/**** quick.css start ****/
/* quick */
.quick {
width: 87px;
position: fixed;
right: 50%;
bottom: 10%;
margin-right: -750px;
z-index: 5;
transition: all 1s ease;
}
.quick.hidden {
display: none;
}
.quick .btn_box {
display: flex;
width: 88px;
height: 147px;
position: relative;
margin-bottom: 10px;
flex-direction: column;
align-items: center;
justify-content: space-evenly;
border-radius: 50px;
background-color: var(--C-000b17);
transition: all 0.3s ease;
overflow: hidden;
}
.quick .btn_box::after {
content: "";
position: absolute;
width: 48px;
height: 2px;
top: 73px;
z-index: 1;
background-color: var(--C-33373f);
}
.quick .btn_box a {
color: var(--C-aaaab3);
}
.quick .btn_box a:hover {
color: var(--C-ffffff);
}
/*.quick .btn_box .menu_open */
.quick .btn_box .menu_open {
display: flex;
width: 100%;
height: 100%;
color: var(--C-aaaab3);
cursor: pointer;
flex-direction: column;
justify-content: space-evenly;
border: none;
background: none;
opacity: 1;
transform: translateY(0px);
transition: all 0.3s ease;
}
.quick .btn_box .menu_open:hover {
color: var(--C-ffffff);
}
.quick .btn_box .menu_open i {
display: block;
}
.quick .btn_box .btn_list {
width: 88px;
padding: 40px 0;
position: absolute;
bottom: 0;
left: 0;
z-index: 2;
flex-direction: column;
align-items: center;
justify-content: space-evenly;
border-radius: 50px;
background-color: var(--C-000b17);
opacity: 0;
pointer-events: none;
transform: translateY(0);
transition: all 0.3s ease;
height: 80%;
}
.quick .btn_box .btn_list .tel {
margin-top: 80px;
font-size: 16px;
color: var(--C-aaaab3);
font-weight: 400;
line-height: 1.2;
text-align: center;
letter-spacing: -0.5px;
}
.quick .btn_box .btn_list .tel i {
display: block;
width: 100%;
height: 30px;
filter: brightness(0.5);
background: url(//image.idhospital.com/www/rn_2025/common/quick/quick_icon_tel.png) no-repeat center
top;
}
.quick .btn_box .btn_list .tel:hover i {
filter: brightness(1);
}
.quick .btn_box .btn_list .tel a:hover {
color: #fff;
}
.quick .btn_box .btn_list ul {
display: flex;
flex-direction: column;
align-items: center;
}
.quick .btn_box .btn_list li::before {
display: block;
content: "";
width: 48px;
height: 1px;
margin: 13px auto;
background-color: var(--C-33373f);
}
.quick .btn_box .btn_list li a {
display: inline-block;
font-size: 14px;
letter-spacing: -0.5px;
color: var(--C-aaaab3);
}
.quick .btn_box .btn_list li a:hover {
color: var(--C-ffffff);
}
.quick .btn_box .btn_list li a i {
display: block;
height: 30px;
width: 100%;
filter: brightness(0.5);
background-repeat: no-repeat;
background-position: center top;
}
.quick .btn_box .btn_list li.onsale_event {
display: none;
}
.quick .btn_box .btn_list li.onsale_event a i {
background-image: url(//image.idhospital.com/www/rn_2025/common/quick/quick_icon_event_v1.png);
}
.quick .btn_box .btn_list li.kakao a i {
background-image: url(//image.idhospital.com/www/rn_2025/common/quick/quick_icon_kakao.png);
}
.quick .btn_box .btn_list li.q_realpay a i {
background-image: url(//image.idhospital.com/www/rn_2025/common/quick/quick_icon_cost.png);
}
.quick .btn_box .btn_list li.online_counsel a i {
background-image: url(//image.idhospital.com/www/rn_2025/common/quick/quick_icon_online.png);
}
.quick .btn_box .btn_list li.online_reserve a i {
background-image: url(//image.idhospital.com/www/rn_2025/common/quick/quick_icon_reservation.png);
}
.quick .btn_box .btn_list li a:hover i {
filter: brightness(1);
}
.quick .btn_box.on {
height: 410px;
padding: 50px 0;
}
.quick .btn_box.on .btn_list {
display: flex;
pointer-events: auto;
opacity: 1;
height: 100%;
transform: translateY(0);
}
.quick .btn_box.on .menu_open {
opacity: 0;
height: 100%;
}
.quick .btn_top {
display: flex;
width: 88px;
height: 88px;
color: var(--C-aaaab3);
cursor: pointer;
align-items: center;
justify-content: center;
border-radius: 50px;
background-color: var(--C-000b17);
}
.quick .btn_event {
display: flex;
width: 88px;
height: 88px;
color: var(--C-aaaab3);
cursor: pointer;
align-items: center;
justify-content: center;
border-radius: 50px;
background-color: var(--C-000b17);
}
.quick .btn_event a {
display: inline-block;
font-size: var(--f-14);
letter-spacing: -0.5px;
color: var(--C-aaaab3);
}
.quick .btn_event a i {
display: block;
height: 30px;
width: 100%;
filter: brightness(0.5);
background-image: url(//image.idhospital.com/www/rn_2025/common/quick/quick_icon_event_v1.png);
background-repeat: no-repeat;
background-position: center top;
}
.quick .btn_event a:hover {
color: var(--C-ffffff);
}
.quick .btn_event a:hover i {
filter: brightness(1);
}
.quick .mo_omit {
display: none;
}
.quick .btn_top:hover {
color: var(--C-ffffff);
}
@media (max-width: 1500px) {
.quick {
width: auto;
right: 2%;
margin-right: 0;
}
.quick .btn_box {
width: 70px;
height: 100px;
}
.quick .btn_box::after {
width: 30px;
top: 50px;
}
.quick .btn_box .btn_list {
width: 70px;
}
.quick .btn_box .btn_list li::before {
width: 30px;
}
.quick .btn_top {
width: 70px;
height: 70px;
}
.quick .btn_event {
width: 70px;
height: 70px;
}
}
@media (max-width: 720px) {
.quick {
/*bottom: 100px;*/
bottom: 26.39vw;
/*top: initial;*/
}
.quick .btn_box {
height: 70px;
margin-bottom: -70px;
}
.quick .btn_box .menu_open {
font-size: 3vw;
display: none; /* 모바ì¼ì—서는 안보ì´ëŠ” 걸로 작업해놓았어요 */
}
.quick .btn_top {
font-size: 3vw;
display: none;
}
.quick .btn_event {
display: none;
}
.quick .btn_box .btn_list .tel {
display: none;
}
.quick .btn_box .btn_list li.onsale_event {
display: block;
}
.quick .btn_box .btn_list li.onsale_event::before {
display: none;
}
.quick .btn_box .btn_list li.online_reserve {
display: none;
}
.quick .btn_box.on {
height: 287px;
margin-bottom: 10px;
padding: 30px 0;
}
.quick .btn_box .btn_list {
padding: 0;
}
.quick .mo_omit {
display: block;
width: 70px;
height: 70px;
border-radius: 50%;
background-color: #020a17;
overflow: hidden;
position: relative;
z-index: 1;
}
.quick .mo_omit i {
display: inline-block;
width: 70px;
height: 70px;
background: url(//image.idhospital.com/www/rn_2025/common/quick/mo_quick_icon_v1.png) no-repeat;
background-size: contain;
position: absolute;
top: 50%;
left: 50%;
transform: translate(-50%, -50%);
}
.quick .mo_omit.on i {
background: url(//image.idhospital.com/www/rn_2025/common/quick/mo_quick_icon_close.png) no-repeat;
background-size: contain;
}
}
/**** quick.css end ****/
/* bottom */
.popup_wrap{
position: fixed;
left: 0;
top: 0;
right: 0;
bottom: 0;
z-index: 100;
background-color: var(--C-000000-50);
opacity: 0;
transform: translateY(20px);
transition: opacity 0.4s cubic-bezier(0.4,0,0.2,1), transform 0.4s cubic-bezier(0.4,0,0.2,1);
pointer-events: none;
}
.popup_wrap.on{
opacity: 1;
transform: translateY(0);
pointer-events: auto;
}
.popup_wrap .inner{
display: flex;
width: 100%;
height: 100%;
justify-content: center;
align-items: center;
flex-direction: column;
}
.popup_wrap .inner .iframe_box{
width: 80%;
max-width: 1290px;
position: relative;
aspect-ratio: 16 / 9;
}
@media (max-width: 440px) {
.popup_wrap.popup_shorts .inner .iframe_box{
aspect-ratio: 9 / 16;
}
}
.popup_wrap .inner .iframe_box iframe{
width: 100%;
height: 100%;
position: absolute;
top: 0;
left: 0;
border: 0;
}
.popup_wrap .inner .btn_close{
display: block;
width: 112px;
height: 46px;
margin-top: 15px;
font-size: var(--f-21);
background-color: #e46ea4;
color: #fff;
font-weight: 800;
border-radius: 50px;
border: 1px solid var(--C-e46ea4);
cursor: pointer;
}
@keyframes spin {
0% { transform: rotate(0deg); }
100% { transform: rotate(360deg); }
}
/**** footer.css start ****/
/* Base styles (Desktop) */
.footer {
background-color: #f8f9fa;
padding: 20px 0;
}
.pc_icon_img {display: block;}
.mo_icon_img {display: none;}
/* footer */
#footer {
width: 100%;
position: relative;
z-index: 0;
border-top: 1px solid var(--C-f4f4f4);
}
#footer::before {
content: "";
width: 100%;
height: 1px;
position: absolute;
left: 0;
top: 83px;
background-color: var(--C-f4f4f4);
}
#footer::after {
content: "";
width: 100%;
height: 1px;
position: absolute;
left: 0;
top: 251px;
background-color: var(--C-f4f4f4);
}
#footer .inner{
width: 960px;
margin: 0 auto;
}
#footer .link_box{
display: flex;
height: 83px;
justify-content: space-between;
align-items: center;
flex-direction: row-reverse;
}
#footer .link_box .sns_link{
display: flex;
gap: 8px;
line-height: 0;
}
#footer .link_box .sns_link img{
width: 48px;
}
#footer .link_box .id_link ul{
display: flex;
gap: 10px;
}
#footer .link_box .id_link ul li a{
display: inline-block;
/*padding: 2px 0 0 30px;*/
/*font-size: var(--f-19);*/
/*color: var(--C-737380);*/
/*font-weight: 900;*/
/*background: url(//image.idhospital.com/www/rn_2025/common/footer_icon_id.png) no-repeat left top;*/
/*background-size: 23px auto;*/
}
#footer .link_box .id_link ul li a img {
max-width: 100%;
}
#footer .link_box .id_link ul li:last-child a{
/*background: none;*/
/*padding-left: 0;*/
}
#footer .company_info{
height: 167px;
display: flex;
font-size: var(--f-19);
color: var(--C-737380);
justify-content: space-between;
align-items: center;
flex-direction: row-reverse;
}
#footer .company_info .left{
display: flex;
gap: 25px;
flex-direction: column;
width: 263px;
line-height: 1;
}
#footer .company_info .left p span{
font-size: 17px;
letter-spacing: -0.5px;
margin-right: 29px;
font-weight: 500;
}
#footer .company_info .left p b{
font-size: 30px;
color: var(--C-45474d);
letter-spacing: -0.5px;
font-weight: 900;
}
#footer .company_info .left p strong{
font-size: var(--f-19);
color: var(--C-45474d);
letter-spacing: -0.5px;
font-weight: 900;
}
#footer .company_info .right{
display: flex;
gap: 30px;
flex-direction: column;
line-height: 1;
font-size: 17px;
letter-spacing: -0.5px;
}
#footer .company_info .right .link ul{
display: flex;
}
#footer .company_info .right .link li::after{
content: "";
display: inline-block;
width: 1px;
height: 16px;
margin: 0 15px;
background-color: #f4f4f4;
vertical-align: -2px;
}
#footer .company_info .right .link li:last-child::after{
display: none;
}
#footer .company_info .right .link a {
color: var(--C-737380);
font-size: 17px;
letter-spacing: -0.5px;
}
#footer .company_info .right .info {
display: flex;
gap: 30px;
}
#footer .copy{
display: flex;
height: 77px;
font-size: var(--f-15);
color: var(--C-aaaab2);
align-items: center;
letter-spacing: -0.5px;
}
/* Tablet styles (max-width: 1024px) */
@media(max-width:1024px){
#footer .inner{
width: initial;
padding: 0 20px;
}
#footer::before{
top: 60px;
}
#footer::after{
top: initial;
bottom: 50px;
}
#footer .link_box{
height: 60px;
}
/*#footer .link_box .sns_link{*/
/* gap: 20px;*/
/*}*/
#footer .link_box .id_link ul{
gap: 20px;
}
/*#footer .link_box .id_link ul li a{*/
/* font-size: var(--f-17);*/
/* padding: 0 0 0 22px;*/
/* background-size: 18px auto;*/
/*}*/
#footer .company_info{
height: 140px;
font-size: var(--f-17);
}
#footer .company_info .left{
gap: 5px;
}
#footer .company_info .right{
gap: 10px;
}
#footer .copy{
height: 50px;
}
}
/* Mobile styles (max-width: 720px) */
@media(max-width:720px){
.pc_icon_img {display: none;}
.mo_icon_img {display: block;}
#footer{
border-width: 2px;
}
#footer::before{
height: 2px;
top: 16vw;
}
#footer::after{
bottom: 10.6vw;
}
#footer .inner{
padding: 0 4.17vw;
}
#footer .link_box{
height: auto;
flex-direction: column;
}
#footer .link_box .sns_link{
height: 16vw;
gap: 5.97vw;
align-items: center;
}
#footer .link_box .sns_link img{
width: 6.67vw;
}
#footer .link_box .id_link{
width: 100%;
padding: 4.03vw 0;
}
#footer .link_box .id_link ul{
gap: 4.17vw 0;
flex-direction: row;
flex-wrap: wrap;
}
#footer .link_box .id_link ul li {
/*width: 33.3%;*/
margin-right: 24px;
}
#footer .link_box .id_link ul li.idskin {
margin-right: 40px;
}
#footer .link_box .id_link ul li:last-child {
margin-right: 0;
}
#footer .link_box .id_link ul li a{
/*padding: 0 0 0 6.5vw;*/
/*font-size: 4.2vw;*/
/*background-size: 5.2vw auto;*/
}
#footer .link_box .id_link ul li.exobalance img {
width: 26.39vw;
}
#footer .link_box .id_link ul li.idclinic img {
width: 21.25vw;
}
#footer .link_box .id_link ul li.iddental img {
width: 20.56vw;
}
#footer .link_box .id_link ul li.idskin img {
width: 24.17vw;
}
#footer .link_box .id_link ul li.idcosmetic img {
width: 32.5vw;
}
#footer .company_info{
height: auto;
padding-bottom: 4.17vw;
align-items: flex-start;
flex-direction: column;
}
#footer .company_info .left{
padding-top: 4.17vw;
padding-bottom: 4.58vw;
width: 100%;
flex-direction: row;
flex-wrap: wrap;
}
#footer .company_info .left p{
margin-right: 5.4vw;
}
#footer .company_info .left p:first-child{
width: 100%;
padding-bottom: 3.61vw;
margin-right: 0;
}
#footer .company_info .left p span{
margin-right: 4.03vw;
font-size: 2.36vw;
letter-spacing: -0.07vw;
}
#footer .company_info .left p b{
font-size: 4.44vw;
letter-spacing: -0.07vw;
}
#footer .company_info .left p strong{
font-size: 2.64vw;
letter-spacing: -0.07vw;
}
#footer .company_info .right{
font-size: 2.36vw;
letter-spacing: -0.07vw;
gap: 4.17vw;
}
#footer .company_info .right .link li::after {
width: 0.14vw;
height: 2.22vw;
margin: 0 2.08vw;
vertical-align: -0.28vw;
}
#footer .company_info .right .link a {
font-size: 2.36vw;
letter-spacing: -0.07vw;
}
#footer .copy{
height: 10.6vw;
font-size: 2.78vw;
letter-spacing: -0.07vw;
}
}
/**** footer.css end ****/