@import url('https://fonts.googleapis.com/css2?family=Crimson+Text:wght@400;600;700&display=swap');

.banner-swiper .img1{background:url(../img/sub3/2/image4.jpg) no-repeat; background-size: cover; background-position: center;}

#intro{ height:auto; }
#intro .intro-in{ padding-bottom:0px; }
#intro .intro-in .intro-right .right-img{ height:510px; background:url(../img/sub3/2/image1.jpg) no-repeat; background-size:cover;}

/*외부전경*/
#view .view-in .view-list .list1{ display:flex; justify-content:space-between; width:100%; height:600px; margin-top: 50px;}
#view .view-in .view-list .list1 .img1{ width:100%; height:100%; background:url(../img/sub3/2/image2.jpg) no-repeat; margin: 0px 10px 0 0; background-size: cover;}
#view .view-in .view-list .list1 .img2{ width:100%; height:100%; background:url(../img/sub3/2/image3.jpg) no-repeat; margin: 0px 10px 0 10px; background-size: cover;}
#view .view-in .view-list .list1 .img3{ width:100%; height:100%; background:url(../img/sub3/2/image4.jpg) no-repeat; margin: 0px 0px 0 10px; background-size: cover;}

#view .view-in .view-list .list2{ display:flex; justify-content:space-between; width:100%; height:600px; margin-top: 50px;}
#view .view-in .view-list .list2 .img1{ width:100%; height:100%; background:url(../img/sub3/2/image5.jpg) no-repeat; margin: 0px 10px 0 0; background-size: cover;}
#view .view-in .view-list .list2 .img2{ width:100%; height:100%; background:url(../img/sub3/2/image6.jpg) no-repeat; margin: 0px 10px 0 10px; background-size: cover;}
#view .view-in .view-list .list2 .img3{ width:100%; height:100%; background:url(../img/sub3/2/image7.jpg) no-repeat; margin: 0px 0px 0 10px; background-size: cover;}

/**********************************************반응형**********************************************************/

@media screen and (max-width: 1024px){
	#intro .intro-in .intro-left .intro-txt h1{ text-align:center; font-size:60px; }
	#intro .intro-in .intro-left .intro-txt h3{ text-align:center; }
	#intro .intro-in .intro-left .intro-txt p{ text-align:center; margin-top:50px; }

	#banner .banner-in .banner-txt h3{ font-size:12px; }
	#banner .banner-in .banner-txt h2{ font-size:60px; margin-top: 10px;}

	#intro .intro-in{ flex-direction:column; }
	#intro .intro-in .intro-left{ width:100%; }
	#intro .intro-in .intro-right{ width:100%; }
	#intro .intro-in .intro-left .left-img{ margin-left:0px; }
	#intro .intro-in .intro-left .intro-txt{ margin-bottom:0; }
	#intro .intro-in .intro-right .right-img{ display:none; }

	#intro .intro-in .intro-right{ display:none; }

	/*외부전경*/
	#view .view-in .view-list .list1 .img3{ display: none;}
	#view .view-in .view-list .list2 .img3{ display: none;}
	#view .view-in .view-list .list3 .img3{ display: none;}
	#view .view-in .view-list .list4 .img3{ display: none;}
	#view .view-in .view-list .list5 .img3{ display: none;}

	
}

@media screen and (max-width: 780px){
	header .header-in .nav{ display:none; }

	#banner .banner-in .banner-txt h3{ font-size:12px; }
	#banner .banner-in .banner-txt h2{ font-size:48px; margin-top: 10px;}

	#intro .intro-in .intro-right{ display: none; }
	#design{display: none;}
	
	#intro .intro-in{ flex-direction:column; }
	#intro .intro-in .intro-left{ width:100%; }
	#intro .intro-in .intro-right{ width:100%; }
	#intro .intro-in .intro-left .left-img{ margin-left:0px; }
	#intro .intro-in .intro-right .right-img{ display:none; }

	#view .view-in .view-list{ margin-top:50px; }

	#view .view-in .view-list .list1{ flex-direction:column; height:1350px; margin: 10px auto;}
	#view .view-in .view-list .list2{ flex-direction:column; height:1350px; margin: 10px auto;}
	#view .view-in .view-list .list3{ flex-direction:column; height:900px; margin: 10px auto;}

	#view .view-in .view-list .list1 .img1{ width: 100%; height: 100%; margin: 0 auto 20px auto; background-size: cover;}
	#view .view-in .view-list .list1 .img2{ width: 100%; height: 100%; margin: 0 auto 20px auto; background-size: cover;}
	#view .view-in .view-list .list1 .img3{ display: block; width: 100%; margin: 0 auto 20px auto; background-size: cover;}

	#view .view-in .view-list .list2 .img1{ width: 100%; height: 100%; margin: 0 auto 20px auto;background-size: cover;}
	#view .view-in .view-list .list2 .img2{ width: 100%; height: 100%; margin: 0 auto 20px auto;background-size: cover;}
	#view .view-in .view-list .list2 .img3{ display: block; width: 100%; margin: 0 auto 20px auto; background-size: cover;}

	
}