@charset "utf-8";

.sub_container {width:100%; position:relative; padding:107px 0 30px;}

.ul_con {}
.ul_con li { margin-bottom:60px;}
.ul_con li .con_title{
	text-align: center;
    font-size: 1.8em;
    padding-bottom: 20px;
	letter-spacing: -0.05em;
	}
.ul_con li.map_btn { width:30.31%; margin:0 auto; position:relative; overflow:hidden; }
.ul_con li.map_btn a { width:100%; text-align:center; margin-bottom:6%; display:block;}
.ul_con li.map_btn a img {  }
.ul_con li img { width:100%; }

.ul_con2 {}
.ul_con2 li { padding:0; margin:0;}
.ul_con2 li.map_btn { width:30.31%; margin:0 auto; position:relative; overflow:hidden; }
.ul_con2 li.map_btn a { width:100%; text-align:center; margin-bottom:6%; display:block;}
.ul_con2 li.map_btn a img {  }
.ul_con2 li img { width:100%; }


.ul_con3 {}
.ul_con3 li {margin-bottom: 30px;}
.ul_con3 li.map_btn { width:30.31%; margin:0 auto; position:relative; overflow:hidden; }
.ul_con3 li.map_btn a { width:100%; text-align:center; margin-bottom:6%; display:block;}
.ul_con3 li.map_btn a img {  }
.ul_con3 li img { width:100%; }

.ul_con4 {}
.ul_con4 li {margin-bottom: 80px;}
.ul_con4 li.map_btn { width:30.31%; margin:0 auto; position:relative; overflow:hidden; }
.ul_con4 li.map_btn a { width:100%; text-align:center; margin-bottom:6%; display:block;}
.ul_con4 li.map_btn a img {  }
.ul_con4 li img { width:100%; }



/*의료진소개 팝업*/
.wrap_mask {width:100%; min-height:100%; position:fixed; top:0; left:0; z-index:9990; display:none;}
.wrap_mask > .bg {position:absolute; top:0; left:0; width:100%; height:100%; background:black; opacity:0.8; z-index:9991;}
.wrap_mask > div {width:96.666%; height:700px; position:relative; margin:0 auto; z-index:9999;}
.wrap_mask > div > .contents {position:relative; width:100%; padding-bottom:105%; height:0; overflow:hidden;}
.wrap_mask > div > .contents > ul {width:100%; height:100%; position:relative;}
.wrap_mask > div > .contents > ul > li {width:100%; height:100%; position:absolute; left:100%; top:0;}
.wrap_mask > div > .contents > ul > li.con_01 {left:0;}
.wrap_mask > div > .contents > ul > li > img { width:100%;}

.wrap_mask > div > .control_bar {width:100%; height:50px; position:relative; top:50px;  overflow:hidden;}
.wrap_mask > div > .control_bar > li {float:right; position:relative; z-index:9995;}
.wrap_mask > div > .control_bar > li.li_03 {float:right; border:none;}



/**** 2024 탭메뉴 ****/

