/* BASIC css start */
/* BASIC css start */
/* BASIC css start */
/* BASIC css start */
.footer .instaWrap { display: block !important } 
/*.item-wrap .item-cont .item-list .thumb { height:442px !important } */
/* 메인 비주얼 슬라이드 */
.visualWrap { font-size: 0; width: 1500px; margin: 0 auto; } 
.visualWrap .visualSlide { } 
.visualWrap .visualSlide img { width: 100% } 

.visualWrap .visualSlide .slick-arrow { margin-top:-40px; position: absolute; top:50%; width: 40px; height: 80px; background: url('/design/maatila2/maatila/phps/main/slide_arrow.png') no-repeat center; background-size: cover; font-size: 0; z-index: 1; } 
.visualWrap .visualSlide .slick-arrow.slick-prev { left: 75px; background-position: 0 0; } 
.visualWrap .visualSlide .slick-arrow.slick-next { right: 75px; background-position: 0 -80px; } 

.visualWrap .visualSlide .slick-dots { width: 100%; position: absolute; bottom: 25px; text-align: center; } 
.visualWrap .visualSlide .slick-dots li { display: inline-block; margin:0 6px; width: 10px; height: 10px; border-radius: 50%; background: #fff; opacity: 0.4 } 
.visualWrap .visualSlide .slick-dots li.slick-active { opacity: 1 } 
.visualWrap .visualSlide .slick-dots li button { font-size: 0 } 

/* 배너영역 */
.bannersWrap { width: 100%; min-width: 1200px; max-width: 1500px; margin: 50px auto 150px; overflow: hidden; font-size: 0; } 
.bannersWrap > div { display: inline-block; width: calc(50% - 15px); vertical-align: top } 
.bannersWrap > div img { width: 100% } 
.bannersWrap ul { height: 100%; display: flex; justify-content: space-between; align-items: center; gap: 0 32px; } 
.bannersWrap ul li { position: relative; width: 100%; } 
.bannersWrap ul li img { width:100%; } 
.bannersWrap ul li .hoverBox { position: absolute; top: 0; left: 0; display: block; width: 100%; height: 100%; background:0,0,0.2); opacity: 1; visibility: visible; } 
.bannersWrap ul li .hoverBox .hoverDetail { position: absolute; width: 25%; text-align: center; top: 50%; left: 50%; transform: translate(-50%, -50%); color: #fff; font-size: 16px; border: 1px solid #fff; padding: 25px 50px; white-space: nowrap; } 
.bannersWrap ul li:hover .hoverBox { opacity: 0; visibility: hidden; transition: all 0.3s } 

.bannersWrap .bannerSlide img { width: 100% } 
.bannersWrap .bannerSlide .slick-dots { width: 100%; position: absolute; bottom: 50px; right: 25px; text-align: right; } 
.bannersWrap .bannerSlide .slick-dots li { display: inline-block; margin:0 6px; width: 10px; height: 10px; border-radius: 50%; background: #fff; opacity: 1 } 
.bannersWrap .bannerSlide .slick-dots li.slick-active { background: #3c2e1c } 
.bannersWrap .bannerSlide .slick-dots li button { font-size: 0 } 

.bannersWrap .bannerSlide li { position: relative; } 
.bannersWrap .bannerSlide li p { position: absolute; bottom:0; width: 100%; height: 30px; background:rgba(60,46,28,0.5); color: #fff; font-size: 14px; text-align: center; line-height: 30px; } 
.bannersWrap .bannerSlide li p span { margin-left: 35px } 

/* 롤링 슬라이드 */
.rollWrap { width: 100%; min-width: 1200px; /*max-width: 1500px; */ background: #f8f8f8; padding: 120px 0 } 
.rollWrap .rollInner { margin: 0 100px 0 75px; font-size: 0 } 
.rollWrap .rollInner .rollDetail { display: inline-block; width: 100%; margin-right: 0%; vertical-align: top; font-size: 14px } 
.rollWrap .rollInner .rollDetail h5 { line-height: 35px; font-size: 35px; font-weight: 900; color: #333; width: 100%; text-align: center; margin: 0 auto; } 
.rollWrap .rollInner .rollDetail p { line-height: 27px; text-align: center; color: #7c7c7c; font-weight: 300; margin-top: 15px } 

.rollWrap .rollInner .rollSlide { display: inline-block; margin-top: 50px; width: 100%; padding-left: 40px; vertical-align: top; font-size: 14px } 
.rollWrap .rollInner .rollSlide li { padding: 10px; box-sizing: border-box; } 
.rollWrap .rollInner .rollSlide li .prdName { text-align:center; margin-top:35px } 
.rollWrap .rollInner .rollSlide li .prdPrice { text-align:center; margin-top:10px } 
.rollWrap .rollInner .rollSlide li .prdPrice .percent { margin-right:5px; font-size:16px; color:#978069; font-weight:bold } 
.rollWrap .rollInner .rollSlide li .prdPrice .price { font-size:16px; color:#414141; font-weight:700 } 

.rollWrap .rollInner .rollSlide .slick-slide { width: 350px; /*margin-right: 30px*/ } 
.rollWrap .rollInner .rollSlide .slick-slide .thumb { position:relative } 
.rollWrap .rollInner .rollSlide .slick-slide .thumb a { display:block } 
.rollWrap .rollInner .rollSlide .slick-slide .thumb .imgBox { display:block; position:relative; padding-top:72.5%; border-radius:100px; overflow:hidden } 
.rollWrap .rollInner .rollSlide .slick-slide .thumb .imgBox img { position:absolute; top:50%; left:50%; transform:translate(-50%, -50%) } 
.rollWrap .rollInner .rollSlide .slick-slide .thumb .timeSaleIcon { position:absolute; top:0; left:0; width:75px; height:75px; font-size:13px; color:#fff; font-weight:bold; text-align:center; line-height:75px; border-radius:50px; background:#978069; z-index:10 } 

.rollWrap .rollInner .rollSlide .slick-arrow { margin-top:-42px; opacity : 1; position: absolute; top: 50%; transform: translateY(-50%); width: 35px; height: 35px; background: url('/design/maatila2/maatila/phps/main/roll_arrow.png') no-repeat center; background-size: cover; font-size: 0; z-index: 1; } 
.rollWrap .rollInner .rollSlide .slick-arrow.slick-disabled { opacity : 0.3; } 
.rollWrap .rollInner .rollSlide .slick-arrow.slick-prev { left: 0; background-position: 0 0; } 
.rollWrap .rollInner .rollSlide .slick-arrow.slick-next { right: -39px; background-position: 0 -35px; } 

/* 베스트 상품노출 */
.bestWrap h2 { margin: 0 0 50px 0; font-size: 35px; font-weight: 700; color: #333 } 

/* 브랜드스토리 */
.storyWrap { width: 100%; min-width: 1200px; overflow: hidden; font-size: 0; background: #f8f4ef; margin-top:100px; } 
.storyWrap .storyInner { width: 100%; min-width: 1200px; max-width: 1500px; margin: 0 auto; } 
.storyWrap .storyInner > div { display: inline-block; width: calc(50% - 15px); vertical-align: top } 
.storyWrap .storyInner > div img { width: 100% } 
.storyWrap .left { margin-right: 15px; } 
.storyWrap .right { margin-left: 15px; font-size: 18px; font-weight: 200; padding: 0 150px; box-sizing: border-box; white-space: nowrap; } 
.storyWrap .right .tit { position: relative; margin-top: 40%; font-size: 60px; font-weight: 400; color :#525252; } 
.storyWrap .right .tit::after { content: ''; display: block; width: 18px; height: 18px; background: #525252; position: absolute; top: -30px; left: -2%; border-radius: 50%; } 
.storyWrap .right .sub { margin-top: 30px; line-height: 40px; } 
.storyWrap .right a { margin-top: 45%; border: 1px solid #999795; display: block; width: 100%; height: 70px; line-height: 70px; text-align: center; } 

/* 영상 영역 */
.playWrap { width: 100%; min-width: 1200px; overflow: hidden; text-align: center; } 
.playWrap h2 { margin: 0 0 80px 0; line-height: 40px; font-size: 40px; font-weight: bold; color: #333 } 
.playWrap h2 span { margin-bottom: 10px; display: block; font-size: 30px; font-weight: 400 } 

.playWrap .playInner { position: relative; } 
.playWrap .playInner img { width: 100%; } 
.playWrap .playInner .playBg { background: url('/design/maatila2/maatila/phps/main/play_back.jpg') no-repeat center; background-size: cover; height: 885px; } 

.videoWrap { position:absolute; top:50%; left:50%; margin-left:-502px; margin-top: -265px; width:1005px } 
.videoWrap .videoArea { position:relative; padding-bottom:50.25%; /* 16:9 */ padding-top: 25px; height: 0; } 
.videoWrap .videoArea iframe { position:absolute; top:0; left:0; width:100%; height:100% } 



/* 홈데코 상품노출 */
.homeWrap { margin-top: 80px; } 
.homeWrap h2 { margin: 120px 0 50px 0; font-size: 35px; font-weight: 700; color: #333 } 


/* 더보기 */
.bestWrap { margin-bottom: 60px; } 
/*.js-load1, .js-load2, .js-load3, .js-load4, .js-load5 { display: none; } 
.js-load1.active, .js-load2.active, .js-load3.active, .js-load4.active, .js-load5.active { display: block; } */
.btn-wrap { display: block; } 
.btn-wrap { text-align: center; } 
.btn-wrap a { display: inline-block; font-size: 15px; font-weight: 400; background: #b7a490; color: #fff; padding: 10px 63px; } 
.btn_moreGray { display: inline-block; font-size: 15px; font-weight: 400; background: #b7a490; color: #fff; } 

.bestNum { display:none; } 

/* BASIC css end */

