.brand-wrapper .brand-section-kv { height: 200vh; } .brand-wrapper .brand-section-kv .brand-kv-bg { background-position: 80% 50%; background-image: url(../../../img/brands/cheonnok/kv_img@2x.jpg); } @media screen and (max-width: 1023px) { .brand-wrapper .brand-section-kv .brand-kv-bg { background-image: url(../../../img/brands/cheonnok/kv_img_t@2x.jpg); } } @media screen and (max-width: 767px) { .brand-wrapper .brand-section-kv .brand-kv-bg { background-image: url(../../../img/brands/cheonnok/kv_img_m@2x.jpg); } } .brand-wrapper .brand-section-kv .brand-kv-desc { background-size: 100px; } @media screen and (max-width: 1023px) { .brand-wrapper .brand-section-kv .brand-kv-desc { background-position: calc(100% - 46px) calc(100% - 50px); background-size: 60px; } } @media screen and (max-width: 767px) { .brand-wrapper .brand-section-kv .brand-kv-desc { background-position: calc(100% - 26px) calc(100% - 30px); } } .brand-wrapper .brand-section-text-img .brand-text-img-content .brand-motion-content-desc .brand-text-img__text-desc { max-width: 45.5%; } @media screen and (max-width: 767px) { .brand-wrapper .brand-section-text-img .brand-text-img-content .brand-motion-content-desc .brand-text-img__text-desc { max-width: 300px; } } .brand-wrapper .brand-section-product { position: relative; height: 200vh; overflow: visible !important; } .brand-wrapper .brand-product-content { position: absolute; width: 100vw; height: 100vh; left: 0; top: 0; } @media screen and (max-width: 1280px) { .brand-wrapper .brand-product-content { height: var(--app-height); } } .brand-wrapper .brand-product-content .__scene { position: absolute; width: 100%; height: 100%; top: 0; left: 0; } .brand-wrapper .brand-product-content .__scene .__scene-inner { position: absolute; width: 100vw; height: 100vh; top: 0; left: 0; background-color: #fff; } @media screen and (max-width: 1280px) { .brand-wrapper .brand-product-content .__scene .__scene-inner { height: var(--app-height); } } .brand-wrapper .brand-product-content .__scene.__over { overflow: hidden; top: auto; bottom: 0; height: 50%; } .brand-wrapper .brand-product-content .__scene.__over .__scene-inner { top: auto; bottom: 0; background: #1a1711; } .brand-wrapper .brand-product-content .__scene.__over .__product-container .__oval { background: #fff; } .brand-wrapper .brand-product-content .__product-container { width: 540px; height: 540px; position: absolute; top: 50%; left: 50%; transform: translate(-50%, -50%); } @media screen and (max-width: 1280px) { .brand-wrapper .brand-product-content .__product-container { width: 380px; height: 380px; } } @media screen and (max-width: 1023px) { .brand-wrapper .brand-product-content .__product-container { width: 386px; height: 386px; } } @media screen and (max-width: 767px) { .brand-wrapper .brand-product-content .__product-container { width: 250px; height: 250px; } } .brand-wrapper .brand-product-content .__product-container .__oval { background-color: #744d33; width: 100%; height: 100%; border-radius: 50%; overflow: hidden; position: absolute; top: 50%; left: 50%; transform: translate(-50%, -50%); } .brand-wrapper .brand-product-content .__product-container .__product-img { width: 29.62963%; height: 133.33333%; position: absolute; top: 50%; left: 50%; transform: translate(-50%, -50%); transform-origin: 50% 20%; } .brand-wrapper .brand-product-content .__product-container .__product-img .__img { position: absolute; width: 100%; height: 100%; top: 0; left: 0; background-size: 100% auto; background-repeat: no-repeat; transform-origin: 50% 0%; } .brand-wrapper .brand-product-content .__product-container[data-product="goodbase"] .__description-container.goodbase { display: block; } .brand-wrapper .brand-product-content .__product-container .__description { position: absolute; top: 50%; transform: translateY(-50%); left: 100%; padding: 60px; color: #fff; width: 300px; } @media screen and (max-width: 1280px) { .brand-wrapper .brand-product-content .__product-container .__description { padding: 30px; width: 270px; left: 95%; } } .brand-wrapper .brand-product-content .__product-container .__description .__description-container { display: none; } .brand-wrapper .brand-product-content .__product-container .__description .__description-container.fonts-black h3, .brand-wrapper .brand-product-content .__product-container .__description .__description-container.fonts-black p, .brand-wrapper .brand-product-content .__product-container .__description .__description-container.fonts-black span { color: #000; } .brand-wrapper .brand-product-content .__product-container .__description h3 { margin-bottom: 0.6em; line-height: 1.45; } @media screen and (max-width: 1023px) { .brand-wrapper .brand-product-content .__product-container .__description h3 span br { display: none; } } .brand-wrapper .brand-product-content .__product-container .__description p span { color: #fff; } .brand-wrapper .brand-product-content .__product-container .__description p a.remark { display: block; color: #fff; padding: 20px 0; } .brand-wrapper .brand-product-content .__product-container .__description p a.remark:after { display: inline-block; content: ''; vertical-align: middle; width: 5px; height: 10px; margin: -1px 0 0 8px; background: url("../../../img/icon/arrow-right.svg") no-repeat 50% 50%; background-size: contain; } @media screen and (max-width: 1280px) { .brand-wrapper .brand-product-content .__product-container .__description { padding: 30px; width: 270px; } } @media screen and (max-width: 1023px) { .brand-wrapper .brand-product-content .__product-container .__description { padding: 50px 30px; width: 280px; text-align: center; left: 50% !important; transform: translateX(-50%) !important; top: 100% !important; } } @media screen and (max-width: 767px) { .brand-wrapper .brand-product-content .__product-container .__description { padding: 30px; width: 280px; } } .brand-wrapper .brand-product-content .__product-container.__over .__product-img .__img { height: 100%; } .brand-wrapper .brand-section-grid-img-text { background-color: #000; color: #fff !important; margin-bottom: -1px; } @media all and (max-width: 1280px) { .brand-wrapper .brand-section-grid-img-text .brand-grid-content-right h4 { white-space: normal; } } @media all and (max-width: 1023px) { .brand-wrapper .brand-section-grid-img-text .brand-grid-content-right h4 { white-space: nowrap; } } .brand-wrapper .brand-section-bg-hover .brand-bg-hover-list ul li { cursor: pointer; } .brand-wrapper .brand-section-bg-hover .brand-bg-hover-desc .brand-bg-hover-desc-inner .brand-bg-hover-desc-content p { font-size: 60px; } .brand-wrapper .brand-section-white .brand-motion-content-desc .brand-font-bold { white-space: nowrap; } .brand-wrapper .brand-section-white .brand-motion-content-desc p { padding-top: 24px; } @media screen and (max-width: 767px) { .brand-wrapper .brand-section-white .brand-motion-content-desc p { padding-top: 0; } } .brand-wrapper .brand-section-history { background-color: #000; color: #fff !important; } .brand-wrapper .brand-section-history .brand-history__list .brand-grid-content-col.title { width: 506px; } @media all and (max-width: 1023px) { .brand-wrapper .brand-section-history .brand-history__list .brand-grid-content-col.title { width: 40%; } } @media screen and (max-width: 767px) { .brand-wrapper .brand-section-history .brand-history__list .brand-grid-content-col.title { width: 100%; } .brand-wrapper .brand-section-history .brand-history__list .brand-grid-content-col.title .brand-grid-content-desc { width: 100%; } } .brand-wrapper .brand-section-history .brand-history__list .brand-grid-content-col.title .brand-history__list-year-title { left: inherit; } @media screen and (max-width: 767px) { .brand-wrapper .brand-section-history .brand-history__list .brand-grid-content-col.title .brand-history__list-year-title { display: inline-block; vertical-align: middle; } } .brand-wrapper .brand-section-history .brand-history__list .brand-grid-content-col.title .brand-history__list-year-title .img-box { position: relative; } .brand-wrapper .brand-section-history .brand-history__list .brand-grid-content-col.title .brand-history__list-year-title .img-box.change-1 img.sat { opacity: 0; } @media screen and (max-width: 767px) { .brand-wrapper .brand-section-history .brand-history__list .brand-grid-content-col.title .brand-history__list-year-title .img-box.change-1 img.sat { opacity: 1; } } .brand-wrapper .brand-section-history .brand-history__list .brand-grid-content-col.title .brand-history__list-year-title .img-box.change-1 img.sa { opacity: 1; } .brand-wrapper .brand-section-history .brand-history__list .brand-grid-content-col.title .brand-history__list-year-title .img-box.change-2 img.sat { opacity: 0; } .brand-wrapper .brand-section-history .brand-history__list .brand-grid-content-col.title .brand-history__list-year-title .img-box.change-2 img.sa { opacity: 0; } .brand-wrapper .brand-section-history .brand-history__list .brand-grid-content-col.title .brand-history__list-year-title .img-box.change-2 img.others { opacity: 1; } .brand-wrapper .brand-section-history .brand-history__list .brand-grid-content-col.title .brand-history__list-year-title .img-box img { position: absolute; top: 0; display: block; width: 220px; } @media screen and (max-width: 1023px) { .brand-wrapper .brand-section-history .brand-history__list .brand-grid-content-col.title .brand-history__list-year-title .img-box img { width: 124px; left: 0; right: 0; margin: 0 auto; } } .brand-wrapper .brand-section-history .brand-history__list .brand-grid-content-col.title .brand-history__list-year-title .img-box img.others, .brand-wrapper .brand-section-history .brand-history__list .brand-grid-content-col.title .brand-history__list-year-title .img-box img.sa { opacity: 0; } @media screen and (max-width: 767px) { .brand-wrapper .brand-section-history .brand-history__list .brand-grid-content-col.title .brand-history__list-year-title .img-box img.others, .brand-wrapper .brand-section-history .brand-history__list .brand-grid-content-col.title .brand-history__list-year-title .img-box img.sa { opacity: 1; } } .brand-wrapper .brand-section-history .brand-history__list .brand-grid-content-col.title .brand-history__list-year-title p { font-size: 18px; font-weight: bold; text-align: center; letter-spacing: -0.18px; padding-top: 214px; } @media screen and (max-width: 1023px) { .brand-wrapper .brand-section-history .brand-history__list .brand-grid-content-col.title .brand-history__list-year-title p { font-size: 14px; padding-top: 144px; } } .brand-wrapper .brand-section-history .brand-history__list .brand-grid-content-col:last-child { margin-left: 80px; } @media all and (max-width: 1280px) { .brand-wrapper .brand-section-history .brand-history__list .brand-grid-content-col:last-child { width: 50%; } } @media screen and (max-width: 1023px) { .brand-wrapper .brand-section-history .brand-history__list .brand-grid-content-col:last-child { margin-left: 40px; } } @media screen and (max-width: 767px) { .brand-wrapper .brand-section-history .brand-history__list .brand-grid-content-col:last-child { margin-left: 0; width: 100%; } } .brand-wrapper .brand-section-history .brand-history__list .brand-grid-content-col:last-child .brand-grid-content-img ul { padding-top: 120px; } @media all and (max-width: 767px) { .brand-wrapper .brand-section-history .brand-history__list .brand-grid-content-col:last-child .brand-grid-content-img ul { padding-top: 40px; } } .brand-wrapper .brand-section-history .brand-history__list .brand-grid-content-col:last-child .brand-grid-content-img ul li:nth-of-type(1) img { width: 557px; margin-top: 80px; } @media all and (max-width: 767px) { .brand-wrapper .brand-section-history .brand-history__list .brand-grid-content-col:last-child .brand-grid-content-img ul li:nth-of-type(1) .list_contents_box { position: relative; } } .brand-wrapper .brand-section-history .brand-history__list .brand-grid-content-col:last-child .brand-grid-content-img ul li:nth-of-type(1) .list_contents_box img { width: 194px; margin-top: 0; } @media all and (max-width: 767px) { .brand-wrapper .brand-section-history .brand-history__list .brand-grid-content-col:last-child .brand-grid-content-img ul li:nth-of-type(1) .list_contents_box img { width: 100%; margin: 0; } } @media all and (max-width: 1023px) { .brand-wrapper .brand-section-history .brand-history__list .brand-grid-content-col:last-child .brand-grid-content-img ul li:nth-of-type(1) .list_contents_box .text_box { position: relative; } } @media all and (max-width: 767px) { .brand-wrapper .brand-section-history .brand-history__list .brand-grid-content-col:last-child .brand-grid-content-img ul li:nth-of-type(1) .list_contents_box .text_box { width: 55%; padding-left: 9%; } } @media all and (max-width: 1023px) { .brand-wrapper .brand-section-history .brand-history__list .brand-grid-content-col:last-child .brand-grid-content-img ul li:nth-of-type(1) .list_contents_box .text_box .text_k7 { position: relative; } .brand-wrapper .brand-section-history .brand-history__list .brand-grid-content-col:last-child .brand-grid-content-img ul li:nth-of-type(1) .list_contents_box .text_box .text_k7:nth-last-of-type(1) { position: absolute; right: 0; bottom: 0; width: calc(100% - 20px); } .brand-wrapper .brand-section-history .brand-history__list .brand-grid-content-col:last-child .brand-grid-content-img ul li:nth-of-type(1) .list_contents_box .text_box .text_k7:before { display: block; content: ''; position: absolute; top: 10px; left: -16px; width: 22%; height: 10px; background: url("../../../img/brands/cheonnok/arrow_white.svg") no-repeat 0 50%; background-size: cover; -webkit-transform: translateX(-100%); -ms-transform: translateX(-100%); transform: translateX(-100%); } } @media all and (max-width: 767px) { .brand-wrapper .brand-section-history .brand-history__list .brand-grid-content-col:last-child .brand-grid-content-img ul li:nth-of-type(1) .list_contents_box .text_box .text_k7:nth-last-of-type(1) { right: -2.3333vw; } .brand-wrapper .brand-section-history .brand-history__list .brand-grid-content-col:last-child .brand-grid-content-img ul li:nth-of-type(1) .list_contents_box .text_box .text_k7:nth-last-of-type(1):before { left: -8px; } } @media all and (max-width: 767px) { .brand-wrapper .brand-section-history .brand-history__list .brand-grid-content-col:last-child .brand-grid-content-img ul li:nth-of-type(1) .list_contents_box .text_box .text_k7:before { width: 22%; left: -12px; } } .brand-wrapper .brand-section-history .brand-history__list .brand-grid-content-col:last-child .brand-grid-content-img ul li:nth-of-type(1) .list_contents_box .text_box .text_k7 .small { display: block; font-size: 14px; color: rgba(255, 255, 255, 0.7); } .brand-wrapper .brand-section-history .brand-history__list .brand-grid-content-col:last-child .brand-grid-content-img ul li img { width: 450px; margin-top: 40px; } @media all and (max-width: 1023px) { .brand-wrapper .brand-section-history .brand-history__list .brand-grid-content-col:last-child .brand-grid-content-img ul li img { max-width: 316px; margin-top: 20px; } } @media all and (max-width: 767px) { .brand-wrapper .brand-section-history .brand-history__list .brand-grid-content-col:last-child .brand-grid-content-img ul li img { width: 93%; } } .brand-wrapper .brand-section-history .brand-history__list li { position: relative; border: none; padding: 56px 0 66px; } @media all and (max-width: 1023px) { .brand-wrapper .brand-section-history .brand-history__list li { padding: 40px 0; } } @media all and (max-width: 767px) { .brand-wrapper .brand-section-history .brand-history__list li { border-top: solid 1px rgba(255, 255, 255, 0.25); padding: 40px 0; } } .brand-wrapper .brand-section-history .brand-history__list li:before { display: block; content: ''; position: absolute; top: 0; left: 0; width: 100vw; height: 1px; background-color: rgba(255, 255, 255, 0.25); } @media all and (max-width: 767px) { .brand-wrapper .brand-section-history .brand-history__list li:before { display: none; } } .brand-wrapper .brand-section-history .brand-history__list li:last-child { padding-bottom: 0; } .brand-wrapper .brand-section-history .brand-history__list li .subtitle { font-size: 24px; margin-bottom: 50px; } @media screen and (max-width: 1023px) { .brand-wrapper .brand-section-history .brand-history__list li .subtitle { font-size: 16px; margin-bottom: 40px; } } @media screen and (max-width: 767px) { .brand-wrapper .brand-section-history .brand-history__list li .subtitle { margin-bottom: 30px; } } .brand-wrapper .brand-section-history .brand-history__list-year-title { padding-top: 160px; } @media screen and (max-width: 767px) { .brand-wrapper .brand-section-history .brand-history__list-year-title { padding-top: 60px !important; } } .brand-wrapper .brand-section-history .mobile_title { display: none; } @media screen and (max-width: 767px) { .brand-wrapper .brand-section-history .mobile_title { display: block; padding-top: 120px; text-align: center; } } .brand-wrapper .brand-section-history ul { padding-top: 450px; } @media screen and (max-width: 1023px) { .brand-wrapper .brand-section-history ul { padding-top: 310px; } } @media screen and (max-width: 767px) { .brand-wrapper .brand-section-history ul { padding-top: 20px; } } .brand-wrapper .brand-section-history ul .text_k7 { color: #fff !important; } @media screen and (max-width: 1023px) { .brand-wrapper .brand-section-history ul .text_k7 { font-size: 16px; } } @media screen and (max-width: 767px) { .brand-wrapper .brand-section-history ul .text_k7 { font-size: 15px; } } .brand-wrapper .brand-section-history ul .text_k9 { color: rgba(255, 255, 255, 0.7); } @media screen and (max-width: 1023px) { .brand-wrapper .brand-section-history ul .text_k9 { font-size: 13px; } } .brand-wrapper .brand-section-history .brand-history__list-desc { margin-bottom: 10px; } @media screen and (max-width: 1023px) { .brand-wrapper .brand-section-history .brand-history__list-desc { font-size: 24px; margin-bottom: 18px; } } .brand-wrapper .brand-section-history .list_contents_box { display: none; } @media screen and (max-width: 1023px) { .brand-wrapper .brand-section-history .list_contents_box { display: flex; } } .brand-wrapper .brand-section-history .list_contents_box:nth-of-type(1) { margin-bottom: 100px; } @media screen and (max-width: 1023px) { .brand-wrapper .brand-section-history .list_contents_box:nth-of-type(1) { margin-bottom: 0; } } .brand-wrapper .brand-section-history .list_contents_box .img_box { width: 97%; } @media all and (max-width: 767px) { .brand-wrapper .brand-section-history .list_contents_box .img_box { width: 45%; } } .brand-wrapper .brand-section-history .list_contents_box .text_box { padding-left: 20px; width: calc(100% - 20px); -webkit-box-sizing: border-box; -moz-box-sizing: border-box; box-sizing: border-box; } .brand-wrapper .brand-section-history .list_contents_box .text_box .text_k7 { margin-bottom: 15px; } .brand-wrapper .brand-section-history .list_wrap { border-top: 2px solid rgba(255, 255, 255, 0.2); border-bottom: 2px solid rgba(255, 255, 255, 0.2); } .brand-wrapper .brand-section-history .list_wrap p { padding: 28px 0; border-top: 1px solid rgba(255, 255, 255, 0.15); } @media screen and (max-width: 1023px) { .brand-wrapper .brand-section-history .list_wrap p { padding: 20px 0; } } .brand-wrapper .brand-section-history .list_wrap span { display: inline-block; margin-right: 34px; float: left; position: relative; } .brand-wrapper .brand-section-history .list_wrap b { overflow: hidden; display: block; } .brand-wrapper .brand-section-img-cross { height: 200vh; } @media all and (max-width: 1023px) { .brand-wrapper .brand-section-img-cross { height: 550vh; } } .brand-wrapper .brand-section-img-cross .brand-img-cross-content { position: relative; height: var(--app-height); } @media all and (-ms-high-contrast: none), (-ms-high-contrast: active) { .brand-wrapper .brand-section-img-cross .brand-img-cross-content { height: 100vh !important; } } .brand-wrapper .brand-section-img-cross .brand-img-cross-content .full-text { position: absolute; left: 50%; top: 50%; width: 90%; transform: translate(-50%, -50%); -webkit-transform: translate(-50%, -50%); -moz-transform: translate(-50%, -50%); -ms-transform: translate(-50%, -50%); -o-transform: translate(-50%, -50%); text-align: center; } @media screen and (max-width: 767px) { .brand-wrapper .brand-section-img-cross .brand-img-cross-content .full-text { text-align: center; max-width: 400px; } } .brand-wrapper .brand-section-img-cross .brand-img-cross-content .full-text div { display: inline-block; vertical-align: middle; } .brand-wrapper .brand-section-img-cross .brand-img-cross-content .cross-area { position: absolute; top: 0; left: 0; right: 0; height: 100%; } .brand-wrapper .brand-section-img-cross .brand-img-cross-content .cross-area .cross-box { position: absolute; width: 50%; height: 100%; overflow: hidden; } @media screen and (max-width: 1023px) { .brand-wrapper .brand-section-img-cross .brand-img-cross-content .cross-area .cross-box { width: 100%; height: 50%; } } .brand-wrapper .brand-section-img-cross .brand-img-cross-content .cross-area .cross-box .deam { display: block; content: ''; position: absolute; width: 100%; height: 100%; opacity: 0; background-color: #000; } .brand-wrapper .brand-section-img-cross .brand-img-cross-content .cross-area .cross-box .bgBox { position: absolute; width: 100%; height: 100vh; } @media screen and (max-width: 1023px) { .brand-wrapper .brand-section-img-cross .brand-img-cross-content .cross-area .cross-box .bgBox { width: 100vw; height: 100%; } } .brand-wrapper .brand-section-img-cross .brand-img-cross-content .cross-area .cross-box:first-child { top: 0; left: 0; } .brand-wrapper .brand-section-img-cross .brand-img-cross-content .cross-area .cross-box:first-child .bgBox { background: url(../../../img/brands/cheonnok/8_feature_1@2x.jpg) no-repeat 10% 100%/cover; background-size: cover; bottom: 0; right: 0; } @media screen and (max-width: 1023px) { .brand-wrapper .brand-section-img-cross .brand-img-cross-content .cross-area .cross-box:first-child .bgBox { background: url(../../../img/brands/cheonnok/8_feature_1@2x.jpg) no-repeat 50% 100%/cover; } } @media screen and (max-width: 767px) { .brand-wrapper .brand-section-img-cross .brand-img-cross-content .cross-area .cross-box:first-child .bgBox { background: url(../../../img/brands/cheonnok/8_feature_1@2x.jpg) no-repeat 50% 100%/cover; } } .brand-wrapper .brand-section-img-cross .brand-img-cross-content .cross-area .cross-box:last-child { bottom: 0; right: 0; } @media screen and (max-width: 767px) { .brand-wrapper .brand-section-img-cross .brand-img-cross-content .cross-area .cross-box:last-child .cross-box-inner { bottom: -70px; } } .brand-wrapper .brand-section-img-cross .brand-img-cross-content .cross-area .cross-box:last-child .bgBox { background: url(../../../img/brands/cheonnok/8_feature_2@2x.jpg) no-repeat 0 100%/cover; background-size: cover; top: 0; left: 0; } @media screen and (max-width: 1023px) { .brand-wrapper .brand-section-img-cross .brand-img-cross-content .cross-area .cross-box:last-child .bgBox { background: url(../../../img/brands/cheonnok/8_feature_2@2x.jpg) no-repeat 50% 100%/cover; } } @media screen and (max-width: 767px) { .brand-wrapper .brand-section-img-cross .brand-img-cross-content .cross-area .cross-box:last-child .bgBox { background: url(../../../img/brands/cheonnok/8_feature_2@2x.jpg) no-repeat 50% 100%/cover; } } .brand-wrapper .brand-section-img-cross .brand-img-cross-content .cross-area .cross-box .cross-box-inner { position: absolute; top: 50%; left: 0; right: 0; color: #fff; text-align: center; -webkit-transform: translateY(-50%); transform: translateY(-50%); } @media screen and (max-width: 1023px) { .brand-wrapper .brand-section-img-cross .brand-img-cross-content .cross-area .cross-box .cross-box-inner { bottom: -50px; } } .brand-wrapper .brand-section-img-cross .brand-img-cross-content .cross-area .cross-box .cross-box-inner .title { color: #fff; margin-bottom: 36px; } @media screen and (max-width: 1023px) { .brand-wrapper .brand-section-img-cross .brand-img-cross-content .cross-area .cross-box .cross-box-inner .title { font-size: 24px; margin-bottom: 20px; } } @media screen and (max-width: 767px) { .brand-wrapper .brand-section-img-cross .brand-img-cross-content .cross-area .cross-box .cross-box-inner .desc { max-width: 360px; margin: 0 auto; } } .brand-wrapper .brand-section-img-cross .brand-img-cross-content .cross-area .cross-box .cross-box-inner .info-wrap { display: flex; justify-content: center; gap: 30px; padding: 40px 15px 0; } @media screen and (max-width: 767px) { .brand-wrapper .brand-section-img-cross .brand-img-cross-content .cross-area .cross-box .cross-box-inner .info-wrap { gap: 10px; padding-top: 30px; } } .brand-wrapper .brand-section-img-cross .brand-img-cross-content .cross-area .cross-box .cross-box-inner .info-wrap .item { font-family: 'Minguk', sans-serif; font-size: 24px; font-weight: bold; line-height: 1.42; letter-spacing: -0.24px; padding-top: 100px; background: no-repeat top center; background-size: 80px; } @media screen and (max-width: 1023px) { .brand-wrapper .brand-section-img-cross .brand-img-cross-content .cross-area .cross-box .cross-box-inner .info-wrap .item { font-size: 13px; font-weight: 500; padding-top: 68px; background-size: 60px; } } .brand-wrapper .brand-section-img-cross .brand-img-cross-content .cross-area .cross-box .cross-box-inner .info-wrap .item1 { background-image: url("../../../img/brands/cheonnok/icon_1.svg"); } .brand-wrapper .brand-section-img-cross .brand-img-cross-content .cross-area .cross-box .cross-box-inner .info-wrap .item2 { background-image: url("../../../img/brands/cheonnok/icon_2.svg"); } .brand-wrapper .brand-section-img-cross .brand-img-cross-content .cross-area .cross-box .cross-box-inner .info-wrap .item3 { background-image: url("../../../img/brands/cheonnok/icon_3.svg"); } .brand-wrapper .brand-section-img-cross .brand-img-cross-content .cross-area .cross-box .cross-box-inner .info-wrap.info2 .item1 { background-image: url("../../../img/brands/cheonnok/icon_4.svg"); } .brand-wrapper .brand-section-video-tab .brand-section__contents { margin-top: 120px; } @media screen and (max-width: 1023px) { .brand-wrapper .brand-section-video-tab .brand-section__contents { margin-top: 70px; } } @media screen and (max-width: 767px) { .brand-wrapper .brand-section-video-tab .brand-section__contents { margin-top: 60px; } } .brand-wrapper .brand-section-video-tab .brand-section__contents .row { padding-top: 60px; border-top: solid 1px rgba(0, 0, 0, 0.2); } @media screen and (max-width: 1023px) { .brand-wrapper .brand-section-video-tab .brand-section__contents .row { padding-top: 40px; } } .brand-wrapper .brand-section-video-tab .brand-section__contents .row:after { display: block; content: ''; clear: both; } .brand-wrapper .brand-section-video-tab .brand-section__contents .row .col.type { float: left; width: 34%; font-size: 20px; font-weight: 500; color: #666; letter-spacing: -0.2px; } @media screen and (max-width: 1023px) { .brand-wrapper .brand-section-video-tab .brand-section__contents .row .col.type { float: none; width: 100%; font-size: 15px; letter-spacing: -0.15px; } } .brand-wrapper .brand-section-video-tab .brand-section__contents .row .col.con { float: right; width: 66%; margin-top: -6px; } @media screen and (max-width: 1023px) { .brand-wrapper .brand-section-video-tab .brand-section__contents .row .col.con { float: none; width: 100%; margin-top: 18px; } } .brand-wrapper .brand-section-video-tab .brand-section__contents .row .col.con .title { font-size: 40px; font-weight: bold; line-height: 1.45; letter-spacing: -0.4px; } @media screen and (max-width: 1023px) { .brand-wrapper .brand-section-video-tab .brand-section__contents .row .col.con .title { font-size: 24px; letter-spacing: -0.24px; } } .brand-wrapper .brand-section-video-tab .brand-section__contents .row .col.con .desc { font-size: 18px; line-height: 1.89; letter-spacing: -0.36px; padding: 40px 0 100px; } @media screen and (max-width: 1023px) { .brand-wrapper .brand-section-video-tab .brand-section__contents .row .col.con .desc { font-size: 14px; letter-spacing: -0.28px; padding: 24px 0 60px; } } .brand-wrapper .brand-section-video-tab .brand-section__contents .row .col.con .gu_sort_area_wrap { display: none; } @media screen and (max-width: 767px) { .brand-wrapper .brand-section-video-tab .brand-section__contents .row .col.con .gu_sort_area_wrap { display: block; } } .brand-wrapper .brand-section-video-tab .brand-section__contents .row .col.con .gu_sort_area_wrap .gu_sort_area { float: left; } .brand-wrapper .brand-section-video-tab .brand-section__contents .row .col.con .gu_sort_area_wrap .gu_sort_area .gu_sort_name a span { display: inline-block; vertical-align: top; font-size: 12px; margin-left: 10px; } .brand-wrapper .brand-section-video-tab .brand-section__contents .row .col.con .gu_sort_area_wrap .gu_sort_area .gu_selectbox .gu_selectbox_inner .gu_custom_scroll .custom_scroll_content a span { vertical-align: top; font-size: 12px; margin: 12px 0 0 10px; } .brand-wrapper .brand-section-video-tab .brand-section__contents .row .col.con .gu_sort_area_wrap .gu_sort_area .gu_selectbox .gu_selectbox_inner .gu_custom_scroll .custom_scroll_content a span:before { display: none; } .brand-wrapper .brand-section-video-tab .brand-section__contents .row .col.con .swiper-container.video-slider .bullet-text { display: none; } .brand-wrapper .brand-section-video-tab .brand-section__contents .row .col.con .swiper-container.video-slider .swiper-pagination { position: relative; bottom: inherit; } @media screen and (max-width: 767px) { .brand-wrapper .brand-section-video-tab .brand-section__contents .row .col.con .swiper-container.video-slider .swiper-pagination { display: none; } } .brand-wrapper .brand-section-video-tab .brand-section__contents .row .col.con .swiper-container.video-slider .swiper-pagination:after { display: block; content: ''; clear: both; } .brand-wrapper .brand-section-video-tab .brand-section__contents .row .col.con .swiper-container.video-slider .swiper-pagination .swiper-pagination-bullet { float: left; opacity: 1; overflow: hidden; width: calc((66.5% - 56px) / 7); height: inherit; color: rgba(0, 0, 0, 0.4); text-align: left; line-height: 52px; white-space: nowrap; margin: 0 4px; border-radius: 0; border-bottom: solid 1px rgba(0, 0, 0, 0.2); background: transparent; -webkit-transition: width 0.3s; -ms-transition: width 0.3s; transition: width 0.3s; } @media screen and (max-width: 1023px) { .brand-wrapper .brand-section-video-tab .brand-section__contents .row .col.con .swiper-container.video-slider .swiper-pagination .swiper-pagination-bullet { line-height: 42px; } } .brand-wrapper .brand-section-video-tab .brand-section__contents .row .col.con .swiper-container.video-slider .swiper-pagination .swiper-pagination-bullet.swiper-pagination-bullet-active { width: 33.5%; color: #000; border-color: #000; background: transparent; } .brand-wrapper .brand-section-video-tab .brand-section__contents .row .col.con .swiper-container.video-slider .swiper-pagination .swiper-pagination-bullet.swiper-pagination-bullet-active .text { opacity: 1; } .brand-wrapper .brand-section-video-tab .brand-section__contents .row .col.con .swiper-container.video-slider .swiper-pagination .swiper-pagination-bullet:nth-of-type(1) { margin-left: 0; } .brand-wrapper .brand-section-video-tab .brand-section__contents .row .col.con .swiper-container.video-slider .swiper-pagination .swiper-pagination-bullet:nth-last-of-type(1) { margin-right: 0; } .brand-wrapper .brand-section-video-tab .brand-section__contents .row .col.con .swiper-container.video-slider .swiper-pagination .swiper-pagination-bullet span { display: inline-block; vertical-align: middle; } .brand-wrapper .brand-section-video-tab .brand-section__contents .row .col.con .swiper-container.video-slider .swiper-pagination .swiper-pagination-bullet .step { font-size: 16px; font-weight: 500; letter-spacing: -0.24px; } @media screen and (max-width: 1023px) { .brand-wrapper .brand-section-video-tab .brand-section__contents .row .col.con .swiper-container.video-slider .swiper-pagination .swiper-pagination-bullet .step { font-size: 14px; } } .brand-wrapper .brand-section-video-tab .brand-section__contents .row .col.con .swiper-container.video-slider .swiper-pagination .swiper-pagination-bullet .text { opacity: 0; font-size: 14px; letter-spacing: -0.21px; margin-left: 20px; } @media screen and (max-width: 1023px) { .brand-wrapper .brand-section-video-tab .brand-section__contents .row .col.con .swiper-container.video-slider .swiper-pagination .swiper-pagination-bullet .text { font-size: 12px; margin-left: 16px; } } .brand-wrapper .brand-section-video-tab .brand-section__contents .row .col.con .swiper-container.video-slider .swiper-wrapper { margin-top: 30px; } @media screen and (max-width: 1023px) { .brand-wrapper .brand-section-video-tab .brand-section__contents .row .col.con .swiper-container.video-slider .swiper-wrapper { margin-top: 20px; } } @media screen and (max-width: 767px) { .brand-wrapper .brand-section-features { padding-top: 120px !important; } .brand-wrapper .brand-section-features .brand-features-content .brand-features-title { margin-bottom: 0; } } .brand-wrapper .brand-section-product.brand-section-product-intro { height: var(--app-height) !important; } @media all and (-ms-high-contrast: none), (-ms-high-contrast: active) { .brand-wrapper .brand-section-product.brand-section-product-intro { height: 100vh !important; } } .brand-wrapper .brand-section-product.brand-section-product-intro .brand-product-content .__scene.__over { height: 100%; } .brand-wrapper .brand-section-product.brand-section-product-intro .brand-product-content .__scene.__over .__product-container:after { content: ''; display: block; position: absolute; width: 100%; height: 33%; top: 6%; left: 50%; transform: translate(-50%, -50%); background-size: 100% auto; background-repeat: no-repeat; transform-origin: 50% 0%; } .brand-wrapper .brand-section-product.brand-section-product-intro .brand-product-content .__scene.__over.__over1 .__scene-inner { background: #744d33 no-repeat center / cover; } .brand-wrapper .brand-section-product.brand-section-product-intro .brand-product-content .__scene.__over.__over1 .__scene-inner .__product-container:after { background-image: url(../../../img/brands/cheonnok/en/product_1@2x.png); } .brand-wrapper .brand-section-product.brand-section-product-intro .brand-product-content .__scene.__over.__over1 .__scene-inner .__product-container[data-product="goodbase"] .__product-img .__img { background-image: url(../../../img/brands/cheonnok/en/product_1@2x.png); } .brand-wrapper .brand-section-product.brand-section-product-intro .brand-product-content .__scene.__over.__over2 .__scene-inner { background: #50392d no-repeat center / cover; } .brand-wrapper .brand-section-product.brand-section-product-intro .brand-product-content .__scene.__over.__over2 .__scene-inner .__product-container:after { background-image: url(../../../img/brands/cheonnok/en/product_2@2x.png); } .brand-wrapper .brand-section-product.brand-section-product-intro .brand-product-content .__scene.__over.__over2 .__scene-inner .__product-container[data-product="goodbase"] .__product-img .__img { background-image: url(../../../img/brands/cheonnok/en/product_2@2x.png); } .brand-wrapper .brand-section-product.brand-section-product-intro .brand-product-content .__scene.__over.__over3 .__scene-inner { background: #3b5542 no-repeat center / cover; } .brand-wrapper .brand-section-product.brand-section-product-intro .brand-product-content .__scene.__over.__over3 .__scene-inner .__product-container:after { background-image: url(../../../img/brands/cheonnok/en/product_3@2x.png); } .brand-wrapper .brand-section-product.brand-section-product-intro .brand-product-content .__scene.__over.__over3 .__scene-inner .__product-container[data-product="goodbase"] .__product-img .__img { background-image: url(../../../img/brands/cheonnok/en/product_3@2x.png); } .brand-wrapper .brand-section-product.brand-section-product-intro .brand-product-content .__scene.__over.__over4 .__scene-inner { background: #772941 no-repeat center / cover; } .brand-wrapper .brand-section-product.brand-section-product-intro .brand-product-content .__scene.__over.__over4 .__scene-inner .__product-container:after { background-image: url(../../../img/brands/cheonnok/en/product_5@2x.png); } .brand-wrapper .brand-section-product.brand-section-product-intro .brand-product-content .__scene.__over.__over4 .__scene-inner .__product-container[data-product="goodbase"] .__product-img .__img { background-image: url(../../../img/brands/cheonnok/en/product_5@2x.png); } .brand-wrapper .brand-section-product.brand-section-product-intro .brand-product-content .__scene.__over.__over5 .__scene-inner { background: #4e4a37 no-repeat center / cover; } .brand-wrapper .brand-section-product.brand-section-product-intro .brand-product-content .__scene.__over.__over5 .__scene-inner .__product-container:after { background-image: url(../../../img/brands/cheonnok/en/product_4@2x.png); } .brand-wrapper .brand-section-product.brand-section-product-intro .brand-product-content .__scene.__over.__over5 .__scene-inner .__product-container[data-product="goodbase"] .__product-img .__img { background-image: url(../../../img/brands/cheonnok/en/product_4@2x.png); } .brand-wrapper .brand-section-product.brand-section-product-intro .brand-product-content .__scene.__over.__over6 .__scene-inner { background: #123945 no-repeat center / cover; } .brand-wrapper .brand-section-product.brand-section-product-intro .brand-product-content .__scene.__over.__over6 .__scene-inner .__product-container:after { background-image: url(../../../img/brands/cheonnok/en/product_6@2x.png); } .brand-wrapper .brand-section-product.brand-section-product-intro .brand-product-content .__scene.__over.__over6 .__scene-inner .__product-container[data-product="goodbase"] .__product-img .__img { background-image: url(../../../img/brands/cheonnok/en/product_6@2x.png); } .brand-wrapper .brand-section-product.brand-section-product-intro .brand-product-content .__scene.__over.__over7 .__scene-inner { background: #272f58 no-repeat center / cover; } .brand-wrapper .brand-section-product.brand-section-product-intro .brand-product-content .__scene.__over.__over7 .__scene-inner .__product-container:after { background-image: url(../../../img/brands/cheonnok/en/product_7@2x.png); } .brand-wrapper .brand-section-product.brand-section-product-intro .brand-product-content .__scene.__over.__over7 .__scene-inner .__product-container[data-product="goodbase"] .__product-img .__img { background-image: url(../../../img/brands/cheonnok/en/product_7@2x.png); } .brand-wrapper .brand-section-product.brand-section-product-intro .brand-product-content .__scene.__over.__over8 .__scene-inner { background: #983d2d no-repeat center / cover; } .brand-wrapper .brand-section-product.brand-section-product-intro .brand-product-content .__scene.__over.__over8 .__scene-inner .__product-container:after { background-image: url(../../../img/brands/cheonnok/en/product_8@2x.png); } .brand-wrapper .brand-section-product.brand-section-product-intro .brand-product-content .__scene.__over.__over8 .__scene-inner .__product-container[data-product="goodbase"] .__product-img .__img { background-image: url(../../../img/brands/cheonnok/en/product_8@2x.png); } .brand-wrapper .brand-section-product.brand-section-product-intro .brand-product-content .__scene.__over.__over9 .__scene-inner { background: #59ad77 no-repeat center / cover; } .brand-wrapper .brand-section-product.brand-section-product-intro .brand-product-content .__scene.__over.__over9 .__scene-inner .__product-container:after { background-image: url(../../../img/brands/cheonnok/en/product_9@2x.png); } .brand-wrapper .brand-section-product.brand-section-product-intro .brand-product-content .__scene.__over.__over9 .__scene-inner .__product-container[data-product="goodbase"] .__product-img .__img { background-image: url(../../../img/brands/cheonnok/en/product_9@2x.png); } .brand-wrapper .brand-section-product.brand-section-product-intro .brand-product-content .__scene.__over .__product-container .__description.left { left: auto; right: 100%; } @media screen and (max-width: 1280px) { .brand-wrapper .brand-section-product.brand-section-product-intro .brand-product-content .__scene.__over .__product-container .__description.left { right: 95%; } } .brand-wrapper .brand-section-product.brand-section-product-intro .brand-product-content .__product-container[data-product="goodbase"] .__product-img .__img { background-image: url(../../../img/brands/cheonnok/en/product_1@2x.png); } .brand-wrapper .brand-section-product.brand-section-product-intro .brand-product-content .__product-container .__product-img { width: 100%; height: 116.9444%; top: 48%; } .has-scroll-smooth.mobile .brand-wrapper .brand-section-product { position: relative; height: calc(var(--app-height) * 2); } .brand-wrapper .brand-section-hero .brand-hero-bg { background-image: url(../../../img/brands/cheonnok/final_tit_img@2x.jpg); } @media screen and (max-width: 1023px) { .brand-wrapper .brand-section-hero .brand-hero-bg { background-image: url(../../../img/brands/cheonnok/final_tit_img@2x.jpg); } } @media screen and (max-width: 767px) { .brand-wrapper .brand-section-hero .brand-hero-bg { background-image: url(../../../img/brands/cheonnok/final_tit_img@2x.jpg); } } .has-scroll-smooth.mobile .brand-wrapper .brand-section-product { position: relative; height: calc(var(--app-height) * 2); } @media screen and (max-width: 767px) { .brand-cf-video--mobile { margin-bottom: -1px; } } body.en .brand-section-history .brand-history__list-year-title.font-title-k3 { font-family: 'CeraPro', sans-serif; font-size: 62px; line-height: 1.39; } @media screen and (max-width: 1280px) { body.en .brand-section-history .brand-history__list-year-title.font-title-k3 { font-size: 50px; line-height: 1.44; } } @media screen and (max-width: 1023px) { body.en .brand-section-history .brand-history__list-year-title.font-title-k3 { font-size: 36px; line-height: 1.5; } } @media screen and (max-width: 767px) { body.en .brand-section-history .brand-history__list-year-title.font-title-k3 { font-size: 26px; line-height: 1.46; } } .list_content_web { display: none; } body.ko .list_content_web.ko { display: block; } @media screen and (max-width: 1023px) { body.ko .list_content_web.ko { display: none; } } body.en .list_content_web.en { display: block; } @media screen and (max-width: 1023px) { body.en .list_content_web.en { display: none; } } body.en .brand-wrapper .brand-product-content .__product-container .__description p a.remark[data-trn-key="brand-cheonnok-translate-69"] { display: none; } body.cn .list_content_web.cn { display: block; } @media screen and (max-width: 1023px) { body.cn .list_content_web.cn { display: none; } } body.cn .brand-wrapper .brand-product-content .__product-container .__description p a.remark[data-trn-key="brand-cheonnok-translate-69"] { display: none; } /*# sourceMappingURL=page-en.css.map */