@charset "utf-8";

/*비쥬얼*/
#mVisu {width:100%; height:100vh; overflow:hidden;}
#mVisu .swiper-slide {display:table; background-repeat:no-repeat; background-position:center center; background-size:cover;}
#mVisu .txt_box {display:table-cell; text-align:center; vertical-align:middle;}
#mVisu .txt_box h2 {font-size:3.5em; color:#fff; letter-spacing:-0.04em; line-height:1.2em; font-weight:500;  position:relative; margin:30px 0; opacity:0; transform:translateY(50px); transition:all 0.8s ease 0.4s}
#mVisu .txt_box h2 span {font-weight:200;}
#mVisu .txt_box .en {display:inline-block; font-size:1.1em; font-family: 'Barlow Condensed', sans-serif; color:#bea48b; font-weight:600; letter-spacing:0.1em; border-bottom:1px solid rgba(255,255,255,0.2); padding:5px 15px; opacity:0; transform:translateY(50px); transition:all 0.8s ease}
#mVisu .txt_box .t1 {font-size:1.35em; color:#fff; line-height:1.6em; letter-spacing:0.5em; font-weight:200;  opacity:0; transform:translateY(50px); transition:all 0.8s ease 0.7s}
#mVisu .swiper-pagination-bullet {width:8px; height:8px; border-radius:0; opacity:1; background:#fff;}
#mVisu .swiper-pagination-bullet-active {width:40px; background:#caa56b;}
#mVisu .swiper-slide-active .txt_box h2, #mVisu .swiper-slide-active .txt_box .en, #mVisu .swiper-slide-active .txt_box .t1 {opacity:1; transform:translateY(0)}



@media screen and (max-width:767px){
	#mVisu {width:100%; height:250px; overflow:hidden;}
	#mVisu .swiper-slide {display:table; background-repeat:no-repeat; background-position:center center;}
	#mVisu .txt_box {display:table-cell; text-align:center; vertical-align:middle;}
	#mVisu .txt_box h2 {font-size:7vw; margin:8% 0;}
	#mVisu .txt_box .en {font-size:0.85em; padding:4px 10px;}
	#mVisu .txt_box .t1 {font-size:1em; padding: 0 5%; }
	#mVisu .txt_box .t1 br { display: none; }
	#mVisu .swiper-pagination-bullet {display:none}
	#mVisu .mv1 .txt_box h2 { font-size: 7vw;  }

}


.mTit {font-size:2.2em; color:#000; line-height:1.3em; font-weight:300;}
.mTit span {font-weight:600;}
.mTxt {font-size:1em; color:#989898; letter-spacing:-0.09em; font-weight:500; margin-top:5px;}
.mTxt.white {color:rgba(255,255,255,0.3)}

@media screen and (max-width:767px){
	.mTit {font-size:1.9em;}
	.mTxt {font-size:0.95em; margin-top:2px;}
}

/*제품소개*/
#mproduct { position: relative; width: 100%; padding: 6% 0; overflow: hidden;   }
#mproduct .m-tit { text-align: center; margin-bottom: 2em;  }
#mproduct .m-tit p{font-size:1.1em; font-family: 'Barlow Condensed', sans-serif; color:#bea48b; font-weight:300; letter-spacing:0.1em; }
#mproduct .m-tit h3{font-size:1.8em; color:#000; letter-spacing:-0.04em; line-height:1.6em; font-weight:500;}
#mproduct .m-tit h3 span{font-weight:300;}

#mproduct .autoplay { z-index:9; position: relative;}
#mproduct .autoplay .appCont { float: left; margin-right: 15px; width: calc(20% - 12px); }
#mproduct .autoplay .appCont:last-child { margin-right:0; }
#mproduct .autoplay .appCont a { display: block; }
#mproduct .autoplay .appCont a img { width: 100%; }
#mproduct .autoplay .appCont a .app-txt { position: relative; border:1px solid #e5e5e5; border-top:0; background:#fff; padding: 2em 25px; }
#mproduct .autoplay .appCont a .app-txt dl dt { color:#1c4e50; font-size: 1.25em; margin-bottom: 0.5em;}
#mproduct .autoplay .appCont a .app-txt dl dd { color:#989898; font-size: 0.93em; }
#mproduct .autoplay .appCont a .app-txt .mpr-tit { color:#c4ab8a; font-size: 1em; }


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

#mproduct { padding: 6% 4%; }

}

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

#mproduct { padding: 7% 5%; }
#mproduct .autoplay .appCont a .app-txt .label { top: -10px; }
#mproduct .autoplay .appCont a .app-txt .label p { line-height: 20px; font-size: 9px; padding: 0 7px; }

}


