@charset "utf-8";

#complexSurgery .top-intro { color: #fff; } 

/* section-2 */
#complexSurgery .section-2 { margin-top: 146px; } 
#complexSurgery .section-2 .step-lists-wrap { position: relative; height: 238px; } 
#complexSurgery .section-2 .step-lists-wrap .step-lists { position: absolute; left: 0; top: 0; height: 100%; width: 100%; border-radius: 110px; } 
#complexSurgery .section-2 .step-lists-wrap .step-lists span {position: absolute;top: 50%;transform: translateY(-50%);right: 100px;font-size: 19px;font-size: 17px;color: #fff;min-width: 70px;text-align: center;padding-top: 74px;} 
#complexSurgery .section-2 .step-lists-wrap .step-lists-1 { z-index: 500; background: #f47b96; max-width: 269px; } 
#complexSurgery .section-2 .step-lists-wrap .step-lists-1 span { background: url("/images/complex_surgery_step_ico_01.png") no-repeat center top;} 

#complexSurgery .section-2 .step-lists-wrap .step-lists-2 { z-index: 400; background: #e85d7c; max-width: 506px; width: 269px; } 
#complexSurgery .section-2 .step-lists-wrap .step-lists-2 span {background: url(/images/complex_surgery_step_ico_02.png) no-repeat center top;right: 48px;}
#complexSurgery .section-2 .step-lists-wrap .step-lists-3 { z-index: 300; background: #db2c53; max-width: 742px; width: 269px; } 
#complexSurgery .section-2 .step-lists-wrap .step-lists-3 span { background: url(/images/complex_surgery_step_ico_03.png) no-repeat center top; } 
#complexSurgery .section-2 .step-lists-wrap .step-lists-4 { z-index: 200; background: #a71032; max-width: 999px; width: 269px; } 
#complexSurgery .section-2 .step-lists-wrap .step-lists-4 span { background: url(/images/complex_surgery_step_ico_04.png) no-repeat center top;} 
#complexSurgery .section-2 .step-lists-wrap .step-lists-5 { z-index: 100; background: #900020; width: 269px; } 
#complexSurgery .section-2 .step-lists-wrap .step-lists-5 span { background: url(/images/complex_surgery_step_ico_05.png) no-repeat center top; right: 87px; } 

#complexSurgery .section-2.viewing .step-lists-wrap .step-lists { width: 100%; transition: width 1s linear;} 
#complexSurgery .section-2.viewing .step-lists-wrap .step-lists-2 {transition-delay: 0.2s;} 
#complexSurgery .section-2.viewing .step-lists-wrap .step-lists-3 {transition-delay: 0.4s;} 
#complexSurgery .section-2.viewing .step-lists-wrap .step-lists-4 {transition-delay: 0.6s;} 
#complexSurgery .section-2.viewing .step-lists-wrap .step-lists-5 {transition-delay: 0.8s;} 

/* section-3 */
#complexSurgery .section-3 { margin-top: 187px; text-align: center; } 
#complexSurgery .section-3 .section-tit { font-size: 48px; font-weight: bold; line-height: 1.3; } 
#complexSurgery .section-3 .section-sub-tit { margin: 56px 0 77px; font-size: 20px; } 

