.core_project_all .banner {width:100%; height:25vw; position:relative; overflow: hidden;}
.core_project_all .banner > img {position: absolute; width: 100%; height: 100%; object-fit: cover; z-index: 0;object-position: 50% 30%; filter:brightness(0.5);}
.core_project_all .banner::after {content: ""; position: absolute; inset: 0; background-color: #262626; opacity: 0.5; pointer-events: none;}
.banner_des {position: relative; z-index: 2; color: #fff; top: 50%; left:8vw; }
.banner_des > h1 {font-family:'Bitter', serif; font-size:36px; font-weight:300; line-height: 1.4rem;  }
.bento p {font-size:20px; color:#FFF;font-weight:300; text-decoration: none; z-index: 3; position: absolute; margin:0; left:0; bottom:0; padding: 30px 30px; text-shadow: 0 0 5px #222 ;}

.bento {position: relative; }
.bento .coming_soon {display: none; color:#EDC189; font-family: 'Aboreto', serif; position:absolute; top: 50%; left: 50%; transform: translate(-50%, -50%); font-weight:normal; font-size:20px; z-index:5; text-align: center; padding:0; margin:0;}
.bento:hover .coming_soon {display:block; }
.bento:hover p {display:none;}


.core_project_all {background-color:#262626;}
.core_project_all .project_wrap {display: grid; grid-template-columns: 48% 48%;/*grid-template-columns: auto auto;*/padding:80px 8vw; align-items: center; justify-content:space-between; gap:4vw; height:auto; margin:0; }
.core_project_all .project_wrap .bento {width:100%; height:24vw; position:relative; overflow:hidden;}
.core_project_all .project_wrap .bento > img {width:120%; height:100%; object-fit: cover; object-position: center; filter: brightness(0.8); transform: scale(1.1);transition: transform 0.28s ease;will-change: transform;}
.core_project_all .project_wrap .bento:hover img,
.core_project_all .project_wrap .bento:active img {transform: scale(1); filter:brightness(0.3);}

#bento1:hover img, #bento1:active img,
#bento2:hover img, #bento2:active img,
#bento3:hover img, #bento3:active img,
#other1:hover img, #other1:active img,
#other2:hover img, #other2:active img,
#other3:hover img, #other3:active img,
#other4:hover img, #other4:active img
#other5:hover img, #other5:active img,
#other6:hover img, #other6:active img,
#other7:hover img, #other7:active img,
#other8:hover img, #other8:active img
 {filter:brightness(0.7);}

#bento1:hover p,
#bento2:hover p,
#bento3:hover p,
#other1:hover p,
#other2:hover p,
#other3:hover p,
#other4:hover p,
#other5:hover p,
#other6:hover p,
#other7:hover p,
#other8:hover p{display:block;}





/***other projects 팝업창***/
.project-modal{ display:none; position:fixed; inset:0; z-index:99999;justify-content:center; align-items:center; }
.project-modal.is-open{ display:flex; }
.project-modal__overlay{ position:absolute; inset:0; background:rgba(0,0,0,.6); }
.project-modal__panel{ max-height: 90vh; overflow-y: auto; position:relative; z-index:1; width:fit-content; padding:20px 30px; /*margin: 4vw auto 0;*/ margin: auto auto;}
.project-modal__close{ position:absolute; top:10px; right:12px; font-size:26px; background:transparent; border:0; cursor:pointer;}
/*.project-modal__content{display:flex; align-items:end; justify-content: space-between; margin-top:20px; gap:10px;}*/

#projectModalImg{ /*width:350px;*/ height:auto; display:block; margin:0 auto;}
#projectModalTitle { font-size:24px; font-family: 'Bitter', serif; font-weight:500; line-height:100%; margin:0;}
#projectModalMeta { white-space:pre-line; font-size:14px; margin-bottom:10px; margin-top:10px;}
#projectModalBody {margin-top:15px; font-size:15px; font-weight:300;}

.project-modal__panel::-webkit-scrollbar{width:4px;}
.project-modal__panel::-webkit-scrollbar-track{background:transparent;}
.project-modal__panel::-webkit-scrollbar-thumb{background:rgba(0,0,0,.25);border-radius:20px;}
.project-modal__panel::-webkit-scrollbar-thumb:hover{background:rgba(0,0,0,.45);}


.project-modal.theme-elevation .project-modal__panel  {background:#29292B;}
.project-modal.theme-elevation #projectModalImg {width:500px;}
.project-modal.theme-elevation #projectModalTitle { color:#FFF; }
.project-modal.theme-elevation #projectModalMeta {color:#AAA;}
.project-modal.theme-elevation #projectModalBody { color:#DDD; }
.project-modal.theme-elevation .project-modal__close {color:#CCC;}

.project-modal.theme-life .project-modal__panel  {background:#2A2626;}
.project-modal.theme-life #projectModalImg {width:350px;}
.project-modal.theme-life #projectModalTitle { color:#FFF; }
.project-modal.theme-life #projectModalMeta {color:#AAA;}
.project-modal.theme-life #projectModalBody { color:#DDD; }
.project-modal.theme-life .project-modal__close {color:#CCC;}

.project-modal.theme-church .project-modal__panel  {background:#FFF;}
.project-modal.theme-church #projectModalImg {width:350px;}
.project-modal.theme-church #projectModalTitle { color:#000; }
.project-modal.theme-church #projectModalMeta {color:#666;}
.project-modal.theme-church #projectModalBody { color:#222; }
.project-modal.theme-church .project-modal__close {color:#444;}

.project-modal.theme-skeleton .project-modal__panel  {background:#EBC0A2;}
.project-modal.theme-skeleton #projectModalImg {width:350px;}
.project-modal.theme-skeleton #projectModalTitle { color:#000; }
.project-modal.theme-skeleton #projectModalMeta {color:#666;}
.project-modal.theme-skeleton #projectModalBody { color:#222; }
.project-modal.theme-skeleton .project-modal__close {color:#444;}

.project-modal.theme-division .project-modal__panel  {background:#222;}
.project-modal.theme-division #projectModalTitle { color:#FFF; }
.project-modal.theme-division #projectModalBody{ color:#CCC; }
.project-modal.theme-division #projectModalImg{ width:800px; }

.project-modal.theme-apple .project-modal__panel  {background:#FFF;}
.project-modal.theme-apple #projectModalTitle { color:#222; }
.project-modal.theme-apple #projectModalBody{ color:#666; }
.project-modal.theme-apple #projectModalImg{ width:550px; }

.project-modal.theme-padi .project-modal__panel  {background:#0d0d0d;}
.project-modal.theme-padi #projectModalImg {width:300px;}
.project-modal.theme-padi #projectModalTitle { color:#FFF; }
.project-modal.theme-padi #projectModalMeta {color:#AAA;}
.project-modal.theme-padi #projectModalBody { color:#DDD; }
.project-modal.theme-padi .project-modal__close {color:#CCC;}

.project-modal.theme-furniture .project-modal__panel  {background:#FFF;}
.project-modal.theme-furniture #projectModalImg {width:550px;}
.project-modal.theme-furniture #projectModalTitle { color:#000; }
.project-modal.theme-furniture #projectModalMeta {color:#666;}
.project-modal.theme-furniture #projectModalBody { color:#222; }
.project-modal.theme-furniture .project-modal__close {color:#444;}


@media (max-width:1440px){

    .banner_des > h1 {font-size:34px;}
    .bento p {font-size: 18px; padding:20px;}
}

@media (max-width:1280px) {
    .banner_des {left:6vw;}
    .banner_des > h1 {font-size:30px;}

    .core_project_all .project_wrap {padding:60px 6vw;}
    
}

@media(max-width:1024px){
   /* .core_project_all .banner {height:300px;}*/
    .bento p {font-size: 16px;}
}

@media(max-width:768px){
    .core_project_all .banner {height:30vw;}
    .banner_des {left:4vw;}
    .banner_des > h1 {font-size:24px;}

    .core_project_all .project_wrap{padding:50px 4vw; grid-template-columns: 100%; gap:3vw;}
    .core_project_all .project_wrap .bento {width:100%; height:350px; /*margin-bottom:4vw;*/}
    .core_project_all .project_wrap #bento6{margin:0;}




}

@media(max-width:480px){
    .core_project_all .banner {height:200px;}
    .banner_des {left:0; object-position: 50% 0; padding: 0 15px;}
    .banner_des h1 {font-size: 23px; text-align:center;}
    .core_project_all .project_wrap .bento {height:330px;}
}