@charset "UTF-8";

/* 
Last Updated : 2016-02-15
Author       : amy
Version      : 1.0
*/

#wrap {background:#eeefef;}

#roen_cf_floating {display:none;}
#estimate_laypop  {display:none;}
/* 탑배너 */
#top_bnr {width:100%; height:775px; position:relative; background:#fff; overflow:hidden; }

#top_bnr ul.main_top_bnr > li {width:100%; min-width:1200px; height:775px; position:relative; overflow:hidden; box-sizing:border-box;}

#top_bnr ul.main_top_bnr > li .topbnr_img_area {width:1200px; height:775px; margin:0 auto; position:relative;}
#top_bnr ul.main_top_bnr > li .topbnr_img_area .left {position:absolute; top:0; left:-400px;}
#top_bnr ul.main_top_bnr > li .topbnr_img_area .right {position:absolute; top:0; right:-400px;}
#top_bnr ul.main_top_bnr > li .topbnr_img_area .btn{position:absolute;top:418px;left:0px;}
#top_bnr ul.main_top_bnr li.topbnr_item01 .topbnr_item01_wrap {width:1200px; height:775px; margin:0 auto; position:relative;}
#top_bnr ul.main_top_bnr li.topbnr_item01 .topbnr_item01_conts {width:3362px; height:775px; overflow:hidden; position:absolute; top:0; left:-1080px}

/* 메인배너 1번 컨텐츠 */
.topbnr_item01_wrap .age40_area {position:absolute; top:0; left:0; width:1875px; height:775px; background:url('/statics/ry/img/main/topbnr/bg_mainbnr01_40age.png') no-repeat; z-index:10;}
.topbnr_item01_wrap .age40_area .operation_select_area {width:700px; height:775px; position:absolute; top:0; left:-2000px; background:url('/statics/ry/img/main/topbnr/bg_operation_select_age40.png') no-repeat; }

.topbnr_item01_wrap .operation_select {width:700px; height:450px; margin:60px 0 30px; overflow:hidden;}
.topbnr_item01_wrap .select_area {float:left; width:304px; height:450px; margin:25px 100px 0 40px;}
.topbnr_item01_wrap .select_area ul li {width:304px; height:24px; min-width:304px; margin-bottom:23px; padding:0; overflow:hidden;}
/* .topbnr_item01_wrap .select_area ul li.second {height:40px} */
.topbnr_item01_wrap .select_area ul li input[type="checkbox"] {float:left; vertical-align:middle; width:20px; height:20px; margin-right:10px;}
.topbnr_item01_wrap .select_area label {float:left; margin-top:5px; visibility:visible; vertical-align:middle;}
.topbnr_item01_wrap .result_area {float:left; width:170px; height:450px;}
.topbnr_item01_wrap .result_area ul li {float:left; width:85px; height:99px;}
.topbnr_item01_wrap .result_area ul li.second {margin-top:50px;}
.topbnr_item01_wrap .result_area ul li.add_cont {margin-top:-50px;}
.topbnr_item01_wrap .avi_area {width:621px; height:169px; margin:0 auto;}

.topbnr_item01_wrap .age20_area {position:absolute; top:0; right:0; width:1875px; height:775px; background:url('/statics/ry/img/main/topbnr/bg_mainbnr01_20age.png') no-repeat; z-index:10;}
.topbnr_item01_wrap .age20_area .operation_select_area {width:700px; height:775px; position:absolute; top:0; right:-2500px; background:url('/statics/ry/img/main/topbnr/bg_operation_select_age20.png') no-repeat; }

/* 메인배너 1번 버튼*/
.topbnr_item01_wrap .btn_age40_open {display:inline-block; position:absolute; width:309px; height:47px; overflow:hidden; top:318px; right:236px; z-index:100; cursor:pointer;}
/* .topbnr_item01_wrap .btn_age40_open:hover img {margin-left:-376px;} */
.topbnr_item01_wrap .btn_age40_close {display:inline-block; position:absolute; bottom:200px; right:210px; z-index:100; cursor:pointer;}
.topbnr_item01_wrap .btn_age20_open2 {display:inline-block; position:absolute; bottom:50px; right:126px; z-index:100; cursor:pointer;}

