@charset="utf-8";

/* transform: translate(-50%, -50%);  
찐갈  955528
연갈  caa992
*/ 

#sub_wrap .footer { position: fixed; bottom:0; }
/************ visual */
.visual { position: relative;}
.plx {    padding-bottom:30%;     background-attachment: fixed;    background-position:top;    background-repeat: no-repeat;    background-size: 100%;  }
.greeting .plx,
.direction .plx {  background-image: url("../../images/tit-company.jpg"); }
.process .plx {  background-image: url("../../images/tit-process.jpg"); }
.promote .plx {  background-image: url("../../images/tit-promote.jpg"); }
.notice_wrapper .plx {  background-image: url("../../images/tit-notice.jpg"); }
.inquiry_wrapper .plx {  background-image: url("../../images/tit-inquiry.jpg"); }
.press_wrapper .plx {  background-image: url("../../images/tit-press.jpg"); }

.combi-blind .plx { background-image: url('../../images/combi/hive.jpg');}
.roll-blind .plx { background-image: url('../../images/roll/woodlook_single.jpg');}
.honeycom-blind .plx { background-image: url('../../images/tit-honeycom.jpg');}
.wood-blind .plx { background-image: url('../../images/tit-wood.jpg');}
.aluminum-blind .plx { background-image: url('../../images/tit-aluminum.jpg');}


.dnb h5::before { content: "DnB";}
.greeting h3::before { content: "CEO 인사말";}
.process h3::before { content: "설비소개";}
.direction h3::before { content: "오시는길";}

.brand h5::before { content: "브랜드 소개";}
.promote h3::before { content: "홍보영상";}

.products h5::before { content: "제품";}
.combi-blind h3::before { content: "콤비 블라인드";}
.roll-blind h3::before { content: "롤 블라인드";}
.wood-blind h3::before { content: "우드 블라인드";}
.honeycom-blind h3::before { content: "허니콤 블라인드";}
.aluminum-blind h3::before { content: "알루미늄 블라인드";}

.service h5::before { content: "서비스";}
.notice_wrapper h3::before { content: "공지사항";}
.press_wrapper h3::before { content: "언론보도";}
.inquiry_wrapper h3::before { content: "문의하기";}


.blackout-combi .box-wrap h4::before { content: "BLACKOUT";}
.pleated-combi .box-wrap h4::before { content: "PLEATED";}
.elegance-combi .box-wrap h4::before { content: "ELEGANCE";}
.net-combi .box-wrap h4::before { content: "NET";}
.formblackout-roll .box-wrap h4::before { content: "FORM BLACKOUT";}
.blackout-roll .box-wrap h4::before { content: "BLACKOUT";}
.screen-roll .box-wrap h4::before { content: "SCREEN";}


#sub_wrap { position: relative;}


@media only screen  and (max-width:680px){  
    .plx { padding-bottom:60%; background-size: 200%;}
 } 


/************ contents */
.contents { margin:80px auto;}