/* section-5 */
#complexSurgery .section-5 { margin-top: 186px; } 
#complexSurgery .section-5 .section-sub-tit { text-align: center; line-height: 1; font-size: 22px; font-weight: 500; margin-bottom: 50px; } 
#complexSurgery .section-5 .section-tit { text-align: center; font-size: 48px; line-height: 1; font-weight: bold; margin-bottom: 115px; } 
#complexSurgery .section-5 .box-wrap {background: #f6f6f6;} 
#complexSurgery .section-5 .box-wrap .container-2 {background: #f6f6f6;padding: 100px 0;}
#complexSurgery .section-5 .surgery-kind-lists li { background: #fff; border-radius: 20px; margin-bottom: 33px; padding: 52px 0 41px; position: relative; opacity:0; transform: translateY(80px);} 
#complexSurgery .section-5 .surgery-kind-lists li > img { position: absolute; top: 50%; left: 39px; transform: translateY(-50%); } 
#complexSurgery .section-5 .surgery-kind-lists li > .title { padding-left: 554px; font-size: 40px; font-weight: bold; line-height: 1; margin-bottom: 48px; } 
#complexSurgery .section-5 .surgery-kind-lists li > .circle-row { padding-left: 554px; overflow: hidden; margin-bottom: 55px; } 
#complexSurgery .section-5 .surgery-kind-lists li > .circle-row .circle { float: left; width: 202px; height: 202px; background: #900029; border-radius: 50%; text-align: center; display: flex; align-items: center; justify-content: center; color: #fff; font-size: 20px; flex-direction: column; } 
#complexSurgery .section-5 .surgery-kind-lists li > .circle-row .circle.center { margin: 0 19px; } 
#complexSurgery .section-5 .surgery-kind-lists li > .circle-row .circle strong { font-size: 27px; line-height: 1.2; } 
#complexSurgery .section-5 .surgery-kind-lists li > .contents { padding-left: 554px; font-size: 20px; padding-right: 54px; word-break: keep-all; line-height: 1.4; } 
#complexSurgery .section-5 .auto-transition-img{width: 504px;height: 502px;position: absolute;top: 50%;left: 39px;transform: translateY(-50%);background: url('/images/complex_surgery_kind_02.png');animation: imgChange 2s linear infinite;   }
#complexSurgery .section-5 .surgery-kind-lists li.viewing {opacity:1; transform: translateY(0px); transition: all 1.4s ease; ;}


@keyframes imgChange{
	0% {background: url('/images/complex_surgery_kind_02.png');}
	70% {background: url('/images/complex_surgery_kind_02_on.png');}
	100% {background: url('/images/complex_surgery_kind_02_on.png'); }
}

/* section-6 */
#complexSurgery .section-6 .container-2{ padding: 195px 0; } 
#complexSurgery .section-6 .section-6-1 .section-tit { text-align: center; font-size: 48px; line-height: 1.2; margin-bottom: 120px; } 
#complexSurgery .section-6 .section-6-1 .move-box-wrapper { width: 1000px; height: 600px; margin: 0 auto; position: relative; overflow: hidden; } 
#complexSurgery .section-6 .section-6-1 .move-box-wrapper .move-txt { position: absolute; color: #fff; font-size: 42px; font-weight: bold; line-height: 1.2; left: 70px; bottom: 190px; } 
#complexSurgery .section-6 .section-6-1 .move-box-wrapper .move-imgs {background: url("/images/complex_surgery_03.jpg");display: inline-block;width: 1257px;height: 820px;margin-top: -219px;margin-left: 0; transition: margin 1s linear;}
#complexSurgery .section-6 .section-6-1 .bottom-comment {width: 1000px;margin: 70px auto 0;font-size: 19px;color: #bcbcbc;} 
#complexSurgery .section-6 .section-6-2 {margin: 108px auto 147px;width: 1000px;}
#complexSurgery .section-6 .section-6-2 .material-list-1{margin-bottom: 45px;}
#complexSurgery .section-6 .section-6-2 .material-list > li{float: left; opacity:0; transform: translateY(80px);}
#complexSurgery .section-6 .section-6-2.viewing .material-list > li{opacity:1; transform: translateY(0px); transition: all 1s ease;}
#complexSurgery .section-6 .section-6-2.viewing .material-list > li.material-2{transition-delay: 0.2s; }
#complexSurgery .section-6 .section-6-2.viewing .material-list > li.material-3{transition-delay: 0.4s; }
#complexSurgery .section-6 .section-6-2.viewing .material-list > li.material-4{transition-delay: 0.6s; }
#complexSurgery .section-6 .section-6-2.viewing .material-list > li.material-5{transition-delay: 0.8s; }
#complexSurgery .section-6 .section-6-2.viewing .material-list > li.material-6{transition-delay: 1s; }
#complexSurgery .section-6 .section-6-2 .material-list > li.center {margin:0 11px;}
#complexSurgery .section-6 .section-6-2 .material-list > li > p{line-height: 1;font-size: 17px;text-align: center;margin-top: 19px;text-transform: uppercase;}
#complexSurgery .section-6 .section-6-3 {overflow: hidden;opacity: 0;transform: translateY(100px);} 
#complexSurgery .section-6 .section-6-3 > img { display: inline-block; padding-top: 16px; } 
#complexSurgery .section-6 .section-6-3 .right-section { display: inline-block; color: #fff; float: right; text-align: right; } 
#complexSurgery .section-6 .section-6-3 .right-section .sml { font-size: 22px; line-height: 1; margin: 17px 0 52px; } 
#complexSurgery .section-6 .section-6-3 .right-section .lrg { font-size: 48px; font-weight: bold; line-height: 1.3; margin-bottom: 80px; } 
#complexSurgery .section-6 .section-6-3 .right-section .comments { font-size: 20px; color: #bcbcbc; } 
#complexSurgery .section-6.viewing {background:#222; color: #fff; transition: all 1.4s ease;}
#complexSurgery .section-6 .section-6-3.viewing{opacity: 1; transform: translateY(0px); transition: all 1.4s ease; }