.topbnr_item01_wrap .btn_age20_open {display:inline-block; width:344px; height:45px; overflow:hidden; position:absolute; top:410px; left:210px; z-index:100; cursor:pointer;}
/* .topbnr_item01_wrap .btn_age20_open:hover img {margin-left:-371px;} */
.topbnr_item01_wrap .btn_age20_close {display:inline-block; position:absolute; top:0; left:310px; z-index:100; cursor:pointer;}
.topbnr_item01_wrap .btn_age40_open2  {display:inline-block; position:absolute; top:80px; left:120px; z-index:100; cursor:pointer;}

/* 메인배너 1번 암막 */
.topbnr_item01_wrap .bg_select {position:absolute;; top:0; left:0; background:url('/statics/ry/img/common/bg_black.png') left top repeat; width:3362px; height:775px; z-index:5;}

#top_bnr ul.main_top_bnr li.topbnr_item03 {background:url('/statics/ry/img/main/topbnr/img_topbnr05.jpg') no-repeat 0 0; background-size:cover;}
#top_bnr ul.main_top_bnr li.topbnr_item03 .left {width:50%; height:775px; position:absolute; top:0; left:0; text-align:right;}
#top_bnr ul.main_top_bnr li.topbnr_item03 .right {width:50%; height:775px; position:absolute; top:0; right:0; text-align:left;}


#top_bnr ul.main_top_bnr li.topbnr_item04 .btn_topbnr_item04 {position:absolute; top:340px; left:825px}

