@charset "utf-8"; 

#uroLift .container-3 { width: 1410px; margin: 0 auto; } 
#uroLift .top-intro { color: #fff; } 

/* section-2 */
#uroLift .section-2 {height:910px;}
#uroLift .section-2 .doctor-rotate {position:absolute; width:100%;}
#uroLift .section-2 .doctor-rotate1 {transform:translateY(65px);}
#uroLift .section-2 .doctor-rotate .doctor-represent-imgs {opacity: 0;transform: translateX(60px);}
#uroLift .section-2 .doctor-rotate.fade .doctor-represent-imgs {transform: translateX(0px); opacity: 1; transition: all 2s ease; }
#uroLift .section-2 .doctor-rotate .doctor-introduce {opacity: 0;transform: translateY(50px); transition-delay:0s;}
#uroLift .section-2 .gray-wrapbox {transition-delay:0s;}
#uroLift .section-2 .doctor-rotate.fade .doctor-introduce {transform: translateY(0px); opacity: 1; transition: all 2s ease;}
#uroLift .section-2 .doctor-rotate1.fade .doctor-introduce {transform: translateY(-35px);}

.youtubeBox{width:100%; height:auto; position:relative; padding-top:56.25%; overflow:hidden; margin-top:260px; transform:translateY(50px); opacity:0;}
.youtubeBox iframe{width:100%; height:100%; position:absolute; top:0; left:0;}
.viewing .youtubeBox{opacity:1; transform:translateY(0px); transition: all 1.5s ease .3s; } 

/* section-3 */
#uroLift .section-3 { margin-top: 260px; } 
#uroLift .section-3 .container-3 { padding-left: 87px; opacity:0; transform:translateY(50px);} 
#uroLift .section-3 .section-tit { text-align: center; margin-bottom: 110px; opacity:0; transform:translateY(50px); } 
#uroLift .section-3 .section-tit .lrg-txt { display: block; font-size: 48px; font-weight: bold; line-height: 1; margin-bottom: 56px; } 
#uroLift .section-3 .section-tit .sml-txt { font-size: 20px; } 
#uroLift .section-3 .video-left-side { float: left; width: 335px; margin-top: 80px; } 
#uroLift .section-3 .video-left-side .tit { font-size: 48px; font-weight: bold; line-height: 1.15; margin-bottom: 50px; } 
#uroLift .section-3 .video-left-side .comment { color: #666; font-size: 20px; line-height: 1.4; } 
#uroLift .section-3 .video-right-side { position: relative; width: calc(100% - 400px); max-width: 983px; padding-bottom: 39%; float: right; } 
#uroLift .section-3 .video-right-side > iframe { position: absolute; width: 100%; height: 100%; } 
#uroLift .section-3 .change-step-wrapper { margin-top: 130px; } 
#uroLift .section-3 .change-step-wrapper .step { float: left; opacity: 0; transform: translateX(90px); } 
#uroLift .section-3 .change-step-wrapper .step > p { margin-top: 30px; font-size: 30px; font-weight: bold; letter-spacing: -1px; line-height: 1; margin-bottom: 20px; } 
#uroLift .section-3 .change-step-wrapper .step > span { font-size: 16px; color: #666; } 
#uroLift .section-3 .change-step-wrapper .step-01, #uroLift .section-3 .change-step-wrapper .step-02 { width: 429px; position: relative; } 
#uroLift .section-3 .change-step-wrapper .step-01:after, #uroLift .section-3 .change-step-wrapper .step-02:after { content: ""; position: absolute; width: 18px; height: 35px; background: url("/images/urolift_next_step_arrow.png"); right: 15px; top: 219px; } 
#uroLift .section-3 .change-step-wrapper.viewing .step { opacity: 1; transform: translateX(0px); transition: all 1s ease; } 
#uroLift .section-3 .change-step-wrapper.viewing .step-02 { transition-delay: 0.4s; } 
#uroLift .section-3 .change-step-wrapper.viewing .step-03 { transition-delay: 0.8s; } 
#uroLift .section-3.viewing .section-tit { opacity:1; transform:translateY(0px); transition: all 1.5s ease; } 
#uroLift .section-3.viewing .container-3 { opacity:1; transform:translateY(0px); transition: all 1.5s ease .3s; } 

