@charset "utf-8"; /******************************************************** .product_detail_responsive > 상세페이지 전용 css *******************************************************/ img.product_detail_img_mb { display: none; } img.product_detail_img_tb { display: none; } img.product_detail_img_pc { display: initial; } @media all and (max-width: 1180px) { img.product_detail_img_mb { display: none; } img.product_detail_img_tb { display: initial; } img.product_detail_img_pc { display: none; } } @media all and (max-width: 768px) { img.product_detail_img_mb { display: initial; } img.product_detail_img_tb { display: none; } img.product_detail_img_pc { display: none; } } /******************************************************** #phantom_rovo > 팬텀 로보 전용 css *******************************************************/ #phantom_rovo * {font-family: 'Bodyfriend_Sans_Regular';} #phantom_rovo video { width: 100%; } #phantom_rovo .content_text{width: 100%;} #phantom_rovo .title_text{font-size: 24px; font-weight: 700; line-height: 38px; text-align: center; /* font-family: 'NotoSansKR-Bold'; */} #phantom_rovo .content .bg_video, #phantom_rovo .content .bg_img__pad, #phantom_rovo .content .bg_img__nopad {position: relative;} #phantom_rovo .content .inner_content{position: absolute; top: 0; z-index: 1;} /* slide 1 */ #phantom_rovo .content.content1 { height: 1000px; overflow:hidden;} #phantom_rovo .content.content1 .content_text{position: absolute; top: 3%; height: 93%; display: flex; flex-direction: column; justify-content: space-between;} #phantom_rovo .content.content1 .bg_video {height: 100%;} #phantom_rovo .content.content1 .bg_video .video_center_cont {overflow:hidden; background: black; display: flex; justify-content: center; align-items: center;} #phantom_rovo .content.content1 .bg_video .video_center_cont video{max-height: 100%; width: auto; height: 100%; } #phantom_rovo .content.content1 .content_text p{font-size: 45px; line-height: 75px; text-align: center; color: #ffffff; font-weight: 700; /* font-family: 'NotoSansKR-Bold'; */} #phantom_rovo .content.content1 .content_text p.sub_text{font-size: 26px; line-height: 51px; font-weight: 500;} #phantom_rovo .content.content1 .content_text p.sub_text_btm{margin-bottom: 40px;} #phantom_rovo .content.content1 .center_img{display: flex; justify-content: center;align-items:center; } #phantom_rovo .content.content1 .center_img > img {width: 30%; height: 100%; object-fit: contain;} @media screen and (max-width: 1180px) { #phantom_rovo .content.content1 .content_text p{font-size: 44px; line-height: 70px;} #phantom_rovo .content.content1 .content_text p.sub_text{font-size: 21px; line-height: 48px;} #phantom_rovo .content.content1 .bg_video .video_center_cont video{max-height: 100%;} } @media screen and (max-width: 900px) { #phantom_rovo .content.content1 { height: 800px; } #phantom_rovo .content.content1 .content_text p{font-size: 32px; line-height: 54px;} #phantom_rovo .content.content1 .content_text p.sub_text{font-size: 15px; line-height: 40px;} } @media screen and (max-width: 768px) { #phantom_rovo .content.content1 { height: 1000px; } #phantom_rovo .content.content1 .content_text p{font-size: 45px; line-height: 75px;} #phantom_rovo .content.content1 .content_text p.sub_text{font-size: 24px; line-height: 52px;} #phantom_rovo .content.content1 .bg_video .video_center_cont video{max-height: 100%;} } @media screen and (max-width: 640px) { #phantom_rovo .content.content1 { height: 850px; } #phantom_rovo .content.content1 .content_text p{font-size: 38px; line-height: 60px;} #phantom_rovo .content.content1 .content_text p.sub_text{font-size: 18px; line-height: 43px;} #phantom_rovo .content.content1 .content_text p.sub_text_btm{margin-bottom: 30px;} } @media screen and (max-width: 500px) { #phantom_rovo .content.content1 { height: 700px; } #phantom_rovo .content.content1 .content_text p{font-size: 28px; line-height: 46px;} #phantom_rovo .content.content1 .content_text p.sub_text{font-size: 15px; line-height: 40px;} #phantom_rovo .content.content1 .content_text p.sub_text_btm{margin-bottom: 20px;} } @media screen and (max-width: 360px) { #phantom_rovo .content.content1 { height: 550px; } #phantom_rovo .content.content1 .content_text p{font-size: 20px; line-height: 36px;} #phantom_rovo .content.content1 .content_text p.sub_text{font-size: 10px; line-height: 35px;} } /*ani*/ #phantom_rovo .content1.offsetCon .sub_text, #phantom_rovo .content1.offsetCon .con_txt > p, #phantom_rovo .content1.offsetCon .center_img{transform:translateY(100%);opacity: 0;transition:all 1.8s;overflow: hidden; } #phantom_rovo .content1.offsetCon .con_txt > p:nth-of-type(1){transition-delay:1.0s;} #phantom_rovo .content1.offsetCon .con_txt > p:nth-of-type(2){transition-delay:1.8s;} #phantom_rovo .content1.offsetCon .con_txt > p:nth-of-type(3){transition-delay:2.6s;} #phantom_rovo .content1.offsetCon .con_txt > p:nth-of-type(4){transition-delay:3.8s;} #phantom_rovo .content1.offsetCon .con_txt > p:nth-of-type(5){transition-delay:4.8s;} #phantom_rovo .content1.offsetCon .con_txt > p:nth-of-type(6){transition-delay:5.8s;} #phantom_rovo .content1.offsetCon .con_txt > p:nth-of-type(7){transition-delay:6.8s;} #phantom_rovo .content1.offsetCon .con_txt > p:nth-of-type(8){transition-delay:7.8s;} #phantom_rovo .content1.offsetCon .center_img{transition-delay:8.6s;} #phantom_rovo .content1.offsetCon.on .sub_text, #phantom_rovo .content1.offsetCon.on .con_txt > p, #phantom_rovo .content1.offsetCon.on .center_img {transform:translateY(0);opacity: 1;} /* slide 2 */ #phantom_rovo .content .bg_img__pad {margin: 35px;} #phantom_rovo .content.content2 .inner_content{ padding: 40px 40px 50px; top: 0; width: 100%; height: 100%; display: flex; flex-direction: column; justify-content: space-between;} #phantom_rovo .content.content2 .content_text p:first-child{color: #E2C8B9; font-size: 40px; line-height: 1.2;} #phantom_rovo .content.content2 .content_text p:nth-child(2){font-size: 90px; line-height: 1.4; font-weight: 700; margin-bottom: 20px;} #phantom_rovo .content.content2 .content_text p.sub_text{font-size: 30px; line-height: 1.6; color: #636468;} #phantom_rovo .content.content2 .content2_tilted_img{position: absolute; right: 0; mix-blend-mode: darken;top: 49%; transform: translateY(-50%);} #phantom_rovo .content.content2 .cont_circle_cont {width: 100%; display: flex;justify-content:center; align-items: center;transform: scale(1.05);} /* #phantom_rovo .content.content2 .cont_circle_cont > img {width: 33.3%; margin: -2%;} */ #phantom_rovo .content.content2 .cont_circle_cont .bg_circle_cont {position:relative; width: 33.3%; margin: -2%;} #phantom_rovo .content.content2 .cont_circle_cont .bg_circle_cont img.circle_stroke{position:absolute;top:0;left:0;animation: rotateClockwise 3s linear infinite;} @media screen and (max-width: 1180px) { #phantom_rovo .content .bg_img__pad {margin: 33px;} #phantom_rovo .content.content2 .inner_content{padding: 40px 40px 50px;} #phantom_rovo .content.content2 .content_text p:first-child{font-size: 30px; } #phantom_rovo .content.content2 .content_text p:nth-child(2){font-size: 77px; margin-bottom: 18px;} #phantom_rovo .content.content2 .content_text p.sub_text{font-size: 25px; } } @media screen and (max-width: 900px) { #phantom_rovo .content .bg_img__pad {margin: 23px;} #phantom_rovo .content.content2 .inner_content{padding: 30px 30px 40px;} #phantom_rovo .content.content2 .content_text p:first-child{font-size: 21px; } #phantom_rovo .content.content2 .content_text p:nth-child(2){font-size: 51px; margin-bottom: 13px;} #phantom_rovo .content.content2 .content_text p.sub_text{font-size: 18px;} } @media screen and (max-width: 768px) { #phantom_rovo .content .bg_img__pad {margin: 25px;} #phantom_rovo .content.content2 .inner_content{padding: 40px 40px 50px;} #phantom_rovo .content.content2 .content_text p:first-child{font-size: 30px; } #phantom_rovo .content.content2 .content_text p:nth-child(2){font-size: 76px; margin-bottom: 18px;} #phantom_rovo .content.content2 .content_text p.sub_text{font-size:26px;} } @media screen and (max-width: 640px){ #phantom_rovo .content .bg_img__pad {margin: 20px;} #phantom_rovo .content.content2 .inner_content{padding: 30px 30px 40px;} #phantom_rovo .content.content2 .content_text p:first-child{font-size: 23px; } #phantom_rovo .content.content2 .content_text p:nth-child(2){font-size: 60px; margin-bottom: 12px;} #phantom_rovo .content.content2 .content_text p.sub_text{font-size: 18px; } } @media screen and (max-width: 500px){ #phantom_rovo .content .bg_img__pad {margin: 17px;} #phantom_rovo .content.content2 .inner_content{padding: 25px 25px 35px;} #phantom_rovo .content.content2 .content_text p:first-child{font-size: 17px; } #phantom_rovo .content.content2 .content_text p:nth-child(2){font-size: 43px; margin-bottom:11px;} #phantom_rovo .content.content2 .content_text p.sub_text{font-size: 15px; } } @media screen and (max-width: 391px) { #phantom_rovo .content .bg_img__pad {margin: 13px;} #phantom_rovo .content.content2 .inner_content{padding: 18px 18px 28px;} #phantom_rovo .content.content2 .content_text p:first-child{font-size: 15px; } #phantom_rovo .content.content2 .content_text p:nth-child(2){font-size: 39px; margin-bottom: 8px; } #phantom_rovo .content.content2 .content_text p.sub_text{font-size: 14px;} } @media screen and (max-width: 320px) { #phantom_rovo .content .bg_img__pad {margin: 10px;} #phantom_rovo .content.content2 .inner_content{padding: 15px 15px 20px;} #phantom_rovo .content.content2 .content_text p:first-child{font-size: 13px; } #phantom_rovo .content.content2 .content_text p:nth-child(2){font-size: 32px; margin-bottom: 5px; } #phantom_rovo .content.content2 .content_text p.sub_text{font-size: 11px;} } /*ani*/ #phantom_rovo .content2.offsetCon .content_text > p {transform:translateY(-100%);opacity: 0;transition:all 1.8s;overflow: hidden;display: block;} #phantom_rovo .content2.offsetCon .cont_circle_cont .bg_circle_cont{transform:translateY(100%);opacity: 0;transition:all 1.5s;overflow: hidden;display: block;} #phantom_rovo .content2.offsetCon .content2_tilted_img {opacity: 0; transition: opacity 2.5s; overflow: hidden;display: block;} #phantom_rovo .content2.offsetCon .content_text > p:nth-of-type(1){transition-delay:.3s;} #phantom_rovo .content2.offsetCon .content_text > p:nth-of-type(2){transition-delay:.8s;} #phantom_rovo .content2.offsetCon .content_text > p:nth-of-type(3){transition-delay:1.6s;} #phantom_rovo .content2.offsetCon .content_text > p:nth-of-type(4){transition-delay:1.6s;} #phantom_rovo .content2.offsetCon .content_text > p:nth-of-type(5){transition-delay:1.6s;} #phantom_rovo .content2.offsetCon .content2_tilted_img {transition-delay:2.2s;} #phantom_rovo .content2.offsetCon .cont_circle_cont .bg_circle_cont:nth-child(1) {transition-delay:3.0s;} #phantom_rovo .content2.offsetCon .cont_circle_cont .bg_circle_cont:nth-child(2) {transition-delay:3.6s;} #phantom_rovo .content2.offsetCon .cont_circle_cont .bg_circle_cont:nth-child(3) {transition-delay:4.2s;} #phantom_rovo .content2.offsetCon.on .content_text > p, #phantom_rovo .content2.offsetCon.on .cont_circle_cont .bg_circle_cont{transform:translateY(0);opacity: 1;} #phantom_rovo .content2.offsetCon.on .content2_tilted_img{opacity: 1;} /* slide 3 */ /* slide 4 */ #phantom_rovo .content.content4 {background-color: #000000; color: #ffffff; text-align: center; padding-top: 5px;} #phantom_rovo .content.content4 .part {margin-top: 50px;} #phantom_rovo .content.content4 .part span{ padding: 6px 8px; font-size: 17px; line-height: 20px; font-weight: 300; border: 1px solid #fff; border-radius: 50%; } #phantom_rovo .content.content4 .part_title {font-weight: 700; font-size: 55px; line-height: 75px;} #phantom_rovo .content.content4 .part_title.btm_title {margin-bottom: 30px;} #phantom_rovo .content.content4 .part_content{font-size: 32px; line-height: 52px; color: #8A8C92; } #phantom_rovo .content.content4 .part_content.btm_content {margin-bottom: 30px;} #phantom_rovo .content.content4 .part_link {position: relative; font-size: 22px; font-weight: 700; } #phantom_rovo .content.content4 .part .video_align {position: relative; display: flex; width: 100%;} #phantom_rovo .content.content4 .part .video_align::after {position: absolute; content: ""; width: 100%; height: 10%; background: linear-gradient(180deg, #000000, transparent);} #phantom_rovo .content.content4 .part_text_cont {margin: 35px 0;} @media screen and (max-width: 1180px) { #phantom_rovo .content.content4 .part {margin-top: 40px;} #phantom_rovo .content.content4 .part span{ padding: 5px 7px; font-size: 15px; } #phantom_rovo .content.content4 .part_text_cont {margin: 25px 0;} #phantom_rovo .content.content4 .part_title {font-size: 45px; line-height: 63px;} #phantom_rovo .content.content4 .part_title.btm_title {margin-bottom: 23px;} #phantom_rovo .content.content4 .part_content{font-size: 27px; line-height: 44px;} #phantom_rovo .content.content4 .part_content.btm_content { margin-bottom: 25px;} } @media screen and (max-width: 900px) { #phantom_rovo .content.content4 .part {margin-top: 25px;} #phantom_rovo .content.content4 .part span{ padding: 3px 5px; font-size: 9px; } #phantom_rovo .content.content4 .part_text_cont {margin: 20px 0;} #phantom_rovo .content.content4 .part_title {font-size: 34px; line-height: 47px;} #phantom_rovo .content.content4 .part_title.btm_title {margin-bottom: 15px;} #phantom_rovo .content.content4 .part_content{font-size: 20px; line-height: 34px;} #phantom_rovo .content.content4 .part_content.btm_content { margin-bottom: 22px;} } @media screen and (max-width: 768px) { #phantom_rovo .content.content4 .part {margin-top: 40px;} #phantom_rovo .content.content4 .part span{ padding: 6px 8px; font-size: 17px; } #phantom_rovo .content.content4 .part_text_cont {margin: 30px 0;} #phantom_rovo .content.content4 .part_title {font-size: 35px; line-height: 50px;} #phantom_rovo .content.content4 .part_title.btm_title {margin-bottom: 20px;} #phantom_rovo .content.content4 .part_content{font-size: 22px; line-height: 37px;} #phantom_rovo .content.content4 .part_content.btm_content { margin-bottom: 20px;} } @media screen and (max-width: 500px) { #phantom_rovo .content.content4 .part {margin-top: 15px;} #phantom_rovo .content.content4 .part span{ padding: 3px 5px; font-size: 9px; } #phantom_rovo .content.content4 .part_text_cont {margin: 20px 0;} #phantom_rovo .content.content4 .part_title {font-size: 25px; line-height: 35px;} #phantom_rovo .content.content4 .part_title.btm_title {margin-bottom: 15px;} #phantom_rovo .content.content4 .part_content{font-size: 15px; line-height: 25px;} #phantom_rovo .content.content4 .part_content.btm_content { margin-bottom: 10px;} } @media screen and (max-width: 360px) { #phantom_rovo .content.content4 .part {margin-top: 10px;} #phantom_rovo .content.content4 .part span{ padding: 2px 4px; font-size: 6px; } #phantom_rovo .content.content4 .part_text_cont {margin: 15px 0;} #phantom_rovo .content.content4 .part_title.btm_title {margin-bottom: 10px;} #phantom_rovo .content.content4 .part_title {font-size: 18px; line-height: 26px;} #phantom_rovo .content.content4 .part_content{font-size: 12px; line-height: 20px;} #phantom_rovo .content.content4 .part_content.btm_content { margin-bottom: 10px;} } /*ani*/ #phantom_rovo .content4 .part.offsetCon > span, #phantom_rovo .content4 .part.offsetCon .part_text_cont > p {transform:translateY(-100%);opacity: 0;transition:all 1.5s;overflow: hidden;} #phantom_rovo .content4 .part.offsetCon .video_align {opacity: 0;transition:all 1.5s;overflow: hidden;} #phantom_rovo .content4 .part.offsetCon > span {transition-delay:.5s;} #phantom_rovo .content4 .part.offsetCon .part_text_cont > p:nth-of-type(1) {transition-delay:.5s;} #phantom_rovo .content4 .part.offsetCon .part_text_cont > p:nth-of-type(2) {transition-delay:.5s;} #phantom_rovo .content4 .part.offsetCon .part_text_cont > p:nth-of-type(3) {transition-delay:1.1s;} #phantom_rovo .content4 .part.offsetCon .part_text_cont > p:nth-of-type(4) {transition-delay:1.1s;} #phantom_rovo .content4 .part.offsetCon .part_text_cont > p:nth-of-type(5) {transition-delay:1.1s;} #phantom_rovo .content4 .part.offsetCon .video_align {transition-delay:1.7s;} #phantom_rovo .content4 .part.offsetCon.on > span, #phantom_rovo .content4 .part.offsetCon.on .part_text_cont > p {transform:translateY(0);opacity: 1;} #phantom_rovo .content4 .part.offsetCon.on .video_align {opacity: 1;} /* slide 5 */ #phantom_rovo .content.content5 {padding: 60px;} #phantom_rovo .content.content5 .content_title {font-weight: 700; text-align: center;} #phantom_rovo .content.content5 .content_title p:nth-child(1), #phantom_rovo .content.content5 .content_title p:nth-child(2) {font-size: 49px; } #phantom_rovo .content.content5 .content_title p:nth-child(3) { font-size: 33px; color: #A7A9AC; margin: 25px; font-weight: 400;} #phantom_rovo .content.content5 .card_cont {display: flex; flex-direction: column; align-items: center;} #phantom_rovo .content.content5 .card_cont .card_img_cont { width: 100%; margin: 12px 0; position: relative; font-weight: 700; } #phantom_rovo .content.content5 .card_cont .card_img_cont > img { } #phantom_rovo .content.content5 .card_cont .card_img_cont .card_text { position: absolute; top: 50%; left: 6%; transform: translateY(-50%);} #phantom_rovo .content.content5 .card_cont .card_img_cont .card_text p{font-size:37px; line-height: 1.6;} #phantom_rovo .content.content5 .card_cont .card_img_cont .card_text ul { margin-top: 15px;} #phantom_rovo .content.content5 .card_cont .card_img_cont .card_text ul li{font-size: 28px; line-height: 1.6; position: relative; padding-left: 20px; font-weight: 400; color: #636468;} #phantom_rovo .content.content5 .card_cont .card_img_cont .card_text ul li::before{position: absolute; content: "·"; top: 0; left: 0;} @media screen and (max-width: 1180px) { #phantom_rovo .content.content5 {padding: 40px; } #phantom_rovo .content.content5 .content_title p:nth-child(1), #phantom_rovo .content.content5 .content_title p:nth-child(2) {font-size: 38px; } #phantom_rovo .content.content5 .content_title p:nth-child(3) { font-size: 24px; margin: 25px;} #phantom_rovo .content.content5 .card_cont .card_img_cont { margin: 12px 0; } #phantom_rovo .content.content5 .card_cont .card_img_cont .card_text p{font-size:28px;} #phantom_rovo .content.content5 .card_cont .card_img_cont .card_text ul { margin-top: 11px;} #phantom_rovo .content.content5 .card_cont .card_img_cont .card_text ul li {font-size: 23px; padding-left: 19px;} } @media screen and (max-width: 900px) { #phantom_rovo .content.content5 {padding: 30px; } #phantom_rovo .content.content5 .content_title p:nth-child(1), #phantom_rovo .content.content5 .content_title p:nth-child(2) {font-size: 30px; } #phantom_rovo .content.content5 .content_title p:nth-child(3) { font-size: 19px; margin: 18px;} #phantom_rovo .content.content5 .card_cont .card_img_cont { margin: 7px 0;} #phantom_rovo .content.content5 .card_cont .card_img_cont .card_text p{font-size: 22px; } #phantom_rovo .content.content5 .card_cont .card_img_cont .card_text ul { margin-top: 7px;} #phantom_rovo .content.content5 .card_cont .card_img_cont .card_text ul li {font-size: 17px; padding-left: 15px;} } @media screen and (max-width: 768px) { #phantom_rovo .content.content5 {padding: 50px; } #phantom_rovo .content.content5 .content_title p:nth-child(1), #phantom_rovo .content.content5 .content_title p:nth-child(2) {font-size: 40px; } #phantom_rovo .content.content5 .content_title p:nth-child(3) { font-size: 26px; margin: 23px;} #phantom_rovo .content.content5 .card_cont .card_img_cont { margin: 12px 0; } #phantom_rovo .content.content5 .card_cont .card_img_cont .card_text p{font-size: 30px;} #phantom_rovo .content.content5 .card_cont .card_img_cont .card_text ul { margin-top: 8px;} #phantom_rovo .content.content5 .card_cont .card_img_cont .card_text ul li {font-size: 24px; padding-left: 25px;} } @media screen and (max-width: 640px) { #phantom_rovo .content.content5 {padding: 40px; } #phantom_rovo .content.content5 .content_title p:nth-child(1), #phantom_rovo .content.content5 .content_title p:nth-child(2) {font-size: 30px; } #phantom_rovo .content.content5 .content_title p:nth-child(3) { font-size: 21px; margin: 18px;} #phantom_rovo .content.content5 .card_cont .card_img_cont { margin: 8px 0; } #phantom_rovo .content.content5 .card_cont .card_img_cont .card_text p{font-size: 23px;} #phantom_rovo .content.content5 .card_cont .card_img_cont .card_text ul { margin-top: 6px;} #phantom_rovo .content.content5 .card_cont .card_img_cont .card_text ul li {font-size: 17px; padding-left: 15px;} } @media screen and (max-width: 500px){ #phantom_rovo .content.content5 {padding: 30px; } #phantom_rovo .content.content5 .content_title p:nth-child(1), #phantom_rovo .content.content5 .content_title p:nth-child(2) {font-size: 23px; } #phantom_rovo .content.content5 .content_title p:nth-child(3) { font-size: 16px; margin: 13px;} #phantom_rovo .content.content5 .card_cont .card_img_cont { margin: 8px 0; } #phantom_rovo .content.content5 .card_cont .card_img_cont .card_text p{font-size: 18px;} #phantom_rovo .content.content5 .card_cont .card_img_cont .card_text ul { margin-top: 4px;} #phantom_rovo .content.content5 .card_cont .card_img_cont .card_text ul li {font-size: 15px; padding-left: 13px;} } @media screen and (max-width: 391px) { #phantom_rovo .content.content5 .content_title p:nth-child(1), #phantom_rovo .content.content5 .content_title p:nth-child(2) {font-size: 21px; } #phantom_rovo .content.content5 .content_title p:nth-child(3) { font-size: 15px; margin: 13px;} #phantom_rovo .content.content5 .card_cont .card_img_cont .card_text p{font-size: 17px; } #phantom_rovo .content.content5 .card_cont .card_img_cont .card_text ul li {font-size: 13px; padding-left: 12px; } } @media screen and (max-width: 360px) { #phantom_rovo .content.content5 {padding: 20px; } #phantom_rovo .content.content5 .content_title p:nth-child(1), #phantom_rovo .content.content5 .content_title p:nth-child(2) {font-size: 16px; } #phantom_rovo .content.content5 .content_title p:nth-child(3) { font-size: 12px; margin: 8px;} #phantom_rovo .content.content5 .card_cont .card_img_cont { margin: 10px;} #phantom_rovo .content.content5 .card_cont .card_img_cont .card_text p{font-size: 12px;} #phantom_rovo .content.content5 .card_cont .card_img_cont .card_text ul { margin-top: 0;} #phantom_rovo .content.content5 .card_cont .card_img_cont .card_text ul li {font-size: 10px; padding-left: 8px; } } /*ani*/ #phantom_rovo .content5.offsetCon .content_title > p {transform:translateY(-100%);opacity: 0;transition:all 1.5s;overflow: hidden;} #phantom_rovo .content5.offsetCon .card_img_cont {opacity: 0;transition:all 1.5s;overflow: hidden;} #phantom_rovo .content5.offsetCon .content_title > p:nth-of-type(3){transition-delay:.5s;} #phantom_rovo .content5.offsetCon .card_cont .card_img_cont:nth-child(1) {transition-delay:1.2s;} #phantom_rovo .content5.offsetCon .card_cont .card_img_cont:nth-child(2) {transition-delay:1.8s;} #phantom_rovo .content5.offsetCon .card_cont .card_img_cont:nth-child(3) {transition-delay:2.6s;} #phantom_rovo .content5.offsetCon .card_cont .card_img_cont:nth-child(4) {transition-delay:3.2s;} #phantom_rovo .content5.offsetCon.on .content_title > p {transform:translateY(0);opacity: 1;} #phantom_rovo .content5.offsetCon.on .card_img_cont {opacity: 1;} /* slide 6 */ #phantom_rovo .content.content6 {text-align: center; position: relative; } #phantom_rovo .content.content6 .absol_content { width: 100%;} #phantom_rovo .content.content6 .absol_img {position: absolute; bottom: 1.5%; left: 0;} #phantom_rovo .content.content6 .absol_text_top{position: absolute; top: 1%; left: 0;} #phantom_rovo .content.content6 .absol_text_mid{position: absolute; top: 14%; left: 0;display:flex; justify-content:center;} #phantom_rovo .content.content6 .absol_text_btm{position: absolute; top: 22.5%; left: 0; } #phantom_rovo .content.content6 .sub_text{font-size: 36px; line-height: 60px; color: #636468; } #phantom_rovo .content.content6 .line_vertical{height: 80px; width: 1px; background: #636468;opacity: 0.6;} #phantom_rovo .content.content6 .title_text{ font-size: 58px; line-height: 86px; font-weight: 700;} #phantom_rovo .content.content6 .inner_content{width: 100%; display: flex; flex-direction: column; align-items: center;} @media screen and (max-width: 1180px) { #phantom_rovo .content.content6 .sub_text{font-size: 36px; line-height: 60px;} #phantom_rovo .content.content6 .line_vertical{ height: 70px; } #phantom_rovo .content.content6 .title_text{ font-size: 58px; line-height: 85px;} } @media screen and (max-width: 1024px) { #phantom_rovo .content.content6 .sub_text{font-size: 31px; line-height: 52px;} #phantom_rovo .content.content6 .line_vertical{ height: 65px; } #phantom_rovo .content.content6 .title_text{ font-size: 49px; line-height: 74px;} } @media screen and (max-width: 900px) { #phantom_rovo .content.content6 .sub_text{font-size: 24px; line-height: 40px;} #phantom_rovo .content.content6 .line_vertical{ height: 48px; } #phantom_rovo .content.content6 .title_text{ font-size: 41px; line-height: 60px; } } @media screen and (max-width: 768px) { #phantom_rovo .content.content6 .sub_text{font-size: 34px; line-height: 58px;} #phantom_rovo .content.content6 .line_vertical{ height: 73px; } #phantom_rovo .content.content6 .title_text{ font-size: 53px; line-height: 77px;} } @media screen and (max-width: 640px){ #phantom_rovo .content.content6 .sub_text{font-size: 28px; line-height: 45px;} #phantom_rovo .content.content6 .line_vertical{ height: 55px; } #phantom_rovo .content.content6 .title_text{ font-size: 50px; line-height: 73px;} } @media screen and (max-width: 600px){ #phantom_rovo .content.content6 .sub_text{font-size: 24px; line-height: 38px;} #phantom_rovo .content.content6 .line_vertical{ height: 44px; } #phantom_rovo .content.content6 .title_text{ font-size: 41px; line-height: 60px;} } @media screen and (max-width: 500px){ #phantom_rovo .content.content6 .sub_text{font-size: 18px; line-height: 28px;} #phantom_rovo .content.content6 .line_vertical{ height: 32px;} #phantom_rovo .content.content6 .title_text{ font-size: 29px; line-height: 41px; } } @media screen and (max-width: 360px) { #phantom_rovo .content.content6 .sub_text{font-size: 15px; line-height: 24px;} #phantom_rovo .content.content6 .line_vertical{ height: 27px; } #phantom_rovo .content.content6 .title_text{ font-size: 24px; line-height: 35px; } } @media screen and (max-width: 320px) { #phantom_rovo .content.content6 .sub_text{font-size: 13px; line-height: 20px;} #phantom_rovo .content.content6 .line_vertical{ height: 25px; } #phantom_rovo .content.content6 .title_text{ font-size: 21px; line-height: 30px; } } /*ani*/ #phantom_rovo .content6.offsetCon .absol_text_top > p, #phantom_rovo .content6.offsetCon .absol_text_mid > div, #phantom_rovo .content6.offsetCon .absol_text_btm > p {transform:translateY(-100%);opacity: 0;transition:all 1.2s;overflow: hidden;} #phantom_rovo .content6.offsetCon .bg_img__nopad, #phantom_rovo .content6.offsetCon .absol_img {opacity: 0;transition:all 1.3s;overflow: hidden;} #phantom_rovo .content6.offsetCon .bg_img__nopad, #phantom_rovo .content6.offsetCon .absol_text_top > p:nth-of-type(2){transition-delay:.5s;} #phantom_rovo .content6.offsetCon .absol_text_mid > div {transition-delay:1.1s;} #phantom_rovo .content6.offsetCon .absol_text_btm > p:nth-of-type(1) {transition-delay:1.8s;} #phantom_rovo .content6.offsetCon .absol_text_btm > p:nth-of-type(2) {transition-delay:2.4s;} #phantom_rovo .content6.offsetCon .absol_text_btm > p:nth-of-type(3) {transition-delay:3.0s;} #phantom_rovo .content6.offsetCon .absol_img {transition-delay:3.6s;} #phantom_rovo .content6.offsetCon.on .absol_text_top > p, #phantom_rovo .content6.offsetCon.on .absol_text_mid > div, #phantom_rovo .content6.offsetCon.on .absol_text_btm > p {transform:translateY(0);opacity: 1;} #phantom_rovo .content6.offsetCon.on .bg_img__nopad, #phantom_rovo .content6.offsetCon.on .absol_img {opacity: 1;} /* slide 7 */ #phantom_rovo .content.content7 {} #phantom_rovo .content.content7 .bg_black{position: relative; background-color: #000000; overflow:hidden;} #phantom_rovo .content.content7 .bg_black > img {animation: scaleUpDown 5.0s .5s infinite alternate; position: absolute; top: 0; left: 0; width: 100%; height: auto;z-index:0;} #phantom_rovo .content.content7 .inner_container{ padding: 100px 0 70px; display: flex; flex-direction: column; justify-content: center; text-align: center;} #phantom_rovo .content.content7 .inner_container .small_text{font-size: 40px; line-height: 75px; color: #677794;} #phantom_rovo .content.content7 .inner_container .text_area { z-index: 1;} #phantom_rovo .content.content7 .inner_container .text_area > .title_text{font-size: 115px; line-height: 160px; margin-bottom: 60px; color: #ffffff;font-weight: 900; } #phantom_rovo .content.content7 .inner_container .sub_text{font-size: 33px; line-height: 55px;color: #ffffff;} #phantom_rovo .content.content7 .inner_container .slide_down_arr{margin: 60px 0 65px; display: flex; justify-content: center; align-items: center;} #phantom_rovo .content.content7 .inner_container .slide_down_arr img{width:5%; animation: moveUpDown 2s .5s infinite alternate;} #phantom_rovo .content.content7 .inner_container .card_cont { z-index: 1;} #phantom_rovo .content.content7 .inner_container .card_cont .part{margin: 30px 65px; padding: 50px; border-radius: 20px; display: flex; flex-direction: column; background-color: #ffffff;} #phantom_rovo .content.content7 .inner_container .card_cont .part > span{font-size: 27px; padding: 10px 0; line-height: 1.2; position:relative; color: #BDBDBD;} #phantom_rovo .content.content7 .inner_container .card_cont .part > span::after{bottom: 0; position: absolute; content: ""; width: 6%; height: 1px; background-color:#BDBDBD;left: 50%; transform: translateX(-50%);} #phantom_rovo .content.content7 .inner_container .card_cont .part > p.sub_title_text {font-size: 30px; line-height: 1.2; margin-top: 41px; color: #8A8C92;} #phantom_rovo .content.content7 .inner_container .card_cont .part > p.title_text {font-size: 66px; line-height: 110px; font-weight: 700; color: #000000; } #phantom_rovo .content.content7 .inner_container .card_cont .part .sub_text_cont { margin: 20px 0 30px; } #phantom_rovo .content.content7 .inner_container .card_cont .part .sub_text_cont > p {font-size: 23px; line-height: 34px; color: #7A705A;} #phantom_rovo .content.content7 .inner_container .card_cont .part .video_center_cont {margin: 0; display: flex;justify-content: center; } #phantom_rovo .content.content7 .inner_container .card_cont .part .video_center_cont video{border-radius: 20px; width: 100%;} @media screen and (max-width: 1180px) { #phantom_rovo .content.content7 .inner_container{padding: 100px 0 80px;} #phantom_rovo .content.content7 .inner_container .small_text{font-size: 30px; line-height: 55px;} #phantom_rovo .content.content7 .inner_container .text_area > .title_text{font-size: 100px; line-height: 145px; margin-bottom: 40px;} #phantom_rovo .content.content7 .inner_container .sub_text{font-size: 25px; line-height: 40px;} #phantom_rovo .content.content7 .inner_container .slide_down_arr{margin: 55px 0 60px;} #phantom_rovo .content.content7 .inner_container .card_cont .part{margin: 25px 50px; padding:35px; border-radius:20px;} #phantom_rovo .content.content7 .inner_container .card_cont .part > span{font-size: 25px; padding: 7px 0; } #phantom_rovo .content.content7 .inner_container .card_cont .part > p.sub_title_text {font-size: 23px; margin-top: 37px; } #phantom_rovo .content.content7 .inner_container .card_cont .part > p.title_text {font-size: 52px; line-height: 86px; } #phantom_rovo .content.content7 .inner_container .card_cont .part .sub_text_cont { margin: 16px 0 22px; } #phantom_rovo .content.content7 .inner_container .card_cont .part .sub_text_cont > p{font-size: 18px; line-height: 30px; } #phantom_rovo .content.content7 .inner_container .card_cont .part .video_center_cont video{border-radius: 20px; } } @media screen and (max-width: 900px) { #phantom_rovo .content.content7 .inner_container{padding: 85px 0 60px;} #phantom_rovo .content.content7 .inner_container .small_text{font-size: 24px; line-height: 40px;} #phantom_rovo .content.content7 .inner_container .text_area > .title_text{font-size: 85px; line-height: 125px; margin-bottom: 30px;} #phantom_rovo .content.content7 .inner_container .sub_text{font-size: 19px; line-height: 33px;} #phantom_rovo .content.content7 .inner_container .slide_down_arr{margin: 45px 0 50px;} #phantom_rovo .content.content7 .inner_container .card_cont .part{margin: 15px 32px; padding: 27px; border-radius:15px;} #phantom_rovo .content.content7 .inner_container .card_cont .part > span{font-size: 19px;padding: 5px 0; } #phantom_rovo .content.content7 .inner_container .card_cont .part > p.sub_title_text {font-size: 18px; margin-top: 29px; } #phantom_rovo .content.content7 .inner_container .card_cont .part > p.title_text {font-size: 42px; line-height: 67px;} #phantom_rovo .content.content7 .inner_container .card_cont .part .sub_text_cont { margin: 11px 0 16px; } #phantom_rovo .content.content7 .inner_container .card_cont .part .sub_text_cont > p{font-size: 15px; line-height: 22px; } #phantom_rovo .content.content7 .inner_container .card_cont .part .video_center_cont video{border-radius: 15px; } } @media screen and (max-width: 768px) { #phantom_rovo .content.content7 .inner_container{padding: 120px 0 80px;} #phantom_rovo .content.content7 .inner_container .small_text{font-size: 31px; line-height: 55px;} #phantom_rovo .content.content7 .inner_container .text_area > .title_text{font-size: 105px; line-height: 145px; margin-bottom: 50px;} #phantom_rovo .content.content7 .inner_container .sub_text{font-size: 25px; line-height: 40px;} #phantom_rovo .content.content7 .inner_container .slide_down_arr{margin: 60px 0 65px;} #phantom_rovo .content.content7 .inner_container .card_cont .part{margin: 25px 50px; padding:40px; border-radius:20px;} #phantom_rovo .content.content7 .inner_container .card_cont .part > span{font-size: 22px; padding: 7px 0; } #phantom_rovo .content.content7 .inner_container .card_cont .part > p.sub_title_text {font-size: 25px; margin-top: 35px; } #phantom_rovo .content.content7 .inner_container .card_cont .part > p.title_text {font-size: 57px; line-height: 85px;} #phantom_rovo .content.content7 .inner_container .card_cont .part .sub_text_cont { margin: 19px 0 24px; } #phantom_rovo .content.content7 .inner_container .card_cont .part .sub_text_cont > p {font-size: 19px; line-height: 30px; } #phantom_rovo .content.content7 .inner_container .card_cont .part .video_center_cont video{border-radius: 20px; } } @media screen and (max-width: 640px){ #phantom_rovo .content.content7 .inner_container{padding: 100px 0 60px;} #phantom_rovo .content.content7 .inner_container .small_text{font-size: 26px; line-height: 50px;} #phantom_rovo .content.content7 .inner_container .text_area > .title_text{font-size: 80px; line-height: 101px; margin-bottom: 40px;} #phantom_rovo .content.content7 .inner_container .sub_text{font-size: 21px; line-height: 33px;} #phantom_rovo .content.content7 .inner_container .slide_down_arr{margin: 40px 0 45px;} #phantom_rovo .content.content7 .inner_container .card_cont .part{margin: 20px 40px;padding:30px; border-radius:15px;} #phantom_rovo .content.content7 .inner_container .card_cont .part > span{font-size: 18px; padding: 8px 0; } #phantom_rovo .content.content7 .inner_container .card_cont .part > p.sub_title_text {font-size: 19px; margin-top: 32px; } #phantom_rovo .content.content7 .inner_container .card_cont .part > p.title_text {font-size: 44px; line-height: 65px; } #phantom_rovo .content.content7 .inner_container .card_cont .part .sub_text_cont { margin: 15px 0 20px; } #phantom_rovo .content.content7 .inner_container .card_cont .part .sub_text_cont > p {font-size: 16px; line-height: 24px; } #phantom_rovo .content.content7 .inner_container .card_cont .part .video_center_cont video{border-radius: 15px; } } @media screen and (max-width: 500px){ #phantom_rovo .content.content7 .inner_container{padding: 65px 0 20px;} #phantom_rovo .content.content7 .inner_container .small_text{font-size: 18px; line-height: 32px;} #phantom_rovo .content.content7 .inner_container .text_area > .title_text{font-size: 55px; line-height: 74px; margin-bottom:30px;} #phantom_rovo .content.content7 .inner_container .sub_text{font-size: 14px; line-height: 25px;} #phantom_rovo .content.content7 .inner_container .slide_down_arr{margin: 35px 0 40px;} #phantom_rovo .content.content7 .inner_container .card_cont .part{margin: 10px 28px; padding: 20px; border-radius:10px;} #phantom_rovo .content.content7 .inner_container .card_cont .part > span{font-size: 12px; padding: 5px 0;} #phantom_rovo .content.content7 .inner_container .card_cont .part > p.sub_title_text {font-size: 13px; margin-top: 23px; } #phantom_rovo .content.content7 .inner_container .card_cont .part > p.title_text {font-size: 31px; line-height: 50px;} #phantom_rovo .content.content7 .inner_container .card_cont .part .sub_text_cont { margin: 12px 0 17px; } #phantom_rovo .content.content7 .inner_container .card_cont .part .sub_text_cont > p {font-size: 11px; line-height: 18px; } #phantom_rovo .content.content7 .inner_container .card_cont .part .video_center_cont video{border-radius: 10px; } } @media screen and (max-width: 360px) { #phantom_rovo .content.content7 .inner_container{padding: 45px 0 20px;} #phantom_rovo .content.content7 .inner_container .small_text{font-size: 14px; line-height: 33px;} #phantom_rovo .content.content7 .inner_container .text_area > .title_text{font-size: 45px; line-height: 55px; margin-bottom: 20px;} #phantom_rovo .content.content7 .inner_container .sub_text{font-size: 12px; line-height: 21px;} #phantom_rovo .content.content7 .inner_container .slide_down_arr{margin: 25px 0 30px;} #phantom_rovo .content.content7 .inner_container .card_cont .part{margin: 7px 20px; padding: 13px; border-radius:8px;} #phantom_rovo .content.content7 .inner_container .card_cont .part > span{font-size: 11px; padding: 3px 0;} #phantom_rovo .content.content7 .inner_container .card_cont .part > p.sub_title_text {font-size: 11px; margin-top: 17px; } #phantom_rovo .content.content7 .inner_container .card_cont .part > p.title_text {font-size: 25px; line-height: 40px;} #phantom_rovo .content.content7 .inner_container .card_cont .part .sub_text_cont { margin: 10px 0 15px; } #phantom_rovo .content.content7 .inner_container .card_cont .part .sub_text_cont > p {font-size: 10px; line-height: 16px; } #phantom_rovo .content.content7 .inner_container .card_cont .part .video_center_cont video{border-radius: 8px; } } /*ani*/ #phantom_rovo .content7 .inner_container.offsetCon .text_area > p, #phantom_rovo .content7 .card_cont.offsetCon .part > span, #phantom_rovo .content7 .card_cont.offsetCon .part p {transform:translateY(100%);opacity: 0;transition:all 1.5s;overflow: hidden;} #phantom_rovo .content7 .card_cont.offsetCon .part, #phantom_rovo .content7 .card_cont.offsetCon .part > .video_center_cont {opacity: 0;transition:all 1.5s;overflow: hidden;} #phantom_rovo .content7 .inner_container.offsetCon .text_area p:nth-of-type(2) {transition-delay:.6s;} #phantom_rovo .content7 .inner_container.offsetCon .text_area p:nth-of-type(3) {transition-delay:1.2s;} #phantom_rovo .content7 .inner_container.offsetCon .text_area p:nth-of-type(4) {transition-delay:1.8s;} #phantom_rovo .content7 .inner_container.offsetCon .text_area p:nth-of-type(5) {transition-delay:2.6s;} #phantom_rovo .content7 .card_cont.offsetCon .part > span {transition-delay:.1s;} #phantom_rovo .content7 .card_cont.offsetCon .part p:nth-of-type(1) {transition-delay:.6s;} #phantom_rovo .content7 .card_cont.offsetCon .part p:nth-of-type(2) {transition-delay:1.2s;} #phantom_rovo .content7 .card_cont.offsetCon .part .sub_text_cont > p:nth-of-type(1), #phantom_rovo .content7 .card_cont.offsetCon .part .sub_text_cont > p:nth-of-type(2), #phantom_rovo .content7 .card_cont.offsetCon .part .sub_text_cont > p:nth-of-type(3){transition-delay:1.8s;} #phantom_rovo .content7 .card_cont.offsetCon .part .video_center_cont {transition-delay:2.6s;} #phantom_rovo .content7 .inner_container.offsetCon.on .text_area > p, #phantom_rovo .content7 .card_cont.offsetCon.on .part > span, #phantom_rovo .content7 .card_cont.offsetCon.on .part p {transform:translateY(0);opacity: 1;} #phantom_rovo .content7 .card_cont.offsetCon.on .part, #phantom_rovo .content7 .card_cont.offsetCon.on .part > .video_center_cont {opacity: 1;} /* slide 8 */ #phantom_rovo .content8 {background-color: #F0F0F0; padding: 30px; text-align: center;} #phantom_rovo .content8 .detail_card{ background: #ffffff; border-radius: 30px;margin-bottom: 30px;filter: drop-shadow(0px 0px 10px rgba(0, 0, 0, 0.1));} #phantom_rovo .content8 .detail_card .detail_card_top > span{padding: 0 25px;font-size: 24px;line-height: 1.6; margin:50px 0 0px; display:inline-block; border: 1px solid #B78568; border-radius: 30px; color:#B78568;} #phantom_rovo .content8 .detail_card .detail_card_top > h3{font-size: 60px; line-height: 1.3;font-weight:700;} #phantom_rovo .content8 .detail_card .detail_card_top .sub_text{margin: 25px 0 30px;} #phantom_rovo .content8 .detail_card .detail_card_top .sub_text p{font-size: 30px; line-height: 1.6; color: #636468;} #phantom_rovo .content8 .detail_card .detail_card_top .rovo-slider {margin: 20px 0; display: flex; flex-wrap: nowrap; overflow-x: auto; justify-content: flex-start; white-space: nowrap;} #phantom_rovo .content8 .detail_card .detail_card_top .rovo-slider .rovo-slide {overflow:hidden;border-radius:10px; box-shadow: 0px 3px 10px rgba(0, 0, 0, 0.12);margin: 8px;} #phantom_rovo .content8 .detail_card .detail_card_top .rovo-slider .rovo-slide .rovo-slide_top{position: relative;} #phantom_rovo .content8 .detail_card .detail_card_top .rovo-slider .rovo-slide .rovo-slide_top .rovo-slide_text{width:100%;height: 100%;position: absolute; top: 0; left: 0;} #phantom_rovo .content8 .detail_card .detail_card_top .rovo-slider .rovo-slide .rovo-slide_top span{font-size:12px; line-height: 1.4; color:#DAA383;text-decoration:underline;display:inline-block;margin: 20px 0 10px;} #phantom_rovo .content8 .detail_card .detail_card_top .rovo-slider .rovo-slide .rovo-slide_top h4{font-size:28px; line-height: 1.5; color:#B4724C;margin-bottom:5px;} #phantom_rovo .content8 .detail_card .detail_card_top .rovo-slider .rovo-slide .rovo-slide_top p{font-size:12px; line-height: 1.5; color:#636468; } #phantom_rovo .content8 .detail_card .detail_card_top .rovo-slider .rovo-slide .rovo-slide_top p:nth-of-type(2){font-weight:700;} #phantom_rovo .content8 .detail_card .detail_card_top .rovo-slider .rovo-slide .rovo-slide_btm{display: flex; justify-content:center; align-items:center; } #phantom_rovo .content8 .detail_card .detail_card_top .rovo-slider .rovo-slide .rovo-slide_btm > div {padding:0 35px; border:1px solid #B78568; border-radius:50px; margin:12px 0;} #phantom_rovo .content8 .detail_card .detail_card_top .rovo-slider .rovo-slide .rovo-slide_btm > div a {display:block; font-size: 12px; line-height:2.3;font-weight:700;color:#B78568;} #phantom_rovo .content8 .detail_card .detail_card_btm video{display:block; border-radius: 0 0 30px 30px;} @media screen and (max-width: 1180px) { #phantom_rovo .content8 {padding: 25px;} #phantom_rovo .content8 .detail_card{ margin-bottom: 25px; border-radius: 25px;} #phantom_rovo .content8 .detail_card .detail_card_btm video{border-radius: 0 0 25px 25px;} #phantom_rovo .content8 .detail_card .detail_card_top > span{font-size: 17px; padding: 0 17px; margin: 40px 0 0px;} #phantom_rovo .content8 .detail_card .detail_card_top > h3 {font-size: 47px; } #phantom_rovo .content8 .detail_card .detail_card_top .sub_text{margin: 20px 0 25px;} #phantom_rovo .content8 .detail_card .detail_card_top .sub_text p {font-size: 23px; } } @media screen and (max-width: 900px) { #phantom_rovo .content8 {padding: 22px;} #phantom_rovo .content8 .detail_card{ margin-bottom: 22px; border-radius: 20px;} #phantom_rovo .content8 .detail_card .detail_card_btm video{border-radius: 0 0 20px 20px;} #phantom_rovo .content8 .detail_card .detail_card_top > span{font-size: 13px;padding: 0 13px; margin:30px 0 0px;} #phantom_rovo .content8 .detail_card .detail_card_top > h3 {font-size: 35px; } #phantom_rovo .content8 .detail_card .detail_card_top .sub_text{margin: 18px 0 23px;} #phantom_rovo .content8 .detail_card .detail_card_top .sub_text p {font-size: 18px; } } @media screen and (max-width: 768px) { #phantom_rovo .content8 {padding: 28px;} #phantom_rovo .content8 .detail_card{ margin-bottom: 28px; border-radius: 25px;} #phantom_rovo .content8 .detail_card .detail_card_btm video{border-radius: 0 0 25px 25px;} #phantom_rovo .content8 .detail_card .detail_card_top > span{padding: 0 20px;font-size: 20px;margin: 50px 0 0px;} #phantom_rovo .content8 .detail_card .detail_card_top > h3 {font-size: 53px; } #phantom_rovo .content8 .detail_card .detail_card_top .sub_text{margin: 25px 0 30px;} #phantom_rovo .content8 .detail_card .detail_card_top .sub_text p {font-size: 28px; } } @media screen and (max-width: 640px){ #phantom_rovo .content8 {padding: 22px;} #phantom_rovo .content8 .detail_card{ margin-bottom: 22px; border-radius: 20px;} #phantom_rovo .content8 .detail_card .detail_card_btm video{border-radius: 0 0 20px 20px;} #phantom_rovo .content8 .detail_card .detail_card_top > span{padding: 0 16px;font-size: 16px;margin: 35px 0 0px;} #phantom_rovo .content8 .detail_card .detail_card_top > h3 {font-size: 40px; } #phantom_rovo .content8 .detail_card .detail_card_top .sub_text{margin: 20px 0 25px;} #phantom_rovo .content8 .detail_card .detail_card_top .sub_text p {font-size: 19px; } } @media screen and (max-width: 500px){ #phantom_rovo .content8 {padding: 18px;} #phantom_rovo .content8 .detail_card{ margin-bottom: 18px; border-radius: 13px;} #phantom_rovo .content8 .detail_card .detail_card_btm video{border-radius: 0 0 13px 13px;} #phantom_rovo .content8 .detail_card .detail_card_top > span{padding: 0 12px;font-size: 12px;margin: 25px 0 0px;} #phantom_rovo .content8 .detail_card .detail_card_top > h3 {font-size: 27px; } #phantom_rovo .content8 .detail_card .detail_card_top .sub_text{margin: 10px 0 20px;} #phantom_rovo .content8 .detail_card .detail_card_top .sub_text p {font-size: 14px; } } @media screen and (max-width: 360px) { #phantom_rovo .content8 {padding: 15px;} #phantom_rovo .content8 .detail_card{ margin-bottom: 15px; border-radius:10px;} #phantom_rovo .content8 .detail_card .detail_card_btm video{border-radius: 0 0 10px 10px;} #phantom_rovo .content8 .detail_card .detail_card_top > span{padding: 0 10px;font-size: 10px;margin: 20px 0 0px;} #phantom_rovo .content8 .detail_card .detail_card_top > h3 {font-size: 20px;} #phantom_rovo .content8 .detail_card .detail_card_top .sub_text{margin: 8px 0 16px;} #phantom_rovo .content8 .detail_card .detail_card_top .sub_text p {font-size: 10px; } } /*ani*/ #phantom_rovo .content8 .detail_card.offsetCon .detail_card_top > span, #phantom_rovo .content8 .detail_card.offsetCon .detail_card_top > h3, #phantom_rovo .content8 .detail_card.offsetCon .detail_card_top .sub_text{transform:translateY(100%);opacity: 0;transition:all 1.7s;overflow: hidden; } #phantom_rovo .content8 .detail_card.offsetCon .detail_card_top .rovo-slider, #phantom_rovo .content8 .detail_card.offsetCon .detail_card_btm video{opacity: 0;transition:all 1.8s;overflow: hidden; } #phantom_rovo .content8 .detail_card.offsetCon .detail_card_top > h3{transition-delay:0.6s;} #phantom_rovo .content8 .detail_card.offsetCon .detail_card_top .sub_text{transition-delay:1.2s;} #phantom_rovo .content8 .detail_card.offsetCon .detail_card_btm video{transition-delay:1.8s;} #phantom_rovo .content8 .detail_card.slider_card.offsetCon .detail_card_top .rovo-slider {transition-delay:1.8s;} #phantom_rovo .content8 .detail_card.slider_card.offsetCon .detail_card_btm video{transition-delay:2.4s;} #phantom_rovo .content8. .detail_card.slider_card.offsetCon .detail_card_btm video{transition-delay:3.0s;} #phantom_rovo .content8 .detail_card.offsetCon.on .detail_card_top > span, #phantom_rovo .content8 .detail_card.offsetCon.on .detail_card_top > h3, #phantom_rovo .content8 .detail_card.offsetCon.on .detail_card_top .sub_text{transform:translateY(0);opacity: 1;} #phantom_rovo .content8 .detail_card.offsetCon.on .detail_card_top .rovo-slider, #phantom_rovo .content8 .detail_card.offsetCon.on .detail_card_btm video{opacity: 1;} /******************************************************** #the_cruise > 더크루즈 전용 css *******************************************************/ #the_cruise * {font-family: 'Bodyfriend_Sans_Regular';} #the_cruise video { width: 100%; } #the_cruise .content_text{width: 100%;} #the_cruise .title_text{font-size: 24px; font-weight: 700; line-height: 38px; text-align: center;} #the_cruise .content .bg_video, #the_cruise .content .bg_img__pad, #the_cruise .content .bg_img__nopad {position: relative;} #the_cruise .content .inner_content{position: absolute; top: 0; z-index: 1;} /* slide 1 */ #the_cruise .content.content1 .content_text{position: absolute; top: 3%; height: 93%; display: flex; flex-direction: column; justify-content: space-between;} #the_cruise .content.content1 .bg_video .video_center_cont {overflow:hidden; background: black; display: flex; justify-content: center; align-items: center;} #the_cruise .content.content1 .bg_video .video_center_cont video{max-height: 100%; width: auto; height: 100%; } #the_cruise .content.content1 .content_text p{font-size: 45px; line-height: 75px; text-align: center; color: #ffffff; font-weight: 700; } #the_cruise .content.content1 .content_text p.sub_text{font-size: 26px; line-height: 51px; font-weight: 500;} #the_cruise .content.content1 .content_text p.sub_text_btm{margin-bottom: 40px;} #the_cruise .content.content1 .center_img{display: flex; justify-content: center;align-items:center; } #the_cruise .content.content1 .center_img > img {width: 25%; height: 100%; object-fit: contain;} @media screen and (max-width: 1180px) { #the_cruise .content.content1 .content_text p{font-size: 44px; line-height: 70px;} #the_cruise .content.content1 .content_text p.sub_text{font-size: 21px; line-height: 48px;} #the_cruise .content.content1 .bg_video .video_center_cont video{max-height: 100%;} } @media screen and (max-width: 900px) { #the_cruise .content.content1 .content_text p{font-size: 32px; line-height: 54px;} #the_cruise .content.content1 .content_text p.sub_text{font-size: 15px; line-height: 40px;} #the_cruise .content.content1 .bg_video .video_center_cont video{max-height: 800px;} } @media screen and (max-width: 768px) { #the_cruise .content.content1 .content_text p{font-size: 50px; line-height: 80px;} #the_cruise .content.content1 .content_text p.sub_text{font-size: 24px; line-height: 52px;} #the_cruise .content.content1 .bg_video .video_center_cont video{max-height: 100%;} } @media screen and (max-width: 640px) { #the_cruise .content.content1 .content_text p{font-size: 38px; line-height: 60px;} #the_cruise .content.content1 .content_text p.sub_text{font-size: 18px; line-height: 43px;} #the_cruise .content.content1 .content_text p.sub_text_btm{margin-bottom: 30px;} #the_cruise .content.content1 .bg_video .video_center_cont video{max-height: 900px;} } @media screen and (max-width: 500px) { #the_cruise .content.content1 .content_text p{font-size: 28px; line-height: 46px;} #the_cruise .content.content1 .content_text p.sub_text{font-size: 15px; line-height: 40px;} #the_cruise .content.content1 .content_text p.sub_text_btm{margin-bottom: 20px;} #the_cruise .content.content1 .bg_video .video_center_cont video{max-height: 800px;} } @media screen and (max-width: 360px) { #the_cruise .content.content1 .content_text p{font-size: 20px; line-height: 36px;} #the_cruise .content.content1 .content_text p.sub_text{font-size: 10px; line-height: 35px;} #the_cruise .content.content1 .bg_video .video_center_cont video{max-height: 600px;} } /*ani*/ #the_cruise .content1.offsetCon .sub_text, #the_cruise .content1.offsetCon .con_txt > p, #the_cruise .content1.offsetCon .center_img{transform:translateY(100%);opacity: 0;transition:all 1.8s;overflow: hidden; } #the_cruise .content1.offsetCon .con_txt > p:nth-of-type(1){transition-delay:1.0s;} #the_cruise .content1.offsetCon .con_txt > p:nth-of-type(2){transition-delay:1.8s;} #the_cruise .content1.offsetCon .con_txt > p:nth-of-type(3){transition-delay:2.8s;} #the_cruise .content1.offsetCon .con_txt > p:nth-of-type(4){transition-delay:3.8s;} #the_cruise .content1.offsetCon .con_txt > p:nth-of-type(5){transition-delay:4.8s;} #the_cruise .content1.offsetCon .con_txt > p:nth-of-type(6){transition-delay:5.8s;} #the_cruise .content1.offsetCon .con_txt > p:nth-of-type(7){transition-delay:7.0s;} #the_cruise .content1.offsetCon .con_txt > p:nth-of-type(8){transition-delay:7.8s;} #the_cruise .content1.offsetCon .con_txt > p:nth-of-type(9){transition-delay:8.6s;} #the_cruise .content1.offsetCon .center_img{transition-delay:9.4s;} #the_cruise .content1.offsetCon.on .sub_text, #the_cruise .content1.offsetCon.on .con_txt > p, #the_cruise .content1.offsetCon.on .center_img {transform:translateY(0);opacity: 1;} /* slide 2 */ #the_cruise .content .bg_img__pad {margin: 35px;} #the_cruise .content.content2 .inner_content{ padding: 40px; color: #ffffff; top: 0; width: 100%; height: 100%; display: flex; flex-direction: column; justify-content: space-between;} #the_cruise .content.content2 .content_text p:first-child{color: #E2C8B9; font-size: 40px; line-height: 1;} #the_cruise .content.content2 .content_text p:nth-child(2){font-size: 90px; line-height: 120px; font-weight: 700; margin-bottom: 20px;} #the_cruise .content.content2 .content_text p.sub_text{font-size: 30px; line-height: 50px;} #the_cruise .content.content2 .cont_circle_cont {width: 100%; display: flex;justify-content:center; align-items: center;} #the_cruise .content.content2 .cont_circle_cont > img {width: 33.3%; margin: -2%;} @media screen and (max-width: 1180px) { #the_cruise .content .bg_img__pad {margin: 33px;} #the_cruise .content.content2 .inner_content{padding: 40px;} #the_cruise .content.content2 .content_text p:first-child{font-size: 30px; } #the_cruise .content.content2 .content_text p:nth-child(2){font-size: 77px; line-height: 100px; margin-bottom: 18px;} #the_cruise .content.content2 .content_text p.sub_text{font-size: 25px; line-height: 42px;} } @media screen and (max-width: 900px) { #the_cruise .content .bg_img__pad {margin: 23px;} #the_cruise .content.content2 .inner_content{padding: 30px;} #the_cruise .content.content2 .content_text p:first-child{font-size: 21px; } #the_cruise .content.content2 .content_text p:nth-child(2){font-size: 51px; line-height: 70px; margin-bottom: 13px;} #the_cruise .content.content2 .content_text p.sub_text{font-size: 18px; line-height: 31px;} } @media screen and (max-width: 768px) { #the_cruise .content .bg_img__pad {margin: 25px;} #the_cruise .content.content2 .inner_content{padding: 40px;} #the_cruise .content.content2 .content_text p:first-child{font-size: 30px; } #the_cruise .content.content2 .content_text p:nth-child(2){font-size: 76px; line-height: 110px; margin-bottom: 18px;} #the_cruise .content.content2 .content_text p.sub_text{font-size:26px; line-height: 43px;} } @media screen and (max-width: 640px){ #the_cruise .content .bg_img__pad {margin: 20px;} #the_cruise .content.content2 .inner_content{padding: 30px;} #the_cruise .content.content2 .content_text p:first-child{font-size: 23px; } #the_cruise .content.content2 .content_text p:nth-child(2){font-size: 60px; line-height: 80px; margin-bottom: 12px;} #the_cruise .content.content2 .content_text p.sub_text{font-size: 18px; line-height: 33px;} } @media screen and (max-width: 500px){ #the_cruise .content .bg_img__pad {margin: 17px;} #the_cruise .content.content2 .inner_content{padding: 27px;} #the_cruise .content.content2 .content_text p:first-child{font-size: 17px; } #the_cruise .content.content2 .content_text p:nth-child(2){font-size: 43px; line-height: 55px; margin-bottom:11px;} #the_cruise .content.content2 .content_text p.sub_text{font-size: 14px; line-height: 24px;} } @media screen and (max-width: 360px) { #the_cruise .content .bg_img__pad {margin: 13px;} #the_cruise .content.content2 .inner_content{padding: 18px;} #the_cruise .content.content2 .content_text p:first-child{font-size: 15px; } #the_cruise .content.content2 .content_text p:nth-child(2){font-size: 39px; line-height: 50px; margin-bottom: 8px; } #the_cruise .content.content2 .content_text p.sub_text{font-size: 14px; line-height: 22px;} } @media screen and (max-width: 320px) { #the_cruise .content .bg_img__pad {margin: 10px;} #the_cruise .content.content2 .inner_content{padding: 15px;} #the_cruise .content.content2 .content_text p:first-child{font-size: 13px; } #the_cruise .content.content2 .content_text p:nth-child(2){font-size: 32px; line-height: 46px; margin-bottom: 5px; } #the_cruise .content.content2 .content_text p.sub_text{font-size: 11px; line-height: 18px;} } /*ani*/ #the_cruise .content2.offsetCon .content_text > p {transform:translateY(-100%);opacity: 0;transition:all 1.8s;overflow: hidden;display: block;} #the_cruise .content2.offsetCon .cont_circle_cont > img {transform:translateY(100%);opacity: 0;transition:all 1.5s;overflow: hidden;display: block;} #the_cruise .content2.offsetCon .content_text > p:nth-of-type(2){transition-delay:.8s;} #the_cruise .content2.offsetCon .content_text > p:nth-of-type(3){transition-delay:1.6s;} #the_cruise .content2.offsetCon .content_text > p:nth-of-type(4){transition-delay:1.6s;} #the_cruise .content2.offsetCon .content_text > p:nth-of-type(5){transition-delay:1.6s;} #the_cruise .content2.offsetCon .cont_circle_cont > img:nth-child(1) {transition-delay:2.2s;} #the_cruise .content2.offsetCon .cont_circle_cont > img:nth-child(2) {transition-delay:2.8s;} #the_cruise .content2.offsetCon .cont_circle_cont > img:nth-child(3) {transition-delay:3.4s;} #the_cruise .content2.offsetCon.on .content_text > p, #the_cruise .content2.offsetCon.on .cont_circle_cont > img {transform:translateY(0);opacity: 1;} /* slide 3 */ /* slide 4 */ #the_cruise .content.content4 {background-color: #000000; color: #ffffff; text-align: center; padding-top: 5px;} #the_cruise .content.content4 .part {margin-top: 50px;} #the_cruise .content.content4 .part span{ padding: 6px 8px; font-size: 17px; line-height: 20px; font-weight: 300; border: 1px solid #fff; border-radius: 50%; /* font-family: 'NotoSansKR-Light'; */} #the_cruise .content.content4 .part_title {font-weight: 700; font-size: 55px; line-height: 75px; } #the_cruise .content.content4 .part_title.btm_title {margin-bottom: 30px;} #the_cruise .content.content4 .part_content{font-size: 32px; line-height: 52px; color:#8A8C92;} #the_cruise .content.content4 .part_content.btm_content {margin-bottom: 30px;} #the_cruise .content.content4 .part_link {position: relative; font-size: 22px; font-weight: 700; } #the_cruise .content.content4 .bg_img_cont_grad {background: linear-gradient(180deg, rgba(130, 130, 130, 0) 0%, #E8BF90 100%);} #the_cruise .content.content4 .bg_img_cont_grad img {width: 100%; object-fit: contain;} #the_cruise .content.content4 .part_text_cont {margin: 35px 0;} /* #the_cruise .content.content4 .part_link a {color: #E2C8B9} #the_cruise .content.content4 .part_link:hover a {color: #288BFF;} */ @media screen and (max-width: 1180px) { #the_cruise .content.content4 .part {margin-top: 40px;} #the_cruise .content.content4 .part span{ padding: 5px 7px; font-size: 15px; } #the_cruise .content.content4 .part_text_cont {margin: 25px 0;} #the_cruise .content.content4 .part_title {font-size: 45px; line-height: 63px;} #the_cruise .content.content4 .part_title.btm_title {margin-bottom: 23px;} #the_cruise .content.content4 .part_content{font-size: 27px; line-height: 44px;} #the_cruise .content.content4 .part_content.btm_content { margin-bottom: 25px;} } @media screen and (max-width: 900px) { #the_cruise .content.content4 .part {margin-top: 25px;} #the_cruise .content.content4 .part span{ padding: 3px 5px; font-size: 9px; } #the_cruise .content.content4 .part_text_cont {margin: 20px 0;} #the_cruise .content.content4 .part_title {font-size: 34px; line-height: 47px;} #the_cruise .content.content4 .part_title.btm_title {margin-bottom: 15px;} #the_cruise .content.content4 .part_content{font-size: 20px; line-height: 34px;} #the_cruise .content.content4 .part_content.btm_content { margin-bottom: 22px;} } @media screen and (max-width: 768px) { #the_cruise .content.content4 .part {margin-top: 40px;} #the_cruise .content.content4 .part span{ padding: 6px 8px; font-size: 17px; } #the_cruise .content.content4 .part_text_cont {margin: 30px 0;} #the_cruise .content.content4 .part_title {font-size: 35px; line-height: 50px;} #the_cruise .content.content4 .part_title.btm_title {margin-bottom: 20px;} #the_cruise .content.content4 .part_content{font-size: 22px; line-height: 37px;} #the_cruise .content.content4 .part_content.btm_content { margin-bottom: 20px;} } @media screen and (max-width: 500px) { #the_cruise .content.content4 .part {margin-top: 15px;} #the_cruise .content.content4 .part span{ padding: 3px 5px; font-size: 9px; } #the_cruise .content.content4 .part_text_cont {margin: 20px 0;} #the_cruise .content.content4 .part_title {font-size: 25px; line-height: 35px;} #the_cruise .content.content4 .part_title.btm_title {margin-bottom: 15px;} #the_cruise .content.content4 .part_content{font-size: 15px; line-height: 25px;} #the_cruise .content.content4 .part_content.btm_content { margin-bottom: 10px;} } @media screen and (max-width: 360px) { #the_cruise .content.content4 .part {margin-top: 10px;} #the_cruise .content.content4 .part span{ padding: 2px 4px; font-size: 6px; } #the_cruise .content.content4 .part_text_cont {margin: 15px 0;} #the_cruise .content.content4 .part_title.btm_title {margin-bottom: 10px;} #the_cruise .content.content4 .part_title {font-size: 18px; line-height: 26px;} #the_cruise .content.content4 .part_content{font-size: 12px; line-height: 20px;} #the_cruise .content.content4 .part_content.btm_content { margin-bottom: 10px;} } /*ani*/ #the_cruise .content4 .part.offsetCon > span, #the_cruise .content4 .part.offsetCon .part_text_cont > p {transform:translateY(-100%);opacity: 0;transition:all 1.5s;overflow: hidden;} #the_cruise .content4 .part.offsetCon .bg_img_cont_grad{opacity: 0;transition:all 1.5s;overflow: hidden;} #the_cruise .content4 .part.offsetCon .part_text_cont > p:nth-of-type(1) {transition-delay:.5s;} #the_cruise .content4 .part.offsetCon .part_text_cont > p:nth-of-type(2) {transition-delay:.5s;} #the_cruise .content4 .part.offsetCon .part_text_cont > p:nth-of-type(3) {transition-delay:1.1s;}/* 작은 텍스트 */ #the_cruise .content4 .part.offsetCon .part_text_cont > p:nth-of-type(4) {transition-delay:1.1s;} #the_cruise .content4 .part.offsetCon .part_text_cont > p:nth-of-type(5) {transition-delay:1.1s;} #the_cruise .content4 .part.offsetCon .bg_img_cont_grad{transition-delay:1.7s;} #the_cruise .content4 .part.offsetCon.on > span, #the_cruise .content4 .part.offsetCon.on .part_text_cont > p {transform:translateY(0);opacity: 1;} #the_cruise .content4 .part.offsetCon.on .bg_img_cont_grad {opacity: 1;} /* slide 5 */ #the_cruise .content.content5 {padding: 60px;} #the_cruise .content.content5 .content_title {font-weight: 700; text-align: center;} #the_cruise .content.content5 .content_title p:nth-child(1), #the_cruise .content.content5 .content_title p:nth-child(2) {font-size: 47px; line-height: 62px; } #the_cruise .content.content5 .content_title p:nth-child(3) { font-size: 29px; color: #A7A9AC; margin: 25px; font-weight: 400;} #the_cruise .content.content5 .card_cont {display: flex; flex-direction: column; align-items: center;} #the_cruise .content.content5 .card_cont .card_img_cont { width: 100%; margin: 12px 0; position: relative; font-weight: 700; } #the_cruise .content.content5 .card_cont .card_img_cont > img { } #the_cruise .content.content5 .card_cont .card_img_cont .card_text { position: absolute; top: 50%; left: 6%; transform: translateY(-50%);} #the_cruise .content.content5 .card_cont .card_img_cont .card_text p{font-size:30px; line-height: 35px;} #the_cruise .content.content5 .card_cont .card_img_cont .card_text ul { margin-top: 15px;} #the_cruise .content.content5 .card_cont .card_img_cont .card_text ul li{font-size: 23px; line-height: 39px; position: relative; padding-left: 20px; font-weight: 400; color: #636468;} #the_cruise .content.content5 .card_cont .card_img_cont .card_text ul li::before{position: absolute; content: "·"; top: 0; left: 0;} @media screen and (max-width: 1180px) { #the_cruise .content.content5 {padding: 40px; } #the_cruise .content.content5 .content_title p:nth-child(1), #the_cruise .content.content5 .content_title p:nth-child(2) {font-size: 38px; line-height: 48px; } #the_cruise .content.content5 .content_title p:nth-child(3) { font-size: 24px; margin: 25px;} #the_cruise .content.content5 .card_cont .card_img_cont { margin: 12px 0; } #the_cruise .content.content5 .card_cont .card_img_cont .card_text p{font-size:28px; line-height: 33px;} #the_cruise .content.content5 .card_cont .card_img_cont .card_text ul { margin-top: 11px;} #the_cruise .content.content5 .card_cont .card_img_cont .card_text ul li {font-size: 22px; line-height: 35px;padding-left: 19px;} } @media screen and (max-width: 900px) { #the_cruise .content.content5 {padding: 30px; } #the_cruise .content.content5 .content_title p:nth-child(1), #the_cruise .content.content5 .content_title p:nth-child(2) {font-size: 30px; line-height: 41px; } #the_cruise .content.content5 .content_title p:nth-child(3) { font-size: 19px; margin: 18px;} #the_cruise .content.content5 .card_cont .card_img_cont { margin: 7px 0;} #the_cruise .content.content5 .card_cont .card_img_cont .card_text p{font-size: 22px; line-height: 31px;} #the_cruise .content.content5 .card_cont .card_img_cont .card_text ul { margin-top: 7px;} #the_cruise .content.content5 .card_cont .card_img_cont .card_text ul li {font-size: 17px; line-height: 26px;padding-left: 15px;} } @media screen and (max-width: 768px) { #the_cruise .content.content5 {padding: 50px; } #the_cruise .content.content5 .content_title p:nth-child(1), #the_cruise .content.content5 .content_title p:nth-child(2) {font-size: 40px; line-height: 55px;} #the_cruise .content.content5 .content_title p:nth-child(3) { font-size: 26px; margin: 23px;} #the_cruise .content.content5 .card_cont .card_img_cont { margin: 12px 0; } #the_cruise .content.content5 .card_cont .card_img_cont .card_text p{font-size: 30px; line-height: 45px;} #the_cruise .content.content5 .card_cont .card_img_cont .card_text ul { margin-top: 8px;} #the_cruise .content.content5 .card_cont .card_img_cont .card_text ul li {font-size: 24px; line-height: 36px;padding-left: 25px;} } @media screen and (max-width: 640px) { #the_cruise .content.content5 {padding: 40px; } #the_cruise .content.content5 .content_title p:nth-child(1), #the_cruise .content.content5 .content_title p:nth-child(2) {font-size: 30px; line-height: 41px; } #the_cruise .content.content5 .content_title p:nth-child(3) { font-size: 21px; margin: 18px;} #the_cruise .content.content5 .card_cont .card_img_cont { margin: 8px 0; } #the_cruise .content.content5 .card_cont .card_img_cont .card_text p{font-size: 23px; line-height: 30px;} #the_cruise .content.content5 .card_cont .card_img_cont .card_text ul { margin-top: 6px;} #the_cruise .content.content5 .card_cont .card_img_cont .card_text ul li {font-size: 17px; line-height: 27px;padding-left: 15px;} } @media screen and (max-width: 500px){ #the_cruise .content.content5 {padding: 30px; } #the_cruise .content.content5 .content_title p:nth-child(1), #the_cruise .content.content5 .content_title p:nth-child(2) {font-size: 21px; line-height: 29px; } #the_cruise .content.content5 .content_title p:nth-child(3) { font-size: 14px; margin: 13px;} #the_cruise .content.content5 .card_cont .card_img_cont { margin: 8px 0; } #the_cruise .content.content5 .card_cont .card_img_cont .card_text p{font-size: 15px; line-height: 20px;} #the_cruise .content.content5 .card_cont .card_img_cont .card_text ul { margin-top: 4px;} #the_cruise .content.content5 .card_cont .card_img_cont .card_text ul li {font-size: 12px; line-height: 20px;padding-left: 13px;} } @media screen and (max-width: 360px) { #the_cruise .content.content5 {padding: 20px; } #the_cruise .content.content5 .content_title p:nth-child(1), #the_cruise .content.content5 .content_title p:nth-child(2) {font-size: 16px; line-height: 22px; } #the_cruise .content.content5 .content_title p:nth-child(3) { font-size: 11px; margin: 8px;} #the_cruise .content.content5 .card_cont .card_img_cont { margin: 10px;} #the_cruise .content.content5 .card_cont .card_img_cont .card_text p{font-size: 12px; line-height: 19px;} #the_cruise .content.content5 .card_cont .card_img_cont .card_text ul { margin-top: 0;} #the_cruise .content.content5 .card_cont .card_img_cont .card_text ul li {font-size: 10px; line-height: 16px; padding-left: 8px; } } /*ani*/ #the_cruise .content5.offsetCon .content_title > p {transform:translateY(-100%);opacity: 0;transition:all 1.5s;overflow: hidden;} #the_cruise .content5.offsetCon .card_img_cont {opacity: 0;transition:all 1.5s;overflow: hidden;} #the_cruise .content5.offsetCon .content_title > p:nth-of-type(3){transition-delay:.5s;} #the_cruise .content5.offsetCon .card_cont .card_img_cont:nth-child(1) {transition-delay:1.2s;} #the_cruise .content5.offsetCon .card_cont .card_img_cont:nth-child(2) {transition-delay:1.8s;} #the_cruise .content5.offsetCon .card_cont .card_img_cont:nth-child(3) {transition-delay:2.6s;} #the_cruise .content5.offsetCon .card_cont .card_img_cont:nth-child(4) {transition-delay:3.2s;} #the_cruise .content5.offsetCon.on .content_title > p {transform:translateY(0);opacity: 1;} #the_cruise .content5.offsetCon.on .card_img_cont {opacity: 1;} /* slide 6 */ #the_cruise .content.content6 {text-align: center; position: relative; } #the_cruise .content.content6 .absol_content { width: 100%;} #the_cruise .content.content6 .absol_img {position: absolute; bottom: 7.5%; left: 0;} #the_cruise .content.content6 .absol_text_top{position: absolute; top: 1%; left: 0;} #the_cruise .content.content6 .absol_text_mid{position: absolute; top: 14%; left: 0;display:flex; justify-content:center;} #the_cruise .content.content6 .absol_text_btm{position: absolute; top: 22.5%; left: 0; } #the_cruise .content.content6 .sub_text{font-size: 36px; line-height: 60px; color: #636468; } #the_cruise .content.content6 .line_vertical{height: 80px; width: 1px; background: #636468;opacity: 0.6;} #the_cruise .content.content6 .title_text{ font-size: 58px; line-height: 86px; font-weight: 700;} #the_cruise .content.content6 .inner_content{width: 100%; display: flex; flex-direction: column; align-items: center;} @media screen and (max-width: 1180px) { #the_cruise .content.content6 .sub_text{font-size: 36px; line-height: 60px;} #the_cruise .content.content6 .line_vertical{ height: 70px; } #the_cruise .content.content6 .title_text{ font-size: 58px; line-height: 85px;} } @media screen and (max-width: 1024px) { #the_cruise .content.content6 .sub_text{font-size: 31px; line-height: 52px;} #the_cruise .content.content6 .line_vertical{ height: 65px; } #the_cruise .content.content6 .title_text{ font-size: 49px; line-height: 74px;} } @media screen and (max-width: 900px) { #the_cruise .content.content6 .sub_text{font-size: 24px; line-height: 40px;} #the_cruise .content.content6 .line_vertical{ height: 48px; } #the_cruise .content.content6 .title_text{ font-size: 41px; line-height: 60px; } } @media screen and (max-width: 768px) { #the_cruise .content.content6 .sub_text{font-size: 34px; line-height: 58px;} #the_cruise .content.content6 .line_vertical{ height: 73px; } #the_cruise .content.content6 .title_text{ font-size: 53px; line-height: 77px;} } @media screen and (max-width: 640px){ #the_cruise .content.content6 .sub_text{font-size: 28px; line-height: 45px;} #the_cruise .content.content6 .line_vertical{ height: 55px; } #the_cruise .content.content6 .title_text{ font-size: 50px; line-height: 73px;} } @media screen and (max-width: 600px){ #the_cruise .content.content6 .sub_text{font-size: 24px; line-height: 38px;} #the_cruise .content.content6 .line_vertical{ height: 44px; } #the_cruise .content.content6 .title_text{ font-size: 41px; line-height: 60px;} } @media screen and (max-width: 500px){ #the_cruise .content.content6 .sub_text{font-size: 18px; line-height: 28px;} #the_cruise .content.content6 .line_vertical{ height: 32px;} #the_cruise .content.content6 .title_text{ font-size: 29px; line-height: 41px; } } @media screen and (max-width: 360px) { #the_cruise .content.content6 .sub_text{font-size: 15px; line-height: 24px;} #the_cruise .content.content6 .line_vertical{ height: 27px; } #the_cruise .content.content6 .title_text{ font-size: 24px; line-height: 35px; } } @media screen and (max-width: 320px) { #the_cruise .content.content6 .sub_text{font-size: 13px; line-height: 20px;} #the_cruise .content.content6 .line_vertical{ height: 25px; } #the_cruise .content.content6 .title_text{ font-size: 21px; line-height: 30px; } } /*ani*/ #the_cruise .content6.offsetCon .absol_text_top > p, #the_cruise .content6.offsetCon .absol_text_mid > div, #the_cruise .content6.offsetCon .absol_text_btm > p {transform:translateY(-100%);opacity: 0;transition:all 1.2s;overflow: hidden;} #the_cruise .content6.offsetCon .absol_img {opacity: 0;transition:all 1.3s;overflow: hidden;} #the_cruise .content6.offsetCon .absol_text_top > p:nth-of-type(2){transition-delay:.5s;} #the_cruise .content6.offsetCon .absol_text_mid > div {transition-delay:1.1s;} #the_cruise .content6.offsetCon .absol_text_btm > p:nth-of-type(1) {transition-delay:1.8s;} #the_cruise .content6.offsetCon .absol_text_btm > p:nth-of-type(2) {transition-delay:2.4s;} #the_cruise .content6.offsetCon .absol_text_btm > p:nth-of-type(3) {transition-delay:3.0s;} #the_cruise .content6.offsetCon .absol_img {transition-delay:3.6s;} #the_cruise .content6.offsetCon.on .absol_text_top > p, #the_cruise .content6.offsetCon.on .absol_text_mid > div, #the_cruise .content6.offsetCon.on .absol_text_btm > p {transform:translateY(0);opacity: 1;} #the_cruise .content6.offsetCon.on .absol_img {opacity: 1;} /* slide 7 */ #the_cruise .content.content7 {} #the_cruise .content.content7 .bg_black{position: relative; background-color: #000000; overflow:hidden;} #the_cruise .content.content7 .bg_black > img {animation: scaleUpDown 5.0s .5s infinite alternate; position: absolute; top: 0; left: 0; width: 100%; height: auto;z-index:0;} #the_cruise .content.content7 .inner_container{ padding: 100px 0 70px; display: flex; flex-direction: column; justify-content: center; text-align: center;} #the_cruise .content.content7 .inner_container .small_text{font-size: 40px; line-height: 75px; color: #677794;} #the_cruise .content.content7 .inner_container .text_area > .title_text{font-size: 115px; line-height: 150px; margin-bottom: 60px; color: #ffffff;font-weight: 900; } #the_cruise .content.content7 .inner_container .sub_text{font-size: 33px; line-height: 55px;color: #ffffff;} #the_cruise .content.content7 .inner_container .slide_down_arr{margin: 60px 0 65px; display: flex; justify-content: center; align-items: center;} #the_cruise .content.content7 .inner_container .slide_down_arr img{width:5%; animation: moveUpDown 2s .5s infinite alternate;} #the_cruise .content.content7 .inner_container .card_cont { z-index: 1;} #the_cruise .content.content7 .inner_container .card_cont .part{margin: 30px 65px; padding: 50px; border-radius: 20px; display: flex; flex-direction: column; background-color: #ffffff;} #the_cruise .content.content7 .inner_container .card_cont .part > span{font-size: 24px; padding: 10px 0; line-height: 1.2; position:relative; color: #BDBDBD;} #the_cruise .content.content7 .inner_container .card_cont .part > span::after{bottom: 0; position: absolute; content: ""; width: 6%; height: 1px; background-color:#BDBDBD;left: 50%; transform: translateX(-50%);} #the_cruise .content.content7 .inner_container .card_cont .part > p.sub_title_text {font-size: 30px; line-height: 1.2; margin-top: 41px; color: #8A8C92;} #the_cruise .content.content7 .inner_container .card_cont .part > p.title_text {font-size: 66px; line-height: 110px; font-weight: 700; color: #000000; } #the_cruise .content.content7 .inner_container .card_cont .part .sub_text_cont { margin: 20px 0 30px; } #the_cruise .content.content7 .inner_container .card_cont .part .sub_text_cont > p {font-size: 23px; line-height: 34px; color: #7A705A;} #the_cruise .content.content7 .inner_container .card_cont .part .video_center_cont {margin: 0; display: flex;justify-content: center; } #the_cruise .content.content7 .inner_container .card_cont .part .video_center_cont video{border-radius: 20px; width: 100%;} @media screen and (max-width: 1180px) { #the_cruise .content.content7 .inner_container{padding: 100px 0 80px;} #the_cruise .content.content7 .inner_container .small_text{font-size: 30px; line-height: 55px;} #the_cruise .content.content7 .inner_container .text_area > .title_text{font-size: 100px; line-height: 145px; margin-bottom: 40px;} #the_cruise .content.content7 .inner_container .sub_text{font-size: 25px; line-height: 40px;} #the_cruise .content.content7 .inner_container .slide_down_arr{margin: 55px 0 60px;} #the_cruise .content.content7 .inner_container .card_cont .part{margin: 25px 50px; padding:35px; border-radius:20px;} #the_cruise .content.content7 .inner_container .card_cont .part > span{font-size: 23px; padding: 7px 0; } #the_cruise .content.content7 .inner_container .card_cont .part > p.sub_title_text {font-size: 23px; margin-top: 37px; } #the_cruise .content.content7 .inner_container .card_cont .part > p.title_text {font-size: 52px; line-height: 86px; } #the_cruise .content.content7 .inner_container .card_cont .part .sub_text_cont { margin: 16px 0 22px; } #the_cruise .content.content7 .inner_container .card_cont .part .sub_text_cont > p{font-size: 18px; line-height: 30px; } #the_cruise .content.content7 .inner_container .card_cont .part .video_center_cont video{border-radius: 20px; } } @media screen and (max-width: 900px) { #the_cruise .content.content7 .inner_container{padding: 85px 0 60px;} #the_cruise .content.content7 .inner_container .small_text{font-size: 24px; line-height: 40px;} #the_cruise .content.content7 .inner_container .text_area > .title_text{font-size: 85px; line-height: 125px; margin-bottom: 30px;} #the_cruise .content.content7 .inner_container .sub_text{font-size: 19px; line-height: 33px;} #the_cruise .content.content7 .inner_container .slide_down_arr{margin: 45px 0 50px;} #the_cruise .content.content7 .inner_container .card_cont .part{margin: 15px 32px; padding: 27px; border-radius:15px;} #the_cruise .content.content7 .inner_container .card_cont .part > span{font-size: 18px;padding: 5px 0; } #the_cruise .content.content7 .inner_container .card_cont .part > p.sub_title_text {font-size: 18px; margin-top: 29px; } #the_cruise .content.content7 .inner_container .card_cont .part > p.title_text {font-size: 42px; line-height: 67px;} #the_cruise .content.content7 .inner_container .card_cont .part .sub_text_cont { margin: 11px 0 16px; } #the_cruise .content.content7 .inner_container .card_cont .part .sub_text_cont > p{font-size: 15px; line-height: 22px; } #the_cruise .content.content7 .inner_container .card_cont .part .video_center_cont video{border-radius: 15px; } } @media screen and (max-width: 768px) { #the_cruise .content.content7 .inner_container{padding: 120px 0 80px;} #the_cruise .content.content7 .inner_container .small_text{font-size: 31px; line-height: 55px;} #the_cruise .content.content7 .inner_container .text_area > .title_text{font-size: 105px; line-height: 145px; margin-bottom: 50px;} #the_cruise .content.content7 .inner_container .sub_text{font-size: 25px; line-height: 40px;} #the_cruise .content.content7 .inner_container .slide_down_arr{margin: 60px 0 65px;} #the_cruise .content.content7 .inner_container .card_cont .part{margin: 25px 50px; padding:40px; border-radius:20px;} #the_cruise .content.content7 .inner_container .card_cont .part > span{font-size: 21px; padding: 7px 0; } #the_cruise .content.content7 .inner_container .card_cont .part > p.sub_title_text {font-size: 25px; margin-top: 35px; } #the_cruise .content.content7 .inner_container .card_cont .part > p.title_text {font-size: 57px; line-height: 85px;} #the_cruise .content.content7 .inner_container .card_cont .part .sub_text_cont { margin: 19px 0 24px; } #the_cruise .content.content7 .inner_container .card_cont .part .sub_text_cont > p {font-size: 19px; line-height: 30px; } #the_cruise .content.content7 .inner_container .card_cont .part .video_center_cont video{border-radius: 20px; } } @media screen and (max-width: 640px){ #the_cruise .content.content7 .inner_container{padding: 100px 0 60px;} #the_cruise .content.content7 .inner_container .small_text{font-size: 26px; line-height: 50px;} #the_cruise .content.content7 .inner_container .text_area > .title_text{font-size: 80px; line-height: 101px; margin-bottom: 40px;} #the_cruise .content.content7 .inner_container .sub_text{font-size: 21px; line-height: 33px;} #the_cruise .content.content7 .inner_container .slide_down_arr{margin: 40px 0 45px;} #the_cruise .content.content7 .inner_container .card_cont .part{margin: 20px 40px;padding:30px; border-radius:15px;} #the_cruise .content.content7 .inner_container .card_cont .part > span{font-size: 17px; padding: 8px 0; } #the_cruise .content.content7 .inner_container .card_cont .part > p.sub_title_text {font-size: 19px; margin-top: 32px; } #the_cruise .content.content7 .inner_container .card_cont .part > p.title_text {font-size: 44px; line-height: 65px; } #the_cruise .content.content7 .inner_container .card_cont .part .sub_text_cont { margin: 15px 0 20px; } #the_cruise .content.content7 .inner_container .card_cont .part .sub_text_cont > p {font-size: 16px; line-height: 24px; } #the_cruise .content.content7 .inner_container .card_cont .part .video_center_cont video{border-radius: 15px; } } @media screen and (max-width: 500px){ #the_cruise .content.content7 .inner_container{padding: 65px 0 20px;} #the_cruise .content.content7 .inner_container .small_text{font-size: 18px; line-height: 32px;} #the_cruise .content.content7 .inner_container .text_area > .title_text{font-size: 55px; line-height: 74px; margin-bottom:30px;} #the_cruise .content.content7 .inner_container .sub_text{font-size: 14px; line-height: 25px;} #the_cruise .content.content7 .inner_container .slide_down_arr{margin: 35px 0 40px;} #the_cruise .content.content7 .inner_container .card_cont .part{margin: 10px 28px; padding: 20px; border-radius:10px;} #the_cruise .content.content7 .inner_container .card_cont .part > span{font-size: 12px; padding: 5px 0;} #the_cruise .content.content7 .inner_container .card_cont .part > p.sub_title_text {font-size: 13px; margin-top: 23px; } #the_cruise .content.content7 .inner_container .card_cont .part > p.title_text {font-size: 31px; line-height: 50px;} #the_cruise .content.content7 .inner_container .card_cont .part .sub_text_cont { margin: 12px 0 17px; } #the_cruise .content.content7 .inner_container .card_cont .part .sub_text_cont > p {font-size: 11px; line-height: 18px; } #the_cruise .content.content7 .inner_container .card_cont .part .video_center_cont video{border-radius: 10px; } } @media screen and (max-width: 360px) { #the_cruise .content.content7 .inner_container{padding: 45px 0 20px;} #the_cruise .content.content7 .inner_container .small_text{font-size: 14px; line-height: 33px;} #the_cruise .content.content7 .inner_container .text_area > .title_text{font-size: 45px; line-height: 55px; margin-bottom: 20px;} #the_cruise .content.content7 .inner_container .sub_text{font-size: 12px; line-height: 21px;} #the_cruise .content.content7 .inner_container .slide_down_arr{margin: 25px 0 30px;} #the_cruise .content.content7 .inner_container .card_cont .part{margin: 7px 20px; padding: 13px; border-radius:8px;} #the_cruise .content.content7 .inner_container .card_cont .part > span{font-size: 11px; padding: 3px 0;} #the_cruise .content.content7 .inner_container .card_cont .part > p.sub_title_text {font-size: 11px; margin-top: 17px; } #the_cruise .content.content7 .inner_container .card_cont .part > p.title_text {font-size: 25px; line-height: 40px;} #the_cruise .content.content7 .inner_container .card_cont .part .sub_text_cont { margin: 10px 0 15px; } #the_cruise .content.content7 .inner_container .card_cont .part .sub_text_cont > p {font-size: 10px; line-height: 16px; } #the_cruise .content.content7 .inner_container .card_cont .part .video_center_cont video{border-radius: 8px; } } /*ani*/ #the_cruise .content7 .inner_container.offsetCon .text_area > p, #the_cruise .content7 .card_cont.offsetCon .part > span, #the_cruise .content7 .card_cont.offsetCon .part p {transform:translateY(100%);opacity: 0;transition:all 1.5s;overflow: hidden;} #the_cruise .content7 .card_cont.offsetCon .part, #the_cruise .content7 .card_cont.offsetCon .part > .video_center_cont {opacity: 0;transition:all 1.5s;overflow: hidden;} #the_cruise .content7 .inner_container.offsetCon .text_area p:nth-of-type(2) {transition-delay:.6s;} #the_cruise .content7 .inner_container.offsetCon .text_area p:nth-of-type(3) {transition-delay:1.2s;} #the_cruise .content7 .inner_container.offsetCon .text_area p:nth-of-type(4) {transition-delay:1.8s;} #the_cruise .content7 .inner_container.offsetCon .text_area p:nth-of-type(5) {transition-delay:2.6s;} #the_cruise .content7 .card_cont.offsetCon .part > span {transition-delay:.1s;} #the_cruise .content7 .card_cont.offsetCon .part p:nth-of-type(1) {transition-delay:.6s;} #the_cruise .content7 .card_cont.offsetCon .part p:nth-of-type(2) {transition-delay:1.2s;} #the_cruise .content7 .card_cont.offsetCon .part .sub_text_cont > p:nth-of-type(1), #the_cruise .content7 .card_cont.offsetCon .part .sub_text_cont > p:nth-of-type(2), #the_cruise .content7 .card_cont.offsetCon .part .sub_text_cont > p:nth-of-type(3){transition-delay:1.8s;} #the_cruise .content7 .card_cont.offsetCon .part .video_center_cont {transition-delay:2.6s;} #the_cruise .content7 .inner_container.offsetCon.on .text_area > p, #the_cruise .content7 .card_cont.offsetCon.on .part > span, #the_cruise .content7 .card_cont.offsetCon.on .part p {transform:translateY(0);opacity: 1;} #the_cruise .content7 .card_cont.offsetCon.on .part, #the_cruise .content7 .card_cont.offsetCon.on .part > .video_center_cont {opacity: 1;} /******************************************************** #medical_phantom > 메디컬팬텀 전용 css *******************************************************/ #medical_phantom .content{padding:0 40px;} #medical_phantom .content .con_txt strong{display:block;margin-bottom:15px;line-height:1.4;font-size:40px;font-family: 'NotoSansKR-Bold';} #medical_phantom .content .con_txt p{line-height:1.4;font-size:19px;color:#5a5a5a;font-family: 'NotoSansKR-Medium';} #medical_phantom .content1 {padding-top:100px;padding-bottom:100px;background:url(https://bodyfriend.speedgabia.com/img/bodyfriend/shoping/medicalPhantom/con1_bg-min.jpg)no-repeat center top;background-size:auto 70%;} #medical_phantom .content1 .con_txt{text-align: center;} #medical_phantom .content1 .con_txt strong{display:block;margin:45px auto 35px auto;line-height:1.2;font-size:50px;font-family: 'NotoSansKR-Bold';} #medical_phantom .content1 .con_txt span{display:block;font-size:24px;} #medical_phantom .content1 .notice{display:flex;justify-content: center;margin-top:70px;} #medical_phantom .content1 .notice span{display:block;} #medical_phantom .content1 .notice span:last-child{padding-left:25px;} #medical_phantom .content1 .notice span:last-child strong{font-size:24px;font-family: 'NotoSansKR-Bold';} #medical_phantom .content1 .notice span:last-child .txt{margin:5px 0;font-size:13px;font-family: 'NotoSansKR-Medium';} #medical_phantom .content1 .notice span:last-child .ad{font-size:12px;color:#4d4d4d;} #medical_phantom .content2{padding:0;} #medical_phantom .content2 .con_txt{margin:0 40px;} #medical_phantom .con_point_list {margin:80px 40px;} #medical_phantom .con_point_list > li{display:flex;flex-wrap:wrap;margin-bottom:50px;perspective:1000px;perspective-origin:bottom;} #medical_phantom .con_point_list .img{position:relative; border-radius: 20px;width:330px;height:218px;overflow: hidden;} #medical_phantom .con_point_list .img:after{content:"";position: absolute;right:20px;bottom:20px;width:20px;height:20px;background:url(https://bodyfriend.speedgabia.com/img/bodyfriend/icon/ico_play.svg)no-repeat center;background-size:100%;} #medical_phantom .con_point_list .img video[poster], #medical_phantom .con_point_list .img video{position:absolute;top:50%;left:50%;transform:translate(-50%,-50%); height:100%;} #medical_phantom .con_point_list .txt{display: flex; flex-direction: column; justify-content: end;padding-left:20px;width:calc(100% - 330px);} #medical_phantom .con_point_list .txt em{display:block;font-size:14px;color:#53B671;font-family: 'NotoSansKR-Bold';} #medical_phantom .con_point_list .txt strong{display:block;margin:5px 0;font-size:24px;font-family: 'NotoSansKR-Bold';} #medical_phantom .con_point_list .txt p{line-height:1.4;font-size:16px;color:#8e8e8e;word-break:keep-all;} #medical_phantom .con_point_list .more{margin:50px 0 0;padding:25px;width:100%;background:#f4f6f6;border-radius: 20px;} #medical_phantom .con_point_list .more strong{font-size:16px;font-family: 'NotoSansKR-Bold';} #medical_phantom .con_point_list .more p{margin-top:15px;font-size:14px;color:#A3A3A3;word-break:keep-all;} #medical_phantom .con_point_list .more .imgs{display:flex;justify-content: space-between;margin-top:20px;} #medical_phantom .con_point_list .more .imgs li{position:relative; height:104px;overflow:hidden;border-radius: 10px;} #medical_phantom .con_point_list .more .imgs li:nth-child(1){width:40%;} #medical_phantom .con_point_list .more .imgs li:nth-child(2){margin:0 10px;width:30%;} #medical_phantom .con_point_list .more .imgs li:nth-child(3){width:30%;} #medical_phantom .con_point_list .more .imgs li img{position: absolute;top:50%;left:50%;transform:translate(-50%,-50%);width:100%;} #medical_phantom .license_info{padding:50px 0 30px 0;background:#f4f6f6;text-align: center;} #medical_phantom .license_info > strong{font-family: 'NotoSansKR-Bold';font-size:24px;} #medical_phantom .license_info p{margin:25px 0;font-size:13px;font-family: 'NotoSansKR-Medium';} #medical_phantom .license_info img{margin:0 auto;max-width:85%;} #medical_phantom .license_info .imgs{display:flex;justify-content: space-between;margin:30px 20px 0 20px;} #medical_phantom .license_info .imgs > li{margin:0 10px;} #medical_phantom .license_info .imgs > li img{width:100%;box-shadow: 0 0 4px rgba(0,0,0,0.15);} #medical_phantom .content3{padding-top:100px;} #medical_phantom .con_slide_wrap h4{margin-top:60px;font-size:26px;} #medical_phantom .con_slide_wrap .con_slide{margin-top:30px;} #medical_phantom .slide_box {margin-right:20px;padding:15px;width:230px;height:288px;border-radius: 17px; cursor:pointer;transition:all .3s;} #medical_phantom .slide_mode .slick-list{overflow:inherit;} #medical_phantom .slide_mode .slide_box{background: #62d8a3;background: -moz-linear-gradient(-45deg, #62d8a3 0%, #50ad9c 100%);background: -webkit-linear-gradient(-45deg, #62d8a3 0%,#50ad9c 100%);background: linear-gradient(135deg, #62d8a3 0%,#50ad9c 100%); filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#62d8a3', endColorstr='#50ad9c',GradientType=1 ); } #medical_phantom .slide_mode .slide_box img{margin:20px 0 12px 0;} #medical_phantom .slide_mode .slide_box strong{display:block;margin-bottom:12px;font-size:24px;color:#FFEB35;} #medical_phantom .slide_mode .slide_box p{font-size:14px;color:#fff;word-break:keep-all;} #medical_phantom .content4{padding-top:100px;padding-bottom:100px;} #medical_phantom .content4 .con_list_column .txt{padding:25px;font-size:24px;font-family: 'NotoSansKR-Bold';text-align:center;} #medical_phantom .con_list_column{ margin:40px 0 0 0 ;} #medical_phantom .con_list_column li{display:flex;align-items:center;margin-bottom:20px;background:#F4F6F6;border-radius:12px; height:197px;overflow: hidden;} #medical_phantom .con_list_column .img{width:302px;} #medical_phantom .content5{padding-top:100px;padding-bottom:100px;background:url(https://bodyfriend.speedgabia.com/img/bodyfriend/shoping/medicalPhantom/con5_bg-min.jpg)no-repeat center; background-size: cover;} #medical_phantom .content5 .con_txt2{margin:100px 0 30px 0;} #medical_phantom .content5 .con_txt2 p.caution{color:#7b7b7b;margin-top:20px;font-size:16px;} #medical_phantom .content5 .con_slide_wrap .con_slide{margin-top:0;} #medical_phantom .content5 .con_img{margin-top:60px;display:flex;flex-wrap:wrap;justify-content: space-between;} #medical_phantom .content5 .con_img li{display: flex;justify-content: flex-end;align-items: center;position:relative; margin-bottom:30px;width:100%;height:240px;border-radius: 17px;overflow:hidden;text-align: center;} #medical_phantom .content5 .con_img li:nth-child(1){background:url(https://bodyfriend.speedgabia.com/img/bodyfriend/shoping/medicalPhantom/con5_img1_x2.png)no-repeat;background-size:auto 240px;} #medical_phantom .content5 .con_img li:nth-child(2){background:url(https://bodyfriend.speedgabia.com/img/bodyfriend/shoping/medicalPhantom/con5_img2_x2.png)no-repeat;background-size:auto 240px;} #medical_phantom .content5 .con_img li:nth-child(3){background:url(https://bodyfriend.speedgabia.com/img/bodyfriend/shoping/medicalPhantom/con5_img3_x2.png)no-repeat;background-size:auto 240px;} #medical_phantom .content5 .con_img li:after{content:"";position: absolute;top:0;left:0;width:100%;height:100%;background:rgba(0,0,0,0.6);} #medical_phantom .content5 .con_img .txt{position: relative;display: flex; flex-direction: column; justify-content: end;width:60%;z-index: 1;} #medical_phantom .content5 .con_img .txt em{position:relative; display:block;margin-bottom:15px;font-size:18px;color:#53B671;font-family: 'NotoSansKR-Bold';} #medical_phantom .content5 .con_img .txt em:after{content:"";position: absolute;left:50%;bottom:0;transform:translateX(-50%);width:28px;height:1px;background:#53B671;} #medical_phantom .content5 .con_img .txt p{font-size:24px;color:#fff;font-family: 'NotoSansKR-Bold';} #medical_phantom .content5 .con_img .txt p span{font-size:24px;color:#53B671;font-family: 'NotoSansKR-Bold';} #medical_phantom .slide_card .slick-list{overflow:inherit;} #medical_phantom .slide_card .slide_box{background:#fff;} #medical_phantom .slide_card .slide_box strong{display:block;margin-bottom:15px;font-size:24px;color:#4EB66B;font-family: 'NotoSansKR-Bold';} #medical_phantom .slide_card .slide_box li{line-height:2.2;font-size:13px;font-family: 'NotoSansKR-Bold';} #medical_phantom .slide_card .slide_box .col2{column-count:2;} #medical_phantom .content6{padding-top:100px;} #medical_phantom .content6 .con_list_column .txt{padding:25px;padding-left:60px;} #medical_phantom .content6 .con_list_column .txt strong{font-size:18px;font-family: 'NotoSansKR-Bold';} #medical_phantom .content6 .con_list_column .txt p{margin-top:5px;font-size:15px;color:#5a5a5a;font-family: 'NotoSansKR-Medium';} #medical_phantom .content6 .con_list_column li:hover{box-shadow: 0 0 10px rgba(0,0,0,0.1);} #medical_phantom .content7{padding-top:100px;padding-bottom:0px;} #medical_phantom .content7 .con_img{margin:40px 0;} #medical_phantom .product_spec_list li{display:flex;border-bottom:1px solid #ddd;} #medical_phantom .product_spec_list li:last-child{border-bottom:0;} #medical_phantom .product_spec_list dl{display:flex;width:50%;align-items:center; } #medical_phantom .product_spec_list dt, #medical_phantom .product_spec_list dd{padding:30px 0;} #medical_phantom .product_spec_list dt{width:35%;font-size:14px;font-family: 'NotoSansKR-Bold';} #medical_phantom .product_spec_list dd{width:65%;font-size:12px;} #medical_phantom .content8{padding-top:180px;padding-bottom:100px;} #medical_phantom .content8 .etc{text-align: right;color:#5A5A5A;font-size:14px;} #medical_phantom .content8 .con_txt p{font-size:16px;} #medical_phantom .check_list{margin:50px 0 25px 0;} #medical_phantom .check_list li{margin-bottom:8px;padding:16px 10px 16px 60px;border-radius:10px;background:url(https://bodyfriend.speedgabia.com/img/bodyfriend/shoping/medicalPhantom/ico_check.svg)no-repeat 20px center #f5f5f7;word-break:keep-all; font-size:16px;font-family: 'NotoSansKR-Bold';word-break:keep-all;} #modal_video {width:600px;} #modal_video .modal__inner{width:100%;} #modal_video video{width:100%;} /*메디컬팬텀 애니메이션*/ #medical_phantom .con_point_list .more, #medical_phantom .con_point_list .img{transform:rotate3d(1,0,0, 90deg);transition:all 1.5s;} #medical_phantom .content1 .con_txt span, #medical_phantom .content1 .con_txt strong, #medical_phantom .check_list li{transform: translateY(-100%);opacity: 0;transition:all 1.5s;overflow: hidden;} #medical_phantom .content1 .con_img{overflow: hidden;} #medical_phantom .content1 .con_img img{transform: translateY(+100%);opacity: 0;transition:all 1.5s;} #medical_phantom .content8.offsetCon.on .check_list li, #medical_phantom .content1.offsetCon.on .con_txt strong, #medical_phantom .content1.offsetCon.on .con_txt span, #medical_phantom .content1.offsetCon.on .con_img img{transform:translateY(0);opacity: 1;} #medical_phantom .slide_box:hover{transform:scale(1.1);} #medical_phantom .content5 .con_img li, #medical_phantom .content5 .con_img li .txt, #medical_phantom .con_list_column li .txt, #medical_phantom .con_list_column li .txt *, #medical_phantom .con_list_column li{transition:all .5s;} #medical_phantom .content5 .con_img li:hover, #medical_phantom .content4.offsetCon.on .con_list_column li:hover, #medical_phantom .content4.offsetCon.on .con_list_column li.on{box-shadow:0 0 10px rgba(0,0,0,0.1); background: -moz-linear-gradient(-45deg, #62d8a3 0%, #50ad9c 100%);background: -webkit-linear-gradient(-45deg, #62d8a3 0%,#50ad9c 100%);background: linear-gradient(135deg, #62d8a3 0%,#50ad9c 100%); filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#62d8a3', endColorstr='#50ad9c',GradientType=1 );} #medical_phantom .content5 .con_img li:hover .txt *, #medical_phantom .content4.offsetCon.on .con_list_column li:hover .txt, #medical_phantom .content4.offsetCon.on .con_list_column li.on .txt{color:#fff;} #medical_phantom .content5 .con_img li:hover:after{display:none;} #medical_phantom .content5 .con_img li:hover .txt{transform:scale(1.1);width:100%;justify-content:center;} #medical_phantom .content5 .con_img li:hover .txt em:after{background:#fff;} #medical_phantom .con_point_list .offsetCon.on .more, #medical_phantom .con_point_list .offsetCon.on .img{transform:rotate3d(1,0,0, 0deg)} @media screen and (max-width: 1024px) { #medical_phantom .content{padding:0 20px;} #medical_phantom .content2 {padding:0;} #medical_phantom .content1, #medical_phantom .content4, #medical_phantom .content5{padding-top:100px;padding-bottom:100px;} #medical_phantom .content3, #medical_phantom .content6, #medical_phantom .content7, #medical_phantom .content8{padding-top:100px} #medical_phantom .content8{padding-bottom:100px;} #medical_phantom .content .con_txt strong{font-size:30px;} #medical_phantom .content .con_txt p{font-size:18px;} #medical_phantom .content1 {background-size:auto 65%;} #medical_phantom .content1 .con_txt span{font-size:20px;} #medical_phantom .content1 .con_txt strong{margin:25px auto 20px auto;font-size:40px;} #medical_phantom .content2 .con_txt{margin:0 20px;} #medical_phantom .con_point_list{margin:60px 20px;} #medical_phantom .con_point_list > li{margin-bottom:30px;} #medical_phantom .con_point_list .img{width:310px;height:200px;} #medical_phantom .con_point_list .txt{width:calc(100% - 310px);} #medical_phantom .con_point_list .txt em{font-size:12px;} #medical_phantom .con_point_list .txt strong{font-size:20px;} #medical_phantom .con_point_list .txt p, #medical_phantom .con_point_list .more strong{font-size:14px;} #medical_phantom .con_point_list .more{margin-top:30px;} #medical_phantom .con_point_list .more p{margin-top:10px;font-size:12px;} #medical_phantom .con_point_list .more .imgs li{margin-right:5px;} #medical_phantom .con_point_list .more .imgs li:last-child{margin:0;} #medical_phantom .con_point_list .more .imgs li img{width:100%;} #medical_phantom .license_info{padding:30px;} #medical_phantom .license_info p{margin:20px 0;} #medical_phantom .license_info .imgs{margin:20px 0 0;} #medical_phantom .con_list_column li{height:180px;} #medical_phantom .con_list_column .img{width:270px;} #medical_phantom .content4 .con_list_column .txt{font-size:22px;} #medical_phantom .content6 .con_list_column .txt p{font-size:14px;} } @media screen and (max-width: 950px) { #medical_phantom .con_point_list .img{width:40%;height:150px;} #medical_phantom .con_point_list .txt{width:60%;} #medical_phantom .con_point_list .txt strong{font-size:18px;} #medical_phantom .con_point_list .txt p br{display:none;} #medical_phantom .con_list_column li{height:auto;} #medical_phantom .con_list_column .img{width:35%;} #medical_phantom .content4 .con_list_column .txt{padding:20px;} #medical_phantom .license_info p br{display:none;} #medical_phantom .con_slide_wrap h4{font-size:22px;} #medical_phantom .content5 .con_img .txt p, #medical_phantom .content5 .con_img .txt p span{font-size:20px;} } @media screen and (max-width: 830px) { #medical_phantom .content1{background-size:auto 55%;} #medical_phantom .content .con_txt strong{font-size:24px;} #medical_phantom .content .con_txt p{font-size:14px;} #medical_phantom .content4 .con_list_column .txt{font-size:18px;} #medical_phantom .content5 .con_img li{height:180px;background-size:auto 180px !important;} } @media screen and (max-width: 768px) { #medical_phantom .con_point_list .img{height:200px} #medical_phantom .content .con_txt strong{font-size:40px;} #medical_phantom .content4 .con_list_column .txt{padding:20px 25px;font-size:22px;} #medical_phantom .content5 .con_img li{height:240px;background-size:auto 240px !important;} } @media screen and (max-width: 640px) { } @media screen and (max-width: 540px) { #medical_phantom .content .con_txt strong{font-size:30px;} #medical_phantom .content1 .notice span:last-child strong{font-size:16px;} #medical_phantom .content1 .notice span:last-child .txt{font-size:14px;} #medical_phantom .content .con_txt strong{margin-bottom:10px;font-size:24px;} #medical_phantom .content .con_txt p{font-size:16px;} #medical_phantom .con_point_list .img, #medical_phantom .con_point_list .txt{width:100%;} #medical_phantom .con_point_list .img{border-radius: 10px;height:260px;} #medical_phantom .con_point_list .txt{padding:20px 0;} #medical_phantom .con_point_list .txt em{font-size:14px;} #medical_phantom .con_point_list .txt p{font-size:16px;} #medical_phantom .license_info{padding:60px 20px;} #medical_phantom .license_info p{font-size:16px;} #medical_phantom .license_info .imgs{margin-top:60px;} #medical_phantom .con_slide_wrap h4{font-size:20px;} #medical_phantom .slide_box{width:315px;height:393px;} #medical_phantom .slide_mode.mode1 .slide_box img{margin-top:65px;} #medical_phantom .slide_mode.mode2 .slide_box img{margin-top:120px;} #medical_phantom .slide_mode .slide_box img{width:100px;} #medical_phantom .slide_mode .slide_box strong{font-size:30px;} #medical_phantom .slide_mode .slide_box p{font-size:18px;} #medical_phantom .con_list_column li{display:block;} #medical_phantom .con_list_column .img{width:100%;} #medical_phantom .con_list_column .img img{width:100%} #medical_phantom .content4 .con_list_column .txt{padding:20px 30px;min-height:100px;text-align: center;} #medical_phantom .content5 .con_img{margin-top:40px;} #medical_phantom .content5 .con_img li{margin-bottom:15px;height: 180px;background-size: auto 180px !important;} #medical_phantom .content5 .con_img .txt{width:70%;} #medical_phantom .content6 .con_list_column .txt{text-align: center;padding-left:25px;} #medical_phantom .slide_card .slide_box{height:436px;} #medical_phantom .slide_card .slide_box img{width:100px;} #medical_phantom .slide_card .slide_box strong{font-size:40px;} #medical_phantom .slide_card .slide_box li{font-size:20px;} #medical_phantom .product_spec_list li{display:block;border:0;} #medical_phantom .product_spec_list dl{width:100%;border-bottom:1px solid #ddd;} #medical_phantom .product_spec_list dt, #medical_phantom .product_spec_list dd{padding:20px 0;} #medical_phantom .product_spec_list dt{font-size:16px;} #medical_phantom .product_spec_list dd{font-size:14px;} #modal_video {width:100%;max-width:100%;} } @media screen and (max-width: 450px) { #medical_phantom .con_point_list .img{height:220px} } @media screen and (max-width: 414px) { #medical_phantom .content5 .con_img .txt{width:100%;} #medical_phantom .check_list{margin:40px 0 20px 0;} #medical_phantom .content .con_txt p, #medical_phantom .check_list li{font-size:14px;} #medical_phantom .con_point_list .txt strong{margin:8px 0;} #medical_phantom .con_point_list .more .imgs{display:block;} #medical_phantom .con_point_list .more .imgs li{width:100% !important;height:auto;margin:0 0 10px 0 !important;border-radius: 20px;} #medical_phantom .con_point_list .more .imgs li img{position:relative; top:auto;left:auto;transform:translate(0 ,0);} #medical_phantom .license_info .imgs{margin-top:30px;} #medical_phantom .slide_card .slide_box, #medical_phantom .slide_box{width:300px;height:370px;} #medical_phantom .slide_mode.mode2 .slide_box img{margin-top:100px;} #medical_phantom .slide_card .slide_box img, #medical_phantom .slide_mode .slide_box img{width:90px;} #medical_phantom .slide_mode .slide_box strong{font-size:25px;} #medical_phantom .slide_card .slide_box li, #medical_phantom .slide_mode .slide_box p{font-size:16px;} #medical_phantom .slide_card .slide_box strong{font-size:30px;} } @media screen and (max-width: 375px) { #medical_phantom .con_point_list .img{height:178px;} }