/*초기설정*/
html{scroll-behavior: smooth;}
*{margin:0; padding:0;}
body{font-family:"Noto Sans KR"; font-size:18px; color:#191919; line-height:24px;}
a{text-decoration:none; color:#000;}
ul{list-style:none;}
/* web font name
font-family: 'Black Han Sans', sans-serif;
font-family: 'Noto Sans KR', sans-serif;
font-family: 'Poppins', sans-serif;
*/

/*pc-----------------------------------------------------------*/

/*wrap*/
#wrap{margin:auto; width:100%; overflow:hidden;}


/*main*/
#main, video{width:100%; margin:auto; position:relative;}
video{opacity: 0.5; display:block;}
.video_box{width:100%; margin:auto; background-color:#000;}
.main_ul{margin:auto; text-align:center; position:absolute; top:50%; left:50%; transform:translate(-50%,-50%); width:1320px;}
.main_ul li{float:left; width:33.3%; line-height:35px;}
.main_ul li:nth-child(2){margin:auto;}
.main_ul li:nth-child(3){float:right;}
.main_ul_li2{margin-top:70px; height:2px; background-color:#fff;}
.main_ul li a{display:block; color:#fff; transition:color 1s; font-family:'poppins'; font-size:70px; font-weight:500;}
.main_ul_sp1{line-height:70px;}
.main_ul_sp2{color:#e2e000;}
.main_ul_sp3{font-family:'Noto Sans KR'; font-size:20px; font-weight:300;}
.main_ul li a:hover{color:#e2e000;}

/*about*/
#about{width:1320px; height:900px; margin:auto; overflow:hidden;}
.about_p1{text-align:center; font-family:'Black Han Sans'; font-size:70px; padding:140px 0 40px;}
.about_p2{text-align:center; font-size:23px; font-weight:600; padding-bottom:70px;}
.about_box{width:100%; height:503px; position:relative;}
.about_box img{display:block; width:50%; position:absolute; top:50%; left:0; transform:translateY(-50%);}
.about_p3{text-align:left; font-size:18px; width:45%; position:absolute; top:22%; right:1%; transform:translateY(-50%);}
 .about_p3_s1{display:block; font-weight:300; padding-bottom:2.5vw;}
.about_p3_s2{display:block; font-weight:400; padding-bottom:2.5vw;}
.about_p3_s3{font-weight:500;}

/*service*/
#service{width:1320px; height:1020px; margin:auto;}
.service_p1{text-align:center; font-family:'Poppins'; font-size:55px; font-weight:600; padding:70px 0;}
.service_box{width:1320px; height:733px; position:relative;}
.service_box2{width:38%; position:absolute; top:15%; left:1%; transform:translateY(-50%);}
.service_p2{font-size:18px; font-weight:400;padding-bottom:70px;}
.service_p2 span{font-family:'Poppins'; font-size:30px; font-weight:500; line-height:60px;}
.service_sp1{color:#1e415a;}
.service_sp2{color:#a0a01f;}
.service_sp3{color:#365f82;}
.service_box img{display:block; width:58%; position:absolute; top:50%; right:1%; transform:translateY(-50%);}

/*product*/
.box_title, .box_title img{width:100%; margin:auto; position:relative; display:block;}
.box_title_p1{font-size:1.3vw; color:#fff; font-weight:400; position:absolute; top:53%; left:15%;}
.box_title_p1 span{color:#bba460;}
.box_title_p2{font-family:'Poppins'; font-size:4.5vw; font-weight:400; color:#fff; letter-spacing:5px; position:absolute; top:70%; left:15%;}

.product_1{width:100%; margin:0 auto 8%; overflow:hidden;}
.product_1 img{width:60%;}
.product_1 div{width:40%; color:#fff; padding-left:5%; box-sizing:border-box;}
.product_wash{background-color:#663e90;}
.product_cleaning{background-color:#215da4;}
.product_interior{background-color:#7e5b31;}
.product_left{float:left;}
.product_right{float:right;}
.product_p1{padding:37% 0 13%; font-family:'Poppins'; font-size:3.5vw; font-weight:400;}
.product_p2{font-size:1.2vw; font-weight:300; line-height:1.7vw; width:90%;}

.product_box{width:1320px; height:550px; margin:0 auto 7%; box-sizing:border-box; position:relative;}
.product_box img, .product_box p{position:absolute; top:50%; transform:translateY(-50%);}
.product_box img{width:40%;}
.product_box p{right:0; width:55%; padding:5%; font-size:18px; font-weight:500; box-sizing:border-box; line-height:28px;}


.interior_box1{height:765px;}
.interior_box2{height:856px;}
.interior_sp1{font-size:25px; font-weight:600;}
.interior_sp2{font-size:20px; font-weight:600; color:#184294;}

/*food*/
.food_box{width:100%; margin:auto; overflow:hidden;}
.food_img-1{float:left; width:40%;}
.food_box1{float:right; width:60%; padding:8%; box-sizing:border-box;}
.food_p1{font-family:'Poppins'; font-size:50px; font-weight:500; line-height:2.5vw;}
.food_p1 span{font-size:25px; font-weight:500;}
.food_line{width:100%; height:1px; background-color:#184294; margin:6% 0;}
.food_p2{font-size:20px; font-weight:400; line-height:30px; width:100%;}
.food_p2-1{padding-bottom:13%;}
.food_p2-2{padding-bottom:7%;}
.food_p2-3{padding-bottom:3%; font-weight:600;}
.food_img-1-1{width:100%;}

.food_img_2{float:right; width:40%;}
.food_box2{float:left; width:60%; padding:3.3% 8% 2%; box-sizing:border-box;}
.table{width:100%;}
.table_box{width:100%;  overflow:hidden;}
.table_center{padding:2vw 0; box-sizing:border-box;}
.table_box p{float:left; width:80%; font-size:16px; font-weight:400;}
.table_box img{float:right; width:18%;}

.food_box3{float:right; width:60%; padding:3.5% 8% 5%; box-sizing:border-box;}
.food_box3-1{padding-top:5%;  box-sizing:border-box; width:100%;}
.food_box3-1 img{float:left; width:35%;}
.food_box3-1 p{float:right; width:65%; padding:2% 0 2% 5%; box-sizing:border-box; font-size:14px; font-weight:400; line-height:16px;}
.food_box3-1 p span{font-weight:600;}

/*living tip*/
.living_title{margin:25vh 0 10vh; font-family:'Black Han Sans'; font-size:3.2vw; text-align:center;}
.living_box{margin:auto; width:1320px; padding:20px; box-sizing:border-box; overflow:hidden;}
.living_box img{display:block; width:30%; float:left;}
.tip_center{padding:0 5%;}

/*footer*/
#footer{width:100%; margin: 80px auto 0; height:300px; background-color:#181c21; position:relative;}
.footer_in{width:80%; position:absolute; top:50%; left:50%; transform:translate(-50%,-50%); text-align:center; letter-spacing:1px;}
.footer_box{display:inline-block;  margin:auto; padding-bottom:15px;}
.footer_box img{display:block;}
.footer_box li{float:left;}
.footer_box li:nth-child(2){width:2px; height:22px; background-color:#bba460; margin:7px 20px;}
.footer_box li:nth-child(3){font-family:'Poppins'; font-size:20px; font-weight:400; color:#bba460; margin-top:6px;}
.footer_text{font-size:16px; text-align:center; color:#f3f3f3; font-weight:300;}
.footer_ul{text-align:center;}
.footer_ul li{display:inline-block; padding:1.5vw 2vw 0;}
.footer_ul li a{font-size:18px; font-weight:500; color:#f3f3f3; transition:color 0.5s;}
.footer_ul li a:hover{color:#bba460;}

/*fix*/
.logo_top{display:block; position:fixed; top:3%; left:2%;}

input[id="menuicon"]{
	display:none;
}
input[id="menuicon"]+label{
	display:block;
	width:60px;
	height:40px;
	position:fixed;
	right:2%;
	top:3%;
	z-index:2;
	transition:all 0.5s;
	cursor:pointer;
}
input[id="menuicon"]:checked+label span{
	background:#fff;
}
input[id="menuicon"]+label span{
	display:block;
	position:absolute;
	width:100%;
	height:5px;
	border-radius:30px;
	background:#000;
	transition:all 0.5s;
}
input[id="menuicon"]+label span:nth-child(1){
	top:0;
}
input[id="menuicon"]+label span:nth-child(2){
	top:50%;
	transform:translateY(-50%);
}
input[id="menuicon"]+label span:nth-child(3){
	bottom:0;
}
input[id="menuicon"]:checked+label span:nth-child(1) {top:50%;transform:translateY(-50%) rotate(45deg); background:#e2e000;}
input[id="menuicon"]:checked+label span:nth-child(2) {opacity:0;}
input[id="menuicon"]:checked+label span:nth-child(3) {bottom:50%;transform:translateY(50%) rotate(-45deg); background:#e2e000;}

.sidebar{
	width:300px;
	height:100%;
	background:rgba(0,0,0,0.9);
	position:fixed;
	top:0;
	right:-100%;
	z-index:1;
	transition:all 0.5s;
	padding:60px 0;
	box-sizing:border-box;
}
.sidebar a{display:block; font-family:'Poppins'; color:#fff; font-size:25px; font-weight:400; height:20%; transition:color 0.7s; text-align:center; padding-top:20%; box-sizing:border-box;}
.sidebar a:hover{color:#e2e000;}
input[id="menuicon"]:checked+label+div{
	right:0;
}
.logo_top1{display:none;}


/*tablet-------------------------------------------------------*/
@media (max-width:1319px){
	.main_ul{width:100%;}
	.main_ul li:nth-child(1){width:40%;}
	.main_ul li:nth-child(2){width:20%;}
	.main_ul li:nth-child(3){width:40%;}
	.main_ul_sp1{line-height:50px;}
	.main_ul li a{font-size:50px;}
	.main_ul_sp3{font-size:16px;}
	
	#about{width:100%; height:80vw;}
	.about_box{padding:0; height:40vw;}
	
	#service{width:100%; height:85vw;}
	.service_box{width:100%; height:65vw;}
	.service_p2{padding-bottom:3vw; font-size:16px;}
	
	.box_title_p1{font-size:1.6vw;}
	.product_box{width:100%; height:470px; margin:0 auto 5%;}
	.product_box p{padding:1%; font-size:16px; line-height:24px;}
	.product_1{margin:0 auto 4%;}
	.product_p2{font-size:1.6vw; line-height:2.3vw;}
	.product_p1{padding:30% 0 13%;}

	.product_box .interior_text{font-size:15px; line-height:22px; font-weight:400;}	
	.interior_sp1{font-size:2.1vw; font-weight:600;}
	.interior_sp2{font-size:16px; font-weight:600;}
	.interior_box1{height:75vw;}
	.interior_box2{height:85vw;}
	
	.food_p1{font-size:35px;}
	.food_p1 span{font-size:18px;}
	.food_p2{font-size:16px; line-height:22px;}
	.food_box1{padding:6%;}
	.food_box2{padding:2% 6%}
	.food_box3{padding:3% 6%;}
	.table_box p{font-size:13px; line-height:15px;}
	.food_box3-1 img{width:50%; padding:0 25%;}
	.food_box3-1 p{float:right; width:100%; padding-top:15px; box-sizing:border-box; font-size:13px; font-weight:400; line-height:15px;}
	
	.living_box{width:100%; padding:1%; margin:auto;}
	.tip_center{padding:0 2%;}
	.living_box img{width:32%;}
	.living_title{margin:70px 0 30px;}
	
	.footer_text{font-size:14px;}
	.footer_ul li a{font-size:16px;}
	
	input[id="menuicon"]+label{width:40px; height:30px;}
	.sidebar{width:200px;}


/*mobile 320px까지 최적화--------------------------*/
@media(max-width:767px){
	
	/* display:none; */
	.table_box, .food_box3-1, .main_ul_sp3, .food_img-1-1, .food_p1 span{display:none;}
	
	.main_ul{width:100%;}
	.main_ul li:nth-child(1){width:45%;}
	.main_ul li:nth-child(2){width:10%;}
	.main_ul li:nth-child(3){width:45%;}
	.main_ul_sp1, .main_ul_sp2{line-height:20px;}
	.main_ul li a{font-size:25px;}
	.main_ul_li2{margin-top:35px;}
	
	#about{height:auto;}
	.about_p1{font-size:40px; padding:80px 0 20px;}
	.about_p2{font-size:14px; padding-bottom:20px;}
	.about_box{height:auto; position:static;}
	.about_box img{width:100%; top:0; left:0; transform:translateY(0); position:static;}
	.about_p3{font-size:16px; width:100%; top:300px; transform:translateY(0); padding:20px; box-sizing:border-box; position:static; height:auto;}
	.about_p3_s1, .about_p3_s2{padding-bottom:5px;}
	
	#service, .service_box, .service_box2, .service_box img{position:static; width:100%; height:auto;}
	.service_p1{font-size:35px; padding:70px 0 30px;}
	.service_p2{padding:10px; font-size:14px; box-sizing:border-box;}
	.service_box{height:auto;}
	.service_box img{ padding:30px 10px 50px; box-sizing:border-box; top:0; right:0; transform:translateY(0)}
	.service_box2{transform:translateY(0);}
	
	.box_title_p1{font-size:2vw; position:absolute; top:40%;}
	.box_title_p2{font-size:5vw; letter-spacing:3px; position:absolute; top:65%;}
	
	.product_1{width:100%; margin:0 auto 8%; overflow:hidden;}
	.product_1 img{width:100%;}
	.product_1 div{width:100%; color:#fff; padding:6vw; box-sizing:border-box;}
	.product_p1{padding:0 0 4vw; font-size:5vw;}
	.product_p2{font-size:3vw; font-weight:300; line-height:4vw; width:90%;}
	
	.product_box{margin:auto; width:100%; height:auto; margin:0 auto 0; position:static;}
	.product_box img, .product_box p{position:static; transform:translateY(0); width:100%; box-sizing:border-box;}
	.product_box img{padding:5vw 10vw 2vw;}
	.product_box p{padding:5vw 5vw 10vw; font-size:14px; line-height:20px;}
	
	.product_box .interior_text{font-size:13px; line-height:18px; font-weight:400;}
	.interior_sp1{font-size:4vw; font-weight:600;}
	
	.food_box1, .food_box2, .food_box3{padding:5vw 3vw;}
	.food_p1{font-size:7vw;}
	.food_p2{font-size:13px; line-height:18px;}
	.food_line{margin:5vw 0;}
	.food_p2-1{padding-bottom:0;}
	.food_p2-2{padding-bottom:0;}
	.food_p2-3{padding-bottom:3%; font-weight:600;}
	.food_img-1, .food_img_2{padding-bottom:15px; box-sizing:border-box;}
	
	.living_box{padding:0;}
	.living_box img{width:100%; padding-top:5vw;}
	.tip_center{padding:0;}
	.living_title{margin:16vw 0 0; font-size:6.7vw;}
	
	#footer{height:400px;}
	.footer_box{display:none;}
	.footer_ul{padding-top:5vw;}
	.footer_ul li{width:100%; padding:5px;}
	.footer_text{width:100%;}
	
	.logo_top{top:1%; left:1%; transform:scale(0.7,0.7);}
	.sidebar{width:150px;}
}


/*
참고 -------------------------------------------------

- 말줄임 css	http://blog.tjsrms.me/css-%EB%A7%90%EC%A4%84%EC%9E%84-%EC%B2%98%EB%A6%AC%ED%95%98%EA%B8%B0/
- position:static;
- position:inherit;	


*/