.w1080 { width: 1080px; }
@media(max-width:990px) {
    .w1080 { width: 90%; }
}

.divline { width: 100%; height: 1px; background: var(--gray); }
.divline-point { width: 100%; height: 1px; background: var(--pointcolor); }
.divline-point-half { width: 50%; }
.divline-point-white { background: #fff; }
.section-div { position: relative; left: calc( ((100vw - var(--layoutwidthMini)) / 2) * -1 ); width: 100vw; margin: 2rem 0; }
.section-div-right { left: calc( (100vw / 2) * -1 ); z-index: -1; }
.speak-bubble { position: relative; }
.speak-bubble .after { position: absolute; width: 0px;
   height: 0px; border-style: solid; border-width: 10px 10px 0 10px; border-color: var(--pointcolor) transparent transparent transparent; transform: rotate(0deg) translateX(-50%); left: 50%; bottom: -8px;  }
@media(max-width:990px) {
    .section-div { width: 100%; left: 0; }
}

ul.point { padding: .5rem 0; }
ul.point li { position: relative; padding-left: 1rem; margin-bottom: .5rem; }
ul.point li::before { position: absolute; content: ''; width: 3px; height: 3px; background: var(--subcolor); border-radius: 50%; left: 0; top: 50%; transform: translateY(-50%);  }
ul.point li:last-child { margin-bottom: 0; }

ul.check li { position: relative; padding-left: 25px; margin-bottom: .5rem; }
ul.check li::before { position: absolute; content: url(../img/sub/img_check.png); left: 0; top: auto; }
ul.check.w li:before {filter: brightness(0) invert(1) }
ul.check li:last-child { margin-bottom: 0; }
ul.checkline li { padding: 1rem 0 1rem 25px; }
ul.checkline li:not(:last-child) { position: relative; }
ul.checkline li:not(:last-child)::after { position: absolute; content: ''; width: calc( var(--layoutwidth) / 2 ); height: 1px; background: var(--gray); bottom: 0; left: -4rem; }
@media(max-width:990px) {
    /* ul.check li::before { top: 0; } */
}

ul.counter { counter-reset: counterlist; }
ul.counter li { position: relative; padding-left: 2.5rem; margin-bottom: .5rem; }
ul.counter li::before { position: absolute; counter-increment: counterlist; content: counter(counterlist, decimal-leading-zero); left: 0; top: 0; color: var(--pointcolor); font-weight: 700; opacity: .5; }

.subway { padding: .1rem .75rem .15rem .6rem; border-radius: 1rem; color: #fff; margin: .1rem; }
.subway.sub01 { background: #a71e31; }
.subway.sub02 { background: #ff7300; }

.sec-radius { border-radius: 3rem; }
.sec-radius-md { border-radius: 2rem; }
.sec-radius-sm { border-radius: 1rem; }
.sec-radius-xs { border-radius: .5rem; }

#subTop { position: relative; width: 100%; min-height: 70vh; display: flex; align-items: center; justify-content: center; overflow: hidden; }
#subTop .subTopBg { position: absolute; width: 100%; height: 100%; top: 0; left: 0; }
#subTop .subTopBg img { width: 100%; height: auto; object-fit: cover; }
#subTop .subTopTit { text-align: center; z-index: 1; }
@media(max-width:990px) {
    #subTop { min-height: 100vh; }
    #subTop .subTopBg img { width: 100%; height: 100%; object-fit: cover; }
}

.sub .section { position: relative; }
.sub .v-line { position: absolute; width: 1px; height: 100%; background: var(--gray); top: 0; }
.sub .v-line.left { left: calc( (100% - var(--layoutwidth)) / 2 ); }
.sub .v-line.right { right: calc( (100% - var(--layoutwidth)) / 2 ); }
.sub .h-line { position: absolute; width: 100%; height: 1px; background: var(--gray); }
.sub .half-section { width: 50%; }
.sub .link_btn { position: relative; display: inline-flex; justify-content: space-between; align-items: center; min-width: 250px; padding: 1rem 3rem; border: 1px solid #000; border-radius: 2rem; margin: auto; overflow: hidden; }
.sub .link_btn::before { position: absolute; content: ''; top: 0; left: 0; width: 0; height: 100%; background: var(--BodyColor); transition: .4s; }
.sub .link_btn span, .sub .link_btn svg { transition: .3s; }
.sub .link_btn:hover::before { width: 100%; }
.sub .link_btn:hover span { color: #000; z-index: 5; }
.sub .link_btn:hover svg { fill: #000; z-index: 5; }
.sub .tabList { width: 50%; }
.sub .tabList li { border: 1px solid var(--pointcolor); color: var(--pointcolor); border-radius: 2rem; padding: .5rem 0; cursor: pointer; }
.sub .tabList li.active { background: var(--pointcolor); color: #fff; font-weight: 700; }
.sub .tabContent .tabCont { display: none; }
.sub .tabContent .tabCont.active { display: block; }
.sub .container_sm { width: 1240px; margin: auto; }
.sub .Point img { border-radius: 3rem; overflow: hidden; }
.sub .Point .txt { position: absolute; width: 50%; left: 0; top: 50%; transform: translateY(-50%); }
@media(max-width:990px){
    .sub .v-line { display: none; }
    .sub .half-section { width: 80%; --y-gap: 2.5rem; }
    .sub .link_btn { min-width: 50%; padding: 1.5rem 3rem; border-radius: 3rem; }
    .sub .tabList { width: 90%; }
    .sub .tabList li { padding: 1rem 0; border-radius: 2.5rem; }
    .sub .container_sm { width: 90%; }
    .sub .Point .txt { width: fit-content; color: #fff; top: auto; left: 50%; bottom: 10%; transform: translateX(-50%); }
    /* .sub .container > .container_mini { width: 95%; } */
}

.sub .lineBox { position: relative; }
.sub .lineBox::before, .sub .lineBox::after { position: absolute; content: ''; width: var(--layoutwidth); height: 1px; background: var(--pointcolor); left: calc( ((var(--layoutwidth) - var(--layoutwidthMini)) / 2) * -1 ); }
.sub .lineBox::before { top: 0; }
.sub .lineBox::after { bottom: 0; }
.sub .lineBox .num { position: relative; }
.sub .lineBox .num::before { position: absolute; content: ''; width: 50px; height: 50px; border: 1px solid var(--pointcolor); top: 50%; left: 50%; transform: translate(-50%,-50%) rotate(45deg); }
.sub .lineBox .num.square::before { width: 70px; height: 70px; transform: translate(-50%,-50%) rotate(0); }
.sub .lineBox .box { padding: 6rem 0 5rem; }
.sub .lineBox .box:not(:last-child) { border-right: 1px solid var(--pointcolor); }
@media(max-width:990px){
    .sub .lineBox::before, .sub .lineBox::after { opacity: 0; }
    .sub .lineBox .num { margin-bottom: 4rem; }
    .sub .lineBox .box { padding: 5rem 0 2.5rem; border-right: none !important; }
    .sub .lineBox .box:nth-child(n+2) { border-top: 1px solid var(--pointcolor); }
}

.sub .borderBox .box { border: 1px solid var(--pointcolor); border-radius: 3rem; padding: 4rem; }
.sub .borderBox_sm .box { border-radius: 2rem; padding: 2rem; }

.sub .pointBox { padding: 4rem 0; border-radius: 3rem; }
.sub .pointBox .innerLine { width: 100%; height: 1px; background: rgba(255,255,255,.5); }
.sub .pointBox ul { width: 40%; margin: auto; }
.sub .pointBox ul li .tit { min-width: 170px; margin-right: 1rem; padding: .5rem; background: #fff; border-radius: .5rem; }
@media(max-width:1540px){
    .sub .pointBox ul { width: 60%; }
}
@media(max-width:990px){
    .sub .pointBox ul { width: 90%; }
    .sub .pointBox ul li .tit { width: 45% }
    .sub .pointBox ul li .tit ~ p { width: 50%; text-align: left; }
}
@media(max-width:550px){
    .sub .pointBox ul li .tit { width: 50% }
    .sub .pointBox ul li .tit ~ p { width: 100%; text-align: left; margin-top: .5rem; }
}

.sub .sectionTableWrap { width: 100%; overflow-x: auto; }
.sub .sectionTable { border-spacing: 0; border: 1px solid var(--pointcolor); border-right: 0; border-bottom: 0; }
.sub .sectionTable th, .sub .sectionTable td { padding: 1rem 1.5rem; }
.sub .sectionTable th { background: var(--pointcolor); color: #fff; border-right: 1px solid var(--BodyColor); }
.sub .sectionTable tr th:last-child { border-right: 0; }
.sub .sectionTable td { background: #fff; color: var(--subcolor); border-right: 1px solid var(--pointcolor); border-bottom: 1px solid var(--pointcolor); }
.sub .sectionTable td.subTit { text-align: center; background: rgba(var(--pointcolor-rgb),.05); }
.sub .cusTable { width: 100%; overflow-x: auto; }
.sub .cusTable table { border-spacing: 0; border-radius: 1.5rem; overflow: hidden; }
.sub .cusTable table th, .sub .cusTable table td { padding: 1.5rem 3rem; }
.sub .cusTable table th { background: var(--pointcolor); color: #fff; }
.sub .cusTable table td { background: var(--light-gray); color: var(--subcolor); border-top: 2px dotted var(--sub2color); }
.sub .cusTable table tr:first-child td { border-top: 0; }
@media(max-width:990px){
    .sub .sectionTableWrap, .sub .cusTable { white-space: nowrap; }
}

.sub .caseNreviewSwiper::after { position: absolute; content: url(../img/sub/img_drag.png); top: 50%; left: 50%; transform: translate(-50%,-50%); z-index: 20; }
.sub .caseNreviewSwiper .swiper-slide { position: relative; min-height: 600px; height: 100%; border-radius: 2rem; overflow: hidden; padding: 4rem 2.5rem; }
.sub .caseNreviewSwiper .swiper-slide img { position: absolute; top: 0; left: 0; right: 0; bottom: 0; width: auto; height: 100%; object-fit: cover; z-index: -1; }
.sub .caseNreviewSwiper .swiper-slide .bg { position: absolute; width: 100%; height: 100%; top: 0; left: 0; right: 0; bottom: 0; background: var(--pointcolor); z-index: -1; }
.sub .caseNreviewSwiper .swiper-slide .cate { display: inline-block; background: #fff; padding: .25rem .75rem; border-radius: .5rem; }
.sub .caseNreviewSwiper .swiper-slide .date { position: absolute; top: 3.5rem; right: 2.5rem; }
.sub .caseNreviewSwiper .swiper-slide .more { position: absolute; bottom: 3.5rem; left: 2.5rem; text-shadow: 0 0 .25rem rgba(0, 0, 0, .25); }

.sub #viewInfo .view { position: relative; }
.sub #viewInfo .view .info { position: absolute; width: 100%; top: 50%; left: 50%; transform: translate(-50%,-50%); }
.sub #viewInfo .view .innerline { position: absolute; width: 100vw; height: 1px; background: var(--gray); top: 50%; left: calc( ((100vw - var(--layoutwidthMini)) / 2) * -1 ); transform: translateY(-50%); z-index: -1; }
@media(max-width:990px){
    .sub #viewInfo .view .info .lh-16 { line-height: 1.4; }
    .sub #viewInfo .view .innerline { display: none; }
}

.sub #steps .container { background: var(--light-gray); border-radius: 3rem; }
.sub #steps .philosophy_box h4.tit { width: 15%; }
.sub #steps .philosophy_box .cont { width: 85%; }
.sub #steps .philosophy_box .cont .cont-tit.relative { position: relative; z-index: 3; }
.sub #steps .philosophy_box .cont .bg-text { position: absolute; line-height: 1; top: -75%; left: 0; z-index: 1; color: #eae6e7; letter-spacing: -3px; white-space: nowrap; }
.sub #steps .philosophy_box .cont .bg-text .mask { line-height: inherit; }
.sub #steps .philosophy_box .cont .bg-text .mask1 { mask-image: linear-gradient(to bottom, #eae6e7 0%, #eae6e7 35%, transparent 55%, transparent 100%); }
.sub #steps .philosophy_box .cont .bg-text .mask2 { mask-image: linear-gradient(to bottom, #eae6e7 0%, #eae6e7 55%, transparent 75%, transparent 100%); }
.sub #steps .philosophy_box .cont .flexList { --x-gap : 2.5rem; }
.sub #steps .philosophy_box .cont .flexList .order1 { order: 1; }
.sub #steps .philosophy_box .cont .flexList .order2 { order: 2; }
@media(max-width:990px) {
    .sub #steps .philosophy_box { overflow: hidden; }
    .sub #steps .philosophy_box h4.tit { width: 50%; margin-bottom: 2rem; }
    .sub #steps .philosophy_box .cont { width: 100%; }
    .sub #steps .philosophy_box .cont .cont-tit.relative { margin-top: 4rem; }
    .sub #steps .philosophy_box .cont .bg-text { font-size: 5rem; top: -45%; }
    .sub #steps .philosophy_box .cont .bg-text .mask1 { mask-image: linear-gradient(to bottom, #eae6e7 0%, #eae6e7 55%, transparent 75%, transparent 100%); }
    .sub #steps .philosophy_box .cont .bg-text .mask2 { mask-image: linear-gradient(to bottom, #eae6e7 0%, #eae6e7 65%, transparent 85%, transparent 100%); }
    .sub #steps .philosophy_box .cont .flexList .order1 { order: 2; }
    .sub #steps .philosophy_box .cont .flexList .order2 { order: 1; }
}

.sub #vision .flexList .box { background-position: center; background-size: 100% 100%; background-repeat: no-repeat; border-radius: 3rem; overflow: hidden; transition: .5s; }
.sub #vision .flexList .box:nth-child(1) { 
    background-image: url(../img/sub/reface/img_Philosophy_vision01.png);
}
.sub #vision .flexList .box:nth-child(2) { 
    background-image: url(../img/sub/reface/img_Philosophy_vision02.png);
}
.sub #vision .flexList .box:hover { background-size: 110% 110%; }
@media(max-width:990px) {
    .sub #vision .flexList .box, .sub #vision .flexList .box:hover { background-size: cover; }
}

.sub #overview .img-lb { position: absolute; left: 0; bottom: -2rem; }
.sub #overview .img-rt { position: relative; top: 0; margin-left: auto; margin-right: 0; }
.sub #overview .flexList { --x-gap: 5rem; }
@media(max-width:990px) {
}

.sub #profile .container { position: relative; background: linear-gradient(to bottom, var(--light-gray) 0%, var(--light-gray) 75%, transparent 100%); border-radius: 3rem 3rem 0 0; overflow: hidden; }
.sub #profile .divline-v { width: 1px; min-height: 1000px; background: var(--gray); }
.sub #profile .logo-rc { position: absolute; right: -8rem; top: 50%; transform: translateY(-50%); mask-image: linear-gradient(to bottom, #eae6e7 0%, #eae6e7 40%, transparent 80%, transparent 100%); }
.sub #profile .flex-between .order1 { order: 1; }
.sub #profile .flex-between .order2 { order: 2; }
.sub #profile .flex-between .order3 { order: 3; }
@media(max-width:990px) {
    .sub #profile .flex-between { flex-wrap: wrap; }
    .sub #profile .flex-between .box { padding: 0; }
    .sub #profile .flex-between .width40 { width: 100%; }
    .sub #profile .flex-between .order1 { order: 3; }
    .sub #profile .flex-between .order3 { order: 1; }
}

.sub #space .divline-v { position: absolute; width: 1px; height: 100%; background: var(--gray); left: 50%; top: 0; transform: translateX(-50%); z-index: 0; }
.sub #space .spaceBox { position: relative; z-index: 5; }
.sub #space .spaceBox .img img { box-shadow: 0 0 1rem rgba(0,0,0,.3); }
.sub #space .spaceBox .img2 img { margin-right: 7rem; margin-left: auto; }
.sub #space .spaceBox .img3 img { margin-left: 7rem; margin-right: auto; }

@media(max-width:990px) {
    .sub #space .spaceBox .img2 img { width: 15rem; }
    .sub #space .spaceBox .img3 img { width: 22rem; margin-left: 5rem; }
}

.sub #spaceSlider .sld-navigation { position: absolute; top: 50%; transform: translateY(-50%); z-index: 5; cursor: pointer; }
.sub #spaceSlider .sld-prev { left: 5%; }
.sub #spaceSlider .sld-next { right: 5%; }
@media(max-width:990px) {
    .sub #spaceSlider .sldmethod_box -navigation { width: 60px; height: auto; }
}

@media(max-width:990px){
    .sub #Definition .img { margin-top: 2rem; }
}

.sub #Surgery3D .container { position: relative; background: linear-gradient(to bottom, #fff 0%, #fff 90%, transparent 100%); border-radius: 3rem 3rem 0 0; overflow: hidden;
}

.sub .SurMeth { --x-gap : 2rem; }
.sub #Surgery3D .philosophy_box h4.tit { width: 15%; }
.sub #Surgery3D .philosophy_box .cont { width: 85%; }
.sub #Surgery3D .philosophy_box .cont .cont-tit.relative { position: relative; z-index: 3; }
.sub #Surgery3D .philosophy_box .cont .flexList { --x-gap : 2.5rem; }
.sub #Surgery3D .philosophy_box .cont .flexList .order1 { order: 1; }
.sub #Surgery3D .philosophy_box .cont .flexList .order2 { order: 2; }
@media(max-width:990px) {
    .sub .SurMeth { --y-gap : 5rem; }
    .sub #Surgery3D .philosophy_box { overflow: hidden; }
    .sub #Surgery3D .philosophy_box h4.tit { width: 50%; margin-bottom: 2rem; }
    .sub #Surgery3D .philosophy_box .cont { width: 100%; }
    .sub #Surgery3D .philosophy_box .cont .cont-tit.relative { margin-top: 4rem; }
    .sub #Surgery3D .philosophy_box .cont .flexList .order1 { order: 2; }
    .sub #Surgery3D .philosophy_box .cont .flexList .order2 { order: 1; }
}

.sub #procedure .leftside { width: 60%; }
.sub #procedure .leftside .ctrl, .sub #procedure .leftside .thumb { width: 50%; }
.sub #procedure .ctrl li { display: flex; align-items: center; opacity: .3; transition: .5s; }
.sub #procedure .ctrl li.focus { opacity: 1; }
.sub #procedure .ctrl li:not(:last-child) { margin-bottom: 1rem; }
.sub #procedure .ctrl li .num { opacity: 0; transition: .3s; }
.sub #procedure .ctrl li.focus .num { opacity: 1; }
.sub #procedure .ctrl li .num ~ h4 { margin-left: 2rem; }
.sub #procedure .thumb { position: relative; left: -25%; z-index: -1; }
.sub #procedure .thumb li { position: absolute; opacity: 0; transition: .5s; }
.sub #procedure .thumb li.focus { opacity: 1; }
.sub #procedure .scroll-progress { position: absolute; top: 0; right: 0; width: 1px; height: 600px; background: var(--sub2color); }
.sub #procedure .scroll-progress .filler { width: 100%; height: 100%; background: var(--pointcolor); }
.sub #procedure .rightside { position: relative; width: 40%; }
.sub #procedure .info li { padding: 5rem; opacity: .5; filter: blur(3px); transition: .5s; }
.sub #procedure .info li.focus { opacity: 1; filter: blur(0); }
@media(max-width:1540px) {
    .sub #procedure .pin-spacer { width: 60% !important; }
}
@media(max-width:990px) {
    .sub #procedure .leftside { width: 55%; }
    .sub #procedure .rightside { width: 45%; }
    .sub #procedure .swiper-ctrl .swiper-pagination-bullet { display: flex; align-items: center; width: 100%; height: auto; margin: 1rem 0; background: transparent; opacity: .3; }
    .sub #procedure .swiper-ctrl .swiper-pagination-bullet .num { opacity: 0; transition: .3s; }
    .sub #procedure .swiper-ctrl .swiper-pagination-bullet h4 { margin-left: 1rem; }
    .sub #procedure .swiper-ctrl .swiper-pagination-bullet-active { background: transparent; opacity: 1; }
    .sub #procedure .swiper-ctrl .swiper-pagination-bullet-active .num { opacity: 1; }
    .sub #procedure .swiper-progress { height: 1px; background: var(--sub2color); transform-origin: left top; transform: rotate(90deg); margin-top: 2rem; margin-left: 90%; }
    .sub #procedure .swiper-progress .swiper-pagination-progressbar-fill { background: var(--pointcolor); }
}

.sub #staff .flexList { --x-gap : .00125rem; }
.sub #staff  ul.check li { margin-left: 4rem; }

.sub #Reason .container { border-radius: 3rem; }

@media(max-width:990px) {
.sub #whatType { padding-bottom: 120px !important; }
.sub #whatType .v-line { display: block; }
.sub #whatType .v-line.left { left: 5%; }
.sub #whatType .v-line.right { right: 5%; }
}

@media(max-width:990px) {
.sub #multiPiece { padding-top: 0; }
}
@media(max-width:768px) {
.sub #multiPiece .container_mini { width: 85%; padding: 80px 0; }
}

.sub #straighteningPeriod .bg-tit { padding: 1rem; border-top: 2px solid var(--subcolor); border-bottom: 1px solid var(--subcolor); background: #dbdbdb; }
.sub #straighteningPeriod .period .line { padding: .25rem 0; }
.sub #straighteningPeriod .period .line:first-child { border-radius: 2rem 0 0 2rem; }
.sub #straighteningPeriod .period .line:last-child { border-radius: 0 2rem 2rem 0; }
.sub #straighteningPeriod .period .circle { aspect-ratio: 1/1; border: 5px solid var(--pointcolor); border-radius: 50%; box-shadow: 0 0 0 .35rem var(--pointcolor); z-index: 5; }
.sub #straighteningPeriod .period-line { position: relative; width: 100%; height: 1px; background: #c2c2c2; }
.sub #straighteningPeriod .period-line .dot { position: absolute; top: 50%; transform: translateY(-50%); width: 10px; height: 10px; border-radius: 50%; }
.sub #straighteningPeriod .period-line .dot.first { left: 0; }
.sub #straighteningPeriod .period-line .dot.second { left: 50%; transform: translate(-50%,-50%); }
.sub #straighteningPeriod .period-line .dot.third { right: 0; }
@media(max-width:990px) {
    .sub #straighteningPeriod .flexList { --y-gap: 8rem; margin-bottom: 6rem; }
    .sub #straighteningPeriod .period.font-30 { font-size: 1.5rem; }
    .sub #straighteningPeriod .period .line { padding: .5rem 0; }
    .sub #straighteningPeriod .period .circle { box-shadow: 0 0 0 .4rem var(--pointcolor); }
    .sub #straighteningPeriod .period-line .dot { width: 6px; height: 6px; }
}

.sub #AtoZ .container { position: relative; background: linear-gradient(to bottom, #fff 0%, #fff 95%, transparent 100%); border-radius: 3rem 3rem 0 0; overflow: hidden; }

.sub .method_box .tit { width: 12.5%; }
.sub .method_box .cont { width: 85%; }
@media(max-width:990px) {
    .sub #AtoZ .section_mini { padding: 100px 0; }
    .sub #AtoZ .info { text-align: center; margin-bottom: 2rem; }
    .sub .method_box .tit { width: 100%; margin-bottom: 2rem; }
    .sub .method_box .cont { width: 100%; }
}


.sub #premiumCareZone { padding-top: 0; }
.sub #premiumCareZone .gradient-title { background-image: linear-gradient(to bottom, rgba(var(--pointcolor-rgb),.1) 0%, rgba(var(--pointcolor-rgb),.1) 45%, transparent 75%, transparent 100%); background-clip: text; -webkit-background-clip: text; color: transparent; }
.sub .systems .flexList .img { width: 40%; border-radius: 2rem; overflow: hidden; }
.sub .systems .flexList .txt { width: 58%; padding: 0 2.5rem; }
.sub .systems .flexList .txt .wrap { width: 100%; }
.sub .systems .flexList .txt .line { width: 100%; height: 1px; background: #fff; }
@media(max-width:990px) {
    .sub #premiumCareZone { padding-top: 80px; }
    .sub #premiumCareZone .gradient-title {  background-image: linear-gradient(to bottom, rgba(var(--pointcolor-rgb),.1) 0%, rgba(var(--pointcolor-rgb),.1) 45%, transparent 85%, transparent 100%); font-size: 3.5rem; text-align: center; }
    .sub .systems .flexList { --y-gap: 3rem; }
    .sub .systems .flexList .img, .sub .systems .flexList .txt { width: 100%; }
    .sub .systems .flexList .img { border-radius: 3rem; }
    .sub .systems .flexList .txt { margin-top: 2rem; padding: 4rem 2rem; }
}

.sub #reason .container_mini .h-line { position: absolute; width: var(--layoutwidth); height: 1px; background: var(--gray); top: 50%; left: calc( ((var(--layoutwidth) - 100%) / 2)*-1 ); transform: translateY(-50%); z-index: -1; }
.sub #reason .horizontal-line { position: absolute; top: 0; left: 0; width: 100%; height: 1px; background: var(--gray); }
.sub #reason .horizontal-line.line-bottom { top: auto; bottom: 0; }
@media(max-width:990px) {
    .sub #reason .container_mini { width: 100%; }
    .sub #reason .flexList .box { padding: 1rem 3rem; }
    .sub #reason .container_mini .h-line,
    .sub #reason .horizontal-line.line-bottom { display: none; }
}

.sub #Wbox .container { position: relative; background: linear-gradient(to bottom, #fff 0%, #fff 90%, transparent 100%); border-radius: 3rem 3rem 0 0; overflow: hidden; }

/* CardSwiper */
.sub .Swipers { position: relative; display: flex; }
.sub .prcCardSwiper { width: 50%; margin-left: 0; border-radius: 2rem; overflow: hidden; }
.sub .prcInfoSwiper { position: absolute; right: 0; bottom: -5rem; width: 60%; }
.sub .prcInfoSwiper .swiper-slide { width: 100%; background: var(--light-gray); padding: 5rem; }
.sub .prcInfoSwiper .swiper-nav { position: absolute; display: flex; align-items: center; bottom: 2rem; right: 3rem; z-index: 5; }
.sub .prcInfoSwiper .swiper-nav .swiper-nav-prev,
.sub .prcInfoSwiper .swiper-nav .swiper-nav-next {
    cursor: pointer;
}
.sub .prcInfoSwiper .swiper-logo { position: absolute; right: 1rem; top: 1rem; z-index: 5; }
@media(max-width:990px) {
    .sub .Swipers { flex-wrap: wrap; }
    .sub .prcCardSwiper, .sub .prcInfoSwiper { width: 100%; }
    .sub .prcCardSwiper { border-radius: 2rem 2rem 0 0; }
    .sub .prcInfoSwiper { position: relative; right: auto; bottom: 0; }
    .sub .prcInfoSwiper .swiper-slide { padding: 6rem 3rem; }
    .sub .prcInfoSwiper .swiper-logo { width: 25%; }
    .sub .prcInfoSwiper .swiper-nav svg { width: 24px; height: 24px; }
}

/* beforeNafter */
.beafSwiper  .beafPics { position: relative; }
.beafSwiper  .beafPics .beforeImg, .beafSwiper  .beafPics .afterImg { width: 50%; }
.beafSwiper  .beafPics .beafLock { position: absolute; width: 100%; height: 100%; background: rgba(0, 0, 0, .9); top: 0; left: 0; }
.beafSwiper  .beafPics .img-outer, .beafSwiper  .beafPics .img-inner { position: absolute; top: 50%; left: 50%; transform: translate(-50%,-50%); }
.beafSwiper  .beafPics .img-outer img { animation: rotate 30s linear infinite; }
.beafSwiper  .beafPics .img-inner { width: 100px; height: 100px; background: var(--pointcolor); border-radius: 50%; display: flex; align-items: center; justify-content: center; }
.beafSwiper h6 { margin-top: 2.5rem; }
.beafSwiper ~ .paginationBox { position: relative; }
.beafSwiper ~ .paginationBox .beafPagination { position: absolute; bottom: 0; margin-top: 4rem; background: #dfdfdf; }
.beafSwiper ~ .paginationBox .beafPagination .swiper-pagination-progressbar-fill { background: var(--pointcolor); }
@media(max-width:990px){
    .beafSwiper  .beafPics .beafLock p { font-size: 1.75rem; margin-top: 1.25rem; }
    .beafSwiper  .beafBox { width: 90%; margin: auto; }
    .beafSwiper  .beafPics { flex-wrap: wrap; }
    .beafSwiper  .beafPics .beforeImg, .beafSwiper  .beafPics .afterImg { width: 100%; }
    .beafSwiper  .beafPics .img-outer img { width: 100px; height: 100px; }
    .beafSwiper  .beafPics .img-inner { width: 70px; height: 70px; }
    .beafSwiper  .beafPics .img-inner svg { width: 30px; height: 30px; }
}