/* section-7 */
#complexSurgery .section-7 { margin-top: 200px; } 
#complexSurgery .section-7 .section-tit { text-align: center; line-height: 1; margin-bottom: 120px; } 
#complexSurgery .section-7 .section-tit .sml-txt { display: block; font-size: 22px; font-weight: 500; margin-bottom: 50px; } 
#complexSurgery .section-7 .section-tit .lrg-txt { font-size: 48px; font-weight: bold; } 
#complexSurgery .section-7 .compare-box { position: relative; } 
#complexSurgery .section-7 .compare-box-1 { height: 330px; } 
#complexSurgery .section-7 .compare-box-2 { height: 194px; } 
#complexSurgery .section-7 .compare-box-3 { height: 101px; } 
#complexSurgery .section-7 .compare-box-4 { height: 101px; } 
#complexSurgery .section-7 .compare-box-5 { height: 101px; } 
#complexSurgery .section-7 .compare-box-6 { height: 101px; } 

#complexSurgery .section-7 .compare-box .left-dir { position: absolute; left: 0; height: 100%; } 
#complexSurgery .section-7 .compare-box .right-dir { position: absolute; right: 0; height: 100%; color: #900020; font-weight: bold; } 
#complexSurgery .section-7 .compare-box .center-dir { position: absolute; left: 50%; top: 50%; transform: translate(-50%, -50%); font-size: 50px; color: #d0d0d0; font-weight: bold; } 
#complexSurgery .section-7 section.compare-box .left-dir { width: 488px; text-align: right; font-size: 24px; color: #666; padding-top: 32px; } 
#complexSurgery .section-7 section.compare-box .right-dir { width: 488px; padding-top: 32px; } 
#complexSurgery .section-7 .compare-box-2 section.left-dir { height: 100%; top: 0; padding-top: 69px; border-bottom: 1px solid #333; } 
#complexSurgery .section-7 .compare-box-2 section.left-dir .tit { font-size: 32px; font-weight: bold; line-height: 1; color: #333; } 
#complexSurgery .section-7 .compare-box-2 section.left-dir .tit span { font-size: 20px; display: block; margin-top: 20px; font-weight: 500; } 
#complexSurgery .section-7 .compare-box-2 section.right-dir { height: 100%; top: 0; top: 0; padding-top: 69px; border-bottom: 1px solid #900020; } 
#complexSurgery .section-7 .compare-box-2 section.right-dir .tit { font-size: 32px; font-weight: bold; line-height: 1; color: #900020; } 
#complexSurgery .section-7 .compare-box-2 section.right-dir .tit span { font-size: 20px; display: block; margin-top: 20px; font-weight: 500; } 
#complexSurgery .section-7 p.left-dir { border-bottom: 1px solid #eaeaea; font-size: 24px; color: #666; } 
#complexSurgery .section-7 p.right-dir { border-bottom: 1px solid #eaeaea; font-size: 24px; color: #900020; } 
#complexSurgery .section-7 .compare-box-6 p.left-dir { border-bottom: 1px solid #333; } 
#complexSurgery .section-7 .compare-box-6 p.right-dir { border-bottom: 1px solid #900020; } 
#complexSurgery .section-7 .notify-txts {margin-top: 70px;text-align: center;font-size: 20px;letter-spacing: -0.5px;}