/*시공갤러리*/
#mgallery { position: relative; width: 100%; padding: 5% 0; overflow: hidden; background: #c4ab8a; }
#mgallery .m-tit { text-align: center; margin-bottom: 2em;  }
#mgallery .m-tit p{font-size:1.1em; font-family: 'Barlow Condensed', sans-serif; color:#fff; font-weight:300; letter-spacing:0.1em; }
#mgallery .m-tit h3{font-size:1.8em; color:#fff; letter-spacing:-0.04em; line-height:1.6em; font-weight:500;}
#mgallery .m-tit h3 span{font-weight:300;}

#mgallery .autoplay { z-index:9; position: relative;}
#mgallery .autoplay .appCont { float: left; margin-right: 15px; width: calc(20% - 12px); }
#mgallery .autoplay .appCont:last-child { margin-right:0; }
#mgallery .autoplay .appCont a { display: block; }
#mgallery .autoplay .appCont a img { width: 100%; }
#mgallery .autoplay .appCont a .app-txt { position: relative; border:1px solid #e5e5e5; border-top:0; background:#fff; padding: 2em 25px; }
#mgallery .autoplay .appCont a .app-txt dl dt { color:#1c4e50; font-size: 1.25em; margin-bottom: 0.5em;}
#mgallery .autoplay .appCont a .app-txt dl dd { color:#989898; font-size: 0.93em; }
#mgallery .autoplay .appCont a .app-txt .mpr-tit { color:#c4ab8a; font-size: 1em; }
#mgallery .sec2_link {font-weight:400; color:#FFF; border:1px solid #FFF; width:70%; max-width:130px; height:40px; line-height:40px; text-align:center; display:block; margin: 0 auto;}
#mgallery .sec2_link:hover{background: #FFF; border-color:#ddd; color:#c4ab8a;}

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

#mgallery { padding: 6% 4%; }

}

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

#mgallery { padding: 7% 5%; }
#mgallery .autoplay .appCont a .app-txt .label { top: -10px; }
#mgallery .autoplay .appCont a .app-txt .label p { line-height: 20px; font-size: 9px; padding: 0 7px; }

}


/*유리*/

