/* BASIC css start */ /* swiper */ .deps01 .swiper {width: 100%;height: 100%;} .deps01 .swiper-slide {text-align: center;display: flex;justify-content: center;align-items: center;} .deps01 .swiper-slide img {display: block;width: 100%;height: 100%;object-fit: cover;} .deps01 .swiper-pagination-bullet{background:transparent!important;border:1.5px solid #fff!important;} .deps01 .swiper-pagination{bottom:5%!important;} .deps01 .swiper-pagination-bullet-active{background:#ffffff!important;} .deps01 .swiper-horizontal>.swiper-pagination-bullets .swiper-pagination-bullet, .swiper-pagination-horizontal.swiper-pagination-bullets .swiper-pagination-bullet{margin:0 10px!important;} #contentWrapper {position:relative;} /* deps01 */ #contentWrapper .deps01{position:relative;} #contentWrapper .deps01 .swiper-slide{position:relative;} #contentWrapper .deps01 .swiper-slide .text_box{position:absolute;top:50%; left:50%; transform:translate(-50%,-50%);} #contentWrapper .deps01 .swiper-slide .text_box .p1{margin-bottom:3%;} #contentWrapper .deps01 .swiper-slide .text_box span {display:block;} #contentWrapper .deps01 .btn_wrap{display:flex;width:10%;margin:0 auto;position:relative; top:40px;} /* deps02 */ #contentWrapper .deps02 {width:100%;padding:12% 0;background:url('/design/dreamx860/250121/img/deps02_bg.jpg'); background-size:cover; background-position:center top; background-repeat:no-repeat;} #contentWrapper .deps02 .row01{display:flex;width:100%;max-width:2060px; margin:0 auto;} #contentWrapper .deps02 .row01 .item_box{width:50%;position:relative;} #contentWrapper .deps02 .row01 .item_box.left .text_box {position: absolute;top: 50%;transform: translateY(-50%);height: 72%;top: 50%;display: flex;flex-direction:column;justify-content: space-between;} #contentWrapper .deps02 .row01 .item_box.left .text_box .p1 span{display:block;} #contentWrapper .deps02 .row01 .item_box.right .img_box{border-radius:20px;overflow:hidden;} #contentWrapper .deps02 .row01 .item_box.right .img_box img{display:block;object-fit:cover;width:100%;} /* deps03 */ #contentWrapper .deps03 .row01{display:flex;} #contentWrapper .deps03 .row01 .item_box{width:20%;} #contentWrapper .deps03 .row01 .item_box .img_box{position:relative;} #contentWrapper .deps03 .row01 .item_box .img_box img{display:block; object-fit:cover;width:100%;} #contentWrapper .deps03 .row01 .item_box .img_box .text_box .p1{margin-bottom:35px;} #contentWrapper .deps03 .row01 .item_box .img_box .text_box a{display:inline-block;position:absolute;bottom:0;} #contentWrapper .deps03 .row01 .item_box .img_box .text_box a:after { position: absolute; content: ""; display: block; border-bottom: 1.5px solid #fff; transition: width 250ms ease-out; left: auto; right: 0; width: 0;} #contentWrapper .deps03 .row01 .item_box .img_box .text_box a:hover{color:#fff;} #contentWrapper .deps03 .row01 .item_box .img_box .text_box a:hover:after {width: 100%;left: 0; right: auto;} */ #contentWrapper .deps03 .row01 {display: flex;} #contentWrapper .deps03 .row01 .item_box {width: 33.33%;} #contentWrapper .deps03 .row01 .item_box .img_box {position: relative;} #contentWrapper .deps03 .row01 .item_box .img_box img {display: block;object-fit: cover;width: 100%;} #contentWrapper .deps03 .row01 .item_box .img_box .text_box {position: absolute;top: 36%;left: 12%;} #contentWrapper .deps03 .row01 .item_box .img_box .text_box .p1 {margin-bottom: 7%;} #contentWrapper .deps03 .row01 .item_box .img_box .text_box a {display: inline-block;position: absolute;bottom: 0;color: #fff;} #contentWrapper .deps03 .row01 .item_box .img_box .text_box a:after {position: absolute;content: "";display: block;border-bottom: 1.5px solid #fff;transition: width 250ms ease-out;left: auto;right: 0;width: 0;} #contentWrapper .deps03 .row01 .item_box .img_box:hover .text_box a:after {width: 100%;left: 0;right: auto;} #contentWrapper .deps03 .row01 .item_box .img_box:hover .text_box a {color: #fff;} /* deps03-1 */ #contentWrapper .deps03-1{padding:7% 0;} #contentWrapper .deps03-1 .row01{width:90%;max-width:2360px;margin:0 auto;} #contentWrapper .deps03-1 .row01 .item_box_wrap{display:flex;justify-content:space-between;} #contentWrapper .deps03-1 .row01 .item_box.left{width:25%;position: relative;display: flex;flex-direction: column;justify-content: space-between;} #contentWrapper .deps03-1 .row01 .item_box.right{width:75%;display:flex;justify-content:space-between;} #contentWrapper .deps03-1 .row01 .item_box.left .item .p_group{margin-bottom:5%;} #contentWrapper .deps03-1 .row01 .item_box.left .item .p_group .p1 {margin-bottom: 3%;} #contentWrapper .deps03-1 .row01 .item_box.left .item a.more_btn {display:flex;align-items:center; justify-content:center; height:50px; max-width:170px; border: 1px solid #000; border-radius: 24px; transition: all .3s;} #contentWrapper .deps03-1 .row01 .item_box.left .item a.more_btn:hover{background-color:#000;color:#fff!important;} #contentWrapper .deps03-1 .row01 .item_box.right .img_box{width:19%;position:relative;cursor:pointer;} #contentWrapper .deps03-1 .row01 .item_box.right .img_box .text_box {position: absolute;left: 8%;bottom: 10%;} #contentWrapper .deps03-1 .row01 .item_box.right .img_box img{width:100%;object-fit:cover;display:block;} /* deps04 */ #contentWrapper .deps04{padding:10% 0;} #contentWrapper .deps04 .row01{width:100%;max-width:2360px;margin:0 auto;} #contentWrapper .deps04 .row01 .all_prd {display: flex;justify-content: end;margin-bottom: 1%;text-decoration: underline; text-underline-offset: 8px;} #contentWrapper .deps04 .row01 .item_box_wrap{display:flex;justify-content:space-between;} #contentWrapper .deps04 .row01 .item_box.left{width:30%;position: relative;display: flex;flex-direction: column;justify-content: space-between;} #contentWrapper .deps04 .row01 .item_box.left .item.top{display:none;} #contentWrapper .deps04 .row01 .item_box.left .item.top.on{display:block;} #contentWrapper .deps04 .row01 .item_box.left .item.top .p_group{margin-bottom:5%;} #contentWrapper .deps04 .row01 .item_box.left .item.top .p_group .p1{margin-bottom:3%;} #contentWrapper .deps04 .row01 .item_box.left .item.top .p_group .p2 span{display:block;} #contentWrapper .deps04 .row01 .item_box.left .item.top a.more_btn {display:flex;align-items:center; justify-content:center; height:50px; max-width:170px; border: 1px solid #000; border-radius: 24px; transition: all .3s;} #contentWrapper .deps04 .row01 .item_box.left .item.top a.more_btn:hover{background-color:#000;color:#fff!important;} #contentWrapper .deps04 .row01 .item_box.left .item.bottom{overflow:hidden;padding-top:10%;} #contentWrapper .deps04 .row01 .item_box.left .item.bottom .swiper-container{position:relative;} #contentWrapper .deps04 .row01 .item_box.left .item.bottom .controler_wrap {position: absolute;top: -29%;right: 0;width: 30%;display: flex; align-items: center;justify-content: center;line-height:4px;} #contentWrapper .deps04 .row01 .item_box.left .item.bottom .controler_wrap .item.left{width:50%;position:relative;left:10px;top:2px;} #contentWrapper .deps04 .row01 .item_box.left .item.bottom .controler_wrap .item.right{width:40%;position:relative;} #contentWrapper .deps04 .row01 .item_box.left .item.bottom .controler_wrap .item.left .swiper-pagination{font-size:16px;} #contentWrapper .deps04 .row01 .item_box.left .item.bottom .controler_wrap .swiper-button-next{background:url('/design/dreamx860/250121/img/slide_next.png'); background-repeat:no-repeat; max-width: 25px;background-size: contain;background-position: center; right:0!important;} #contentWrapper .deps04 .row01 .item_box.left .item.bottom .controler_wrap .swiper-button-prev{background:url('/design/dreamx860/250121/img/slide_prev.png'); background-repeat:no-repeat; max-width: 25px;background-size: contain;background-position: center; left:0!important;} #contentWrapper .deps04 .row01 .item_box.left .item.bottom .controler_wrap .swiper-button-next::after, #contentWrapper .deps04 .row01 .item_box.left .item.bottom .controler_wrap .swiper-button-prev::after {display: none;} #contentWrapper .deps04 .row01 .item_box.left .swiper-slide .img_box{margin-bottom:5%;} #contentWrapper .deps04 .row01 .item_box.left .swiper-slide .img_box img {display: block;width: 100%;height: 100%;object-fit: cover; border-radius: 8px;} #contentWrapper .deps04 .row01 .item_box.left .swiper-slide .text_box { overflow: hidden; white-space: normal; text-overflow: ellipsis; display: -webkit-box; -webkit-line-clamp: 1; -webkit-box-orient: vertical; width: 88%; margin: 0 auto;} #contentWrapper .deps04 .row01 .item_box.left .swiper-slide.swiper-slide-active .img_box {border: 2px solid #005c9c;overflow: hidden;border-radius: 10px;} #contentWrapper .deps04 .row01 .item_box.left .swiper-pagination.swiper-pagination-fraction.swiper-pagination-horizontal{font-family: "Montserrat", serif;} #contentWrapper .deps04 .row01 .item_box.right{width:65%;overflow:hidden;} #contentWrapper .deps04 .row01 .item_box.right .swiper-slide{border-radius: 20px;overflow: hidden;} /* deps_product_board */ #contentWrapper .deps_product_board{width: 90%;max-width: 2360px;margin: 0 auto;display: flex;justify-content: space-between; padding: 7% 5% 7%;flex-direction: column; background: #fbfbfb;} #contentWrapper .deps_product_board .item_box.left{align-items: center; text-align: center; margin: 0 auto 4%;} #contentWrapper .deps_product_board .item_box.right{width:100%;display:flex;justify-content:space-between;} #contentWrapper .deps_product_board .item_box.right ul{display:flex; justify-content: space-between; flex-wrap: wrap;} #contentWrapper .deps_product_board .item_box.right ul li{width: 19%; margin-bottom: 25px;} #contentWrapper .deps_product_board .item_box.right ul li .wrap{margin-bottom: 10px; border-radius: 14px; overflow: hidden;} #contentWrapper .deps_product_board .item_box.right ul li .wrap img{display: block; width: 100%;} #contentWrapper .deps_product_board .item_box.left .item .p_group{margin-bottom:5%;} #contentWrapper .deps_product_board .item_box.left .item .p_group .p1 {margin-bottom: 3%;} #contentWrapper .deps_product_board .item_box.left .item a.more_btn {display: flex; align-items: center; justify-content: center;height: 50px;max-width: 170px; border: 1px solid #000; border-radius: 24px; transition: all .3s;margin: 0 auto;} #contentWrapper .deps_product_board .item_box.left .item a.more_btn:hover{background-color:#000;color:#fff!important;} /* deps_gallery_board */ #contentWrapper .deps_gallery_board{/*border-top: 1px #ddd solid;*/ padding: 5% 0 0;} #contentWrapper .deps_gallery_board .wrap{width: 90%; margin: 0 auto; max-width: 2060px;} #contentWrapper .deps_gallery_board .deps_gallery_swiper{padding-bottom: 10%;} #contentWrapper .deps_gallery_board .deps_gallery_swiper .swiper-slide img{display: block; width: 100%; margin-bottom: 15px; border-radius: 14px;} #contentWrapper .deps_gallery_board .deps_gallery_swiper .swiper-pagination{bottom: 20%;} #contentWrapper .deps_gallery_board .deps_gallery_swiper .swiper-pagination-bullet{background:transparent!important;border:1.5px solid #000!important;} #contentWrapper .deps_gallery_board .deps_gallery_swiper .swiper-pagination-bullet-active{background:#000!important;} #contentWrapper .deps_gallery_board .deps_gallery_swiper .swiper-horizontal>.swiper-pagination-bullets .swiper-pagination-bullet, .swiper-pagination-horizontal.swiper-pagination-bullets .swiper-pagination-bullet{margin:0 10px!important;} #contentWrapper .deps_gallery_board .item{margin-bottom: 4%;} #contentWrapper .deps_gallery_board .item .p_group{margin-bottom: 1%;} #contentWrapper .deps_gallery_board .item .p_group .p1 {margin-bottom: .3%;} #contentWrapper .deps_gallery_board .item a.more_btn {margin: 0 auto; display:flex;align-items:center; justify-content:center; height:50px; max-width:170px; border: 1px solid #000; border-radius: 24px; transition: all .3s;} #contentWrapper .deps_gallery_board .item a.more_btn:hover{background-color:#000;color:#fff!important;} /* deps05 */ #contentWrapper .deps05{padding:14% 0; background:url('/design/dreamx860/250121/img/deps05_bg.jpg'); background-size:cover; background-position:center top; background-repeat:no-repeat; } #contentWrapper .deps05 .row01 {position:relative;} #contentWrapper .deps05 .row01 .text_box {position: absolute;left: 50%;top: 50%;transform: translate(-50%, -50%); text-align:center;} #contentWrapper .deps05 .row01 .text_box a.more_btn {display: inline-block; padding: 10px 30px; max-width: 170px; margin: 0 7px; border: 1px solid #fff; border-radius: 24px; transition: all .3s;} #contentWrapper .deps05 .row01 .text_box a.more_btn:hover{background-color:#fff;color:#000!important;} #contentWrapper .deps05 .row01 .text_box .p1{margin-bottom:3%;} #contentWrapper .deps05 .row01 .text_box .p2{margin-bottom:15%;} /* 미디어 쿼리 */ @media (min-width: 1920px) and (max-width: 2400px) { #contentWrapper .deps02 .row01, #contentWrapper .deps04 .row01{width:90%;margin:0 auto;} } @media (max-width: 1920px) { #contentWrapper .deps02 .row01, #contentWrapper .deps03-1 .row01, #contentWrapper .deps04 .row01{width:90%;margin:0 auto;} #contentWrapper .deps04 .row01 .item_box.left .item.bottom .controler_wrap{width:40%;} .top_btn {bottom: -36px;} .top_btn img{max-width:70px;} } @media (max-width: 1800px) { #contentWrapper .deps03 .row01 .item_box .img_box .text_box{left: 8%;} } @media (max-width: 1660px) { #contentWrapper .deps04 .row01 .item_box.left .item.bottom .controler_wrap .swiper-button-next{max-width:20px;} #contentWrapper .deps04 .row01 .item_box.left .item.bottom .controler_wrap .swiper-button-prev{max-width:20px;} #contentWrapper .deps04 .row01 .item_box.left .item.bottom .controler_wrap .item.left .swiper-pagination{font-size:14px;} } @media (max-width: 1440px) { #contentWrapper .deps04 .row01 .all_prd{margin-bottom:1.5%;} #contentWrapper .deps04 .row01 .item_box.left .item.bottom .controler_wrap .item.left{left:2px;} } @media (max-width: 1280px) { .display_noen_1280{display:noen;} .display_show_1280{display:block;} #contentWrapper .deps03 .row01 .item_box .img_box .text_box {left: 4%;} } @media (max-width: 1024px) { #contentWrapper .deps03 .row01 .item_box .img_box .text_box{left:10%;} #contentWrapper .deps03-1 .row01 .item_box_wrap{flex-direction: column;} #contentWrapper .deps03-1 .row01 .item_box.left{width:100%;} #contentWrapper .deps03-1 .row01 .item_box.left .item {margin-bottom: 4%;} #contentWrapper .deps03-1 .row01 .item_box.right{width:100%;} #contentWrapper .deps04 .row01 .item_box_wrap{flex-direction: column;} #contentWrapper .deps04 .row01 .item_box.left{width: 100%;margin-bottom: 10%;} #contentWrapper .deps04 .row01 .item_box.right{width:100%;} #contentWrapper .deps04 .row01 .item_box.left .item.top{margin-bottom:4%;} #contentWrapper .deps04 .row01 .item_box.left .item.bottom{padding-top:5%;} #contentWrapper .deps04 .row01 .item_box.left .item.bottom .controler_wrap{top:-13%; width:20%;} #contentWrapper .deps04 .row01 .item_box.left .item.bottom .controler_wrap .item.left .swiper-pagination {font-size: 12px;} #contentWrapper .deps04 .row01 .item_box.left .item.bottom .controler_wrap .item.left {left: -8px;} #contentWrapper .deps_gallery_board ul{flex-wrap: wrap;} #contentWrapper .deps_gallery_board ul li {width: 48%; margin-bottom: 25px;} } @media (max-width: 999px) { #contentWrapper .deps03 .row01 .item_box .img_box .text_box {left: 10%;} } /* BASIC css end */