@charset "utf-8";

/* ===================================================== */
/* 콘텐츠 공통 */

.in_pd{padding:10rem 0 10rem 0;}
.bg_gr{background-color:#f7f7f7;}
section:first-child.in_pd{padding-top:3rem;}
section:last-child.in_pd{padding-bottom:15rem;}
.cont_nml{font-size:1.6rem; color:#666; font-weight:500; margin-bottom:4rem;}
ul.cont_nml li{margin-bottom:1rem; margin-left:0.8rem; display:flex;}
ul.cont_nml li:before{content:'·'; color:#888;  font-size:1.6rem; text-indent:-0.8rem;  }
ol.cont_nml li{margin-bottom:1rem;}
.of_hd{overflow:hidden;}
.f_blu{color:var(--color-main);}
li .f_blu{line-height:1.2;}
.f_bk{color:#222;}
.mg-tp5{margin-top:5rem;}
.pd-tp3{padding-top:3rem;}


/* 타이틀 */
.title_top{display:flex;  flex-wrap:wrap; align-items:end; padding-bottom:3rem; font-weight:700; margin-bottom:5rem; position:relative;}
.title_top:before{ position:absolute; bottom:0; left:0; content:''; width:100%; height:1px;border-bottom:1px solid #cccccc;}
.title_top:after{ position:absolute;  bottom:0; left:0; content:''; width:50px; height:1px;border-bottom:1px solid var(--color-main);}
.title_top h4{color:#222; font-size:3rem;  margin-right:2rem;}
.title_top p{font-size:1.7rem; color:#888; padding-top:1.5rem;}
h6{color:#222; font-size:2rem; font-weight:700; margin-bottom:1.5rem;}

/* 테이블 */
.tb_st{width:100%; margin-bottom:5rem;}
.tb_st thead{
	border-top:2px solid var(--color-main); 
	background-color:#f3f6fa; 
	text-align:center;
	font-size:1.7rem; font-weight:600; color:var(--color-main); 
	}
.tb_st thead tr th{padding:2rem;}
.tb_st tbody tr td{color:#666; font-size:1.6rem; font-weight:500; padding:2rem;text-align:center;}
.tb_st thead th, .tb_st tbody td{border-right:1px solid #cccccc;}
.tb_st thead th:last-child, .tb_st tbody td:last-child{border-right:0;}
.tb_st tbody tr {border-bottom:1px solid #cccccc;}
.tb_st tbody tr:last-child {border-bottom:2px solid #cccccc;}

@media (hover: hover) and (pointer: fine) {
}
@media (max-width: 1280px){
}
@media (max-width: 1024px){
  
}
@media (max-width: 768px){

}
@media (max-width: 576px){
}
@media (max-width: 480px){
}
/* 콘텐츠 공통 */
/* ===================================================== */


/* ===================================================== */
/*  */

@media (hover: hover) and (pointer: fine) {
}
@media (max-width: 1280px){
}
@media (max-width: 1024px){
}
@media (max-width: 768px){
}
@media (max-width: 576px){
}
@media (max-width: 480px){
}
/*  */
/* ===================================================== */


/* 010100_product list */
.pdlist_st{display:grid; }
.align_3{grid-template-columns:repeat(3, 1fr);gap:5.5rem;}
.align_4{grid-template-columns:repeat(4, 1fr);gap:4rem;}
.pdlist_st li { 
	height:33rem; position:relative;
	background-image:url(../images/sub/pdl_bg_h.png); background-repeat:no-repeat; 
	background-blend-mode:screen; background-color:#888; 
	background-position:top left;	
	border-radius:0 3rem 0 0;
	margin-left:20px;
	}
.pdlist_st.align_4 li{height:38rem;}
.pdlist_st li:hover{
	 background-image:url(../images/sub/pdl_bg.png); 
	 background-color:var(--color-main); 
	 background-blend-mode:unset;
	 transition:0.5s ease-in-out;
	}	
.pdlist_st li h5{
	color:#fff; font-size:2.2rem; font-weight:600; text-align:right; 
	position:absolute;
	top:3rem;
	right:3rem;
	z-index:10;	
	} 

.pdlist_st li a .pro_pic{
	z-index:10;position:absolute; bottom:0;  
	border-radius:0 3rem 0 0; 
	width:100%;   
	text-align:center;
	transform:translate(-20px, 0);
	transition:0.5s ease-in-out;
	display:none;
	} 

.pdlist_st li a:hover .pro_pic {
	display:block;
	height:25rem;	
	box-shadow: 0px -5px 10px rgba(0,0,0,0.2);
	transition:0.5s ease-in-out;
	}
.pdlist_st.align_4 li a:hover .pro_pic {height:30rem;}
.pdlist_st li a:hover .pro_pic div{ margin-top:calc((25rem - 6.7rem) / 2); }
.pdlist_st.align_4 li a:hover .pro_pic div{ margin-top:calc((30rem - 6.7rem) / 2); }
.pdlist_st li a .pro_pic div{color:#fff; font-size:1.7rem; font-weight:400;}
.pdlist_st li a .pro_pic p{
	 color:#888; font-size:3.5rem; 
	font-weight:300; background-color:#fff; border-radius:50%; height:3.5rem; aspect-ratio:1/1; 
	margin:1rem auto;
	display:flex; justify-content:center; align-items:center; 
	}

.pdlist_st li a .pro_bg{
	position:absolute; bottom:0; 
	border-radius:0 3rem 0 0; 
	height:25rem;
	transform:translate(-20px, 0);
	overflow:hidden;	
}
.pdlist_st.align_4 li a .pro_bg{height:30rem;}
.pdlist_st li a .pro_bg:before{
	content:''; 
	background: linear-gradient(to bottom, rgba(0,0,0,0.7) ,rgba(0,0,0,0.7)); 
	transform: translateY(100%);
	transition: 0.5s;
	display:block;
	width:100%;
	height:100%;
	position:absolute;
	z-index:11;
	}
.pdlist_st li a:hover .pro_bg:before{transform: translateY(0);}
.pdlist_st li a .pro_bg img{ object-fit:cover; }
.pdlist_st.align_4 li a .pro_bg img{height:100%;}

@media (max-width: 1150px){
.pdlist_st.align_4{gap:3.5rem;}
.align_4{grid-template-columns:repeat(2, 1fr); gap:3rem;}
.align_4 li a .pro_bg{width:100%;}
.align_4 li a .pro_bg img{width:100%; }
}
@media (max-width: 880px){
	.pdlist_st{gap:3.5rem;}
	.pdlist_st.align_3 li a .pro_bg img{height:100%; }
}
@media (max-width: 640px){
	.align_3, .align_4{grid-template-columns:repeat(1, 1fr);}
	.align_3 li a .pro_bg{width:100%;}
	.align_3 li a .pro_bg img{width:100%; }
	.pdlist_st.align_4 li{height:33rem;}
	.pdlist_st.align_4 li a:hover .pro_pic {height:25rem;}
	.pdlist_st.align_4 li a:hover .pro_pic div{ margin-top:calc((25rem - 6.7rem) / 2); }
	.pdlist_st.align_4 li a .pro_bg{height:25rem;}
}

/*설치사례 썸네일 */
.pdlist_title{color:#222; font-size:3.2rem; text-align:center; font-weight:700; margin-bottom:5rem;}
.pdlist_th{
	height:33rem; position:relative;
	background-image:url(../images/sub/pdl_bg_h.png); background-repeat:no-repeat; 
	background-blend-mode:screen; background-color:#888; 
	background-position:top left;	
	border-radius:0 3rem 0 0;
	margin:0 auto;
	width:70%;
	max-width:40rem;
}
.pdlist_th:hover{
	 background-image:url(../images/sub/pdl_bg.png); 
	 background-color:var(--color-main); 
	 background-blend-mode:unset;
	 transition:0.5s ease-in-out;
	}	
.pdlist_th h5{
	color:#fff; font-size:2.2rem; font-weight:600; text-align:right; 
	position:absolute;
	top:3rem;
	right:3rem;
	z-index:10;	
	} 

.pdlist_th a .pro_pic{
	z-index:10;position:absolute; bottom:0;  
	border-radius:0 3rem 0 0; 
	width:100%;   
	text-align:center;
	transform:translate(-20px, 0);
	transition:0.5s ease-in-out;
	display:none;
	} 

.pdlist_th a:hover .pro_pic {
	display:block;
	height:25rem;	
	box-shadow: 0px -5px 10px rgba(0,0,0,0.2);
	transition:0.5s ease-in-out;
	}
.pdlist_th a:hover .pro_pic div{ margin-top:calc((25rem - 6.7rem) / 2); }
.pdlist_th a .pro_pic div{color:#fff; font-size:1.7rem; font-weight:400;}
.pdlist_th a .pro_pic p{
	 color:#888; font-size:3.5rem; 
	font-weight:300; background-color:#fff; border-radius:50%; height:3.5rem; aspect-ratio:1/1; 
	margin:1rem auto;
	display:flex; justify-content:center; align-items:center; 
	}

.pdlist_th a .pro_bg{
	position:absolute; bottom:0; 
	border-radius:0 3rem 0 0; 
	height:25rem;
	width:100%;
	transform:translate(-20px, 0);
	overflow:hidden;	
}
.pdlist_th a .pro_bg:before{
	content:''; 
	background: linear-gradient(to bottom, rgba(0,0,0,0.7) ,rgba(0,0,0,0.7)); 
	transform: translateY(100%);
	transition: 0.5s;
	display:block;
	width:100%;
	height:100%;
	position:absolute;
	z-index:11;
	}
.pdlist_th a:hover .pro_bg:before{transform: translateY(0);}
.pdlist_th a .pro_bg img{ object-fit:cover;width:100%; }


/*-----S:제품페이지 공통-----*/


/*제품이미지*/
.imgst_al2{display:grid; grid-template-columns:repeat(2, 1fr);gap:4rem; background-color:#f7f7f7;border-radius:3rem; width:100%; padding:4rem;}
.imgst_al2 .bg_wh{background-color:#fff; border-radius:3rem; }
.imgst_al2 img{ border-radius:3rem;}

.imgst_al4{display:flex; flex-wrap:wrap; justify-content:space-between;}
.imgst_al4 .img_inner{width:48.5%;  border-radius:0 3rem 0 0; position:relative; margin-bottom:5rem;}
.imgst_al4 .img_inner:after{
	content:''; position:absolute; top:0; right:0; 
	width:10rem; height:10rem; 
	border-radius:0 4rem 0 0; 
	background-color:var(--color-main);
	z-index:-5;
	}
.imgst_al4 .img_inner img,
.imgst_al4 .img_inner video{padding:10px 10px 0 0; border-radius:0 4rem 0 0;}
.imgst_al4 .img_inner p{font-size:1.8rem; color:#222; font-weight:600; text-align:center; margin-top:1rem; margin-bottom:-5rem;}

.img_al01{background-color:#f7f7f7; border-radius:3rem; padding:4rem; width:100%;margin-bottom:5rem;}
.img_al01 img{border-radius:3rem;background-color:#fff;}

.img_rd img{border-radius:3rem;}

@media (max-width: 640px){
	.imgst_al2{grid-template-columns:repeat(1, 1fr);}
	.imgst_al4 .img_inner{width:100%; }	
	.imgst_al4 .img_inner:first-child{margin-bottom:8rem;}
	.img_al01{padding:2rem;}
}
/*제품특징*/
.p_chr{display:grid; grid-template-columns:repeat(3, 1fr);gap:4rem;}
.p_chr li .li_inner {
	background-color:#fff; 
	width:calc(100% - 10px);
	height:-webkit-fill-available;
	min-height:17rem; position:relative;
	border-radius:0 0 30px 0; padding:3rem;
	margin-bottom:10px;
	}
.p_chr li .li_inner:before{content:''; position:absolute; bottom:0; right:0; width:50px; height:50px; background-color:#fff; border-radius:0 0 30px 0; z-index:5;}
.p_chr li .li_inner:after{content:'';position:absolute; bottom:-10px; right:-10px; width:50px; height:50px; background-color:var(--color-main); border-radius:0 0 40px 0;}
.p_chr li .li_inner .chr_no{color:#bcdcf1; font-size:3.7rem; font-weight:900; margin-bottom:1rem; }
.p_chr li .li_inner h5{color:#222;font-size:1.8rem; font-weight:600; width:78%;}
.p_chr li .li_inner p{color:#666;font-size:1.6rem; font-weight:500; width:78%;}
.p_chr li .li_inner img{position:absolute; bottom:3rem; right:3rem;z-index:10; }
@media (max-width: 720px){
	.p_chr{grid-template-columns:repeat(1, 1fr);}
	
}
/*제품적용*/
.pr_apply{display:grid; grid-template-columns:repeat(2, 1fr);gap:4rem;}
.pr_apply li{padding:2rem; height:25rem; font-size:2rem; color:#fff; font-weight:500;display:flex; justify-content:center; align-items:center; text-align:center;border-radius:3rem; }
.pr_apply li:nth-child(1){background-image:url(../images/sub/010103_bg01.jpg);}
.pr_apply li:nth-child(2){background-image:url(../images/sub/010103_bg02.jpg);}
@media (max-width: 720px){
	.pr_apply{grid-template-columns:repeat(1, 1fr);}
}
/*컬러선택*/
.choix{display:flex; justify-content:space-between;}
.choi_tab{width:50%; }
.choix h5{font-size:1.9rem; color:#222; font-weight:700; margin-bottom:1.5rem;}
.choix .color_tab{width:100%; display:flex;flex-wrap:wrap;}
.choix .color_tab li.c_tab{display:flex; flex-direction:column;margin:0 3.5rem 3rem 0; }
.choix .color_tab li.c_tab a{position:relative; display:block; font-size:1.6rem; color:#666;font-weight:600; text-align:center;}
.choix .color_tab li.c_tab a .choix_box{
	height:7.2rem; aspect-ratio:1/1; border-radius:1.3rem; margin-bottom:1rem;	
	}
.choix .color_tab li.c_tab a .choix_box:before{
	position:absolute; content:url('../images/sub/color_ch.svg'); 
	top:calc((7.2rem - 35px) / 2);
	left:calc((7.2rem - 35px) / 2);
	opacity:0;
	}
.choix .color_tab li.c_tab a:hover .choix_box:before,
.choix .color_tab li.c_tab a.active .choix_box:before{
	opacity:1;
	transition:0.5s ease-in-out;
	}

.choix .color_pic{width:48%; position:relative; order:2;}
.choix .color_pic.mg_tp{margin-top:3.5rem;}
.choix .color_pic img{position:absolute; top:0; left:0;}

@media (max-width: 1000px){
	.choix .color_tab li{margin:0 2.5rem 3rem 0;}
}
@media (max-width: 700px){
	.choix{flex-wrap:wrap;}
	.choix .choi_tab{width:100%; order:2; }
	.choix .color_tab li{margin:0 1.5rem 3rem;}
	
	/*이미지 새로 오면 padding-top값 다시 계산*/
	.choix .color_pic{width:100%; margin-bottom:3rem; padding-top:calc((30rem / 70rem) * 100%);}
	.choix .color_pic.mg_tp{margin-top:0;}
}
@media (max-width: 413px){
	.choix .color_tab{display:grid;grid-template-columns:repeat(6, 1fr); gap:calc((var(--inner-width) - (6.5rem * 7)) / 6);}
	.choix .color_tab li.c_tab{margin-bottom:3rem;margin-right:0;}
	.choix .color_tab li.c_tab a{max-width:6.5rem;}
	.choix .color_tab li.c_tab a .choix_box{height:6.5rem;}
	.choix .color_tab li.c_tab a .choix_box:before{top:calc((6.5rem - 35px) / 2); left:calc((6.5rem - 35px) / 2);}
}
@media (max-width: 404px){
	
}

/*절차*/
.proce{}
.proce > li{width:100%;background-color:#fff; padding:4rem 3rem; margin-bottom:2rem; display:flex;}
.proce > li:last-child{margin-bottom:0;}
.proce li.c_bsk{border:5px solid #e4f2f7; }
.proce li.c_ble{border:5px solid #f3f6fa; }
.proce li.c_gry{border:5px solid #f7f7f7; }
.proce li:last-child.c_bsk{background-color:#0595d5; border:5px solid #0595d5;}
.proce li:last-child.c_ble{background-color:var(--color-main); border:5px solid var(--color-main);}
.proce li .prc_no{font-size:3.7rem; font-weight:900; margin-right:3rem;}
.proce li .prc_cnt h4{font-size:2rem; font-weight:700; margin-bottom:1.2rem;}
.proce li.c_bsk .prc_no, .proce li.c_bsk h4{color:#0595d5;}
.proce li.c_ble .prc_no, .proce li.c_ble h4{color:var(--color-main);}
.proce li.c_gry .prc_no, .proce li.c_gry h4{color:#888;}
.proce li:last-child.c_bsk .prc_no, 
.proce li:last-child.c_bsk h4,
.proce li:last-child.c_ble .prc_no,
.proce li:last-child.c_ble h4{color:#fff;}
.proce li .prc_cnt{padding-left:3rem;}
.proce li.c_bsk .prc_cnt{border-left:5px solid #e4f2f7;}
.proce li.c_ble .prc_cnt{border-left:5px solid #f3f6fa;}
.proce li.c_gry .prc_cnt{border-left:5px solid #f7f7f7;}
.proce li:last-child.c_bsk .prc_cnt,
.proce li:last-child.c_ble .prc_cnt{border-left:5px solid #fff;}
.proce li .prc_cnt .prc_txt{font-size:1.6rem; color:#666;font-weight:500;}
.proce li:last-child .prc_cnt .prc_txt{color:#fff;}
.proce li .prc_cnt .prc_txt li{line-height:2.4rem;}
.proce li .prc_cnt .prc_txt li:last-child, 
.proce li .prc_cnt .prc_txt.cont_nml,
.proce li .prc_cnt .prc_txt.cont_nml li:last-child{margin-bottom:0;}
.proce li .prc_cnt .prc_txt.cont_nml li{margin-bottom:0.5rem;}

@media (max-width: 640px){
	.proce > li{flex-wrap:wrap;}
	.proce li .prc_cnt{padding-left:0; padding-top:3rem; width:100%;}
	.proce li .prc_no{margin-bottom:2rem;}
	.proce li.c_bsk .prc_cnt{border-top:5px solid #e4f2f7; border-left:0;}
	.proce li.c_ble .prc_cnt{border-top:5px solid #f3f6fa;border-left:0;}
	.proce li.c_gry .prc_cnt{border-top:5px solid #f7f7f7;border-left:0;}
	.proce li:last-child.c_bsk .prc_cnt,
	.proce li:last-child.c_ble .prc_cnt{border-top:5px solid #fff; border-left:0;}
}

/*-----E:제품페이지 공통-----*/

/*-----010207_미디어파사드-----*/
.imgst_mf{position:relative; display:flex; justify-content:space-between; padding:2rem; background-color:#f7f7f7; border-radius:3rem;}
.imgst_mf  > p{
	position:absolute; top:50%; left:50%; transform:translate(-50%, -50%); 
	background-color:var(--color-main); height:8rem; aspect-ratio:1/1; color:#fff;font-size:5rem; font-weight:200; 
	box-shadow: 0px 0px 10px rgba(0,0,0,0.2);
	border-radius:50%;
	padding:calc((8rem - 5rem) / 2);
	z-index:10;
	display:flex; justify-content:center; align-items:center;
	}
.imgst_mf .img_inner{ padding:2.5rem; margin:2rem; width:48%;border-radius:3rem; min-height:26rem;display:flex; justify-content:center; align-items:center;text-align:center;}
.imgst_mf .img_inner.faca{background-image:url(../images/sub/010207_img01.png);}
.imgst_mf .img_inner.solar{background-image:url(../images/sub/010207_img02.png);}
.imgst_mf .img_inner p{ font-size:2rem; color:#fff; font-weight:500;}
.mf_arr{margin:2rem auto;}

@media (max-width: 640px){
	.imgst_mf{flex-wrap:wrap;}
	.imgst_mf .img_inner{width:100%;}
}
/*-----040101~03_sustainability-----*/
.sus_bg{ font-weight:500;background-position:center;width:100%; padding:3rem;border-radius:3rem; text-align:center; min-height:35rem; color:#fff; font-size:2.3rem;display:flex; flex-wrap:wrap;justify-content:center;align-items:center; }
.sus_bg b{font-weight:700; }
.sus_bg.bg040101{background-image:url(../images/sub/040101_bg01.jpg);}
.sus_bg.bg040201{background-image:url(../images/sub/040201_bg01.jpg);}

.in_pd.bg040101{background-image:url(../images/sub/040101_bg02.jpg);}
.in_pd.bg040202{background-image:url(../images/sub/040202_bg01.jpg);}

.sus_card{display:grid; grid-template-columns:repeat(3, 1fr);gap:4rem;}

.sus_card > li { 
	height:33rem; position:relative;
	background-image:url(../images/sub/pdl_bg.png);  background-repeat:no-repeat; 
	background-color:var(--color-main);
	background-position:top left;	
	border-radius:0 3rem 0 0;
	margin-left:20px;
	}
.sus_card > li h5{
	color:#fff; font-size:2.2rem; font-weight:600; text-align:right; 
	position:absolute;
	top:3rem;
	right:3rem;
	z-index:10;	
	} 
.sus_card > li .card_cont{
	z-index:10;position:absolute; bottom:0;  
	border-radius:0 3rem 0 0; 
	width:100%; 
	height:25rem;
	transform:translate(-20px, 0);
	background-color:#fff;
	padding:3rem;
	box-shadow: 0px 5px 10px rgba(0,0,0,0.2);
	} 
.sus_card > li .card_cont ul.cont_nml li:last-child{}
.sus_card > li .card_ico{position:absolute; bottom:3rem; right:5rem; z-index:10;}

@media (max-width: 1144px){
	.sus_card.gr_co21{grid-template-columns:repeat(2, 1fr);}
}
@media (max-width: 1064px){
	.sus_card > li{height:42rem;}
	.sus_card > li .card_cont{height:34rem;}
	
}
@media (max-width: 880px){
	.sus_bg{font-size:2rem;}
	.sus_card{gap:3.5rem;}	
}
@media (max-width: 700px){
	.sus_card,
	.sus_card.gr_co21{grid-template-columns:repeat(1, 1fr);}
	.sus_card > li{height:33rem;}
	.sus_card > li .card_cont{height:25rem;}
	.sus_card > li .card_ico img{width:100%;}
}
.welf{display:flex; flex-wrap:wrap; margin-bottom:5rem; padding-bottom:5rem; border-bottom:1px solid #ccc;}
.welf  .welf_img{width:35%; position:relative;margin-right:3rem;}
.welf  .welf_img img{padding:10px 10px 0 0; border-radius:0 4rem 0 0;}
.welf  .welf_img:after{
	content:''; position:absolute; top:0; right:0; 
	width:10rem; height:10rem; 
	border-radius:0 4rem 0 0; 
	background-color:var(--color-main);
	z-index:-5;
}
.welf  .welf_cont{width:60%;}
.welf  .welf_cont ul.cont_nml{display:flex; flex-direction:column;max-height:24rem;flex-wrap:wrap;}
.welf  .welf_cont ul.cont_nml li{margin-right:4rem; margin-bottom:1.5rem;}
.welf  .welf_cont ul.cont_nml.wd_50 li{max-width:48%;}
@media (max-width: 1124px){
	.welf .welf_img{width:45%;}
	.welf  .welf_cont{width:50%;}	
	.welf .welf_cont ul.cont_nml li{margin-right:2rem;}
	
}
@media (max-width: 950px){
	.welf  .welf_cont ul.cont_nml{max-height:27rem;}
}
@media (max-width: 910px){
	.welf .welf_img{width:50%;}
	.welf .welf_cont{width:45%;}
}
@media (max-width: 870px){
	.welf .welf_img{width:100%;margin-bottom:3rem;}
	.welf .welf_img img{width:100%;}
	.welf  .welf_cont{width:100%;}
	.welf .welf_cont ul.cont_nml{max-height:unset;}
	.welf  .welf_cont ul.cont_nml.wd_50 li{max-width:unset;}
}

/* ===================================================== */
/* 030101_인사말 */
.greet { position: relative; padding-bottom: 18rem; overflow: hidden; } 
.greet:before { position: absolute; width: 100%; height: 79%; background-color: #f7f7f7; content: ""; bottom: 0; } 
.greet .inner { display: flex; column-gap: 5.5rem; } 
.greet .tit { position: relative; margin-top: 1rem; } 
.greet .tit:after { position: absolute; width: calc(100% - 180px); height: 1px; content: ""; background-color: var(--color-main); right: 0; top: 50%; animation: fade-right .6s both .6s paused; } 
.greet .tit.aos-animate:after { animation-play-state: running; } 
.greet .tit header { color: var(--color-main); font-size: 2rem; font-weight: 800; } 
.greet h3 { margin: 6.5rem 0; color: #222; font-size: 3.2rem; font-weight: 600; } 
.greet .message { margin-top: 12rem; } 
.greet .message p { color: #666; font-size: 1.7rem; font-weight: 500; line-height: 1.6; margin-top: 3rem; } 
.greet .message p:first-child { margin-top: 0; } 
.greet .name { margin-top: 6.5rem; } 
.greet .name h4 { font-size: 1.4rem; font-weight: 500; color: #666; } 
.greet .name h4 strong { color: #222; font-weight: 600; font-size: 2.2rem; padding-left: 3.5rem; } 
.greet .left{max-width:50%;}
.greet .right { position: relative; z-index: 1; padding: 2rem 2rem 0 0; width: 42%; } 
.greet .right:after { position: absolute; width: 20rem; height: 20rem; content: ""; right: 0; top: 0; background-color: var(--color-main); z-index: -1; } 
.greet .right .img { width: 100%; height: 60rem; border-radius: 0 0 0 50px; overflow: hidden; box-shadow: 0 18px 30px rgba(0, 0, 0, 0.08); } 
.greet .right .img img { width: 100%; height: 100%; object-fit: cover; } 

@media (max-width:1919px){
 .greet:before { height: calc(79% + 10px); } 
 }
@media (max-width:1024px){
 .greet:before { height: 85.5%; } 
 .greet .inner { flex-direction: column-reverse; } 
 .greet .left { margin-top: 5rem; max-width:unset;} 
 .greet .right { width: 100%; } 
.greet .right .img { height: 40rem; } 
.greet h3 { margin: 6rem 0 0 0; } 
.greet .message { margin-top: 4rem; } 
.greet .message p br { display: none; } 
 }
@media (max-width: 768px){
 .greet .right .img { height: 30rem; } 
.greet .tit:after { width: calc(100% - 150px); } 
 }
@media (max-width: 480px){
 .greet .tit:after { width: calc(100% - 120px); } 
 }
/* 030101_인사말 */
/* ===================================================== */



/* ===================================================== */
/* 030201_연혁 */
.history { background: url(../images/sub/history_bg.png) no-repeat; background-position: 100% 100%; padding-bottom: 15rem; overflow: hidden; } 
.history .visual { position: relative; padding: 1rem; } 
.history .visual:before { position: absolute; width: 10rem; height: 10rem; background-color: var(--color-main); content: ""; left: 0; top: 0; z-index: -1; } 
.history .visual .wrap { position: relative; z-index: 10; display: flex; justify-content: space-between; align-items: center; gap: 4rem; background: url(../images/sub/history_visual.jpg) 50% 50% no-repeat; padding: 8rem; } 
.history .visual .wrap:after { position: absolute; width: 100%; height: 100%; background-color: rgb(6, 34, 80, .7); content: ""; left: 0; top: 0; z-index: -1; } 
.history .visual .wrap .line { width: 50%; height: 1px; background-color: #fff; } 
.history .visual .wrap h3 { font-size: clamp(28px, 5vw, 65px); font-weight: 900; color: #fff; } 
.history .visual .wrap h3 b { color: var(--color-main); } 
.history .year { margin-top: 10rem; } 
.history .year > li { display: flex; gap: 3rem; } 
.history .year > li h4 { color: #222; font-size: 3.5rem; font-weight: 800; } 
.history .year > li:first-child h4 { color: var(--color-main); } 
.history .year > li > ol { padding-top: .5rem; } 
.history .year > li > ol { padding-top: .5rem; } 
.history .year > li > ol > li { display: flex; align-items: flex-start; gap: 2.5rem; margin-top: 1.5rem; } 
.history .year > li > ol > li:first-child { margin-top: 0; } 
.history .year > li > ol > li .date { font-size: 1.6rem; font-weight: 600; color: #aaaaaa; padding-top: .1rem; } 
.history .year > li > ol > li p { color: #666; font-weight: 500; } 
.history .year > li:nth-child(even) { margin: 8rem 0; padding: 4.5rem 0 4.5rem 60rem; position: relative; background: url(../images/sub/history_img01.jpg) no-repeat 0 50%; } 
.history .year > li:nth-child(4) { background: url(../images/sub/history_img02.jpg) no-repeat 0 50%; } 
.history .year > li:nth-child(6) { background: url(../images/sub/history_img03.jpg) no-repeat 0 50%; } 
.history .year > li:nth-child(8) { background: url(../images/sub/history_img04.jpg) no-repeat 0 50%; } 
.history .year > li:nth-child(even)::after { content: ""; position: absolute; top: 0; right: 0; width: 75%; height: 100%; background: linear-gradient(
 to left,
 #fff 0%,
 #fff 70%,
 rgba(255,255,255,0) 100%
 ); z-index: 0; } 
.history .year > li:nth-child(even) h4,
.history .year > li:nth-child(even) ol { position: relative; z-index: 11; } 

@media (max-width: 1024px){
 .history .year > li:nth-child(even) { margin: 4.5rem 0; padding: 4.5rem 0 4.5rem; position: relative; background: initial; border-top: 1px solid rgb(221, 221, 221, .5); border-bottom: 1px solid rgb(221, 221, 221, .5); } 
.history .year > li:nth-child(even):after { display: none; } 
.history .year > li > ol > li .date { padding-top: .3rem; } 
 }
@media (max-width:768px){
 .history .visual .wrap { padding: 6rem; } 
 .history .year > li > ol > li .date { padding-top: .5rem; } 
 }
@media (max-width:480px){
 .history .year > li { flex-direction: column; } 
 .history .visual .wrap { flex-direction: column; } 
 .history .visual .wrap h3 { font-size: 7rem; } 
 }
/* 030201_연혁 */
/* ===================================================== */










/* ===================================================== */
/* 030301_R&D */
.rnd {overflow: hidden;}
.rnd .tit {padding-bottom: 3.5rem;position: relative;border-bottom: 1px solid #cccccc; } 
.rnd .tit:before {position: absolute;background-color: var(--color-main);width: 50px;height: 1px;bottom: -1px;left: 0;content: ""; } 
.rnd h3 {font-size: 3.2rem;color: #222;font-weight: 700; } 
.rnd li .top {display: flex;gap: 4rem;padding: 5.5rem 0; } 
.rnd ul li:first-child {border-bottom: 1px solid #cccccc; } 
.rnd ul li .wrap {position: relative;padding: 1rem;z-index: 1; } 
.rnd ul li .wrap:before {position: absolute;content: "";background-color: var(--color-main);width: 100px;height: 100px;border-radius: 0 40px 0 0;top: 0;right: 0;z-index: -1; } 
.rnd .img {width: 49rem;height: 21rem;border-radius: 0 30px 0 0;overflow: hidden; } 
.rnd .img img {width: 100%;height: 100%;object-fit: cover; } 
.rnd .desc {padding-top: 1rem; } 
.rnd .desc h4 {color: #222;font-size: 1.9rem;font-weight: 700;margin-bottom: 2rem; } 
.rnd .desc p {color: #666;font-weight: 500;font-size: 1.6rem; } 
.rnd .field {margin-top: 3rem;padding: 10rem 0;background: url(../images/sub/rnd_field-bg.jpg) 50% 50% no-repeat; background-size:cover;} 
.rnd .field .tit {border-bottom: 1px solid #fff; } 
.rnd .field .tit h3 {color: #fff; } 
.rnd .field .desc h4 {color: #fff; } 
.rnd .field .desc p {color: #ddd; } 
.rnd .field .blur-box {padding: 6rem 3rem 7rem;border: 1px solid rgb(255, 255, 255, .4);border-radius: 30px;background-color: rgb(0, 0, 0, .1);backdrop-filter: blur(5px);color: #fff;display: flex;flex-direction: column;align-items: center;margin-bottom: 5.5rem; } 
.rnd .field .blur-box h5 {font-size: 1.9rem;font-weight: 700;padding-bottom: 2rem;margin-bottom: 2.5rem;position: relative; } 
.rnd .field .blur-box h5:after {position: absolute;content: "";left: 50%;bottom: 0;transform: translateX(-50%);width: 21px;height: 3px;background-color: #fff; } 
.rnd .field .blur-box ol {display: flex;justify-content: center;width: 100%; } 
.rnd .field .blur-box ol li {border-bottom: 0;font-size: 1.8rem;font-weight: 500;padding: 2.5rem;border: 1px solid #fff;width: calc(25% - 40px);border-radius: 50px;text-align: center;display: flex;justify-content: center;align-items: center;max-height: 8rem; } 
.rnd .field .blur-box ol li b {font-size: 1.6rem; } 
.rnd .field .blur-box ol li:nth-child(1) {margin-right: -2rem; } 
.rnd .field .blur-box ol li:nth-child(2) {margin-right: -2rem; } 
.rnd .field .blur-box ol li:nth-child(4) {margin-left: -2rem; } 

@media (max-width: 1024px) {.rnd .img { width: 40rem; } 
.rnd .field .blur-box ol li { width: 25%; } 
 }
@media (max-width: 768px) {.rnd .img { width: 30rem; } 
.rnd .desc p {font-weight: 400; } 
.rnd .field .blur-box ol {flex-wrap: wrap; } 
.rnd .field .blur-box ol li { width: 50%; } 
.rnd .field .blur-box ol li:nth-child(1) {margin-right: 0; } 
.rnd .field .blur-box ol li:nth-child(2) {margin-right: 0;margin-left: -2rem; } 
.rnd .field .blur-box ol li:nth-child(3) {margin-top: 1rem; } 
.rnd .field .blur-box ol li:nth-child(4) {margin-top: 1rem;margin-left: -2rem; } 
 }
@media (max-width: 640px) {.rnd li .top {flex-direction: column; } 
.rnd .img {width: 100%; } 
.rnd .field .blur-box ol {row-gap: 1rem; } 
.rnd .field .blur-box ol li { width: 100%; } 
.rnd .field .blur-box ol li:nth-child(2) {margin-right: 0;margin-left: 0; } 
.rnd .field .blur-box ol li:nth-child(3) {margin-top: 0; } 
.rnd .field .blur-box ol li:nth-child(4) {margin-top: 0;margin-left: 0; } 
 }
/* 030301_R&D */
/* ===================================================== */









/* ===================================================== */
/* 030501_오시는 길 */
.skse-cnt { padding-bottom: 15rem; overflow: hidden; } 
.directions { position: relative; margin-top: 10rem; } 
.directions:first-child { margin-top: 0; } 
.directions .tit { margin-bottom: 4rem; } 
.directions .tit h3 { font-size: 3rem; color: #222; font-weight: 700; position: relative; display: inline-block; } 
.directions .tit h3:before { position: absolute; content: ""; bottom: -5px; left: 50%; transform: translateX(-50%); width: 110%; height: 2.2rem; background-color: #e9efff; z-index: -1000; } 
.directions-map { height: 50rem; overflow: hidden; } 
.directions-map .item { height: 100%; position: relative; } 
.directions-map .item iframe { width: 100%; height: 100%; border: 0; aspect-ratio: 16 / 5; position: relative; z-index: 1; } 
.directions .info-box { background: url(../images/sub/030501_logo.png) no-repeat, var(--color-main); padding: 5rem 5rem; color: #fff; font-size: 1.8rem; font-weight: 600; display: flex; gap: 0 5rem; justify-content: start; position: relative; background-position: 0 40%; } 
.directions .info-box > div,
.directions .info-box > a{ position: relative; padding-left: 6rem; } 
.directions .info-box > div:before,
.directions .info-box > a:before{ position: absolute; width: 47px; height: 47px; content: ""; left: 0; top: 50%; transform: translateY(-50%); } 
.directions .info-box .location.wd_50{width:50%;}
.directions .info-box .location:before { background: url(../images/sub/030501_ico-location.png) no-repeat; } 
.directions .info-box .call:before { background: url(../images/sub/030501_ico-call.png) no-repeat; } 
@media (max-width:1331px){
	.directions .info-box{flex-wrap:wrap;}
	.directions .info-box > div,
	.directions .info-box > a{width:100%; }
	.directions .info-box > a{margin-top:4rem;}
}
@media (max-width:1024px){
 .directions .info-box { gap: 0 3rem; } 
.directions .info-box > div:before,
.directions .info-box > a:before{ width: 37px; height: 37px; } 
.directions .info-box .location:before,
.directions .info-box .call:before,
.directions .info-box .mail:before { background-size: contain; } 
 }
@media (max-width: 768px){
 .directions .info-box { flex-direction: column; gap: 4rem 0; font-weight: 400; padding: 5rem; background-position: 120% 40%; } 
 .directions .info-box > div,
 .directions .info-box > a{ padding-left: 5rem; } 
 .directions .info-box > a{margin-top:0;}
 .directions .info-box > div:before,
 .directions .info-box > a:before { width: 30px; height: 30px; } 
 }
/* 030501_오시는 길 */
/* ===================================================== */










/* ===================================================== */
/* 060101_문의 */
.inquiry .tit h3 { font-size: 2.4rem; font-weight: 500; color: #222; text-align: center; }
.inquiry .tit h3 b { font-weight: 700; }
.inquiry .list { display: grid; grid-template-columns: repeat(2, 1fr); gap: 4rem; margin-top: 6rem; }
.inquiry .list > li { border: 1px solid #ddd; padding: 12rem 4rem 5rem; position: relative; }
.inquiry .list > li:after { position: absolute; right: 4rem; top: 50%; transform: translateY(-50%); background: url(../images/sub/inquiry_ico01.png) no-repeat; width: 106px; height: 110px; content: ""; }
.inquiry .list > li:nth-child(2):after { background: url(../images/sub/inquiry_ico02.png) no-repeat; width: 110px; height: 110px; }
.inquiry .list > li:nth-child(3):after { background: url(../images/sub/inquiry_ico03.png) no-repeat; width: 110px; height: 96px; }
.inquiry .list > li:nth-child(4):after { background: url(../images/sub/inquiry_ico04.png) no-repeat; width: 98px; height: 111px; }
.inquiry .list > li h4 { color: #fff; background-color: var(--color-main); position: absolute; top: 0; left: 0; padding: 2rem 4rem; border-radius: 0 0 15px 0; font-size: 2.2rem; font-weight: 700; overflow: hidden; z-index: 1; }
.inquiry .list > li h4:before { position: absolute; background: url(../images/sub/inquiry_logo.png) no-repeat; content: ""; left: -1rem; top: -1rem; width: 92px; height: 88px; z-index: -1; }
.inquiry .list > li > ol > li a { color: #666; font-size: 2rem; font-weight: 500; position: relative; padding-left: 5rem; width: fit-content; transition: .5s; }
.inquiry .list > li > ol > li a:before { position: absolute; background: url(../images/sub/inquiry_ico-call.png) no-repeat; content: ""; left: 0; top: 50%; transform: translateY(-50%); width: 24px; height: 24px; }
.inquiry .list > li > ol > li:last-child a:before { background: url(../images/sub/inquiry_ico-mail.png) no-repeat; width: 30px; height: 24px; }
.inquiry .list > li > ol > li:last-child { margin-top: 2.5rem; }

@media (max-width:1024px){
.inquiry .list > li:after { width: 56px; height: 60px; background-size: contain; bottom: 3rem; top: auto; }
.inquiry .list > li:nth-child(2):after { width: 60px; height: 60px; background-size: contain; }
.inquiry .list > li:nth-child(3):after { width: 60px; height: 56px; background-size: contain; }
.inquiry .list > li:nth-child(4):after { width: 48px; height: 61px; background-size: contain; }
 }
@media (max-width:768px){
.inquiry .list > li > ol > li a:before { background-size: contain; width: 19px; height: 19px; }
.inquiry .list > li > ol > li:last-child a:before { background-size: contain; width: 25px; height: 19px; }
 }
@media (max-width:574px){
.inquiry .list { grid-template-columns: repeat(1, 1fr); }
 }
@media (max-width:480px){
.inquiry .list > li > ol > li a:before { background-size: contain; width: 15px; height: 15px; }
.inquiry .list > li > ol > li:last-child a:before { background-size: contain; width: 21px; height: 15px; }
 }
/* 060101_문의 */
/* ===================================================== */