/* 윤곽 */
.sub_tab_face { width:100%; position:absolute; top:106px;}
.sub_tab_face .top_tab {position: relative; white-space: nowrap; display: flex; background: #f5f5f5; justify-content: space-around;}
.sub_tab_face .top_tab li {width: 100%; height: 38px; border-bottom: 1px solid #DDD; border-left: 1px solid #ddd; padding: 0 8px;}
.sub_tab_face .top_tab li.first { border-left: none;}
.sub_tab_face .top_tab li a {display: block; text-align: center; color: #111; font-size: 14px; letter-spacing: -.02em; font-weight: 400; line-height: 38px;}
.sub_tab_face .top_tab li.on {background:#419fb7;}
.sub_tab_face .top_tab li.on a {color: #fff;}

/* 가슴 */
.sub_tab_br { width:100%; position:absolute; top:106px;}
.sub_tab_br .top_tab {position: relative; white-space: nowrap; display: flex; background: #f5f5f5; justify-content: space-around;}
.sub_tab_br .top_tab li {width: 100%; height: 38px; border-bottom: 1px solid #DDD; border-left: 1px solid #ddd; padding: 0 8px;}
.sub_tab_br .top_tab li.first { border-left: none;}
.sub_tab_br .top_tab li a {display: block; text-align: center; color: #111; font-size: 14px; letter-spacing: -.02em; font-weight: 400; line-height: 38px;}
.sub_tab_br .top_tab li.on {background:#0cc898;}
.sub_tab_br .top_tab li.on a {color: #fff;}

/* 눈 */
.sub_tab_eye{ width:100%; position:absolute; top:106px;}
.sub_tab_eye .top_tab {position: relative; white-space: nowrap; display: flex; background: #f5f5f5; justify-content: space-around;}
.sub_tab_eye .top_tab li {width: 100%; height: 38px; border-bottom: 1px solid #DDD; border-left: 1px solid #ddd; padding: 0 8px;}
.sub_tab_eye .top_tab li.first { border-left: none;}
.sub_tab_eye .top_tab li a {display: block; text-align: center; color: #111; font-size: 14px; letter-spacing: -.02em; font-weight: 400; line-height: 38px;}
.sub_tab_eye .top_tab li.on {background:#ff3f6e;}
.sub_tab_eye .top_tab li.on a {color: #fff;}

/* 코 */
.sub_tab_nose { width:100%; position:absolute; top:106px;}
.sub_tab_nose .top_tab {position: relative; white-space: nowrap; display: flex; background: #f5f5f5; justify-content: space-around;}
.sub_tab_nose .top_tab li {width: 100%; height: 38px; border-bottom: 1px solid #DDD; border-left: 1px solid #ddd; padding: 0 8px;}
.sub_tab_nose .top_tab li.first { border-left: none;}
.sub_tab_nose .top_tab li a {display: block; text-align: center; color: #111; font-size: 14px; letter-spacing: -.02em; font-weight: 400; line-height: 38px;}
.sub_tab_nose .top_tab li.on {background:#b09077;}
.sub_tab_nose .top_tab li.on a {color: #fff;}

/* 동안 */
.sub_tab_lift { width:100%; position:absolute; top:106px;}
.sub_tab_lift .top_tab {position: relative; white-space: nowrap; display: flex; background: #f5f5f5; justify-content: space-around;}
.sub_tab_lift .top_tab li {width: 100%; height: 38px; border-bottom: 1px solid #DDD; border-left: 1px solid #ddd; padding: 0 8px;}
.sub_tab_lift .top_tab li.first { border-left: none;}
.sub_tab_lift .top_tab li a {display: block; text-align: center; color: #111; font-size: 14px; letter-spacing: -.02em; font-weight: 400; line-height: 38px;}
.sub_tab_lift .top_tab li.on {background:#ff764f;}
.sub_tab_lift .top_tab li.on a {color: #fff;}

/* 남자 */
.sub_tab_homme { width:100%; position:absolute; top:106px;}
.sub_tab_homme .top_tab {position: relative; white-space: nowrap; display: flex; background: #f5f5f5; justify-content: space-around;}
.sub_tab_homme .top_tab li {width: 100%; height: 38px; border-bottom: 1px solid #DDD; border-left: 1px solid #ddd; padding: 0 8px;}
.sub_tab_homme .top_tab li.first { border-left: none;}
.sub_tab_homme .top_tab li a {display: block; text-align: center; color: #111; font-size: 14px; letter-spacing: -.02em; font-weight: 400; line-height: 38px;}
.sub_tab_homme .top_tab li.on {background:#34444d;}
.sub_tab_homme .top_tab li.on a {color: #fff;}

/* 피부과 */
.sub_tab_skin{ width:100%; position:absolute; top:106px;}
.sub_tab_skin .top_tab {position: relative; white-space: nowrap; display: flex; background: #f5f5f5; justify-content: space-around;}
.sub_tab_skin .top_tab li {width: 100%; height: 38px; border-bottom: 1px solid #DDD; border-left: 1px solid #ddd; padding: 0 8px;}
.sub_tab_skin .top_tab li.first { border-left: none;}
.sub_tab_skin .top_tab li a {display: block; text-align: center; color: #111; font-size: 14px; letter-spacing: -.02em; font-weight: 400; line-height: 38px;}
.sub_tab_skin .top_tab li.on {background:#b62c58;}
.sub_tab_skin .top_tab li.on a {color: #fff;}


/** ------------------------------------------------------------------------------------------------------------- **/


/*둘러보기*/
.sub_tab05 { width:100%; min-width:320px; position:absolute; padding-top:52.5%;}
.sub_tab05 .top_tab {width:100%; height:100%; overflow:hidden; position:relative; margin:0 auto;}
.sub_tab05 .top_tab li {float:left; width:19.88%;  background:#a2a2a2; opacity:0.9; margin-right:0.15%;}
.sub_tab05 .top_tab li.last { margin-right:0;}
.sub_tab05 .top_tab li a {display:block; width:100%; height:100%; text-align:center;}
.sub_tab05 .top_tab li a img {display:inline-block; padding-top:12px; padding-bottom:12px; }
.sub_tab05 .top_tab li.on {background:#060b1c;}
.sub_tab05 .top_tab li a:hover {background:#060b1c;}

/* 카테고리 탭메뉴 */
.categorys {width: calc(100% - 12px); height: 100%; border: 1px solid #999; overflow: hidden; position: relative; margin: 0 auto; white-space: nowrap; display: flex; background: #f5f5f5; justify-content: space-between; flex-direction: row; flex-wrap: wrap;}
  .categorys li {height: 38px; width: 28.6%; border-bottom: 1px solid #ddd; border-left: 1px solid #ddd; padding: 0 8px;}
  .categorys li.first {border-left:none;}
  .categorys li a {    display: block; text-align: center; color: #111; font-size: 14px; letter-spacing: -.02em; font-weight: 400; line-height: 38px;}
  .categorys li a img {display:inline-block; padding-top:10px; padding-bottom:10px;}
  .categorys li.on {background:#71cfd0;}
  .categorys li:hover {background:#71cfd0; color: #fff !important;}
  .categorys li.on a {color: #fff;font-weight: 600;}


/*제이준소식*/
.jj_notice_list {width:93.75%; margin:0 auto; position:relative; overflow:hidden;max-width:592px; min-width:300px;}
.jj_notice_list .divs {width:99.8; position:relative; margin:0 auto; border:1px solid #d9dada; }
.jj_notice_list .divs.leftside {margin:0 0 13px 0;}
.jj_notice_list .divs .img_area {width:100%; height:0; position:relative; padding-bottom:80%; max-height:300px; vertical-align:top; overflow:hidden;}
.jj_notice_list .divs .img_area img {width:100%; height:auto;}
.jj_notice_list .divs .link_area {display:block; width:100%; position:absolute; height:130px; margin:0 auto; vertical-align:middle;}

.jj_notice_list .divs .link_area .date {text-align:center; font-size:15px; color:#807e7e;}
.jj_notice_list .divs .link_area .cons {width:95%; display:block; font-size:17px; color:#2e2b2b; font-weight:bold; margin-top:8px; text-align:center; line-height:18px; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; padding: 5px 10px;}
.jj_notice_list .divs .link_area .bn {width:74px; height:22px; display:block; margin:10px auto 0; border:1px solid #dbb57d; font-size:13px; font-weight:bold;
color:#cba369; text-align:center; line-height:22px;}
.jj_notice_list .divs.div_odd {margin:0 0 13px 0; height: 100%;}
.jj_notice_list .divs.div_odd .link_area {bottom:0; background:#fff /*url('/img/jj_con01_07_txtbox_bot_off.png') center 0 no-repeat*/; /*background-size:100%;*/}
.jj_notice_list .divs.div_odd .link_area .date {padding-top:20px;}
.jj_notice_list .divs.div_even {margin:0 0 13px 0; height: 100%;}
.jj_notice_list .divs.div_even .link_area {bottom:0; background:#fff/*url('/img/jj_con01_07_txtbox_top_off.png') center 0 no-repeat*/; /*background-size:100%;*/}
.jj_notice_list .divs.div_even .link_area .date {padding-top:20px;}
.jj_notice_list .divs.div_odd .link_area:hover {background:#18181a /*url('/img/jj_con01_07_txtbox_bot_on.png') center 0 no-repeat*/; /*background-size:100%;*/}
.jj_notice_list .divs.div_even .link_area:hover {background:#18181a/*url('/img/jj_con01_07_txtbox_top_on.png') center 0 no-repeat*/; /*background-size:100%;*/}
.jj_notice_list .divs .link_area:hover .cons {color:#fff;}
.jj_notice_list .divs .link_area:hover .bn {background:#cba369; color:#18181a;}

/*리얼스토리*/
.sub_container .sub_con.real_story {padding-bottom:0;}
.padding_t { padding-top:108px;}
.padding_t2 { padding-top:140px;}
.padding_t3 { padding-top:175px;}
.padding_t4 { padding-top:160px;}
.padding_t5 { padding-top: 216px;}
.padding_t6 { padding-top: 238px;}
.padding_t145 {padding-top: 145px;}
.padding_t184 {padding-top: 184px;}


.real_slide {}
.real_slide {width:100%; max-width:640px; position:relative; margin:0 auto; overflow:hidden;}
.real_slide .imgs {width:100%; padding-bottom:137.5%; height:0; position:relative;}
.real_slide .imgs li {width:100%; height:100%; position:absolute; top:0; left:100%;}
.real_slide .imgs li img {width:100%;}
.real_slide .imgs li.li_01 {left:0;}
/*.real_slide .imgs li.li_01 {left:0; background:url('/img/jj_real_mv_01.jpg') center 0 no-repeat;}
.real_slide .imgs li.li_02 {background:url('/img/jj_real_mv_02.jpg') center 0 no-repeat;}
.real_slide .imgs li.li_03 {background:url('/img/jj_real_mv_03.jpg') center 0 no-repeat;}
.real_slide .imgs li.li_04 {background:url('/img/jj_real_mv_04.jpg') center 0 no-repeat;}*/
.real_slide .indis {width:100%; position:absolute; left:0; top:11%; text-align:center;}
.real_slide .indis ul {display:inline-block; width:93.75%; margin:0 auto; overflow:hidden;}
.real_slide .indis ul li {width:24%; height:46px; margin-left:1px; float:left; position:relative;}
.real_slide .indis ul li a {width:100%; height:100%; display:block; text-align:center; position:relative;}
.real_slide .indis ul li a span {display:block; color:#060b1c; line-height:46px; position:relative; z-index:10;}
.real_slide .indis ul li a div {width:100%; height:100%; position:absolute; top:0; left:0; z-index:5; background:#c1cdd5; opacity:0.7;}
.real_slide .indis ul li a:hover {}
.real_slide .indis ul li a:hover span {/* background:url('/img/jj_real_mv_tab_on_rect.gif') center 35px no-repeat; */ color:#fff;}
.real_slide .indis ul li a:hover div {background:#272f40;}
.real_slide .indis ul li.on a {}
.real_slide .indis ul li.on a span {/* background:url('/img/jj_real_mv_tab_on_rect.gif') center 35px no-repeat; */ color:#fff;}
.real_slide .indis ul li.on a div {background:#272f40;}

.hover_area {width:100%; max-width:640px; padding:30px 0; position:relative; margin:0 auto; background:#e1e1e1; overflow:hidden;}
.hover_area .hover_wrap_01 {width:93.75%; padding:10px 8px 10px 8px; background:#fff; position:relative; margin:0 auto; overflow:hidden;}
.hover_area .hovers {width:100%; height:100%;  position:relative;}
.hover_area .hovers .img_area {width:96.666%; position:relative; margin:0 auto; overflow:hidden;}
.hover_area .hovers .img_area a img { width:100%; height:100%}
.hover_area .hovers .desc_area {width:100%; height:93px; position:absolute; bottom:0; left:0; display:block;}
.hover_area .hovers .desc_area .txts {width:80%; padding:25px 10% 0; position:relative; z-index:10; overflow:hidden;}
.hover_area .hovers .desc_area .txts p {display:block; width:60%; float:left; font-size:16px; color:#333; font-weight:bold;}
.hover_area .hovers .desc_area .txts span {font-size:13px; display:block; font-weight:normal; margin-top:4px;}
.hover_area .hovers .desc_area .txts a {display:block; width:30%; height:30px; line-height:30px; text-align:center; font-size:14px; color:#b99967; border:1px solid #b99967; float:right; margin:10px 0 0 0;}
.hover_area .hovers .desc_area .bg_rect {width:100%; height:100%; position:absolute; top:0; left:0; z-index:5; background:#fff; opacity:0.7;}


/*수술전후사진*/
.beaf_slide_div{position:relative; width:93.75%; overflow:hidden; margin:0 auto;}
.beaf_slide_div .slide_con_img{position:relative; width:100%; padding-top:5%; margin:0 auto; overflow:hidden;}

.beforeafter{position:relative; width:100%;}
#rolling{clear:both; position:relative; width:100%; padding-bottom:73%; margin:0 auto; overflow:hidden;}
.wrap{position: absolute; left: 0; top: 0; width:100%; heigth:100%;}
.wrap li{float:left; width:100%; position:relative;}
.wrap li .slide_con_bottom_span {    position: relative;
    left: 0;
    bottom: 0;
    width: 100%;
    /**height: 50px**/;
    background: #000;
    color: #fff;
    text-align: center;
    line-height: 20px;
    display: block;
	word-break: keep-all;
    padding: 5px 0;
	}
.wrap li img { width:100%;}

.wrap .beaf_btn_left{position:absolute; left:0; top:310px; z-index:2;}
.wrap .beaf_btn_right{position:absolute; right:0; top:310px; z-index:2;}

.bt-roll {width:70.33%; height:auto; position:relative; margin:0 auto; text-align: center;}
.bt-roll > ul { margin-top:15px;}
.bt-roll > ul >  li{ float:left; width:32.833%; margin-right:0.5%}
.bt-roll > ul >  li a { display:block; background:#383c49; font-size:15px; color:#fff; padding:10px 0 10px; font-weight:bold; text-align:center;}
.bt-roll > ul >  li a:hover { background:#cba369;}
.bt-roll > ul >  li.first a { background:#cba369;}
.bt-roll ul li a.basic_c{background:#383c49; color:#fff;}
.bt-roll ul li a.basic_c.on_view { background:#cba369; color:#fff;}
/*.bt-roll01{margin-left:-33px;}
.bt-roll02{margin-left:-66px;}*/
/* .bt-roll03{margin-left:-97px;} */
.loop{position: relative; z-index: 2;}

.view .bn {width:55px; height:55px; position:absolute; top:50%; margin:-28px 0 0 0; z-index:9999;}
.view .bn a {display:block; width:100%; height:100%;}
.view .bn_left {left:0;}
.view .bn_right {right:0;}

.beaf_slide_list{position:relative; width:100%; overflow:hidden; margin:0 auto;}
.beaf_slide_list .list_con{position:relative; width:1200px; margin:0 auto; overflow:hidden;}
.beaf_slide_list .list_con li{float:left; position:relative; width:290px; height:170px; margin:0 13px 0 0; cursor:pointer;}
.beaf_slide_list .list_con li.last{margin:0;}


/* 20150414 게시판 작업 */
.board_con .table_wrap {width:100%; position:relative;}
.board_con .table_wrap table {width:100%; border-collapse:collapse;}
.board_con .paging_wrap {width:100%; max-width:400px; height:38px; text-align:center; margin:0 auto; position:relative; padding-top:3%; padding-bottom:2%;}
.board_con .paging {width:100%; height:38px; text-align:center; position:relative; margin:0 auto;}
.board_con .paging .bn { position:absolute;}
.board_con .paging .bn a {color:#807e7e; font-size:14px; line-height:38px;}
.board_con .paging .bn_left {width:50px; height:38px; float:left;}
.board_con .paging .bn_left a {display:block; width:100%; height:100%; background:url('/img/jj_board_paging_left.png') 0 center no-repeat; text-indent:12px;}
.board_con .paging .bn_right {width:50px; height:38px; float:left; right:0; margin-left:20px;}
.board_con .paging .bn_right a {display:block; width:100%; height:100%; background:url('/img/jj_board_paging_right.png') right center no-repeat; text-align:left;}
.board_con .paging ul {width:100%; text-align:center; height:38px;}
.board_con .paging ul li {display:inline-block; width:38px; height:38px;}
.board_con .paging ul li a {display:inline-block; width:36px; height:36px; border:1px solid #dadada; font-size:14px; color:#807e7e; text-align:center; line-height:36px;}
.board_con .paging ul li a:active {width:38px; height:38px; border:0; background:#cba369; font-weight:bold; color:#fff;}
.board_con .paging ul li.on  a{width:38px; height:38px; border:0; background:#cba369; font-weight:bold; color:#fff; line-height:36px;}


/*제이준tv*/
.ul_jjtv { width:100%; max-width:640px; position:relative; margin:0 auto; overflow:hidden;}
.ul_jjtv li {}
.ul_jjtv li img { width:100%;}

.div_jjtv { width:100%; max-width:640px; min-width:320px; position:relative; margin:0 auto; background:#e1e1e1; padding:20px 0 10px;}
.div_jjtv .jjtv_img { width:93.75%; position:relative; margin:0 auto; overflow:hidden; margin-bottom:6%;}
.div_jjtv .jjtv_img img { width:100%; height:auto;}

@media handheld, only screen and (max-width: 600px) {
.sub_tab05 { width:100%; min-width:320px; position:absolute; padding-top:50.5%;}
}
@media handheld, only screen and (max-width: 480px) {
	/*.jj_notice_list .divs .img_area {width:100%; height:200px; padding-bottom:0; overflow:hidden;}*/
	.sub_tab .top_tap li a img { width:auto; height:14.5px;}
	.sub_tab03 .top_tab li a img  { width:auto; height:14.5px;}
	
	.sub_tab05 { width:100%; min-width:320px; position:absolute; padding-top:49.5%;}
	
	.sub_tab10 .top_tab li a img  { width:auto; height:14.5px;}
	
}

@media handheld, only screen and (max-width: 400px) {
	.sub_tab .top_tap li a img { width:auto; height:12.5px;}
	.sub_tab03 .top_tab li a img  { max-width: 86%; height:17px;}
	.sub_tab10 .top_tab li a img  { max-width: 86%; height:17px;}
	
}

#lip-youtube-wrap {
    /*position: absolute;*/
    /*width: 100%;*/
    /*height: px;*/
    /*top: 289px;*/
    /*left: 468px;*/
    position: absolute; top: 0; left: 0; right: 0; bottom: 0; max-width: 100%; height: auto;

}


/*** ================================= 컨텐츠 2024 ================================= ***/
html, body {max-width: 100%; overflow-x: hidden;}

@font-face {
    font-family: 'GmarketSansMedium';
    src: url('https://fastly.jsdelivr.net/gh/projectnoonnu/noonfonts_2001@1.1/GmarketSansMedium.woff') format('woff');
    font-weight: normal;
    font-style: normal;
}
@font-face {
  font-family: "Noto Sans", sans-serif;
  src: url('https://fonts.googleapis.com/css2?family=Noto+Sans:ital,wght@0,100..900;1,100..900&display=swap') 
  font-optical-sizing: auto;
  font-weight: <weight>;
  font-style: normal;
  font-variation-settings:
    "wdth" 100;
}
@font-face {
  font-family: "Noto Serif", serif;
  src: url('https://fonts.googleapis.com/css2?family=Noto+Serif:ital,wght@0,100..900;1,100..900&display=swap') 
  font-optical-sizing: auto;
  font-weight: <weight>;
  font-style: normal;
  font-variation-settings:
    "wdth" 100;
}
@font-face {
  font-family: "Noto Serif KR", serif;
  src: url('https://fonts.googleapis.com/css2?family=Noto+Serif+KR:wght@200..900&display=swap') 
  font-optical-sizing: auto;
  font-weight: <weight>;
  font-style: normal;
}
@font-face {
  font-family: "Shrikhand", serif;
  src: url('https://fonts.googleapis.com/css2?family=Shrikhand&display=swap') 
  font-weight: 400;
  font-style: normal;
}

.ul_con_new {position: relative; text-align: center; word-break: keep-all;}
.ul_con_new img {width: 100%; max-width: 420px;}

/* padding */
.pt0 {padding-top: 0px !important;}
.pt10 {padding-top: 10px;}
.pt20 {padding-top: 20px;}
.pt30 {padding-top: 30px;}
.pt40 {padding-top: 40px;}
.pt60 {padding-top: 60px;}
.pl10 {padding-left: 10px;}
.pl20 {padding-left: 20px;}
.pl40 {padding-left: 40px;}
.pl70 {padding-left: 70px;}
.pr20 {padding-right: 20px;}
.pb0 {padding-bottom: 0px !important;}
.pb20 {padding-bottom: 20px;}
.pb30 {padding-bottom: 30px;}
.pb40 {padding-bottom: 40px;}
.pb60 {padding-bottom: 60px;}

/* margin */
.mauto {margin: 0 auto;}
.mt0 {margin-top: 0px !important;}
.mt20 {margin-top: 20px !important;}
.mt60 {margin-top: 60px;}
.mt100 {margin-top: 100px !important;}
.mb6 {margin-bottom: 6px !important;}
.mb60 {margin-bottom: 60px;}

/* width */
.wd10 {width: 10% !important;}
.wd20 {width: 20% !important;}
.wd34 {width: 34% !important;}
.wd40 {width: 40% !important;}
.wd50 {width: 50% !important;}
.wd60 {width: 60% !important;}
.wd70 {width: 70% !important;}
.wd80 {width: 80% !important;}
.wd90 {width: 90% !important;}
.wd100 {width: 100% !important;}

/* color */
.color_fff {color: #fff;}
.color_ddd {color: #ddd;}
.color_gray {color: #999;}
.color_111 {color: #111;}
.color_gold {color: #b18f4f;}
.color_eye {color: #ff3f6e;}
.color_nose {color: #a88060;}
.color_face {color: #419fb7;}
.color_homme {color: #6332a7;}
.color_lifting {color: #ff7e51;}
.color_ulthera {color: #eca919;}
.color_petit {color: #00c0bd;}
/*.color_skin {color: #730056;}*/
.color_fat{color: #4e6cdc;}
.color_skin {color: #b62c58;}

/* bg_color */
.bg_fff {background: #fff;}
.bg_gray {background: #f3f3f3;}
.bg_eye {background: #fceef1; position:relative;}
.bg_eye2 {background: #ff3f6e;}
.bg_eye3 {background: #fc7e9a;}
.bg_eye_pattern {background: repeating-linear-gradient(45deg, #fc7e9a, #fc7e9a 10px, #fc8ba4 0, #fc8ba4 12px);}
.bg_nose {background: #fef8e7; position:relative;}
.bg_nose2 {background: #a88060;}
.bg_nose3 {background: #cca281;}
.bg_face {background: #cceaf1; position:relative;}
.bg_face2 {background: #419fb7;}
.bg_face3 {background: #63bed5;}
.bg_face_pattern {background: repeating-linear-gradient(45deg, #63bed5, #63bed5 10px, #70c8de 0, #70c8de 12px);}
.bg_fat{background: #eaf2ff; position:relative;}
.bg_fat2{background: #4e6cdc;}
.bg_fat3{background: #2b46a9;}
.bg_homme {background: #eee9f3; position:relative;}
.bg_homme2 {background: #6332a7;}
.bg_homme3 {background: #424fab;}
.bg_homme_pattern {background: repeating-linear-gradient(-45deg, #825bb9, #825bb9 10px, #8f6cc0 0, #8f6cc0 12px);}
.bg_lifting {background: #fcede7; position:relative;}
.bg_lifting2 {background: #ff7e51 !important;}
.bg_lifting3 {background: #ffad5d;}
.bg_ulthera {background: #ffb729;}
.bg_lifting_pattern {background: repeating-linear-gradient(45deg, #ff7e51, #ff7e51 10px, #ff875d 0, #ff875d 12px);}
.bg_petit {background: #def5f5;}
.bg_petit2 {background: #00c0bd;}
.bg_petit3 {background: #3d9ed5;}
.bg_petit4 {background: #def5f5; position:relative;}

.bg_petit_pattern {background: repeating-linear-gradient(-45deg, #33cdca, #33cdca 10px, #47d3d0 0, #47d3d0 12px);}
/*.bg_skin2 {background: #730056;}
.bg_skin3 {background: #a1649c;}*/
.bg_grid {background: linear-gradient(to bottom, transparent 20px, #eee 20px) 0 0 / 200vw 21px repeat-y, linear-gradient(to right, transparent 20px, #eee 20px) 0 0 / 21px 200vh repeat-x white;}
.bg_info {background: #111; opacity: .8; padding: 10px; position: absolute; bottom: 0;}
.bg_111 {background: #111; position:relative;}
.bg_skin{background: #fff4f2; position:relative;}
.bg_skin2{background: #b62c58;}
.bg_skin3{background: #ee5e79;}

/* font-size */
.fs36 {font-size: 36px; font-family: GmarketSansMedium; letter-spacing: -.05em; line-height: 1.5; padding: 16px 0;}
.fs30 {font-size: 30px; font-family: GmarketSansMedium; letter-spacing: -.05em; line-height: 1.3; padding-top: 10px;}
.fs20 {font-size: 20px; font-family: GmarketSansMedium; letter-spacing: -.05em; line-height: 1.5;}
.fs16 {font-size: 16px; font-family: noto sans KR; font-weight: 400; letter-spacing: -0.05em; line-height: 1.5em;}
.fs12 {font-size: 12px; font-family: noto sans KR; font-weight: 400; letter-spacing: -0.05em; line-height: 1.5em;}

/* font-style */
.f_italic {font-style: italic;}
.f_bold {font-weight: bold;}
.f_under {text-decoration: underline; text-decoration-thickness: 8px; text-underline-offset: -5px; text-decoration-color: #ffffc7; text-decoration-skip-ink: none;}
.f_serif {font-family: "Noto Serif", serif; font-family: "Noto Serif KR", serif; font-weight: 600;}
.f_eng {font-family: "Shrikhand", serif; font-weight: 400; font-style: normal; letter-spacing: 0em;}

.txtbox {border: 1px solid; padding: 16px; margin: auto; word-break: keep-all;}

/* con_style */

/* 특징 */
.ul_con_new .swiper { width: 100%; height: auto;}
.ul_con_new .swiper-wrapper {padding-bottom: 36px;}
.ul_con_new .swiper-slide {}
.ul_con_new .swiper-slide img {display: block; width: 100%; height: 100%; object-fit: cover;}
.ul_con_new .swiper .txt {position: absolute; top: 50%; left: 50%; transform: translate(-50%, -50%); width: 80%; height: auto; padding: 20px 20px;}
.ul_con_new .swiper-pagination-bullet-active {background: #111;}

.liststyle_info {text-align: left; display: flex; flex-wrap: wrap; width: 100%; font-size: 15px;}
.liststyle_info li {display: flex; align-items: center; width: 50%; margin: 6px 0; word-break: keep-all;}
.liststyle_info .txt {display: flex; flex-direction: column; text-align: left; color: #fff;}
.liststyle_info .time {background: url(/img/jj_m_con_info_time_w.png) center 0 no-repeat; width: 30px; height: 30px; background-size: contain; position: absolute;}
.liststyle_info .anesthesia {background: url(/img/jj_m_con_info_anesthesia_w.png) center 0 no-repeat; width: 30px; height: 30px; background-size: contain; position: absolute;}
.liststyle_info .hospital {background: url(/img/jj_m_con_info_hospital_w.png) center 0 no-repeat; width: 30px; height: 30px; background-size: contain; position: absolute;}
.liststyle_info .stitch {background: url(/img/jj_m_con_info_stitch_w.png) center 0 no-repeat; width: 30px; height: 30px; background-size: contain; position: absolute;}
.liststyle_info .recovery {background: url(/img/jj_m_con_info_recovery_w.png) center 0 no-repeat; width: 30px; height: 30px; background-size: contain; position: absolute;}
.liststyle_info .logo {background: url(/img/jj_m_con_info_logo_w.png) center 0 no-repeat; width: 30px; height: 30px; background-size: contain; position: absolute;}

.liststyle_list {text-align: left;}
.liststyle_list li {width: 100%; margin-bottom: 12px; word-break: keep-all;}
.liststyle_list .num {position: absolute; width: 36px; height: 40px; padding-right:4px; line-height: 43px; text-align: center; border-radius: 50%;}
.liststyle_list .txt {height: auto; padding: 10px 20px; background: rgba(999, 999, 999, .6); border-radius: 20px; margin-left: 50px;}

.liststyle_img {text-align: center;}
.liststyle_img li {padding-bottom: 30px;}
.liststyle_img img {padding-bottom: 10px;}
.liststyle_img .txtbox {width: 90%; padding: 14px 16px 10px 16px;}
.liststyle_img .txt {width: 100%; padding-top: 10px;}
.liststyle_img button {padding: 8px 0 12px; margin-top: 20px; width: 100%; border-radius: 24px; border: 0px;}
.liststyle_img button a {color: #fff;}

.liststyle_img2 {margin: 0 auto; text-align: center; display: flex; justify-content: center; flex-direction: column;}
.liststyle_img2 li {display: flex; flex-direction: row; align-items: center; text-align: left; padding-bottom: 20px;}
.liststyle_img2 li img {width: 120px; margin-right: 20px;}

.liststyle_step {display: flex; flex-wrap: wrap; justify-content: center;}
.liststyle_step li {margin-bottom: 20px; width: 50%; word-break: keep-all;}
.liststyle_step .num {width: 36px; height: 40px; padding-right:4px;line-height: 43px; text-align: center; border-radius: 50%; margin: 0 auto; position: relative;}
.liststyle_step .img {margin-top: -20px; padding-bottom: 12px;}
.liststyle_step img {width: 92% !important; max-width: 300px;}
.liststyle_step .txt {width: 92%; margin: 0 auto;}

.liststyle_point {text-align: left; display: flex; flex-wrap: wrap;}
.liststyle_point li { padding: 16px; background: rgba(999, 999, 999, .6); border-radius: 20px; margin-bottom: 12px; width: 100%; word-break: keep-all;}
.liststyle_point .point {position: absolute; font-family: "Noto Serif", serif; font-weight: 700; font-size: 14px; padding-bottom: 16px; text-decoration: underline; text-underline-offset: 6px;}

.liststyle_vs {display: flex; justify-content: center; flex-wrap: nowrap;}
.liststyle_vs li {margin-bottom: 20px; width: 50%; word-break: keep-all; padding: 0 8px;}
.liststyle_vs img {margin: 10px 0;}
.liststyle_vs .vs {position: absolute; margin-top: 19%; width: 36px; height: 40px; padding-right:4px; line-height: 43px; text-align: center; border-radius: 50%;}
.liststyle_vs .txt {padding-top: 10px;}

.liststyle_check {text-align: left;}
.liststyle_check .flex {display: flex; flex-wrap: wrap;}
.liststyle_check li {width: 100%; margin-bottom: 12px; word-break: keep-all;}
.liststyle_check .txt {height: auto; padding: 10px 20px; background: rgba(999, 999, 999, .6); border-radius: 20px; margin-left: 50px;}
.liststyle_check .check_gold {background: url(/img/intro/jj_m_con_gold_check.png) center 0 no-repeat; width: 16px; height: 18px; background-size: contain; position: absolute;}
.liststyle_check .check_eye {background: url(/img/eye/jj_m_con_eye_check.png) center 0 no-repeat; width: 16px; height: 18px; background-size: contain; position: absolute;}
.liststyle_check .check_nose {background: url(/img/nose/jj_m_con_nose_check.png) center 0 no-repeat; width: 16px; height: 18px; background-size: contain; position: absolute;}
.liststyle_check .check_face {background: url(/img/face/jj_m_con_face_check.png) center 0 no-repeat; width: 16px; height: 18px; background-size: contain; position: absolute; margin-top: 2px;}
.liststyle_check .check_lifting {background: url(/img/lifting/jj_m_con_lifting_check.png) center 0 no-repeat; width: 16px; height: 18px; background-size: contain; position: absolute; margin-top: 2px;}
.liststyle_check .check_skin {background: url(/img/skin/jj_m_con_skin_check.png) center 0 no-repeat; width: 16px; height: 18px; background-size: contain; position: absolute; margin-top: 2px;}
.liststyle_check .check_homme {background: url(/img/homme/jj_m_con_homme_check.png) center 0 no-repeat; width: 16px; height: 18px; background-size: contain; position: absolute; margin-top: 2px;}
.liststyle_check .check_fat {background: url(/img/fat/jj_m_con_fat_check.png) center 0 no-repeat; width: 16px; height: 18px; background-size: contain; position: absolute; margin-top: 2px;}
.liststyle_check .check_petit {background: url(/img/petit/jj_m_con_petit_check.png) center 0 no-repeat; width: 16px; height: 18px; background-size: contain; position: absolute; margin-top: 2px;}

.liststyle_table {display: -webkit-box; display: -ms-flexbox;}
.liststyle_table tbody {display: flex; align-items: center; justify-content: center; flex-direction: column;}
.liststyle_table tr {display: flex; width: 100%; align-items: center; padding: 10px; border-bottom: 1px solid #ddd;}
.liststyle_table th {display: block; padding: 4px 12px; background: #999; color: #fff; border-radius: 20px; height: fit-content; width: 46px;}
.liststyle_table td {display: block; width: 50%; padding: 0 10px;}

.liststyle_copy {padding: 60px 20px 0 20px;}
.liststyle_copy .mark {font-size: 40px; padding: 0; font-weight: 800;}

.liststyle_play {width: 100%; height: auto;}
.liststyle_play iframe {width :100%; max-width: 420px; height: 240px;}
.liststyle_play .txtbox {margin-top: 20px;}
.liststyle_play a {color: #fff; text-decoration: underline; }

.liststyle_circle {display: flex; justify-content: center; align-items: center; flex-wrap: nowrap;}
.liststyle_circle li {width: 88px; height: 88px; border-radius: 50%; background-blend-mode: multiply; opacity: .9; padding: 0; margin: 0 -5px; position: relative;}
.liststyle_circle li p {color: #fff; font-size: 16px; line-height: 1.2; position: absolute; letter-spacing: -.05em; top: 50%; left: 50%; transform: translate(-50%, -50%);}

.liststyle_circle2 {display: flex; justify-content: center; flex-wrap: wrap;}
.liststyle_circle2 li {width: 100px; height: 100px; border-radius: 50%; position: relative; padding: 20px; margin: 10px;}
.liststyle_circle2 .num {color: #fff; font-size: 20px; padding: 8px 0; text-decoration: underline; text-underline-offset: 6px; text-decoration-thickness: 1px;}
.liststyle_circle2 .txt {color: #fff; font-size: 16px; line-height: 1.2; letter-spacing: -.05em;}


/* 전후리스트 */
/** 눈 **/
#bna-eye .login{position: absolute; z-index: 111; width: 100%; margin: 0 auto; top: 44%;}
#bna-eye .surgery {width: 94%; height: auto; padding: 3%; border-radius: 30px; color: #111; background: #eee; margin-top: 10px; display: flex; align-items: center; justify-content: center;}
#bna-eye .swiper {width: 100%; height: 100%;}
#bna-eye .swiper-wrapper {padding-bottom: 20px !important;}
#bna-eye .swiper-slide {text-align: center; font-size: 18px; background: #fff; display: flex; justify-content: center; align-items: center; flex-direction: column;}
#bna-eye .swiper-slide img {display: block; width: 100%; height: 100%; object-fit: cover; object-position: top; border-radius: 30px;}
#bna-eye .swiper {width: 96%; margin-left: auto; margin-right: auto;}
#bna-eye .swiper-slide {background-size: cover; background-position: center;}
#bna-eye .mySwiper2 {height: auto; width: 96%;}
#bna-eye .mySwiper {height: auto; box-sizing: border-box; cursor: pointer;}
#bna-eye .mySwiper .swiper-slide {height: 100%; opacity: 0.5;}
#bna-eye .mySwiper .swiper-slide-thumb-active {opacity: 1;}
#bna-eye .swiper-slide img {display: block; width: 100%; height: 100%; object-fit: cover;}
#bna-eye .swiper-button-next, #bna-eye .swiper-button-prev {top: 36%; color: #fff; scale: 70%;}
#bna-eye .swiper-button-next {right: 0;}
#bna-eye .swiper-button-prev {left: 0;}

/** 코,윤곽,동안 등 **/
#bna-nose .login{position: absolute; z-index: 111; width: 36%; margin: 0 auto; top: 22%; left: 55%;}
#bna-nose .surgery {width: 94%; height: auto; padding: 3%; border-radius: 30px; color: #111; background: #eee; margin-top: 10px; display: flex; align-items: center; justify-content: center;}
#bna-nose .swiper {width: 100%; height: 100%;}
#bna-nose .swiper-wrapper {padding-bottom: 20px !important;}
#bna-nose .swiper-slide {text-align: center; font-size: 18px; background: #fff; display: flex; justify-content: center; align-items: center; flex-direction: column;}
#bna-nose .swiper-slide img {display: block; width: 100%; height: 100%; object-fit: cover; object-position: top; border-radius: 30px;}
#bna-nose .swiper {width: 96%; margin-left: auto; margin-right: auto;}
#bna-nose .swiper-slide {background-size: cover; background-position: center;}
#bna-nose .mySwiper2 {height: auto; width: 96%;}
#bna-nose .mySwiper {height: auto; box-sizing: border-box; cursor: pointer;}
#bna-nose .mySwiper .swiper-slide {height: 100%; opacity: 0.5;}
#bna-nose .mySwiper .swiper-slide-thumb-active {opacity: 1;}
#bna-nose .swiper-slide img {display: block; width: 100%; height: 100%; object-fit: cover;}
#bna-nose .swiper-button-next, #bna-nose .swiper-button-prev {top: 34%; color: #fff; scale: 70%;}
#bna-nose .swiper-button-next {right: 0;}
#bna-nose .swiper-button-prev {left: 0;}


/* 의료진소개 */
#medicalteam .swiper-wrapper {padding-bottom: 20px;}
#medicalteam .swiper-slide {text-align: center; font-size: 18px; background: #fff; display: flex; justify-content: center; align-items: center; flex-direction: column;}
#medicalteam .swiper-slide img {display: block; width: 100%; height: 100%; object-fit: cover; object-position: top; border-radius: 10px;}
#medicalteam .swiper {width: 96%; margin-left: auto; margin-right: auto;}
#medicalteam .swiper-slide {background-size: cover; background-position: center;}
#medicalteam .mySwiper2 {height: auto; width: 96%;}
#medicalteam .mySwiper {height: auto; box-sizing: border-box; cursor: pointer;}
#medicalteam .mySwiper .swiper-wrapper {display: flex; flex-wrap: wrap; flex-direction: row; /**justify-content: space-between;**/}
#medicalteam .mySwiper .swiper-slide {height: 100%; opacity: 0.5; margin-right: 7px !important; margin-bottom: 10px; color:#777;}
#medicalteam .mySwiper .swiper-slide-thumb-active {opacity: 1; color:#111;}
#medicalteam .swiper-button-next, #medicalteam .swiper-button-prev {color: #aaa; scale: 70%;}
#medicalteam .swiper-button-next {right: 0;}
#medicalteam .swiper-button-prev {left: 0;}

/* 수술후기 리스트 페이징 */
.paging_ul ul {list-style: none; display: inline-flex;}
.paging_ul ul li {width: 30px; height: 30px; line-height: 30px; border: 1px solid #777; margin: 1px;}
.paging_ul ul li.on {background-color: #777; color: #eee;}
.paging_ul ul li.arrow {background-color: #9c8108;}
.paging_ul ul li.arrow a { color: #eee;}

/* sns login */
ul#sns_login {max-width: 320px; width: 100%;}