/*  */
.menu_wrap {border-bottom:1px solid #eee; width:100%;  }
.menu_wrap section { margin:0 auto; padding:0%; display: flex; max-width:1000px; }
.menu_wrap section a { display: inline-block; flex:1; text-align: center; transition: .3s; padding:2% 1%;  }
.menu_wrap section a:hover { background-color:#e2dbd6;  transition: .3s;}

/************ title */
.tit { text-align: center; width:100%;}
#sub .visual .tit { position:absolute; top:50%; color:#fff;  } 
#sub .contents .tit h4 { color:#955528; }
#sub .contents .tit span { width:40px; height:1px; margin:20px auto; display: block; background-color: #caa992;  }




/************ side quick */
.quick { position:fixed; right:2%; bottom:10%; z-index: 99;}
.quick a { border-radius:50%; padding:20px; width:60px; height:60px; display: block; background-size: contain; background-size: 30px; margin:20px 10px; transition: all .3s; }
.quick a:hover { margin-left:5px; }
.quick .goto_qna { background-color: #955528; background-image: url("../../images/i-qna.png"); } 
.quick .goto_up { background-color: #222; background-image: url("../../images/i-up.png"); }

@media only screen  and (max-width:1300px){   
    .quick {  bottom:5%; }
}

@media only screen  and (max-width:680px){   
    .quick a { width:45px; height:45px; margin:15px 10px }  
 } 

/************ thumb / products list page */
.thumb_wrap { margin-top:50px;}
.thumb_wrap section { display: flex; flex-wrap:wrap; justify-content: center; }
.thumb_wrap section a { flex:1; flex-basis:30%; max-width:30%; margin:1% 1% 5% 1%; text-align: center;}
.thumb_wrap section a > div  { border:1px solid #955528;   background-size: cover; padding:30%;  margin-bottom:10px;  }
.thumb_wrap section a > div div {  background-size: 50px; padding:30px; opacity:.5; background-image: url('../../images/waterMark.png');  }








.detail > div { width:100%; height:100vh;} 
.detail section { position: absolute; top:500px; left:50%; transform: translate(-50%, -50%); max-width:1200px;  }
.detail section .box-wrap { width:50%; padding:4%;  max-width:500px; min-width:300px;  float:right; background-color: rgba(000, 000, 000, .7); color:#fff; }
.detail section .box-wrap >  span { display: block;  margin:20px 0;  width:50px; height:2px; background-color: #fff;}
.detail section .box-wrap >  p { margin:20px 0; }
.detail section .box-wrap .tit-box h4 { font-size:1.3em; margin:0; letter-spacing: 2px; }
.detail section .box-wrap .tit-box p { font-size:3em; font-weight:500; text-transform: uppercase; }
.detail section .box-wrap .tit-box p span { margin-left:15px; font-size:.8em; }
.detail section .box-wrap .icon-box { }


.detail section .box-wrap .icon-box { overflow: hidden;}
.detail section .box-wrap .icon-box li { padding:25px; margin-right:10px;}
.detail section .box-wrap .icon-box li:first-child { background-image: url("../../images/i-01.png");}
.detail section .box-wrap .icon-box li:nth-child(2) { background-image: url("../../images/i-02.png");}
.detail section .box-wrap .icon-box li:nth-child(3) { background-image: url("../../images/i-03.png");}

.detail section .box-wrap .link-box { width:80%;  margin:40px 0 0; display: flex; justify-content: space-between; font-size:.9em; }
.detail section .box-wrap .link-box a { flex:1; flex-basis: 48%; max-width:48%; text-align: center; color:#fff; padding:2%;}
.detail section .box-wrap .link-box a:first-child { background-color: #e3bc3c; }
.detail section .box-wrap .link-box a:nth-child(2) { background-color: #222;}



@media only screen  and (max-width:680px){   
    .detail > div { height:60vh;} 
    .detail section { top:60vh; left:0%; transform: translate(0%, 0%); padding: 0  !important; height:40vh; }
    .detail section .box-wrap { width:50%; padding:4%;  max-width:100%; min-width:100%;  float:none; background-color: rgba(000, 000, 000, .7); color:#fff; height:100%; }
 } 






 
.wood-blind .tit,
.honeycom-blind .tit,
.aluminum-blind .tit { height:400px;}











/*  */
.combi {background-image: url('../../images/combi/combi.jpg');}
.tahiti {background-image: url('../../images/combi/tahiti.jpg');}
.linen {background-image: url('../../images/combi/linen.jpg');}
.bolero {background-image: url('../../images/combi/bolero.jpg');}
.graphic {background-image: url('../../images/combi/graphic.jpg');}
.hive {background-image: url('../../images/combi/hive.jpg');}
.heerringbone {background-image: url('../../images/combi/heerringbone.jpg');}
.lime {background-image: url('../../images/combi/lime.jpg');}
.slope {background-image: url('../../images/combi/slope.jpg');}
.cross {background-image: url('../../images/combi/cross.jpg');}
.lush {background-image: url('../../images/combi/lush.jpg');}
.wide {background-image: url('../../images/combi/wide.jpg');}
.opacity90 {background-image: url('../../images/combi/opacity90.jpg');}
.fresh {background-image: url('../../images/combi/fresh.jpg');}
.deluxe {background-image: url('../../images/combi/deluxe.jpg');}
.mild {background-image: url('../../images/combi/mild.jpg');}
/*  */
.metal_romance {background-image: url('../../images/combi/metal_romance.jpg');}
.crease_shine {background-image: url('../../images/combi/crease_shine.jpg');}
.beauty {background-image: url('../../images/combi/beauty.jpg');}
.arte {background-image: url('../../images/combi/arte.jpg');}
.super_benita {background-image: url('../../images/combi/super_benita.jpg');}
.benita {background-image: url('../../images/combi/benita.jpg');}
.maronnier {background-image: url('../../images/combi/maronnier.jpg');}
.crossing {background-image: url('../../images/combi/crossing.jpg');}
.burger {background-image: url('../../images/combi/burger.jpg');}
.crease {background-image: url('../../images/combi/crease.jpg');}
.metal_gradation {background-image: url('../../images/combi/metal_gradation.jpg');}
.pleated_5line {background-image: url('../../images/combi/pleated_5line.jpg');}
.trio_6line {background-image: url('../../images/combi/trio_6line.jpg');}
.folding_2line {background-image: url('../../images/combi/folding_2line.jpg');}
/*  */
.galaxy {background-image: url('../../images/combi/galaxy.jpg');}
.emerald {background-image: url('../../images/combi/emerald.jpg');}
.venezia {background-image: url('../../images/combi/venezia.jpg');}
.rudy {background-image: url('../../images/combi/rudy.jpg');}
.woodlook_soft {background-image: url('../../images/combi/woodlook_soft.jpg');}
.cubic_st {background-image: url('../../images/combi/cubic_st.jpg');}
.open_pearl {background-image: url('../../images/combi/open_pearl.jpg');}
.panorama {background-image: url('../../images/combi/panorama.jpg');}
.twin_50 {background-image: url('../../images/combi/twin_50.jpg');}
.blackout_50 {background-image: url('../../images/combi/blackout_50.jpg');}
/*  */
.sense {background-image: url('../../images/combi/sense.jpg');}
.hugo {background-image: url('../../images/combi/hugo.jpg');}
.band_mobile {background-image: url('../../images/combi/band_mobile.jpg');}
.bal_gradation_combi {background-image: url('../../images/combi/bal_gradation_combi.jpg');}
.bal_woodlook_combi {background-image: url('../../images/combi/bal_woodlook_combi.jpg');}
.rainbow {background-image: url('../../images/combi/rainbow.jpg');}
.net_woodlook {background-image: url('../../images/combi/net_woodlook.jpg');}
.rope {background-image: url('../../images/combi/rope.jpg');}
.provence {background-image: url('../../images/combi/provence.jpg');}
.small_trio {background-image: url('../../images/combi/small_trio.jpg');}
.super_woodlook {background-image: url('../../images/combi/super_woodlook.jpg');}
.super_diamond {background-image: url('../../images/combi/super_diamond.jpg');}
.woodlook {background-image: url('../../images/combi/woodlook.jpg');}
.basic {background-image: url('../../images/combi/basic.jpg');}
/*  */
.ben_280 {background-image: url('../../images/roll/ben_280.jpg');}
.ace_280 {background-image: url('../../images/roll/ace_280.jpg');}
.venetian {background-image: url('../../images/roll/venetian.jpg');}
.slub {background-image: url('../../images/roll/slub.jpg');}
.sl_280 {background-image: url('../../images/roll/sl_280.jpg');}
.mars {background-image: url('../../images/roll/mars.jpg');}
.woodlook_single {background-image: url('../../images/roll/woodlook_single.jpg');}
/*  */
.dwcb1 {background-image: url('../../images/roll/dwcb1.jpg');}
.dwcb2 {background-image: url('../../images/roll/dwcb2.jpg');}
.dwgb {background-image: url('../../images/roll/dwgb.jpg');}
.dwsb {background-image: url('../../images/roll/dwsb.jpg');}
/*  */
.screen_ace_280 {background-image: url('../../images/roll/screen_ace_280.jpg');}
.screen_sl_280 {background-image: url('../../images/roll/screen_sl_280.jpg');}
.screen_mars {background-image: url('../../images/roll/screen_mars.jpg');}
.screen_slub {background-image: url('../../images/roll/screen_slub.jpg');}
.screen_tc {background-image: url('../../images/roll/screen_tc.jpg');}







/* direction */
.direction { padding-bottom:10%; }
.direction section { position: relative;}
.direction section iframe { width:100%; height:600px;  }
.direction section .box_wrap { position:absolute; top:100%; left:50%; width:90%; padding:5%; background-color: #fff;  transform: translate(-50%, -50%);   }
.direction section .box_wrap div {  }
.direction section .box_wrap .i-box { width:30%;  padding:3% 10%; background-size: contain; background-image: url("../../images/logo_bl.png"); float:left; background-position: center center; } 
.direction section .box_wrap .t-box { float:right; width:70%; border-left:1px solid #ddd; padding-left:20px;  }
.direction section .box_wrap .t-box ul { margin:0 30px 10px 0; overflow: hidden; display: inline-block;}
.direction section .box_wrap .t-box ul li { margin-right:15px; }
.direction section .box_wrap .t-box ul li:first-child { padding:12px; background-position: center; }
.direction section .box_wrap .t-box ul li:nth-child(2) { text-transform: uppercase; font-weight:500; }
.direction section .box_wrap .t-box ul:first-child { width:100%; overflow: hidden;}
.direction section .box_wrap .t-box ul .add { background-image: url("../../images/i-add.png");}
.direction section .box_wrap .t-box ul .tel { background-image: url("../../images/i-tel.png");}
.direction section .box_wrap .t-box ul .fax { background-image: url("../../images/i-fax.png");}


@media only screen  and (max-width:680px){   

    .direction section iframe { height:350px;  }
    .direction section .box_wrap .i-box { width:100%;  padding:5%;  } 
    .direction section .box_wrap .t-box { width:100%; border-left:0px solid #ddd; padding:20px 0 0; margin:10px 0 0;  }
    .direction .contents { padding-bottom: 100px !important;}
 } 



/* promote */
.video_wrap { width: 100%; max-width: 1300px; margin:0 auto; border-radius: 30px; }
.video_wrap section { position:relative; height: auto;  padding-top: 50%; }
.video_wrap section iframe {   z-index: 1; top: 0; left: 0; position: absolute; width: 100%; height: 100%; }


@media only screen  and (max-width:680px){   


    
 } 




/* greeting */
.greeting .contents { margin-bottom:0;}
.ceo_wrap { background-image: url("../../images/cir.png"); background-size: 50%; background-position: bottom; line-height:1.6em; }
.ceo_wrap > p {margin:20px auto; text-align: center; font-weight:700; font-size:2em; }
.ceo_wrap > .i-box { background-image: url("../../images/mark.png"); display: block; margin:0 auto; padding:30px; max-width:50px; background-size: contain; }
.ceo_wrap section { margin-top:5%;}
.ceo_wrap section div { margin:4% 0 10%; overflow: hidden;}
.ceo_wrap section div ul { width:45%; float:left; }
.ceo_wrap section div ul .i-box { border-radius: 15px; border:1px solid #cbcbcb; margin:20px 0;}
.ceo_wrap section div ul:first-child { float:left; }
.ceo_wrap section div ul:first-child .i-box { background-image: url("../../images/greeting_01.jpg"); width:80%; max-width:400px; padding-bottom:80%;  }
.ceo_wrap section div ul:last-child { float:right;}
.ceo_wrap section div ul:last-child .i-box { background-image: url("../../images/greeting_02.jpg"); padding-bottom:80%; margin-bottom:20px; }
.ceo_wrap section div ul li { float:none; margin-bottom:20px; }
.ceo_wrap section div ul .txt  { color:#955528; font-weight:400; font-size:1.1em; }


.banner_wrap { background-image: url("../../images/tit-banner.jpg"); padding:7% 2% 5%; overflow: hidden; width:100%; }
.banner_wrap div { background-image: url("../../images/style.png"); width:300px; margin:0 auto; padding-bottom:3%; background-size: contain; 
    }
.banner_wrap a { padding:10px 25px; border-radius: 35px; background-color: rgba(126, 59, 5, 0.767); color:#fff; display: block; margin:10px auto; text-align: center; width:20%; min-width:250px; transition: all .3s; }
.banner_wrap a:hover { background-color: rgba(126, 59, 5, 1);  transition: all .3s; }



@media only screen  and (max-width:680px){   
    .ceo_wrap section div ul { width:100%; float:none; }
    .banner_wrap { padding:15% 2% 10%; }
    .banner_wrap div {  padding-bottom:5%; text-align: center;}
    .ceo_wrap section div ul:first-child .i-box { width:80%; max-width:100%; padding-bottom:80%;  }
    .ceo_wrap section div ul:last-child .i-box {  padding-bottom:80%; margin-bottom:20px; }
} 



/* process */
.process_box h4 { text-transform: uppercase; font-weight:500; }
.process_box section { display: flex; flex-wrap:wrap; align-items: center; margin-bottom:30px;  }
.process_box section > p { flex-basis:100%; text-align: center;  }
.process_box section > p:first-child { font-weight:700; font-size:2em; margin-bottom:10px;  }
.process_box section:nth-child(even)   {   }
.process_box section div { flex:1; padding:3%; flex-basis:50%; max-width:50%;  }
.process_box section div:first-child { flex:1;   padding:13%; background-size: contain;}


.process_box .tit ul { display: flex; max-width:800px; padding:1% 3% 3% 3%;  width:100%; margin:50px auto; background-image: url('../../images/process-bg.png'); background-size: contain; }
.process_box .tit ul li { background-size: 50%; text-transform: capitalize; font-weight:500; }
.process_box .tit ul li:nth-child(odd) { flex:3; padding:20% 2% 2% 2%; }
.process_box .tit ul li:nth-child(even) { flex:1;  padding:7%; }
.process_box .tit ul li:nth-child(1) { background-image: url('../../images/i-weaving.png');}
.process_box .tit ul li:nth-child(3) { background-image: url('../../images/i-finishing.png');}
.process_box .tit ul li:nth-child(5) { background-image: url('../../images/i-goods.png');}

.process_box .weaving .txt-box h4 { color:#c0c0c0; }
.process_box .finishing .txt-box h4 { color:#9e7e68; }
.process_box .goods .txt-box h4 { color:#955528; }
.process_box .goods .txt-box b { position: relative;}
.process_box .goods .txt-box b span { z-index: -1; position:absolute; top:50%; left:0;  width:100%; height:50%; background-color: #e9dcd4; }


.process_box .weaving .img-box { background-image: url('../../images/process-1.jpg');}
.process_box .finishing .img-box { background-image: url('../../images/process-2.jpg');}
.process_box .goods .img-box { background-image: url('../../images/process-3.jpg');}




@media only screen  and (max-width:1080px){   
    .process_box .tit ul li:nth-child(even) { padding:5%;  }
    .process_box .tit ul li { background-size: 40%; }
}
@media only screen  and (max-width:680px){   
    .process_box section div { flex-basis:100%; max-width:100%; }  
    .process_box .tit ul li:nth-child(odd) { flex:4; padding:20% 2% 2% 2%;   }
    .process_box .tit ul li:nth-child(even) { flex:1;  padding:20px; }
}