.maintopbnr_pager  {position:absolute; left:0; bottom:20px; width:100%;  text-align:center; z-index:30;}
.maintopbnr_pager a {margin:0 2px; display:inline-block; width:15px; height:15px; line-height:18px;text-indent: -9999px; text-align:center; background:#aaa;-moz-border-radius:10px;-webkit-border-radius:10px;border-radius:10px;border:2px solid #aaa}
.maintopbnr_pager a:hover, .maintopbnr_pager a.active {background: #523d76; border:2px solid #fff;}

/* 지점안내 */ 
.branch_infor {width:100%; height:43px; overflow:hidden; border-top:1px solid #e0e0e0; border-bottom:1px solid #e0e0e0; margin:30px 0 15px;}
.branch_infor ul li {float:left; width:97.2px; height:43px; padding:10px 0; text-align:center; box-sizing:border-box; -webkit-box-sizing:border-box; -moz-box-sizing:border-box; background:#fff; color:#000; font-size:16px; border-left:1px solid #e0e0e0}
.branch_infor ul li:last-child {border-right:1px solid #e0e0e0;}
.branch_infor ul li a {display:inline-block; width:100%; height:43px;}
.branch_infor ul li:hover {border:1px solid #7961a1;}
.branch_infor ul li.title {width:130px; height:43px; background:#7961a1; color:#fff; border:0;}
.branch_infor ul li.title:hover {border:0;}

/* 수술 배너 */
.opration_bnr_area {width:1200px; height:162px; overflow:hidden; margin:0 auto 15px;}
.opration_bnr_area ul li {float:left; width:396px; height:160px; margin-right:3px; border:1px solid #fff;}
.opration_bnr_area ul li.last {margin:0;}
.opration_bnr_area ul li:hover {border:1px solid #b283b8;}

/* 시술후기_이벤트 */
.cfavi_event_area {width:1200px; height:270px; overflow:hidden; margin-bottom:15px;}
.cfavi_event_area .cfavi_area {float:left; width:855px; height:270px; overflow:hidden; margin-right:15px; position:relative;}
.cfavi_event_area .cfavi_area .cfavi_go {position:absolute; top:161px; left:76px; width:100px;height:23px;line-height:23px; font-size:13px; text-align:center; border:1px solid #bbb; letter-spacing:-0.5px;color:#717171}
.cfavi_event_area .cfavi_area .cfavi_go:hover {background:#523d76; color:#fff;} 

.cfavi_event_area .eventbnr_area {float:left; width:330px; height:270px; position:relative;}
.cfavi_event_area .eventbnr_area ul {position:relative;}
.cfavi_event_area .eventbnr_area ul li {float:left; width:330px; height:270px;}
.cfavi_event_area .eventbnr_rolling_pager  {position:absolute; right:15px; top:15px; width:100%;  text-align:right;}
.cfavi_event_area .eventbnr_rolling_pager a {display:inline-block; width:10px; height:10px; line-height:18px; text-indent: -9999px; text-align:center; background:#aaa;-moz-border-radius:10px;-webkit-border-radius:10px;border-radius:10px;}
.cfavi_event_area .eventbnr_rolling_pager a:hover, .cfavi_event_area .eventbnr_rolling_pager a.active {background: #523d76;}

/* 인트로 배너 */
.intro_bnr_area {width:1200px; height:194px; margin-bottom:15px; cursor:pointer; position:relative}
.intro_bnr_area .intro_go {position:absolute; top:121px; left:136px; width:100px; font-size:13px; padding:5px 0; display:inline-block; text-align:center; border:1px solid #bbb; letter-spacing:-0.5px;}
.intro_bnr_area .intro_go:hover {background:#523d76; color:#fff;} 

/* 수술 궁금증 ASK ROEN _ 로앤 Culture _ 로앤 웹툰 _ 로앤 TV*/
.roenstory_area {width:1200px; height:449px; overflow:hidden; margin-bottom:15px; position:relative;}

/* ask roen 수술 궁금증 */
.ask_area {float:left; width:552px; height:409px; background:#fff; margin-right:15px; padding:20px 12px; position:relative; margin-right:15px;}
.ask_area .title {width:100%; display:inline-block; text-align:center; font-size:20px; margin:13px 0 33px; letter-spacing:-1.2px; color:#000;}
.ask_area .title .bold {font-weight:600;}
.ask_area .title .gray {color:#a8a8a8; letter-spacing:0;}

.ask_rolling_area {width:553px; height:409px; overflow:hidden; position:relative;}

.rolling_area ul {position:relative; width:552px; height:320px; overflow:hidden;}
.rolling_area ul li {float:left; width:258px; height:318px; margin:0 8px; border:1px solid #e4e4e4;}
.rolling_area ul li:hover {border:1px solid #b283b8;}
.rolling_area ul li .text_area {padding:25px 20px; width:218px;}
.rolling_area ul li .text_area .star {display:inline-block; width:100%; margin-bottom:10px;}
.rolling_area ul li .text_area .ask_title {display:inline-block; width:100%; font-size:16px; word-break:keep-all; letter-spacing:-0.5px; font-weight:600; color:#2c2c2c; margin-bottom:10px; line-height:20px;}
.rolling_area ul li .text_area .ask_title a:hover {text-decoration:underline;}
.rolling_area ul li .text_area .sns_area {display:inline-block; width:100%; overflow:hidden;}
.rolling_area ul li .text_area .sns_area > span {display:inline-block; float:left; margin-right:5px;}
.rolling_area ul li .text_area .sns_area > span img {vertical-align:middle;}
.rolling_area ul li .text_area .sns_area .good {margin-right:16px;  font-size:14px; margin-top:4px}
.rolling_area ul li .text_area .sns_area .count {margin-right:42px; font-size:14px; margin-top:4px} 
.rolling_area ul li .text_area .sns_area .count .bold {font-weight:600; color:#000000; margin-right:5px;}

/* 로앤 컬쳐 */
.roen_culture {width:264px; height:449px; float:left; overflow:hidden; margin-right:15px;}

.webtoon_tv_area {width:329px; height:449px; float:left;}
.webtoon_tv_area .roen_webtoon {width:329px; height:217px; overflow:hidden; margin-bottom:15px;}


/* 진료시간 및 상담예약 */
.advice_area {width:100%; height:304px; overflow:hidden;}
.advice_area .infor_area {float:left; width:856px; height:304px; background:#fff; margin-right:15px;}
.advice_area .infor_area .branch_list {float:left; width:140px; height:304px; }
.advice_area .infor_area .branch_list li {width:140px; height:26.7px; border-bottom:1px solid #645184; background:#523d76; color:#fff; text-align:center; cursor:pointer; font-size:12px;line-height: 27px;}
.advice_area .infor_area .branch_list li.on {color:#523d76; background:#fff; font-weight:600; border-bottom:#fff;}
	.branch_contents {float:left; width:690px; height:277px; overflow:hidden;}
	.branch_contents ul li {width:630px; height:190px; padding:45px 30px; overflow:hidden;}
	.branch_contents ul li .thum {float:left; width:240px; height:190px; overflow:hidden; margin-right:30px;}
	.branch_contents ul li .text {float:left; width:360px; height:190px;}
	.branch_contents ul li .title {width:100%; display:inline-block; font-size:20px; color:#000; margin-bottom:15px; letter-spacing:-1px;}
	.branch_contents ul li .bold {font-weight:bold;}
	.branch_contents ul li .tell {width:100%; display:inline-block; font-size:34px; color:#000; margin-bottom:18px; font-weight:600; color:#523d76; letter-spacing:-1px;}
	.branch_contents ul li .tell .gray {font-size:14px; color:#666666; vertical-align:middle;}
	.branch_contents ul li .time {width:100%; display:inline-block; margin-bottom:15px}
		.branch_contents ul li .time > span {padding:0; display:inline-block; width:50%; float:left; height:22px; font-size:16px; color:#666666;}
		.branch_contents ul li .time > span .day {display:inline-block; width:50px; float:left; text-align:justify; font-size:16px;}
	.branch_contents ul li .info_detail {display:inline-block; width:100%; color:#666666; letter-spacing:-0.5px; margin-bottom:10px; font-size:13px; }
	.branch_contents ul li .branch_go {width:152px; padding:5px 0; display:inline-block; text-align:center; border:1px solid #bbb; letter-spacing:-0.5px;}
	.branch_contents ul li .branch_go:hover {background:#523d76; color:#fff;}

.favorites_menu{float:left;width:329px; height:304px; }

/* 인트로 배너 */
.intro_bnr {position:fixed; top:0; left:0; background:url('/statics/ry/img/intro/bg_intro.jpg') left top no-repeat; background-size:100% 100%; width:100%; height:100%; z-index:100; }
.intro_bnr .intro_contents {width:1200px; height:870px; margin:0 auto; position:relative;}
.intro_bnr .title {position:absolute; top:0; left:0; width:100%; padding:20px; box-sizing:border-box;}
.intro_bnr  .intro_bnr_close {display:inline-block; position:absolute; top:0; right:0; cursor:pointer;}
.intro_bnr .age40, .intro_bnr .age20 {width:50%; float:left; padding-top:100px;  cursor:pointer;}
.intro_bnr .age40 {text-align:right;}
.intro_bnr .age20 {text-align:left; padding-top:98px}

#layer_age40 {background:url('/statics/ry/img/intro/bg_40age_pop.png') no-repeat;}
#layer_age20 {background:url('/statics/ry/img/intro/bg_20age_pop.png') no-repeat;}
.intro_conts {width:1200px; height:800px; background:#939598; position:fixed; top:50%; left:50%; margin:-400px 0 0 -600px; z-index:102; padding:8px 15px 15px; box-sizing:border-box;}
.intro_conts .close_age20, .intro_conts .close_age40 {position:absolute; top:20px; right:10px;}
.intro_conts .check_question {width:460px; float:left; padding:65px 15px;  box-sizing:border-box; position:relative; margin-right:80px;}
.intro_conts .bg_img {width:100%; position:absolute; top:-16px; left:0;}
.intro_conts .bg_img img {width:100%;}
.intro_conts .check_question .title {width:100%; display:inline-block; text-align:center; margin-bottom:30px;}
.intro_conts .check_question .title img{width:393px}
.intro_conts .check_question .sub_title {width:100%; display:inline-block; text-align:center; margin-bottom:20px;}
.intro_conts .check_question .sub_title img {width:421px;}
.intro_conts .check_question ul {height:322px; margin-bottom:58px;}
.intro_conts .check_question ul li {width:100%; padding:10px; font-size:16px;}
.intro_conts .check_question ul li img {width:85%; vertical-align:middle; }
.intro_conts .check_question ul li input[type="checkbox"] {vertical-align:middle; width:20px; height:20px; margin-right:10px;}
.intro_conts .check_question label {visibility:visible; vertical-align:middle;}
.intro_conts .intro_btn {width:100%; display:inline-block; text-align:center; cursor:pointer;}
.intro_conts .intro_btn02 {width:100%; display:inline-block; text-align:center; cursor:pointer;}

.intro_conts .tree_area {width:420px; height:566px; float:left; padding-top:200px; position:relative; text-align:left;}
.intro_conts .tree_area div {width:33%; float:left; position:absolute;}
.intro_conts .tree_area .operation_type01 {top:205px; left:-15px; text-align:left;}
.intro_conts .tree_area .operation_type02 {top:115px; left:132px; text-align:center; }
.intro_conts .tree_area .operation_type03 {top:205px; right:-5px; text-align:right;}
.intro_conts .tree_area .operation_type04 {top:400px; left:-15px; text-align:left;}
.intro_conts .tree_area .operation_type05 {top:495px; left:132px; text-align:center;}
.intro_conts .tree_area .operation_type06 {top:400px; right:-5px; text-align:right;}

.intro_conts .tree_area .operation_age20_type01 {top:200px; left:20px; text-align:left;}
.intro_conts .tree_area .operation_age20_type02 {top:145px; left:132px; text-align:center;}
.intro_conts .tree_area .operation_age20_type03 {top:350px; left:-12px; text-align:left;}
.intro_conts .tree_area .operation_age20_type04 {top:200px; right:40px; text-align:right;}
.intro_conts .tree_area .operation_age20_type05 {top:455px; left:63px; text-align:center;}
.intro_conts .tree_area .operation_age20_type06 {top:455px; left:195px; text-align:center;}
.intro_conts .tree_area .operation_age20_type07 {top:350px; right:-16px; text-align:center;}

.intro_conts .tree_area div img {width:95px;}

#popup_bg {display:none; position:fixed; top:0; left:0; background:url('/statics/ry/img/common/bg_black.png') left top repeat; width:100%; height:100%; z-index:101;}

/* 이벤트 레이어팝업 */
#main_event_pop {width:600px; height:680px; background:#fff; position:fixed; z-index:200; top:50%; left:50%; margin:-340px 0 0 -300px}
#main_event_pop .title {width:600px; height:60px; background:#5F4192; overflow:hidden;}
#main_event_pop .title .tit_txt {float:left; width:520px; height:60px; line-height:60px; color:#fff; font-size:18px; letter-spacing:-0.75px; font-weight:600; padding-left:30px;}
#main_event_pop .title .close {float:left; width:40px; height:40px; padding:10px 5px; cursor:pointer;}

#main_event_pop .main_event {width:600px; height:572px; overflow:hidden; }
#main_event_pop .main_event ul {width:540px; height:492px; overflow:hidden; margin:0 30px;}
#main_event_pop .main_event ul li p {margin:0; display:inline-block;}


#main_event_pop .main_event_pager {width:555px; height:40px; margin:20px 15px 20px 30px;}
#main_event_pop .main_event_pager a {float:left; width:170px; height:40px; line-height:38px; text-align:center; border:2px solid #979797; box-sizing:border-box; margin-right:15px; font-size:14px; font-weight:600;}
#main_event_pop .main_event_pager a.active {border:2px solid #5F4192;}

#main_event_pop .bx-controls-direction {position:absolute; top:360px; left:10px; width:580px; height:25px; overflow:hidden;}
#main_event_pop .bx-controls-direction .bx-prev {width:15px; height:25px; float:left; background:url('/statics/ry/img/main/btn_event_pop_left.png') no-repeat; text-indent: -9999px;}
#main_event_pop .bx-controls-direction .bx-next {width:15px; height:25px; float:right; background:url('/statics/ry/img/main/btn_event_pop_right.png') no-repeat; text-indent: -9999px;}

#main_event_pop .today_check {width:540px; height:48px; margin:0 30px; text-align:right; line-height:40px; font-size:13px;}
#main_event_pop .today_check input {margin:0; vertical-align:middle;}
#main_event_pop .today_check span {background:#787878; color:#fff; width:50px; height:23px; display:inline-block; text-align:center; border:0; font-size:12px; line-height:23px; cursor:pointer;}

/* 최상단 수상 팝업 */
#layer_award {width:100%; height:150px; overflow:hidden; position:relative; z-index:1;}
#layer_award .layer_award_cont {width:1200px; height:150px; margin:0 auto; position:relative;}
#layer_award .left_bg {position:absolute; top:0; left:-400px;}
#layer_award .right_bg {position:absolute; top:0; right:-400px;}
#layer_award .close_area {position:absolute; top:10px; right:10px; text-align:right; z-index:2;}
#layer_award .close_area .close {display:inline-block; margin-bottom:90px;}
#layer_award .close_area input[type="checkbox"] {width:15px; height:15px; margin-left:8px;}