/* BASIC css start */
/* 메인 배너 */
.mainSlideWrap .swiper-pagination{width:200px;text-align:center;left:50%;margin-left:0px;height:30px;bottom:0;}
.mainSlideWrap .swiper-pagination-bullet{width:20px;height:6px;border-radius:9999px;transition-duration:.3s;background-color:#fff;opacity:0.7 !important;}
.mainSlideWrap .swiper-pagination-bullet-active{width:40px;background-color:#000;}

.main_roll_big{display:block;width:100%;}
.main_roll_big img{width:100%;}

.main_custom{text-align:center;}
.main_custom .main_custom_tit{font-family:'notokr-light';color:#000;font-size:30px;padding:132px 0 22px;}
.main_custom .main_custom_tit p{font-family:'Montserrat';font-size:15px;line-height:32px;}
.main_custom .main_custom_tx{font-family:'notokr-demilight';color:#000;font-size:14px;line-height:20px;}
.main_custom .main_custom_bt{display:block;margin:34px auto 252px;background:#333;width:456px;height:47px;line-height:47px;border-radius:23px;cursor:pointer;transition:0.3s;}
.main_custom .main_custom_bt a{font-family:'notokr-demilight';color:#fff;font-size:14px;}
.main_custom .main_custom_bt:hover{background:#000;}

.main_video{display:block;width:100%;}
.main_video iframe { width:100%; margin:0 auto; aspect-ratio:16/9; height:auto; display:block;}


[class^="main_roll"]{position:relative;text-align:left;}
[class^="main_roll"] .slideBox{padding-bottom:25px;}
[class^="main_roll"] .main_roll_01_tit{font-family:'notokr-light';color:#000;font-size:27px;padding:245px 0 34px 60px;box-sizing:border-box;}
[class^="main_roll"] img{width:100%;}

.main_bn01{text-align:left;width:81%;margin:200px auto; }
.main_bn01 .main_bn01_tit{font-family:'notokr-light';color:#000;font-size:27px;padding:0 0 70px;text-align:center;}
.main_bn01 .main_bn01_tit p{color:#292929;font-size:15px;font-family:'NotoSerifKR';padding:0 0 8px;}

.main_bn01 ul{overflow:hidden;display:flex;align-items:center;}
.main_bn01 ul li.tx{float:left;width:43%;box-sizing:border-box;padding-left:2%;font-family:'notokr-demilight';color:#000;font-size:14px;line-height:20px;}
.main_bn01 ul li.tx .tit{font-family:'notokr-light';color:#000;font-size:27px;padding:0 0 34px;}
.main_bn01 ul li.tx .tit p{color:#292929;font-size:15px;font-family:'NotoSerifKR';padding:0 0 17px;}
.main_bn01 ul li.tx .bt{border:1px solid #353535;width:300px;height:45px;margin-top:40px;box-sizing:border-box;}
.main_bn01 ul li.tx .bt a{display:block;width:100%;height:45px;line-height:45px;font-family:'notokr-demilight';color:#000;font-size:14px;padding-left:10%;box-sizing:border-box;}
.main_bn01 ul li.tx .bt a:hover{background:#000;color:#fff;transition:all 0.3s ease;-webkit-transition:all 0.3s ease;}
.main_bn01 ul li.tx .bt a span{padding-left:7.5%;}
.main_bn01 ul li.im{float:left;width:57%;}
.main_bn01 ul li.im img{width:100%;}


.main_bn02{text-align:left;width:81%;margin:0px auto;}
.main_bn02 ul{overflow:hidden;display:flex;align-items:center;}
.main_bn02 ul li.im{float:left;width:57%;}
.main_bn02 ul li.im img{width:100%;}
.main_bn02 ul li.tx{float:left;width:43%;box-sizing:border-box;padding-left:7%;font-family:'notokr-demilight';color:#000;font-size:14px;line-height:20px;}
.main_bn02 ul li.tx .tit{font-family:'notokr-light';color:#000;font-size:27px;padding:0 0 34px;}
.main_bn02 ul li.tx .tit p{color:#292929;font-size:15px;font-family:'NotoSerifKR';padding:0 0 17px;}
.main_bn02 ul li.tx .bt{border:1px solid #353535;width:300px;height:45px;margin-top:48px;box-sizing:border-box;}
.main_bn02 ul li.tx .bt a{display:block;width:100%;height:45px;line-height:45px;font-family:'notokr-demilight';color:#000;font-size:14px;padding-left:10%;box-sizing:border-box;}
.main_bn02 ul li.tx .bt a:hover{background:#000;color:#fff;transition:all 0.3s ease;-webkit-transition:all 0.3s ease;}
.main_bn02 ul li.tx .bt a span{padding-left:7.5%;}

.main_cm{display:block;width:100%;margin-top:227px;position:relative;}
.main_cm p{position:absolute;left:50%;top:51%;-webkit-transform:translate(-50%, -50%);transform:translate(-50%, -50%);}
.main_cm p a{font-family:'notokr-demilight';color:#333;font-size:13px;display:block;width:156px;height:25px;line-height:25px;border-radius:12px;margin:12px auto;background:#fff;text-align:center;}
.main_cm img{width:100%;}

/* tabProduct */
#tabProduct{position:relative;}
#tabProduct .h_title{text-align:center;font-family:'notokr-light';color:#000;font-size:27px;padding:245px 0 34px;}


/* 커스텀무드 셀렉션 슬라이드 */
.main_roll_01 .swiper.main_roll_swiper1{width:calc(100% - 60px);margin-right:0;}
.main_roll_01 .swiper-pagination{width:96.875% !important;left:3.125% !important;right:auto !important;bottom:0;text-align:left;}
.main_roll_01 .swiper-pagination-bullet{width:3px;height:3px;border-radius:9999px;transition-duration:.3s;}
.main_roll_01 .swiper-pagination-bullet-active{width:20px;background-color:#000;}
.main_roll_01 .swiper-button-prev,
.main_roll_01 .swiper-button-next{width:40px;height:100%;z-index:10;background-repeat:no-repeat;background-position:center;background-size:40px 40px;}
.main_roll_01 .swiper-button-prev::after,
.main_roll_01 .swiper-button-next::after{display:none;}
.main_roll_01 .swiper-button-prev{top:0;bottom:auto;left:0;right:auto;background-image:url('/design/custommood/deetong/main/arr07.png');}
.main_roll_01 .swiper-button-next{top:auto;bottom:0;left:auto;right:0;background-image:url('/design/custommood/deetong/main/arr08.png');}
.main_roll_01 .swiper-roll-hide{display:none !important;}


.main_roll_02 .swiper.main_roll_swiper2{width:100%;margin-right:0;}
.main_roll_02 .swiper-button-prev,
.main_roll_02 .swiper-button-next{width:48px;height:48px;top:50%;bottom:auto;z-index:10;background-repeat:no-repeat;background-position:center;background-size:48px 48px;opacity:0;visibility:hidden;transform:translateY(-50%);transition:opacity .3s,visibility .3s;}
.main_roll_02 .swiper-button-prev::after,.main_roll_02 .swiper-button-next::after{display:none;}
.main_roll_02 .swiper-button-prev{left:10px;right:auto;background-image:url('/design/custommood/deetong/2023/arr05.png');}
.main_roll_02 .swiper-button-next{left:auto;right:10px;background-image:url('/design/custommood/deetong/2023/arr06.png');}
.main_roll_02.is-wrapper-hover .swiper-button-prev,
.main_roll_02.is-wrapper-hover .swiper-button-next{opacity:1;visibility:visible;}


.main_roll_02 { padding-bottom:200px}
.main_roll_02 .tit{font-family:'notokr-light';color:#000;font-size:27px;padding:247px 0 70px;text-align:center;}
.main_roll_02 .tit p{color:#292929;font-size:15px;font-family:'NotoSerifKR';padding:0 0 8px;}


.main_roll_03 { display:grid; grid-template-columns:45% 55%; overflow:hidden; align-items:center; }
.main_roll_03 .tx { display:flex; flex-direction:column; justify-content:center; padding:0px 0 0 60px; box-sizing:border-box; font-family:'notokr-demilight'; color:#000; font-size:14px; line-height:20px; }
.main_roll_03 .tx .tit { padding:0 0 34px; font-family:'notokr-light'; color:#000; font-size:27px; }
.main_roll_03 .tx .tit p { padding:0 0 17px; color:#292929; font-size:15px; font-family:'NotoSerifKR'; }
.main_roll_03 .tx .bt { width:300px; height:45px; margin-top:48px; border:1px solid #353535; box-sizing:border-box; }
.main_roll_03 .tx .bt a { display:block; width:100%; height:45px; line-height:45px; padding-left:10%; box-sizing:border-box; font-family:'notokr-demilight'; color:#000; font-size:14px; text-decoration:none; transition:all .3s ease; }
.main_roll_03 .tx .bt a:hover { background:#000; color:#fff; }
.main_roll_03 .tx .bt a span { padding-left:10%; }
.main_roll_03 .pagination { display:flex; align-items:center; gap:5px; margin-top:150px; }
.main_roll_03 .pagination button { display:block; width:4px; height:4px; margin:0; padding:0; border:0; background:#333; border-radius:50%; cursor:pointer; font-size:0; line-height:0;}
.main_roll_03 .pagination button.active { width:20px; border-radius:10px; }
.main_roll_03 .slideBox { position:relative; overflow:hidden; }
.main_roll_03 .slideTrack { position:relative; width:100%; }
.main_roll_03 .slide { position:absolute; top:0; left:0; width:100%; opacity:0; visibility:hidden; transform:scale(1.018); transition:opacity 1.6s ease, transform 2.6s ease, visibility 0s linear 1.6s; }
.main_roll_03 .slide.active { position:relative; opacity:1; visibility:visible; z-index:2; transform:scale(1); transition:opacity 1.6s ease, transform 2.6s ease; }
.main_roll_03 .slide img { width:100%; height:auto; display:block; }



/* BASIC css end */