#mGlass {width:100%; overflow:hidden; position:relative;}
.mTech_list {width:1920px; margin:40px auto 0; position:relative;}
.mTech_list .swiper-slide {background:#fff;}
.mTech_list .swiper-slide img {width:100%; opacity:0.5}
/*
.mTech_list .swiper-button-next, .mTech_list .swiper-button-prev {width:37px; height:37px; margin-top:0; background-size:cover; z-index: 100;}
.mTech_list .swiper-button-next {background-image:url(/images/main/mTech_next.png); right:300px;}
.mTech_list .swiper-button-prev {background-image:url(/images/main/mTech_prev.png); left:1100px;}
*/
.mTech_list .swiper-slide-active img {opacity:1;}

.mTech_txt_wrap {width:880px; height:440px; background:#fff; position:absolute; bottom:150px; right:55px; z-index:30;background-image:url(/images/main/gray_logo.png1); background-repeat: no-repeat; background-position: 247px 245px; }
.mTech_txt_wrap .mTech_txt {background-image:url(/images/main/gray_logo.png1); background-repeat: no-repeat; background-position: 247px 245px; z-index:20;}
.mTech_txt_wrap .swiper-button-next, .mTech_txt_wrap .swiper-button-prev {width:37px; height:37px; margin-top:0; background-size:cover; z-index: 3000;}
.mTech_txt_wrap .swiper-button-next {background-image:url(/images/main/mTech_next.png); right:250px;}
.mTech_txt_wrap .swiper-button-prev {background-image:url(/images/main/mTech_prev.png); left:100px;}
.mTech_txt > div {position:absolute; top:0; left:0; width:100%; height:100%; box-sizing:border-box; padding:80px 115px; opacity:0; transition:opacity 0.6s}
.mTech_txt > div.active {opacity:1;}
.mTech_txt h3 {font-size:2.6em; color:#000; line-height:1.2em; font-weight:700;}
.mTech_txt p {font-size:1.1em; color:#000; line-height:1.7em; letter-spacing:-0.07em; margin-top:20px;font-weight:300;}
.mTech_txt ul {position:absolute; bottom: 80px; font-size:1.1em; font-weight:400; color: #757575}
.mTech_txt li {display: inline-block; margin-right: 32px;}
.mTech_txt .on {color:#000; font-weight:500; border-bottom:2px solid #ccc; padding:5px}
/*.mTech_txt  a {display:block; width:70px; height:70px; position:absolute; right:0; top:0; background:#000 url(/images/main/mTech_more.png) no-repeat center center; font-size:0; text-indent:-9999px;}*/
.mTech_a{position: absolute; left: 42%; top: 62.5%; transform: translate(-53.5%, -42%); padding: 6px 50px; background-color: #000; color: #fff; font-size: 1.2em; z-index: 999;}


@media screen and (max-width:976px){
	#mGlass:before {height:150px;}
	.mTech_list {height:650px; margin-top:6%}
	.mTech_txt_wrap {width:700px; height:390px; right:0px; background:#fff; position:absolute; z-index:30;background-image:url(/images/main/gray_logo.png1); background-repeat: no-repeat; background-position: 247px 180px; margin: 0px auto;}
	.mTech_txt_wrap .swiper-button-next {right:50px;}
	.mTech_txt_wrap .swiper-button-prev {left:50px;}
	.mTech_txt {width:85%; height:150px;}
	.mTech_txt > div {padding:50px 60px 0 60px;}
	.mTech_txt p {margin-top:15px;}

}

@media all and(max-width:881px){
    .mTech_a{left: 50%; transform: translateX(-50%);}
}

@media screen and (max-width:767px){
	#mGlass:before {height:100px;}
	.mTech_list {height:300px; margin-top:6%}
	.mTech_txt_wrap {position: relative; width:95%; height:220px; margin-right: 50px; left: 5%; bottom: 150px; background:#fff;  z-index:30;}
	.mTech_txt > div {padding:20px 30px 0 40px;}
	.mTech_txt h3 {font-size:2em;}
	.mTech_txt p {margin-top:2%; font-size:1em;}
/*	.mTech_txt a {width:25px; height:25px;}*/
	.mTech_txt ul {bottom: 30px; font-size:0.9em; font-weight:400; color: #757575}
	.mTech_txt li {margin-right: 15px;}
	.mTech_txt_wrap .swiper-button-next {right:50px;}
	.mTech_txt_wrap .swiper-button-prev {left:40px;}
    .mTech_a{top: 62%; left: 50%; transform: translateX(-50%);}
}
@media screen and (max-width:480px){
    .mTech_txt p {font-size:0.8em;}
}



/*news*/
#mNews { overflow: hidden; }
#mNews .newsBox { padding: 110px 10% 120px 10%}
#mNews .newsBox  h3 { color:#000; font-size: 2.7em; text-align: center; line-height: 1.7em;}
#mNews .newsBox  h3 span{font-weight: 300;}
#mNews .newsBox  h4 { color:#989898; font-size: 1.2em; text-align: center; font-weight: 100; padding-bottom: 70px;}
#mNews .newsBox .news-tit a { float: right; color:#bcbabe; font-family: 'Khand', sans-serif; font-weight: 500; letter-spacing:0;  }
#mNews .newsBox .newsList .mline { border-bottom: 2px solid #000 }
#mNews .newsBox .newsList li { overflow: hidden; background:url("/images/main/dotline.png") repeat-x bottom; padding:30px 0; }
#mNews .newsBox .newsList li a p { float: left; }
#mNews .newsBox .newsList li a p.date { color:#333; font-size: 11px; text-align: center; letter-spacing: 0; font-weight: 500; line-height: 1.0em; margin: 7px 60px 0px;  }
#mNews .newsBox .newsList li a p.date .day { font-size: 40px; font-weight: 900; line-height: 1.0em; } 
#mNews .newsBox .newsList li a p.news-tit { font-size: 18px; color:#989898; padding-top: 3px; }
#mNews .newsBox .newsList li a p.news-tit span { font-size: 1.3em; color:#000;}

#mNews .newsBox .m-tit { text-align: center; margin-bottom: 4em;  }
#mNews .newsBox .m-tit h3 { color:#212121; font-size: 2.26em; margin-bottom: 0.7em; line-height: 1.0em;  }
#mNews .newsBox .m-tit p { color:#989898; }
#mNews .newsBox .m-tit span { font-weight: 300;}

@media all and (max-width:1280px) {
	.m-tit h3 { font-size: 2.1em; }
	#mNews .newsBox .newsList li a p.news-tit {width:70%}
}


@media all and (max-width:976px) {

#mNews { padding: 8% 0; }	
#mNews .newsBox .newsList li a p.news-tit {width:70%}

}

@media all and (max-width:767px) {
#mNews { padding: 10% 0; }
#mNews .newsBox { width: 100%; padding: 5%;  }
#mNews .news1 { border-right: 1px solid #ddd; border-bottom: 0;  }
#mNews .newsBox .news-tit  { font-size: 1.2em; }

#mNews .newsBox .newsList li {padding: 16px 10px; }
#mNews .newsBox .newsList li a p.date .day { font-size: 2.8em; }
#mNews .newsBox .newsList li a p.news-tit { font-size: 13px;  width:70%}
#mNews .newsBox .newsList li a p.news-tit span { line-height: 2em; font-size: 9px; padding: 0 5px; }
#mNews .newsBox .newsList li a p.date { margin: 7px 60px 0px 20px;  }
}


@media all and (max-width:580px) {
#mNews .newsBox .newsList li a p.date { font-size: 10px; }
#mNews .newsBox .newsList li a p.date { margin-right: 20px; }
#mNews .newsBox .newsList li a p.news-tit { font-size: 11px;}
#mNews .newsBox .newsList li a p.news-tit span { font-size: 1.2em; letter-spacing: -0.04em; line-height: 1.0em;  padding: 5px 4px 4px 0px; }
#mNews .newsBox .newsList li a p.date { margin: 7px 20px 0px 0px;  }

}




/*footer*/
#mFt { text-align: center; background:url("/images/main/m_ft_bg.jpg") no-repeat center center; background-size: cover; color:#fff; padding: 8% 0; }
#mFt .t1 { font-size: 3em; font-weight: 700; letter-spacing: -0.06em;}
#mFt .t1 span { color: #c4ab8a;}
#mFt .t2 { font-size: 1.2em; font-weight: 300; line-height: 1.0em; margin:1.2em 0;}
#mFt .t3 { font-size: 1.6em; font-weight: 100; display: inline-block;}
#mFt .t3 span { font-family: 'Barlow Condensed', sans-serif; font-size: 1.2em; font-weight: 500; line-height: 1.0em; padding-right: 1em}


@media all and (max-width: 1080px){
   #mFt  { font-size: 0.9em; }
}

@media all and (max-width: 976px){
   #mFt .t2 { margin:2em 0;  }
   #mFt .t4 { margin-top: 1em; }
}

@media all and (max-width: 767px){
   #mFt  { font-size: 0.75em; }
}

@media all and (max-width: 568px){
   #mFt  { font-size: 0.65em; }
   #mFt .t3 { font-size: 3.5em; }
}

@media all and (max-width: 480px){
   #mFt  { font-size: 0.5em; }
   #mFt .t2 { font-size: 0.5em; letter-spacing: 0.5em;}
   #mFt .t4 { font-size: 1.05em;}
}