/* section-4 */
#uroLift .section-4 { margin-top: 196px; } 
#uroLift .section-4 .section-tit { text-align: center; } 
#uroLift .section-4 .section-tit .sml-txt { display: block; line-height: 1; font-size: 20px; font-weight: 500; margin-bottom: 50px; } 
#uroLift .section-4 .section-tit .lrg-txt { font-size: 48px; font-weight: bold; } 
#uroLift .section-4 .urolift-hover-box { margin-top: 114px; } 
#uroLift .section-4 .urolift-hover-box .hover-box { width: 239px; height: 500px; float: left; margin-right: 1px; background: #efefef; cursor: pointer; position: relative; overflow: hidden; padding: 82px 0 0 66px; transition: all 0.3s ease; } 
#uroLift .section-4 .urolift-hover-box .hover-box.active { background: #900020; color: #fff; width: 516px; } 
#uroLift .section-4 .urolift-hover-box .hover-box .number { font-size: 16px; line-height: 1; margin-bottom: 18px; font-weight: 500; } 
#uroLift .section-4 .urolift-hover-box .hover-box .tit { font-size: 24px; line-height: 1.2; font-weight: bold; margin-bottom: 38px; } 
#uroLift .section-4 .urolift-hover-box .hover-box .content { font-size: 20px; opacity: 0; transition: opacity 0.3s ease; } 
#uroLift .section-4 .urolift-hover-box .hover-box > img { position: absolute; right: 0; bottom: 0; transform: translateX(68px); transition: transform 0.45s ease; } 
#uroLift .section-4 .urolift-hover-box .hover-box.active > img { transform: translateX(0px); } 
#uroLift .section-4 .urolift-hover-box .hover-box.active .content { opacity:1 } 

/* section-5 */
#uroLift .section-5 { margin-top: 196px; } 
#uroLift .section-5 .sml-txt-1 { display: block; font-size: 20px; font-weight: 500; margin-bottom: 50px; } 
#uroLift .section-5 .sml-txt-2 { font-size: 20px; line-height: 1.3; } 
#uroLift .section-5 .section-tit { text-align: center; line-height: 1; margin-bottom: 120px; } 
#uroLift .section-5 .section-tit .sml-txt { display: block; font-size: 22px; font-weight: 500; margin-bottom: 50px; } 
#uroLift .section-5 .section-tit .lrg-txt { font-size: 48px; font-weight: bold; display: block; margin-bottom: 58px; } 
#uroLift .section-5 .compare-box { position: relative; } 
#uroLift .section-5 .compare-box-1 { height: 330px; } 
#uroLift .section-5 .compare-box-2 { height: 194px; } 
#uroLift .section-5 .compare-box-3,
#uroLift .section-5 .compare-box-4,
#uroLift .section-5 .compare-box-5,
#uroLift .section-5 .compare-box-6,
#uroLift .section-5 .compare-box-7 { height: 101px; } 
#uroLift .section-5 .compare-box .left-dir { position: absolute; left: 0; height: 100%; } 
#uroLift .section-5 .compare-box .right-dir { position: absolute; right: 0; height: 100%; color: #900020; font-weight: bold; } 
#uroLift .section-5 .compare-box .center-dir { position: absolute; left: 50%; top: 50%; transform: translate(-50%, -50%); font-size: 50px; color: #d0d0d0; font-weight: bold; } 
#uroLift .section-5 section.compare-box .left-dir { width: 488px; text-align: right; font-size: 24px; color: #666; padding-top: 32px; } 
#uroLift .section-5 section.compare-box .right-dir { width: 488px; padding-top: 32px; } 
#uroLift .section-5 .compare-box-2 section.left-dir { height: 100%; top: 0; padding-top: 69px; border-bottom: 1px solid #333; } 
#uroLift .section-5 .compare-box-2 section.left-dir .tit { font-size: 32px; font-weight: bold; line-height: 1; color: #333; } 
#uroLift .section-5 .compare-box-2 section.left-dir .tit span { font-size: 20px; display: block; margin-top: 20px; font-weight: 500; } 
#uroLift .section-5 .compare-box-2 section.right-dir { height: 100%; top: 0; top: 0; padding-top: 69px; border-bottom: 1px solid #900020; } 
#uroLift .section-5 .compare-box-2 section.right-dir .tit { font-size: 32px; font-weight: bold; line-height: 1; color: #900020; } 
#uroLift .section-5 .compare-box-2 section.right-dir .tit span { font-size: 20px; display: block; margin-top: 20px; font-weight: 500; } 
#uroLift .section-5 p.left-dir { border-bottom: 1px solid #eaeaea; font-size: 24px; color: #666; } 
#uroLift .section-5 p.right-dir { border-bottom: 1px solid #eaeaea; font-size: 24px; color: #900020; } 
#uroLift .section-5 .compare-box-7 p.left-dir { border-bottom: 1px solid #333; } 
#uroLift .section-5 .compare-box-7 p.right-dir { border-bottom: 1px solid #900020; } 

