/* 팝업 */
.pop{position:absolute; overflow:hidden; z-index:9999;   background:#fff; border:1px solid #ddd;box-shadow:3px 3px 6px rgba(0,0,0,12%); }
.pop .imgBox{background:#fff; width:100%;}
.pop .txtBox{width:100%;   overflow:hidden;  border-top:1px solid #ddd;  display:flex; align-items: center;}
.pop .txtBox button{width:50%;  padding:10px 10px; box-sizing:border-box; color:#000;}
.pop .txtBox button.today{border-right:1px solid #ddd;}
.pop .txtBox button.pop_close{float:right; cursor:pointer;   height:100%;   }
.pop .txtBox button:hover{background:#eee;}


/* 메인 배너 */
.mainBnSwiper {height:100%;}
.main_wrap{overflow:hidden; height: 670px;}
.mainBnSwiper .swiper-slide a img{width:100%; height:100%;} 
.swp_arrowBox{position: absolute; width: auto;  bottom: 70px;   right: 185px; display:inline-block;}
.swp_arrowBox .pasingBox{position: relative;   background: rgba(0,0,0,0.3);  width: 130px;  height: 34px;  border-radius: 100px;
    z-index: 10;  display:inline-block;}
.swp_arrowBox .pasingBox .swiper-button-next{display:inline-block; color:#fff !important; height: 15px; width: 10px; margin-top: -10px; right:15px; z-index:20;}
.swp_arrowBox .pasingBox .swiper-button-next:after{display:none;}
.swp_arrowBox .pasingBox .swiper-button-prev:after{display:none;}
.swp_arrowBox .pasingBox .swiper-button-prev{display:inline-block; color:#fff !important; height: 15px; width: 10px; margin-top: -10px; left:15px; z-index:20;}
.swp_arrowBox .pasingBox .swiper-pagination{display:inline-block;  color:#fff !important; bottom:11px; font-size:0px; z-index:10;}
.swp_arrowBox .pasingBox .swiper-pagination span{color:#fff; font-size: 16px; display: inline-block;  height: 15px;}
.swp_arrowBox .pasingBox .swiper-pagination .swiper-pagination-current{ margin-right: 10px; box-sizing:border-box; padding-right:10px; position:relative;}
.swp_arrowBox .pasingBox .swiper-pagination .swiper-pagination-current:after{position: absolute; content:''; width:1px; height:100%; right: -2px; background: #999; top:69%;
transform:translateY(-50%);}
/*.swp_arrowBox .pasingBox .swiper-pagination .swiper-pagination-total{color: #828282;}*/
.swiper-button-disabled{opacity:1 !important;}
.swiper-slide a{width:100%; height:100%; display:block;}
.swp_arrowBox .btn_pause_stop{    position: relative;  margin-left: 5px;  background: rgba(0,0,0,0.3);  width: 34px;  height: 34px;  border-radius: 50%; z-index: 10; cursor: pointer;
display:inline-block;}
.swp_arrowBox .btn_pause_stop:after{position: absolute;  content:'\f04c';font-family: 'FontAweSome'; font-size: 18px; color:#fff; left:50%; top:50%; transform: translate(-50%, -50%);}
.swp_arrowBox .btn_pause_play{    position: relative;  margin-left: 5px;  background: rgba(0,0,0,0.3);  width: 34px;  height: 34px;  border-radius: 50%; z-index: 10; cursor: pointer;
display:none;}
.swp_arrowBox .btn_pause_play:after{position: absolute;  content:'\f04b';font-family: 'FontAweSome'; font-size: 18px; color:#fff; left:50%; top:50%; transform: translate(-50%, -50%);}


/* section 공통 */
.section{width:100%;}
.section .inner{width:100%; overflow:hidden; padding: 100px 0px; box-sizing:border-box;  }
.section .titleBox{text-align:center; margin-bottom: 50px;}
.section .titleBox h3.title{ font-size:40px; font-weight:bold;}
.section .titleBox p.sub_title{font-size: 22px; color:#888888; margin-top:15px;}


/* 디자인 템플릿 */
.bbs_none{text-align:center; height:100%;   display: flex; justify-content: center; align-items: center; flex-wrap: wrap;}
.bbs_none p{width: 100%; display:block;}
.bbs_none > div{overflow:hidden;    }
.bbs_none p.text{font-size: 22px; margin-top:20px;}

.tabBox{width: 1100px;  margin:0 auto;}
.tabBox .tabSwiper{max-width: 1050px;   overflow:hidden; box-sizing:border-box; padding:0px 53px; margin: 0 auto; position: relative;}
.tabBox .tabSwiper .swiper-wrapper .swiper-slide{ text-align: center; width: auto !important; cursor:pointer;}
.tabBox .tabSwiper .swiper-wrapper .swiper-slide .tab{box-sizing:border-box; padding: 8px 30px; width: auto !important;  border-radius: 100px; display:inline-block;
  /* color:#1d1d1d; */ font-size:15px; border:1px solid #4BB7FF;}
.tabBox .tabSwiper .swiper-wrapper .swiper-slide .tab a{width:100%; height: 100%; display:inline-block;}
.tabBox .tabSwiper .swiper-wrapper .swiper-slide.active .tab{ background:#4BB7FF; color:#fff;}
.tabBox .tabSwiper .swiper-wrapper .swiper-slide.active .nr_grade{ background:#a1d386;a1d386}
.tabBox .tabSwiper .swiper-wrapper .swiper-slide.active .nr_businessGroup{ background:#f79f58;}
.arrowBtn.active{border:1px solid #ddd;   }
/* .arrowBtn.active:after{color:#000 !important;} */
.arrowBtn:hover{border:1px solid #ddd;  }
/* .arrowBtn:hover:after{color:#000 !important;} */

.swiper-button-prev-tab{left: 0px; }
.swiper-button-next-tab{right: 0px; }
.swiper-button-prev-tab, .swiper-button-next-tab{border:1px solid #ddd; border-radius:100%; width: 30px ;height: 30px; transform:translateY(15%);  background:#fff; z-index:2;}
.swiper-button-prev-tab:after, .swiper-button-next-tab:after{font-size: 12px; color:#000 !important; }
.tabBox .tabSwiper:before{position:absolute; content:''; width: 50px; height:50px; background:#fff; left:0; top:0; z-index:2;}
.tabBox .tabSwiper:after{position:absolute; content:''; width: 50px; height:50px; background:#fff; right:0; top:0;  z-index:1;}
/* .swiper-button-prev-tab, .swiper-button-next-tab{ color:#000 !important;} */
.swiper-button-prev-tab.swiper-button-disabled, .swiper-button-next-tab.swiper-button-disabled{  opacity:30% !important;}
/* .swiper-button-prev-tab.swiper-button-disabled.active:after, .swiper-button-next-tab.swiper-button-disabled.active:after{   color: #000 !important;} */
/* .swiper-button-prev-tab.swiper-button-disabled.active:hover:after, .swiper-button-next-tab.swiper-button-disabled.active:hover:after{   color: #000 !important;} */

.galleryBox{ height:460px; overflow:hidden; margin-top: 70px;}
.galleryBox .scbSwiper{height:100%; overflow:visible;  width:1550px; margin:0 auto;  }
.galleryBox .scbSwiper .swiper-wrapper{height:auto; align-items: center;   transition-timing-function: linear; margin-left: -450px;   height:100%; }
.galleryBox .scbSwiper .swiper-slide{  text-align:center; filter: blur(5px); transform: scale(0.8);  transition:all 0.8s;  height:195px; width:auto; }
.galleryBox .scbSwiper .swiper-slide a{ display:flex; align-items: center;  }
.galleryBox .scbSwiper .swiper-slide .imgBox{width:100%;  position: relative;  height: 195px;  }
.galleryBox .scbSwiper .swiper-slide-active{ background: url("/images/r_img/scb_swiper_bg.png") no-repeat right/contain;  filter: blur(0px); width:  815px !important;
margin:0px 90px 0px 70px;  transition:all 0.8s; transform: scale(1.0) ;  height: 460px; cursor: pointer;  }
.galleryBox .scbSwiper .swiper-slide-active .imgBox{width:100% ;position: relative;   height:100%; }

.galleryBox .scbSwiper .swiper-slide .thm_img img{transition:all 0.8s;}
.galleryBox .scbSwiper .swiper-slide-active .thm_img img{transition:all 0.8s;}
.galleryBox .scbSwiper .swiper-slide .mok_bg img{transition:all 0.8s;}
.galleryBox .scbSwiper .swiper-slide-active .mok_bg img{ transition:all 0.8s;}

.galleryBox .scbSwiper .swiper-slide img{position: absolute;}
.galleryBox .scbSwiper .swiper-slide img.pc_scb{left:0px; bottom:0px;width:277px; height:133px; z-index:1; }
.galleryBox .scbSwiper .swiper-slide img.mo_scb{right:-30px; bottom: -23px;width:100px; height:115px; z-index:3;}
.galleryBox .scbSwiper .swiper-slide img.pc_img{left: 29px; bottom:2px; width:240px; height:115px;  border-radius: 0px 0px 8px 8px; z-index:2;}
.galleryBox .scbSwiper .swiper-slide img.mo_img{right:-10px; bottom:0px; width:50px; height: 84px; z-index:4; }

.galleryBox .scbSwiper .swiper-slide-active img.pc_scb{left:20px; bottom:40px;width:632px; height:380px; }
.galleryBox .scbSwiper .swiper-slide-active img.mo_scb{right:0; bottom:0;width:290px; height:331px;}
.galleryBox .scbSwiper .swiper-slide-active img.pc_img{left:81px; bottom:53px; width:549px; height:330px; }
.galleryBox .scbSwiper .swiper-slide-active img.mo_img{right:49px; bottom:47px; width:145px; height:243px;}

.swiper-button-next-scb{color:#B7B7B7; right: 20%;}
.swiper-button-prev-scb{color:#B7B7B7; left: 20%;}


/* 테마 설명 */
.galleryBox .scbSwiper .swiper-slide .thm_textBox{display:none;}
.galleryBox .scbSwiper .swiper-slide-active .thm_textBox{position:absolute; left:81px; top:58px; width:690px; height:389px; z-index: 11111; text-align:left; background: url('/images/r_img/thm_text_bg.png') no-repeat  center/contain;
transition: all 0.5s; opacity:0; display:inline-block;}
.galleryBox .scbSwiper .swiper-slide-active:hover .thm_textBox{ opacity:1; transition: all 0.5s;}
.galleryBox .scbSwiper .swiper-slide-active .thm_textBox .box_wrap{width:100%; height:100%; overflow:hidden; display:flex; box-sizing:border-box; padding: 30px; align-items: flex-end;}
.galleryBox .scbSwiper .swiper-slide-active .thm_textBox .box_wrap .txtBox{width:100%;  overflow:hidden; }
.galleryBox .scbSwiper .swiper-slide-active .thm_textBox .box_wrap .txtBox .thm_name{ font-size: 25px; color:#fff; margin-bottom: 20px; }
.galleryBox .scbSwiper .swiper-slide-active .thm_textBox .box_wrap .txtBox .txt{ font-size: 18px;  line-height:1.5;}
.galleryBox .scbSwiper .swiper-slide-active .thm_textBox .box_wrap .txtBox ul{width:100%; overflow:hidden;}
.galleryBox .scbSwiper .swiper-slide-active .thm_textBox .box_wrap .txtBox ul li{color: #fff; margin-bottom: 5px;}
.galleryBox .scbSwiper .swiper-slide-active .thm_textBox .box_wrap .txtBox ul li:last-child{margin-bottom:5px;}
.galleryBox .scbSwiper .swiper-slide-active .thm_textBox .box_wrap .txtBox ul li span{display: inline-block; font-size:14px;}
.galleryBox .scbSwiper .swiper-slide-active .thm_textBox .box_wrap .txtBox ul li span.tit{width:10%; background:#fff; color:#1d1d1d; text-align:center; font-weight:bold; box-sizing:border-box;
padding: 5px 5px;   margin-right:5px;}


/* 템플릿 레이어 */
body.temp_open{overflow:hidden;} 
.slide-tab-content{display:none;}
.slide-tab-content.current{display:block;}

.slideTabs{text-align:center; margin-bottom: 22px;}
.layerTabs{display:inline-block; overflow:hidden; box-sizing:border-box; padding:5px; border-radius: 100px; background: #EFF1F4; position: relative;z-index: 1; transition:all 0.3s;}
.layerTabs li{display:inline-block;  width: 70px; height:35px;  cursor:pointer;line-height:37px; text-align:center; }
.layerTabs li i{color:#bbb; font-size: 18px;}
.layerTabs li.current i{color: #223C60;}

.layerTabs:after{ width: 70px; height:35px; border-radius: 100px; background: #fff;box-shadow:0px 0px 5px rgba(0,0,0,20%); position:absolute; top:50%;transform:translateY(-50%);  content:'';
z-index:-1;}
.layerTabs.left:after{left:5px; transition:all 0.3s; }
.layerTabs.right:after{left:78px; transition:all 0.3s; }

.tempLayer, .portLayer{position:fixed; left:0%; top:0%;   width: 100%; height:100%; z-index: 999999; display: none ;}
.tempLayer.open, .portLayer.open {display:block;}
.swiper-slide img {
      display: block;
      width: 100%;
      height: 100%;
      object-fit: cover;
}
.main_wrap .swiper-slide img {
  /* height: auto !important; */
}

.bgLayer{position:fixed; left:0%; top:0%;   width: 100%; height:100%;   background: rgba(0,0,0,60%); backdrop-filter: blur(5px);}
.bgLayer:hover{cursor:url('/images/r_img/close_pointer.png') 20 30, auto;}

.tempLayer .layerBox,
.portLayer .layerBox {position:fixed; left:50%; top:50%; transform:translate(-50%, -50%); width: 1200px; height: 750px; background:#fff;  border-radius: 10px;
box-shadow: 5px 5px 10px rgba(0,0,0,15%);}
.tempLayer .layerBox > div,
.portLayer .layerBox > div {width: 100%; overflow:hidden; box-sizing:border-box; padding:50px 40px; display:flex; height: 100%; justify-content: space-between;}
.tempLayer .layerBox > div .closeBtn,
.portLayer .layerBox > div .closeBtn {position: absolute; right:20px; top: 20px; font-size:20px; color:#888;}
.tempLayer .layerBox > div .leftBox,
.portLayer .layerBox > div .leftBox {width: 61%; display:inline-block;}
.tempLayer .layerBox > div .leftBox > div,
.portLayer .layerBox > div .leftBox > div {width: 100%;  }
.tempLayer .layerBox > div .leftBox > div .slide-tab-content {width:100%; height:100%;position:relative;}
.tempLayer .layerBox > div .leftBox > div .slide-tab-content .gallery-main-swiper{  border-bottom: 1px solid #ddd; box-sizing: border-box; padding-bottom: 50px; overflow:hidden;}
.tempLayer .layerBox > div .leftBox > div .slide-tab-content .gallery-main-swiper .swiper-slide{width:100%;}
.tempLayer .layerBox > div .leftBox > div .slide-tab-content .gallery-main-swiper .swiper-slide img{width:99.7%; height: auto;border:1px solid #eee;  }
.tempLayer .layerBox > div .leftBox > div .slide-tab-content .gallery-thumb-swiper{width:100%;margin-top: 41px; overflow:hidden !important;}
.tempLayer .layerBox > div .leftBox > div .slide-tab-content .gallery-thumb-swiper .swiper-slide{width: 19%;box-sizing:border-box; padding: 3px;  opacity:60%;}
.tempLayer .layerBox > div .leftBox > div .slide-tab-content .gallery-thumb-swiper .swiper-slide img{width:100%; border:1px solid #eee;}
.tempLayer .layerBox > div .leftBox > div .slide-tab-content .gallery-thumb-swiper .swiper-slide-thumb-active{border:1px solid #000; opacity:100%;}
.tempLayer .layerBox > div .leftBox > div .slide-tab-content .gallery-main-swiper-mo{ border-bottom: 1px solid #ddd; box-sizing: border-box; padding-bottom: 40px; overflow:hidden;}
.tempLayer .layerBox > div .leftBox > div .slide-tab-content .gallery-main-swiper-mo .swiper-slide{width: 100%; text-align:center; background:#f3f3f3; box-sizing:border-box; padding:20px;}
.tempLayer .layerBox > div .leftBox > div .slide-tab-content .gallery-main-swiper-mo .swiper-slide img{width: auto; height:374px; border:1px solid #eee; margin:0 auto;}
.tempLayer .layerBox > div .leftBox > div .slide-tab-content .gallery-thumb-swiper-mo{width:100%; margin-top: 40px; overflow:hidden !important;}
.tempLayer .layerBox > div .leftBox > div .slide-tab-content .gallery-thumb-swiper-mo .swiper-slide{width: 8%;box-sizing:border-box; padding: 3px; opacity:60%;}
.tempLayer .layerBox > div .leftBox > div .slide-tab-content .gallery-thumb-swiper-mo .swiper-slide img{width:100%; border:1px solid #eee;}
.tempLayer .layerBox > div .leftBox > div .slide-tab-content .gallery-thumb-swiper-mo .swiper-slide-thumb-active{border:1px solid #000; opacity:100%;}
.tempLayer .layerBox > div .leftBox > div .slide-tab-content .swiper-slide img { display: block;  width: 100%; height: 100%;  }


.swiper-gallery-next-mo{position:absolute; top:544px !important; right:0; z-index:998;}
.swiper-gallery-prev-mo{position:absolute; top:544px  !important; z-index:998; left:0;}
.swiper-gallery-next-mo, .swiper-gallery-prev-mo{width:40px; height:40px; border-radius:100%; line-height:40px;background:#fff; border:1px solid #ddd;  cursor:pointer;}
.swiper-gallery-next-mo:after, .swiper-gallery-prev-mo:after{color:#000; font-size:16px; position:absolute; left:50%; top:50%; transform:translate(-50%, -50%); font-family: 'FontAwesome';} 
.swiper-gallery-next-mo:after{content: '\f105';}
.swiper-gallery-prev-mo:after{content: '\f104';}
.swiper-gallery-prev-mo.swiper-button-disabled, .swiper-gallery-next-mo.swiper-button-disabled{display:none;}


.tempLayer .layerBox > div .rightBox,
.portLayer .layerBox > div .rightBox {width: 35%; display:inline-block;}
.tempLayer .layerBox > div .rightBox .titBox .tit,
.portLayer .layerBox > div .rightBox .titBox .tit {font-size: 27px; line-height: 1.5;}
.tempLayer .layerBox > div .rightBox .infoBox,
.portLayer .layerBox > div .rightBox .infoBox {border-top:1px solid #000; border-bottom:1px solid #000; margin:30px 0px;   font-size:14px;}
.tempLayer .layerBox > div .rightBox .infoBox .pageNum,
.portLayer .layerBox > div .rightBox .infoBox .pageNum {border-bottom:1px solid #ddd;}
.tempLayer .layerBox > div .rightBox .infoBox .pageNum p,
.portLayer .layerBox > div .rightBox .infoBox .pageNum p {display:inline-block; color: #1d1d1d; }
.tempLayer .layerBox > div .rightBox .infoBox .pageNum p.tit,
.portLayer .layerBox > div .rightBox .infoBox .pageNum p.tit {font-weight:bold; width: 18%; border-right:1px solid #ddd; text-align:center; box-sizing:border-box; padding:15px 0px;
margin-right:15px;}
.tempLayer .layerBox > div .rightBox .infoBox .sizeBox p,
.portLayer .layerBox > div .rightBox .infoBox .sizeBox p {display:inline-block; color: #1d1d1d;  } 
.tempLayer .layerBox > div .rightBox .infoBox .sizeBox p.oneTit,
.portLayer .layerBox > div .rightBox .infoBox .sizeBox p.oneTit {font-weight:bold; width: 18%; border-right:1px solid #ddd; text-align:center; box-sizing:border-box; padding:15px 0px;
margin-right:15px;}
.tempLayer .layerBox > div .rightBox .middleBox{display:flex; justify-content: space-between;align-items: center;     margin-top: auto;}
.tempLayer .layerBox > div .rightBox .middleBox button{box-sizing:border-box; padding:15px 5px; font-size:16px; font-weight:bold; text-align:center;border-radius: 5px;}
.tempLayer .layerBox > div .rightBox .middleBox button.likeBtn{width: 30% ; border:1px solid #ddd;}
.tempLayer .layerBox > div .rightBox .middleBox button.likeBtn.no{color:#ddd; cursor:default;}
.tempLayer .layerBox > div .rightBox .middleBox button.likeBtn.no:hover{color:#ddd; cursor:default; border:1px solid #ddd;}
.tempLayer .layerBox > div .rightBox .middleBox button.likeBtn i{margin-right:5px;}
.tempLayer .layerBox > div .rightBox .middleBox button.likeBtn:hover{border:1px solid #4BB7FF; color:#4BB7FF;}
.tempLayer .layerBox > div .rightBox .middleBox button.likeBtn.like{border:1px solid #4BB7FF; color:#4BB7FF;}
.tempLayer .layerBox > div .rightBox .middleBox button.likeBtn .i1{display:inline-block;}
.tempLayer .layerBox > div .rightBox .middleBox button.likeBtn .i2{display:none;}
.tempLayer .layerBox > div .rightBox .middleBox button.likeBtn.like .i1{display:none;}
.tempLayer .layerBox > div .rightBox .middleBox button.likeBtn.like .i2{display:inline-block;}
.tempLayer .layerBox > div .rightBox .middleBox button.makeIt{width: 67% ; background: #223C60; color:#fff;}
.tempLayer .layerBox > div .rightBox .middleBox button.makeIt i{margin-right:10px;}

/* .tempLayer .layerBox > div .rightBox .optionBox{margin-top:30px;} */
.tempLayer .layerBox > div .rightBox > div {
  height: 100%;
  display: flex;
  flex-direction: column;
}
.tempLayer .layerBox > div .rightBox .optionBox ul{width:100%; overflow:hidden;}
.tempLayer .layerBox > div .rightBox .optionBox > ul > li{margin-bottom:13px;}
.tempLayer .layerBox > div .rightBox .optionBox > ul > li:last-child{margin-bottom:0px;}
.tempLayer .layerBox > div .rightBox .optionBox > ul > li p.tit{margin-bottom:10px; }
.tempLayer .layerBox > div .rightBox .optionBox > ul > li .option{overflow:hidden;}
.tempLayer .layerBox > div .rightBox .optionBox > ul > li .option ul{overflow-y:auto;  max-height: 76px; }
.tempLayer .layerBox > div .rightBox .optionBox > ul > li .option ul li,
.portLayer .layerBox > div .rightBox .optionBox > ul > li .option ul li {display:inline-block; box-sizing:border-box; background:#eee; border-radius:100px;
font-size:14px; color:#444; font-weight:normal;padding: 5px 15px;margin-bottom: 10px;margin-right: 10px;} 


.tempLayer .layerBox > div .rightBox .optionBox > ul > li .option ul::-webkit-scrollbar,
.portLayer .layerBox > div .rightBox .optionBox > ul > li .option ul::-webkit-scrollbar,
.portLayer .layerBox > div .nr_middleBox::-webkit-scrollbar{
    width: 4px;  /* 스크롤바의 너비 */
}

.tempLayer .layerBox > div .rightBox .optionBox > ul > li .option ul::-webkit-scrollbar-thumb,
.portLayer .layerBox > div .rightBox .optionBox > ul > li .option ul::-webkit-scrollbar-thumb,
.portLayer .layerBox > div .nr_middleBox::-webkit-scrollbar-thumb{
    height: 10%; /* 스크롤바의 길이 */
    background: #9B9B9B; /* 스크롤바의 색상 */

    border-radius: 10px;
}

.tempLayer .layerBox > div .rightBox .optionBox > ul > li .option ul::-webkit-scrollbar-track,
.portLayer .layerBox > div .rightBox .optionBox > ul > li .option ul::-webkit-scrollbar-track,
.portLayer .layerBox > div .nr_middleBox::-webkit-scrollbar-track{
    background: #ddd;  /*스크롤바 뒷 배경 색상*/
}


.swiper-gallery-next{position:absolute; top:544px !important; right:0; z-index:998;}
.swiper-gallery-prev{position:absolute; top:544px  !important; z-index:998; left:0;}
.swiper-gallery-next, .swiper-gallery-prev{width:40px; height:40px; border-radius:100%; line-height:40px;background:#fff; border:1px solid #ddd;  cursor:pointer;}
.swiper-gallery-next:after, .swiper-gallery-prev:after{color:#000; font-size:16px; position:absolute; left:50%; top:50%; transform:translate(-50%, -50%); font-family: 'FontAwesome';} 
.swiper-gallery-next:after{content: '\f105';}
.swiper-gallery-prev:after{content: '\f104';}
.swiper-gallery-prev.swiper-button-disabled, .swiper-gallery-next.swiper-button-disabled{display:none;}



/* 가격 안내 */
.price_info{background: #EFF1F4 ;}
.price_info .inner .price_box{width:1600px; margin:0 auto; box-sizing:border-box; padding:0px 25px;}
.price_info .inner .price_box ul{width:100%; display:flex;justify-content: flex-start;}
.price_info .inner .price_box ul li{display:inline-block;   width: 375px; border-radius:15px; background: #fff; overflow:hidden; margin-right: 14px;}
.price_info .inner .price_box ul li:last-child{margin-right:0px;}
.price_info .inner .price_box ul li a{width:100%; height:100%; display:block; box-sizing:border-box; padding:50px 30px; text-align:center;}
.price_info .inner .price_box ul li:hover{box-shadow: 0px 3px 17px rgba(34, 60, 96, 80%);}
.price_info .inner .price_box ul li a .title{font-size: 25px; margin-bottom:15px;}
.price_info .inner .price_box ul li.price_01 a .title{color:;}
.price_info .inner .price_box ul li.price_02 a .title{color:#007E22;}
.price_info .inner .price_box ul li.price_03 a .title{color:#223C60;}
.price_info .inner .price_box ul li.price_04 a .title{color:#5B3BC6;}
.price_info .inner .price_box ul li a .price{color: #8A8A8A; font-size:30px;}
.price_info .inner .price_box ul li a .price span.num{font-weight: 600; color:#1d1d1d; font-size: 40px;}
.price_info .inner .price_box ul li a .price span.span{font-size:14px; display:block; margin-top:5px;}
.price_info .inner .price_box ul li a .text{margin: 30px 0px; height:60px; overflow:hidden; word-break: break-all;}
.price_info .inner .price_box ul li a .text p{color:#747474 ; font-size:16px;   overflow: hidden; word-break: break-word; 
line-height:1.2; display: -webkit-box; -webkit-line-clamp: 3; -webkit-box-orient: vertical;}
.price_info .inner .price_box ul li a .text p i{color:#1d1d1d; margin-right:5px;}
.price_info .inner .price_box ul li a .price_more{color:#fff; border-radius: 100px; box-sizing:border-box; padding:10px 40px; font-size:17px;}
.price_info .inner .price_box ul li.price_01 a .price_more{background:#1d1d1d;}
.price_info .inner .price_box ul li.price_02 a .price_more{background:#007E22; transition: all 0.3s ease;}
.price_info .inner .price_box ul li.price_02 a .price_more:hover{background: #033611;}
.price_info .inner .price_box ul li.price_03 a .price_more{background:#223C60;  transition: all 0.3s ease;}
.price_info .inner .price_box ul li.price_03 a .price_more:hover{background:#001B41; }
.price_info .inner .price_box ul li.price_04 a .price_more{background:#5B3BC6;  transition: all 0.3s ease;}
.price_info .inner .price_box ul li.price_04 a .price_more:hover{background:#200872; }

.price_info .inner .price_box ul li.price_01.best{/* border:4px solid #1d1d1d;  */}
.price_info .inner .price_box ul li.price_01.best a{position:relative;  border:4px solid #1d1d1d; border-radius: 15px;}
.price_info .inner .price_box ul li.price_01.best a:after{position:absolute; content: ''; width: 0px;height: 0px; border-top: 80px solid none;  border-bottom:80px solid #1d1d1d;
  border-right: 80px solid transparent; border-left:  80px solid  transparent; color:#fff; text-align:center; right: -53px; top: -14px; transform: rotate(45deg); z-index:40;}
.price_info .inner .price_box ul li.price_01.best a:before{position:absolute; content: 'BEST';   color:#fff; right: 9px; top: 24px; transform: rotate(45deg);
  font-size: 23px; z-index:50;}

.price_info .inner .price_box ul li.price_02.best{/* border:4px solid #007E22; */ }
.price_info .inner .price_box ul li.price_02.best a{position:relative; border:4px solid #007E22; border-radius: 15px;}
.price_info .inner .price_box ul li.price_02.best a:after{position:absolute; content: ''; width: 0px;height: 0px; border-top: 80px solid none;  border-bottom:80px solid #007E22;
  border-right: 80px solid transparent; border-left:  80px solid  transparent; color:#fff; text-align:center; right: -53px; top: -20px; transform: rotate(45deg); z-index:40;}
.price_info .inner .price_box ul li.price_02.best a:before{position:absolute; content: 'BEST';   color:#fff; right: 2px; top: 18px; transform: rotate(45deg);
  font-size: 23px; z-index:50;}

.price_info .inner .price_box ul li.price_03.best{/* border:4px solid #223C60; */ }
.price_info .inner .price_box ul li.price_03.best a{position:relative; border:4px solid #223C60; border-radius: 15px;}
.price_info .inner .price_box ul li.price_03.best a:after{position:absolute; content: ''; width: 0px;height: 0px; border-top: 80px solid none;  border-bottom:80px solid #223C60;
  border-right: 80px solid transparent; border-left:  80px solid  transparent; color:#fff; text-align:center; right: -53px; top: -14px; transform: rotate(45deg); z-index:40;}
.price_info .inner .price_box ul li.price_03.best a:before{position:absolute; content: 'BEST';   color:#fff; right: 2px; top: 20px; transform: rotate(45deg);
  font-size: 23px; z-index:50;}

.price_info .inner .price_box ul li.price_04.best{/* border:4px solid #5B3BC6; */ }
.price_info .inner .price_box ul li.price_04.best a{position:relative; border:4px solid #5B3BC6; border-radius: 15px;}
.price_info .inner .price_box ul li.price_04.best a:after{position:absolute; content: ''; width: 0px;height: 0px; border-top: 80px solid none;  border-bottom:80px solid #5B3BC6;
  border-right: 80px solid transparent; border-left:  80px solid  transparent; color:#fff; text-align:center; right: -53px; top: -14px; transform: rotate(45deg); z-index:40;}
.price_info .inner .price_box ul li.price_04.best a:before{position:absolute; content: 'BEST';   color:#fff; right: 7px; top: 22px; transform: rotate(45deg);
  font-size: 23px; z-index:50;}


/* 사용법 안내 */
.section.how_use .titleBox{margin-bottom:  30px;}
.how_use .useList{width:1600px; margin:0 auto;  }
.how_use .useList ul{width:100%; overflow:hidden; display:flex; box-sizing:border-box; padding:20px 25px;}
.how_use .useList ul li{display:inline-block;  width: 277px; margin-right:43px; border-radius:15px; position:relative;}
.how_use .useList ul li:hover{box-shadow: 0px 3px 17px rgba(34, 60, 96, 80%);}
.how_use .useList ul li:after{position:absolute; content: url('/images/r_img/use_arrow.png'); right: -30px; top:50%; transform: translateY(-50%); width:18px; height:14px;}
.how_use .useList ul li:last-child{margin-right:0px;}
.how_use .useList ul li:last-child:after{display:none;}
.how_use .useList ul li a{width:100%; height:100%; display: flex; box-sizing:border-box; padding:15px 20px; align-items: center;justify-content: space-between;}
.how_use .useList ul li.step_1{background:#EAEEEF;}
.how_use .useList ul li.step_2{background:#DBE4ED;}
.how_use .useList ul li.step_3{background:#D0D4E8;}
.how_use .useList ul li.step_4{background:#C4CAD9;}
.how_use .useList ul li.step_5{background:#ECB1B1;}
.how_use .useList ul li a .textBox{width: 60%;}
.how_use .useList ul li a .textBox span.step{display:inline-block; border-radius:100px; color:#fff; background:#1d1d1d; font-size:12px; box-sizing:border-box; padding:5px 10px;
margin-bottom:20px;}
.how_use .useList ul li a .textBox h3{font-size: 26px; margin-bottom:14px;}
.how_use .useList ul li a .textBox .use_more{font-size: 14px;  color:#4A4A4A; text-decoration: underline;}
.how_use .useList ul li:hover .use_more{color: #000000; font-weight:bold;}
.how_use .useList ul li .iconBox{margin-right: -15px; width: 130px; height: 102px; }
.how_use .useList ul li .iconBox img{width: auto; max-width:100%; max-height:100%;  height: auto;}


/* 고객 센터 */
.board_section{background: #EFF1F4 ;}
.board_section .inner{display:flex; width:1550px; margin:0 auto; overflow:hidden; justify-content: space-between; align-items: center;}
.board_section .inner .leftBox{width: 300px; background:#223C60 ; border-radius: 15px; }
.board_section .inner .leftBox .left{box-sizing:border-box; width:100%; height:100%; padding:30px 30px 25px;}
.board_section .inner .leftBox .left .titBox{margin-bottom:30px;}
.board_section .inner .leftBox .left .titBox h3{font-size: 32px; color:#fff;}
.board_section .inner .leftBox .left .titBox .board_more{font-size: 14px;  color:#DFDFDF; text-decoration: underline; margin-top:5px;}
.board_section .inner .leftBox .left .titBox .board_more:hover{color:#fff;}

.board_section .inner .leftBox .left .menuBox{width:100%;   position:relative;  height:275px;  }
.board_section .inner .leftBox .left .menuBox ul{width:125%; position:absolute; }
.board_section .inner .leftBox .left .menuBox ul li{cursor:pointer; box-sizing:border-box; padding: 15px 20px; color:#B2B2B2; font-size:20px;}
.board_section .inner .leftBox .left .menuBox ul li:hover{color:#fff;}
.board_section .inner .leftBox .left .menuBox ul li i{width: 15%; text-align:center; margin-right:15px; vertical-align:middle;}
.board_section .inner .leftBox .left .menuBox ul li.current{background:#fff; color:#223C60; border-radius: 15px; box-shadow: 0px 5px 10px rgba(0,0,0,16%);font-weight:bold;}

.board_section .inner .leftBox .left .menuBox ul li a.more_btn{display:none;}
.board_section .inner .leftBox .left .menuBox ul li.current a.more_btn{display:inline-block; float:right; text-decoration: underline; opacity:40%; }
.board_section .inner .leftBox .left .menuBox ul li.current a.more_btn:hover{opacity:1;}


.board_section .inner .rightBox {width: 1075px; height: 393px; }
.board_section .inner .rightBox .right{ width:100%; height:100%; }
.board_section .inner .rightBox .right .tab-content{display:none; width:100%; height:100%;}
.board_section .inner .rightBox .right .tab-content.current{display:inline-block;}
.board_section .inner .rightBox .right .boardList{width:100%; height:100%; }
.board_section .inner .rightBox .right .boardList ul{width:100%; height:100%; overflow:hidden; border-top:1px solid #223C60;}
.board_section .inner .rightBox .right .boardList ul li{width:100%; overflow:hidden; border-bottom:1px dotted #AFAFAF;}
.board_section .inner .rightBox .right .boardList ul li:hover{background:#fff;}
.board_section .inner .rightBox .right .boardList ul li a{width:100%; height:100%; display:block; box-sizing:border-box; padding: 26px 30px ; display:flex;
align-items: center; justify-content: space-between;}
.board_section .inner .rightBox .right .boardList.faq ul li a{padding:32px 30px;}
.board_section .inner .rightBox .right .boardList ul li a .dateBox{border:2px solid #223C60; color:#223C60;  border-radius:15px; box-sizing:border-box; padding:10px 15px;text-align:center;  }
.board_section .inner .rightBox .right .boardList ul li:hover a .dateBox{background: #223C60;color:#fff;}
.board_section .inner .rightBox .right .boardList ul li a .dateBox p.day{font-size: 35px; font-weight:bold;}
.board_section .inner .rightBox .right .boardList ul li a .dateBox p.year{font-size:11px; font-weight:bold;}
.board_section .inner .rightBox .right .boardList ul li a .title {width:80%;}
.board_section .inner .rightBox .right .boardList ul li a .title h4{font-size: 20px ;overflow:hidden; text-overflow:ellipsis; white-space:nowrap;  line-height:1.5;
max-width:100%; width:auto;  display: inline-block; align-items: center;}
.board_section .inner .rightBox .right .boardList ul li a .title h4 > .txt {display: inline;overflow-x: hidden;text-overflow: ellipsis;white-space: nowrap;line-height: initial;}
.board_section .inner .rightBox .right .boardList ul li a .title h4 > img{width:15px; margin-right:10px; height:auto;}
.board_section .inner .rightBox .right .boardList ul li:hover a .title h4{font-size:23px; position:relative;}
.board_section .inner .rightBox .right .boardList ul li:hover a .title h4:after{position:absolute; content:'';width:100%; height:1px; left:0; bottom:0; background:#1d1d1d;}
.board_section .inner .rightBox .right .boardList ul li a .arrow button{font-size: 26px; color:#686868; }
.board_section .inner .rightBox .right .boardList ul li:hover a .arrow button{ color:#000000;}
.board_section .inner .rightBox .right .tab-content .none{width:100%; height:100%; text-align:center; line-height: 393px; font-size:18px; border-top:1px solid #223C60;  border-bottom:1px dotted #AFAFAF;}

.board_section .inner .rightBox .right .boardList.make ul li a{padding:11.9px 30px;}
.board_section .inner .rightBox .right .boardList.make ul li a .dateBox{padding: 7px 11px;}
.board_section .inner .rightBox .right .boardList.make ul li a .dateBox p.day {font-size:25px;line-height: 25px;}
.board_section .inner .rightBox .right .boardList.make ul li a .dateBox p.year {font-size:10px;}
.board_section .inner .rightBox .right .boardList.make ul li a .title h4{font-size:16px;}
.board_section .inner .rightBox .right .boardList.make ul li a .title h4 > img{width:10px;}
.board_section .inner .rightBox .right .boardList.make ul li a .title{width:85%;}

.board_section .inner .rightBox .right .boardList.make ul li a .title {display:flex; justify-content: space-between;align-items: center; }
.board_section .inner .rightBox .right .boardList.make ul li a .title h4{max-width:50%; width:auto;    display: inline-flex;
  align-items: center;}
.board_section .inner .rightBox .right .boardList.make ul li a .title .stateBox{width:50%; border-radius:5px; border:1px solid #999;text-align:center;color:#999; display: flex;}
.board_section .inner .rightBox .right .boardList.make ul li a .title span{display:inline-block;  text-align:center;font-size:14px; box-sizing:border-box; 
position:relative; padding:5px 10px; width:25%;}
.board_section .inner .rightBox .right .boardList.make ul li a .title span:after{position:absolute; content:''; width:1px; height:70%; background: #aaa; right:0px; top:50%; transform:translateY(-50%);}
.board_section .inner .rightBox .right .boardList.make ul li a .title span:last-child:after{display:none;}

.board_section .inner .rightBox .right .boardList.make ul li a .title span.ing.on{ color:#555; font-weight:bold; }
.board_section .inner .rightBox .right .boardList.make ul li a .title span.making.on{color:#009328;  font-weight:bold;  }
.board_section .inner .rightBox .right .boardList.make ul li a .title span.complt.on{color:#7e12af;  font-weight:bold; }
.board_section .inner .rightBox .right .boardList.make ul li a .title span.received.on{color:#044f9d;    font-weight:bold; }

.board_section .inner .rightBox .right .boardList.faq ul li a{padding:16.4px 30px;}
.board_section .inner .rightBox .right .boardList.faq ul li a .dateBox{padding: 8px 11px;}
.board_section .inner .rightBox .right .boardList.faq ul li a .dateBox p.day {font-size:25px;line-height: 25px;}
.board_section .inner .rightBox .right .boardList.faq ul li a .title h4{font-size:16px; display: inline-block;}
.board_section .inner .rightBox .right .boardList.faq ul li a .title h4 > img{width:10px;}
.board_section .inner .rightBox .right .boardList.faq ul li a .title{width:85%;display: flex;}

.board_section .inner .rightBox .right .boardList.qna ul li a{padding:11.9px 30px;}
.board_section .inner .rightBox .right .boardList.qna ul li a .dateBox{padding: 7px 11px;}
.board_section .inner .rightBox .right .boardList.qna ul li a .dateBox p.day {font-size:25px;line-height: 25px;}
.board_section .inner .rightBox .right .boardList.qna ul li a .dateBox p.year {font-size:10px;}
.board_section .inner .rightBox .right .boardList.qna ul li a .title h4{font-size:16px; display: inline-flex; align-items: center;}
.board_section .inner .rightBox .right .boardList.qna ul li a .title h4 > img{width:10px;}
.board_section .inner .rightBox .right .boardList.qna ul li a .title{width:85%;}



/* Portfolio */
.Portfolio .inner{ 
  padding: 100px 0px 85px;
}
.Portfolio div .slideBox{ 
  width: 1600px;
  margin: 0 auto;
  box-sizing: border-box;
  padding: 0px 25px 0px; 
  position: relative; 
} 
.Portfolio div .slideBox:after{
  position: absolute; content: ''; 
  width: 86px; height: 97%;
  background:  url('/images/r_img/sld_gr.png') no-repeat; 
  right:25px; top:0;
  z-index:1; 
}
.Portfolio div .slideBox .swiper-wrapper{ 
  transition-timing-function:linear!important; 
  -webkit-transition-timing-function:linear!important; 
  }
.Portfolio div .slideBox .swiper-slide{
  width: 346px; 
  height: auto; 
  cursor: pointer;  
  overflow:hidden;  
}
.Portfolio div .slideBox .swiper-slide img{
  box-shadow: 3px 3px 10px rgba(0,0,0,22%); 
  transition:all 0.5s;
}
.Portfolio div .slideBox .swiper-slide img:hover{
  transform: scale(1.1); 
  transition:all 0.5s;
}
.Portfolio div .slideBox .portfolio_swiper{
  overflow: hidden; 
  box-sizing:border-box; 
  padding-bottom: 15px;
}
.slideBox .portfolio_swiper:hover .swiper-slide{
  animation-play-state:paused;
}
/* .ptflLayer{position:fixed; left:0%; top:0%;   width: 100%; height:100%; z-index: 99999999; display: none ;}
.ptflLayer.open{display:block;}
.bgLayer{position:fixed; left:0%; top:0%;   width: 100%; height:100%;   background: rgba(0,0,0,60%); backdrop-filter: blur(5px);}
.bgLayer:hover{cursor:url('/images/r_img/close_pointer.png') 20 30, auto;}
 .ptflLayer .layerBox{position:fixed; left:50%; top:50%; transform:translate(-50%, -50%); width: 1050px; height: 650px; background:#fff;  border-radius: 10px;
box-shadow: 5px 5px 10px rgba(0,0,0,15%);}
.ptflLayer .layerBox > div{width: 100%; overflow:hidden; box-sizing:border-box; padding:50px 40px; display:flex; height: 100%;     justify-content: center;
  align-items: center;}
.ptflLayer .layerBox > div .closeBtn{position: absolute; right:8px; top: 5px; font-size:20px; color:#888;} */




/* 포트폴리오 레이어 */
.portLayer .layerBox {
  height: auto;
}
.portLayer .layerBox > div {
  display: flex;
  height: 100%;
  justify-content: space-between;
}
/* .portLayer .layerBox > div .leftBox #ptab-layer-1 .wrapper {
  min-height: 416px;
} */
.portLayer .layerBox > div .leftBox #ptab-layer-1 .wrapper img {
  width: 100%;
  object-fit: contain;
}
.portLayer .layerBox > div .leftBox #ptab-layer-2 {
  background: #f3f3f3;
}
.portLayer .layerBox > div .leftBox #ptab-layer-2 .wrapper {
  display: flex;
  align-items: center;
  justify-content: center;
  height: 418px;
}
.portLayer .layerBox > div .leftBox #ptab-layer-2 img {
  width: auto;
  height: 418px;
  border: 1px solid #eee;
  margin: 0 auto;
}


.portLayer .layerBox > div .rightBox {
  display: flex;
}
.portLayer .layerBox > div .rightBox > div {
  width: 100%;
  display: flex;
  flex-direction: column;
}
.portLayer .layerBox > div .rightBox > div .optionBox {
  flex: 1;
  margin-top: auto;
  display: flex;
  overflow-x: auto;
  margin-bottom: 5px;
}
.portLayer .layerBox > div .rightBox .sizeBox,
.portLayer .layerBox > div .rightBox .date_gradeBox {
  border-bottom: 1px solid #ddd;
  display: flex;
  align-items: center;
}
.portLayer .layerBox > div .rightBox .infoBox {
  margin-bottom: 10px !important;
}
.portLayer .layerBox > div .rightBox .infoBox .date_gradeBox {
  display: flex;
}
.portLayer .layerBox > div .rightBox .infoBox .date_gradeBox p {
  display:inline-block; 
  color: #1d1d1d;  
} 
.portLayer .layerBox > div .rightBox .infoBox .date_gradeBox p.con {
  flex: 1;
  margin-top: auto;
  margin-bottom: auto;
  margin-right: 15px;
}
.portLayer .layerBox > div .rightBox .infoBox .date_gradeBox p.con.grade {
  text-align: center;
}
.portLayer .layerBox > div .rightBox .infoBox .date_gradeBox p.con + .oneTit {
  border-left: 1px solid #ddd; 
}
.portLayer .layerBox > div .rightBox .infoBox .date_gradeBox p.oneTit {
  font-weight: bold; 
  width: 18%; 
  border-right: 1px solid #ddd; 
  text-align: center; 
  box-sizing: border-box; 
  padding: 15px 0px;
  margin-right: 15px;
}
.portLayer .layerBox > div .rightBox .infoBox .indusBox p.tit {font-weight:bold; width: 18%; border-right:1px solid #ddd; text-align:center; box-sizing:border-box; padding:15px 0px;
margin-right:15px;}
.portLayer .layerBox > div .rightBox .infoBox .indusBox p {display:inline-block; color: #1d1d1d; } 
.portLayer .layerBox > div .rightBox .optionBox > ul {
  /* height: 100%; */
  display: flex;
  flex-direction: column;
  justify-content: end;
  width: 100%;
  min-width: max-content;
}
.portLayer .layerBox > div .rightBox .optionBox::-webkit-scrollbar {
  width: 2px; /* 스크롤바의 너비 */
  height: 4px;
}
/* 스크롤바 트랙 (배경) */
.portLayer .layerBox > div .rightBox .optionBox::-webkit-scrollbar-track {
  background: #f1f1f1; /* 스크롤 트랙 배경색 */
  border-radius: 0px; /* 둥근 모서리 */
}
/* 스크롤바 핸들 (이동하는 부분) */
.portLayer .layerBox > div .rightBox .optionBox::-webkit-scrollbar-thumb {
  background: #888; /* 스크롤바 색상 */
  border-radius: 0px; /* 둥근 모서리 */
}
.portLayer .layerBox > div .rightBox .optionBox > ul > li {
  display: flex;
  align-items: center;
  position: relative;
  /* border-bottom: 1px solid #daeaf0; */
}
.portLayer .layerBox > div .rightBox .optionBox > ul > li:first-child {border-top: 1px solid #000;}
/* .portLayer .layerBox > div .rightBox .optionBox > ul > li:last-child {border-bottom: 1px solid #000;} */
.portLayer .layerBox > div .rightBox .optionBox > ul > li::after {
  content: '';
  display: block;
  position: absolute;
  left: 0;
  right: 0;
  bottom: 0;
  height: 1px;
  background:  #ddd;
  z-index: -1;
}
.portLayer .layerBox > div .rightBox .optionBox > ul > li div.tit {
  position: sticky;
  left: 0;
  min-width: 68.39px;
  font-size: 14px;
  padding: 15px 0px;
  display: flex;
  align-items: center;
  justify-content: center;
  font-weight: 600;
  background: #ddd;
  color: #1d1d1d;
  border-bottom: 1px solid #fff;
}
.portLayer .layerBox > div .rightBox .optionBox > ul > li:last-child div.tit {border-bottom: none;}
.portLayer .layerBox > div .rightBox .optionBox > ul > li .option {
  padding-left: 10px;
  align-self: stretch;
  display: flex;
}
.portLayer .layerBox > div .rightBox .optionBox > ul > li .option > ul {
  display: flex;
  flex-wrap: nowrap;
  gap: 10px;
}
.portLayer .layerBox > div .rightBox .optionBox > ul > li .option > ul > li {
  white-space: nowrap;
  padding: 5px 15px;
  align-self: center;
  margin-bottom: 0;
  margin-right: 0;
}
.portLayer .layerBox > div .rightBox .optionBox > ul > li.color .option > ul > li {

}
.portLayer .layerBox > div .rightBox .optionBox > ul > li p.tit {
  margin-bottom: 10px;
}
/* .portLayer .layerBox > div .rightBox .optionBox > ul > li .option > ul {
  overflow-y: auto;
  height: 37px;
}
.portLayer .layerBox > div .rightBox .optionBox > ul > li .option > ul.ulheight {
  overflow-y: auto;
  height: 73px!important;
} */


/* 포트폴리오 레이어 new */
.nr_layerBox {
  width: 1600px!important;
}
.portLayer .layerBox > div .nr_leftBox {
  width: 46%;}
.portLayer .layerBox > div .nr_middleBox {
  width: 25%;
  overflow-y: auto;
  margin-top: 65px;
}
.portLayer .layerBox > div .nr_rightBox {
  width: 25%;
}
.nr_portfolioCTS{
  /* position: relative;
  top: 58px; */
}
.nr_middleBox ul {
  display: flex; 
  flex-wrap: wrap;
  /* max-height: 404px; */
}
.nr_middleBox ul li {
  width: 50%;
}
.nr_middleBox ul li .nr_portfolioThumb {
  padding: 5px;
}
.nr_middleBox ul li .nr_portfolioThumb img {
  display: inline-block;
  width: 100%;
  height: 100%;
}
.nr_mobBox {
  text-align: center;
  background: #f3f3f3;
}
.nr_mobThmbW{
  width: 35.7%!important;
}
.nr_mobThmbW2{
  width: 38%!important;
  display: inline-block!important;
}
.nr_blur{
  /* filter: blur(2px); 추후 적용 */
}
.portfolioborder{
  border: 1px solid #ddd;
}
.portfolioH{
  height: 96px;
}
.nr_portfolioPC {
  position: absolute;
  width: 165px;
  padding: 7px;
  left: 313px;
  top:105px;
  z-index: 10;
  border-radius: 5px;
  background: #4bb7ff;
  font-size: 13px;
  text-align: center;
  color: #fff;
}
.nr_portfolioPC:after {
  position: absolute;
  top: -63%;
  left: 23%;
  width: 0;
  height: 0;
  margin-left: -10px;
  border: solid transparent;
  border-color: rgba(51, 51, 51, 0);
  border-bottom-color: #4bb7ff;
  border-width: 10px;
  pointer-events: none;
  content: ' ';
}
.nr_portfolioM {
  position: absolute;
  width: 195px;
  padding: 7px;
  left: 379px;
  top: 105px;
  z-index: 10;
  border-radius: 5px;
  background: #4bb7ff;
  font-size: 13px;
  text-align: center;
  color: #fff;
}
.nr_portfolioM:after {
  position: absolute;
  top: -63%;
  left: 23%;
  width: 0;
  height: 0;
  margin-left: -10px;
  border: solid transparent;
  border-color: rgba(51, 51, 51, 0);
  border-bottom-color: #4bb7ff;
  border-width: 10px;
  pointer-events: none;
  content: ' ';
}



/* With Us*/
@keyframes marquee_t {
	0%{   transform: translateX(35px);}
	100%{   transform: translateX(-100%);}
}

@keyframes marquee_b {
  0%{  transform: translateX(-100%);}
  100% {   transform: translateX(35px);}
}

.with_us .inner .logoBoxtop{width:100%; position:relative;height:125px;margin-bottom:35px; }
.with_us .inner .logoBoxtop .wrap{    width: 200%; display: flex; gap: 35px;  }
.with_us .inner .logoBoxtop ul{   display: flex; gap: 35px;  animation:marquee_t 60s linear infinite  ;  }
.with_us .inner .logoBoxtop ul li{display:inline-block; float:left; border-radius:15px;  width:340px; height:120px; text-align:center; line-height:120px;
box-shadow:0px 0px 10px rgba(0,0,0,16%); background:#fff;}
.with_us .inner .logoBoxtop ul li img{width:auto; max-width:90%; max-height: 60px; object-fit: contain;}
.with_us .inner .logoBoxbottom{width: 100%; position:relatisve;height:125px;margin-bottom:35px;  }
.with_us .inner .logoBoxbottom .wrap{  width: 200%; display: flex; gap: 35px;}
.with_us .inner .logoBoxbottom ul{  display: flex; gap: 35px;animation:marquee_b 60s linear infinite ; }
.with_us .inner .logoBoxbottom ul li{display:inline-block; float:left;border-radius:15px;  width:340px; height:120px; text-align:center; line-height:120px; 
box-shadow:0px 0px 10px rgba(0,0,0,16%);background:#fff; }
.with_us .inner .logoBoxbottom ul li img{width:auto; max-width:90%; object-fit: contain;}

.with_us .inner .logoBox{width:100%; }
.with_us .inner .logoBox .moreBtn{margin-top: 50px; text-align:center;}
.with_us .inner .logoBox .moreBtn button{ box-sizing:border-box; padding:14px 40px 5px;  font-size: 18px; color: #fff; background:#223C60 ; border-radius:100px; transition:all 0.3s ease;}
.with_us .inner .logoBox .moreBtn button:hover{background:#001B41; }