/* urolift-insurance */
#uroLift .urolift-insurance {margin-top: 196px; background: url("/images/urolift_insurance_bg.jpg") no-repeat center; background-attachment:fixed; background-size: cover;height: 528px;padding: 100px 0; overflow:hidden;}
#uroLift .urolift-insurance .container-2 {position:relative; z-index:100;}
#uroLift .urolift-insurance .section-tit{color: #fff;text-align: center;line-height: 1;}
#uroLift .urolift-insurance .section-tit .sml-tit{font-size: 22px;display: block;margin-bottom: 50px;}
#uroLift .urolift-insurance .section-tit .lrg-tit{font-size: 48px;font-weight: bold; display: block;margin-bottom: 56px;}
#uroLift .urolift-insurance .comment-box {width: 940px;margin: 0 auto;background: rgba(255,255,255,.9);text-align: center;font-size: 22px;padding: 45px 0;letter-spacing: -0.5px;}
#uroLift .urolift-insurance .comment-box strong{color: #900020;}
#uroLift .urolift-insurance .effect-content-wrap {width: 1406px;position: relative;margin: 0 auto; }
#uroLift .urolift-insurance .effect-content-wrap > img{position: absolute;bottom: -96px; }
#uroLift .urolift-insurance .effect-content-wrap > img.effect-con-01{left: 36px; z-index:10;}
#uroLift .urolift-insurance .effect-content-wrap > img.effect-con-02{right: 214px; z-index:30;}
#uroLift .urolift-insurance .effect-content-wrap > img.effect-con-03{right: 34px; z-index:20;}

/* section-6 */
#uroLift .section-6 { margin-top: 100px; position: relative; } 
#uroLift .section-6 .section-6-bg {position: absolute;top: 0;left: 0;z-index: -1;height: 750px;transition: transform 1.5s ease;width: 100%;} 
#uroLift .section-6 .section-tit { padding-top: 153px; text-align: center; line-height: 1; color: #fff; } 
#uroLift .section-6 .section-tit .sml-txt-1 { display: block; font-size: 20px; font-weight: 500; margin-bottom: 50px; } 
#uroLift .section-6 .section-tit .sml-txt-2 { line-height: 1; margin-top: 50px; display: block; font-size: 20px; margin-bottom: 117px; } 
#uroLift .section-6 .section-tit .lrg-txt { display: block; font-size: 48px; font-weight: bold; line-height: 1.3; } 
#uroLift .section-6 .machine-list-wrap { position: relative; height: 490px; margin-bottom: 75px; opacity: 0; transform: translateY(60px);} 
#uroLift .section-6 .machine-list-wrap.viewing {opacity: 1; transform: translateY(0px); transition: all 1s ease;}
#uroLift .section-6 .machine-list-wrap li { position: absolute; } 
#uroLift .section-6 .machine-list-wrap li > .model-name { text-align: center; font-size: 20px; padding-top: 80px; position: relative; } 
#uroLift .section-6 .machine-list-wrap li > .model-name:after { content: ""; width: 1px; height: 75px; background: #333; position: absolute; left: 50%; top: -28px; transform: translateX(-50%); } 
#uroLift .section-6 .machine-list-wrap .left { left: 0; } 
#uroLift .section-6 .machine-list-wrap .center { left: 50%; transform: translateX(-50%); } 
#uroLift .section-6 .machine-list-wrap .right { right: 0; }