@charset "UTF-8";

*, *:before, *:after { -webkit-box-sizing:border-box; -moz-box-sizing:border-box; box-sizing:border-box; }
.all_wrap{overflow: hidden;position: relative;}

.jarallax {position: relative;z-index: 0;height: 100%;}
.jarallax > .jarallax-img {position: absolute;  object-fit: cover;  top: 0;  left: 0;  width: 100%;  height: 100%;  z-index: -1;}

html {background: #fff; width: 100%; overflow-x: hidden;}

/* 공통 */
.Hwidth{width: 92% !important; max-width: 1700px; margin: 0 auto; position: relative;}
.width{width: 92% !important; max-width: 1400px; margin: 0 auto; position: relative;}
.width1280{width: 92% !important; max-width: 1280px; margin: 0 auto; position: relative;}
.width900{width: 92% !important; max-width: 900px; margin: 0 auto; position: relative;}
.bo_common {padding: 160px 0;}





/* 관리자 로그인 */
.main_admin {position: fixed; z-index: 11; top: 105px;right: 10px ;}
.main_admin a {font-size: 14px; background: #fff; border-radius: 5px; margin-bottom: 5px; width: 100px; height: 30px; display: inline-block; text-align: center;line-height: 30px;font-weight: 500; }




:root{
	--main-color: #0cc522;
 

    --fs128: 12.8rem;
    --fs100: 10rem;
    --fs95: 9.5rem;
    --fs96: 9.6rem;
    --fs85: 8.5rem;
    --fs80: 8.0rem;
    --fs75: 7.5rem;
    --fs70: 7.0rem;
    --fs65: 6.5rem;
    --fs60: 6.0rem;
    --fs58: 5.8rem;
    --fs55: 5.5rem;
    --fs54: 5.4rem;
    --fs52: 5.2rem;
    --fs50: 5.0rem;
	--fs48: 4.8rem;
    --fs45: 4.5rem;
    --fs42: 4.2rem;
	--fs40: 4.0rem;
    --fs38: 3.8rem;
    --fs37: 3.7rem;
    --fs36: 3.6rem;
	--fs35: 3.5rem;
    --fs32: 3.2rem;
    --fs30: 3.0rem;
    --fs29: 2.9rem;
	--fs28: 2.8rem;
	--fs27: 2.7rem;
    --fs26: 2.6rem;
	--fs25: 2.5rem;
    --fs24: 2.4rem;
    --fs23: 2.3rem;
	--fs22: 2.2rem;
    --fs21: 2.1rem;
	--fs20: 2.0rem;
	--fs19: 1.9rem;
    --fs18: 1.8rem;
    --fs17: 1.7rem;
    --fs16: 1.6rem;
    --fs15: 1.5rem;
	--fs14: 1.4rem;
}

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

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

@media all and (max-width: 1024px) {
    .bo_common {padding: 80px 0;}
}

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

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

@media all and (max-width: 768px) {
}
@media all and (max-width: 600px) {
}
#header{width: 100%;background: transparent;position: fixed;top: 0;z-index: 999; transition: 0.3s all; }
#header .head_menu .logo{}
#header.scroll{background: var(--main-color);}

#header .head_menu{position: relative;display: flex;justify-content: space-between;align-items: center;width: 100%; height: 100px;}
#header .head_menu .main_menu { width: 70%; display: flex; justify-content: right; align-items: center; text-align: center; height: 100%; z-index: 9;}
#header .head_menu .main_menu .dept1 { }
#header .head_menu .main_menu .dept1 > a { font-size: 1.8rem; padding: 35px 30px; font-weight: 500; color: #fff;}
#header .head_menu .main_menu .dept1 > a.active { color: #fff; font-weight: bold; }
#header .head_menu .main_menu .dept1 > a.menuon { color: #fff; font-weight: bold; }

#header .head_menu .main_menu .contact_menu a {background: var(--main-color); padding: 17px 30px; border-radius: 30px;}

#header .head_menu .main_menu .contact_menu > a.active { color: #fff; font-weight: bold; }
#header .head_menu .main_menu .contact_menu > a.menuon  { color: #fff; font-weight: bold; }


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

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

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

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

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

@media all and (max-width: 768px) {
}
@media all and (max-width: 600px) {
}

/* 모바일 */
.mobile_head {width: 100%; height: 80px; display: flex; justify-content: space-between; align-items: center; padding: 0px 15px; display: none; position: fixed; background: var(--main-color); z-index: 99; box-shadow: 0px 1px 3px rgba(0,0,0,0.15);}
.mobile_head .mobile_logo { width: 150px; }
.mobile_head .mobile_logo img {  width: 100px; height: auto; }
#mobile_menu {  display: none; position: fixed; top: 0; right: -75%; width: 75%; background: #fff; z-index: 1000; height: 100vh; overflow-y: scroll; -ms-overflow-style: none; scrollbar-width: none;}
#mobile_menu::-webkit-scrollbar{display: none;}
#mobile_menu .mob_logo { width: 100%; padding: 0px 20px; height: 80px; background:var(--main-color);display: flex; justify-content: space-between; align-items: center; }
#mobile_menu .mob_logo a { width: 100px; }
#mobile_menu .mob_logo a img { width: 100%; }
#mobile_menu .mobile_close { font-size: 30px; cursor: pointer; color: #fff;}


#mobile_menu .mob_menu {padding: 0 20px;}
#mobile_menu .mob_menu .dept1 {padding: 25px 0; border-bottom: 1px solid #dfdfdf;}
#mobile_menu .mob_menu .dept1 a { font-size: var(--fs24); font-weight: 600;}

#mobile_menu .mob_menu .top_menu {display: flex;justify-content: space-between; align-items: center; padding: 20px 0px;font-size: 17px; margin: 0px 20px; border-bottom: 1px solid #8e8e8e;}
.mobile_open{font-size: 24px; color: #fff;}
#mobile_menu .mob_menu .topmenu.on { color: #fff; }
#mobile_menu .mob_menu .sub_menu { padding: 15px 0px; margin: 0px 20px; border-bottom: 1px solid #ccc; background: #fff; visibility: visible; }
#mobile_menu .mob_menu .sub_menu a {display: block; color: #333 ;font-size: 15px; padding: 10px; background: #fff;}

#mobile_menu .mob_menu_btn{display: flex; padding: 10px 0px; margin: 0px 20px; justify-content: space-between;}
#mobile_menu .mob_menu_btn li{width: 49%;}
#mobile_menu .mob_menu_btn a{font-size: 17px;  background: #ddd;display: flex; height: 50px; justify-content: center; align-items: center;}
#mobile_menu .mob_menu_btn a i{font-size: 16px; margin-right: 5px;}
.mob_bg {  display: none; position: fixed; top: 0; left: 0; width: 100%; height: 100vh; background: rgba(0, 0, 0, 0.5); z-index: 99;}

@media screen and ( max-width: 1400px ){
#pcmenu .topmenu { font-size: 16px; }
#pcmenu .submenu a { font-size: 14px; }
}
@media screen and ( max-width: 1024px ){
#header { display: none; }
.mobile_head{display: flex;}
}



/* 메인비주얼 */
.Hfull{ position: relative;}
.swiper_visual {display:block;height:100%;margin:0px auto;overflow:hidden;position:relative;}
.swiper_visual .swiper-slide {position:relative; height: auto !important;}
.swiper_visual .swiper-slide .main_visual img{width: 100%;}

.pc{display: block !important;}
.tab{display: none !important;}
.mob{display: none !important;}



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

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

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

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

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

@media all and (max-width: 768px) {
}
@media all and (max-width: 600px) {
}

/* 메인 텍스트 */
.maintext_box { position: absolute; z-index: 5; left: 0; right: 0; top: 0; height: 100%; display: flex; justify-content: flex-end; flex-direction: column; padding-bottom: 20%; text-align: left;}
.maintext_box h2{color: #fff; font-size: var(--fs50); margin: 14px 0 20px 0 ; font-weight: 800; line-height: 1.3;}
.maintext_box p{ color: #fff; font-size: var(--fs20); font-weight: 500; }
.maintext_box img {height: 62px; width: auto;}


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

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

@media all and (max-width: 1024px) {
    .maintext_box {padding-bottom: 12%;}
}

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

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

@media all and (max-width: 768px) {
    .maintext_box {padding-bottom: 70%;}
    .maintext_box img {height: 45px; width: auto;}
}
@media all and (max-width: 600px) {
    
}
/* 스크롤 다운 */
.Hfull .visual_scroll {position: absolute; left: 50%; bottom: 45px; transform: translate(-50%, 0); display: flex; flex-direction: column; justify-content: center; align-items: center; z-index: 99; }

.Hfull .visual_scroll img {width: 69px; height: auto;}
@media all and (max-width: 1100px){
	.pc{display: none !important;}
	.tab{display: block !important;}
	.mob{display: none !important;}
	.Hfull{margin-top: 80px;}
	.maintext_box{justify-content: center;}
	.maintext_box h2{font-size: var(--fs40);  margin: 10px 0 18px 0 ;}
	.maintext_box p{font-size: var(--fs18);}
}
@media all and (max-width: 768px){
	.pc{display: none !important;}
	.tab{display: none !important;}
	.mob{display: block !important;}
	.maintext_box p br{display: none;}
}

/* ######################## 메인 서브 공통 ######################## */
.title {text-align: center;}
.title h3 {font-weight: 800; font-size: var(--fs50); line-height: 1.2;}
.title h3 b {color: var(--main-color);}
.title h4 {font-weight: 800; font-size: var(--fs42); line-height: 1.2;}
.title h5 {font-weight: 600; font-size: var(--fs30); color: #f78018; line-height: 1.2;}
.title h6 {font-weight: 800; font-size: var(--fs28); line-height: 1.4;}
.title p {font-weight: 500; font-size: var(--fs20); line-height: 1.6; color: #494949;}
.title span {font-weight: 700; font-size: var(--fs23); color: var(--main-color);}


.box_wrap {display: flex; align-items: center; justify-content: center; flex-wrap: wrap;}

.sub_common {padding-top: 160px;}

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

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

@media all and (max-width: 1024px) {
    .sub_common {padding-top: 80px;}
    .title p { font-size: var(--fs22);}
    .title span { font-size: var(--fs28);}
}

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

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

@media all and (max-width: 768px) {
    .title img {width: 110px; height: auto;}
}
@media all and (max-width: 600px) {


}


/* 스크롤다운 디자인2 */
.visual_scroll2 i {color: var(--main-color);}
.visual_scroll2 {padding: 30px 0; position: relative; text-align: center; margin: 35px 0;}
.visual_scroll2 .scroll_down {bottom: 40px;} 

/* 스크롤다운 디자인 */
.scroll_down {
    position: absolute;
    bottom: 10px;
    left: 50%;
    text-align: center;
    transform: translateX(-50%);
}

.scroll_down .arrow .arrow-icon {
    display: block;
    text-align: center;
    font-size: 24px;
    color: #fff;
    height: 7px;
    animation: arrow-ani 1s ease-in-out 0s infinite;
}

.scroll_down .arrow .arrow-icon:nth-child(1) {
    animation-delay: 0.1s;
}

.scroll_down .arrow .arrow-icon:nth-child(2) {
    animation-delay: 0.5s;
}

@keyframes arrow-ani {
    0% {
        opacity: 1;
    }
    50% {
        opacity: 0.2;
    }
    100% {
        opacity: 1;
    }
}


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

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

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

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

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

@media all and (max-width: 768px) {
}
@media all and (max-width: 600px) {
}

/* 장점 레이아웃 */
#point_wrap {}
#point_wrap .box {}

#point_wrap .box2  {background: #f8f8f8;}

#point_wrap .box .box_wrap {padding: 160px 0;}

#point_wrap .box .txt_box {width: 50%;}
#point_wrap .box .img_box {width: 50%; text-align: center;}

#point_wrap .box .img_box img {width: 60%; max-width: 320px;}
#point_wrap .box2 .img_box img {width: 70%; max-width: 430px;}

#point_wrap .box .txt_box span {font-weight: 700; font-size: var(--fs23); color: #fff; padding: 15px 30px; border-radius: 30px; background: var(--main-color); display: inline-block;}

#point_wrap .box .txt_box h3 {font-weight: 900; font-size: var(--fs50); margin: 20px  0 35px 0;}
#point_wrap .box .txt_box h3 b {color: var(--main-color);}
#point_wrap .box .txt_box em {font-weight: 700; font-size: var(--fs24); color: #858585; margin-top: auto; font-style: normal; margin-left: 15px;}
#point_wrap .box .txt_box p {font-size: var(--fs20); color: #494949; line-height: 1.6;}



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

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

@media all and (max-width: 1024px) {
    #point_wrap .box .box_wrap {padding: 80px 0;}



}

@media all and (max-width: 900px) {
    #point_wrap .box .txt_box {width: 100%;}
    #point_wrap .box .img_box {width: 100%; margin-top: 40px; }
    
    #point_wrap .box .txt_box span { padding: 6px 12px; }
    
    #point_wrap .box .txt_box h3 { margin: 15px  0 20px 0;}
    #point_wrap .box .txt_box h3 b {color: var(--main-color);}
    #point_wrap .box .txt_box em { margin-left: 0; display: block; margin-top: 8px;}
    #point_wrap .box .txt_box p {font-size: var(--fs20); color: #494949; line-height: 1.6;}
    
}

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

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

}
@media all and (max-width: 600px) {
    #point_wrap .box .img_box {}
}





/* ######################## 메인 시작 ######################## */
.top_ment {background: var(--main-color); height: 40px; display: flex; align-items: center; justify-content: center;}
.top_ment p {font-size: var(--fs15); font-weight: 500; color: #fff; text-align: center;}

/* 애니메이션 */
/* 텍스트 에니메이션 */
.ani_txt_wrap {position: relative; background: #121212;  width:100vw;  overflow:hidden;}
.ani_txt_wrap {}
.ani_txt_wrap .ani_txt {width:200vw;  overflow:hidden;}
.ani_txt_wrap .ani_txt h2 {width:100vw; overflow: hidden; float:left; font-size:34px; color: var(--main-color); ;animation:pado2 30s linear infinite; line-height: 1; padding: 15px 0; font-weight: 800; white-space: nowrap; /* 텍스트 줄바꿈 방지 */ text-overflow: clip; /* 텍스트 넘칠 경우 잘림 */}
.ani_txt_wrap .ani_txt h2:first-child {width:100vw; overflow: hidden; white-space: nowrap; /* 텍스트 줄바꿈 방지 */ text-overflow: clip; /* 텍스트 넘칠 경우 잘림 */}

.ani_txt_wrap2 {position: relative; top: -5px;}
@keyframes pado2{
	0%{ transform: translateX(0);}
    100% { transform: translateX(-100vw);}
}


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

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

@media all and (max-width: 1024px) {
    .ani_txt_wrap .ani_txt h2 {font-size:17px;  padding: 12px 0;}
}

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

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

@media all and (max-width: 768px) {
}
@media all and (max-width: 600px) {
}

/* section2 */

.section2 {padding-top: 100px;}
.section2 .title h3 {padding: 35px 0 20px 0;}
.section2 .title p {color: #494949; font-weight: 400;}


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

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

@media all and (max-width: 1024px) {
    .section2 .title h3 {padding: 25px 0 20px 0;}
}

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

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

@media all and (max-width: 768px) {
}
@media all and (max-width: 600px) {
    .section2 .title p {font-size: var(--fs17); }

}
/* section3 */
.section3 .title {max-width: 1400px; width: 92%; text-align: left; position: absolute; left: 50%; top: 50%; transform: translate(-50%,-50%);}
.section3 .title h4 {color: #fff;}
.section3 .title p {color: #fff; margin-top: 30px;}


.section3_video {
    width: 100vw;
    overflow: hidden;
    position: relative;
}
.section3_video video {width: 100%; height: auto;}
/* .section3_video  .video-controls {
    position: absolute;
    bottom: 30%;
    left: 45.2%;
    transform: translateX(-50%, -50%);
}

.section3_video  .control-btn {
    background: none;
    border: none;
    color: white;
    font-size: 180px;
    cursor: pointer;
    opacity: 0.2;
}

.section3_video  .control-btn:focus {
    outline: none;
} */

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

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

@media all and (max-width: 1024px) {
    .section3_video {display: flex; justify-content: center;}
    .section3_video video {width: 150%;}
    .section3_video  .control-btn {font-size: 90px; }
    .section3_video  .video-controls {bottom: 38%; left: 48%;
    }
}
@media all and (max-width: 1024px) {
}

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

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

@media all and (max-width: 768px) {
    .section3_video video {width: 250%;}
    .section3_video  .control-btn {display: none;}
}
@media all and (max-width: 600px) {
}

/* section4 */
.section4 .common {padding-top: 200px;}
.section4 .title {}
.section4 .title h3 {padding: 25px 0 15px 0;}
.section4 .title p {}

 
#bo_gall .title h3 {padding: 25px 0 15px 0;}

.section4 .link_box {width: 200px; height: 70px; display: flex; align-items: center; justify-content: center; border-radius: 50px; border: 2px solid var(--main-color); gap: 0 10px; margin: 0 auto; margin-top: 100px; cursor: pointer;}
.section4 .link_box a, .section4 .link_box i {color: var(--main-color); font-size: var(--fs24); font-weight: 700;}
.section4 .link_box i {font-size: var(--fs20);}
.section4 .link_box:hover {background: var(--main-color);}
.section4 .link_box:hover a, .section4 .link_box:hover i {color: #fff;}



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

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

@media all and (max-width: 1024px) {
    .section4 .common {padding-top: 80px;}
    .section4 .link_box {width: 150px; height: 50px; margin-top: 40px; }
    .section4 .link_box a, .section4 .link_box i {font-size: var(--fs26); }
}

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

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

@media all and (max-width: 768px) {
}
@media all and (max-width: 600px) {
}
/* 베너 */
.banner .common {padding: 160px 0;}
.banner .title h5 {margin-top: 5PX;} 
.banner .box_wrap {border-radius:20px ; box-shadow:0 0 51px  rgba(117, 117, 117, 0.13); padding:0 100px;}
.banner .box_wrap .title {width: 55%; text-align: left;}
.banner .box_wrap .img_box {width: 45%; padding-top: 70px;}

.banner .box_wrap .title p {color: #121212;}
.banner .box_wrap .title h4 {padding: 20px 0 15px 0;}
.banner .box_wrap .title p b  { font-size: var(--fs24) ; font-weight: 700; color: #585858; }
.banner .box_wrap .title a { border-radius: 50px; margin-top: 40px; padding: 24px 40px; background: var(--main-color) ; font-size: var(--fs24) ; font-weight: 700; color: #fff; display: inline-block;}
.banner .box_wrap .img_box img {max-width: 580px; height: auto; width: 100%;}




.banner2 .box_wrap {box-shadow:0 0 51px  rgba(117, 117, 117, 0.13);}
.banner2  .box_wrap .img_box { padding: 70px 0;}
.banner2 .box_wrap .img_box{text-align: right;}
.banner2 .box_wrap .img_box img {max-width: 337px; height: auto; width: 100%;}
.banner2 .title span {font-weight: 800;}

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

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

@media all and (max-width: 1024px) {
    .banner .common {padding: 80px 0;}
    .banner .box_wrap {padding: 40px 45px 0 45px;}
    .banner .box_wrap .title {width: 100%;}
.banner .box_wrap .img_box {width: 100%; padding-top: 40px; text-align: right;}

.banner .box_wrap .title a { padding: 15px 25px; background: var(--main-color) ; font-size: var(--fs28) ; margin-top: 30px;}

.banner2  .box_wrap .img_box { padding: 40px 45px;}
}

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

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

@media all and (max-width: 768px) {
}
@media all and (max-width: 600px) {
    .banner .box_wrap {padding: 40px 15px 0 15px;}

    .banner2  .box_wrap .img_box { padding: 40px 15px;}
}


/* ######################## 서브 시작 ######################## */

/* 공통 */
.sub_pc {display: block;}
.sub_mob {display: none;}

@media all and (max-width: 768px) {
    .sub_pc {display: none;}
.sub_mob {display: block;}
}
/* 회사소개 */
.intro1 .title p{ margin-top: 45px;}
.intro1 .img_box {margin-top: 60px;}
.intro1 .img_box img {width: 100%; height: auto; box-shadow: 0 0 51px rgba(129, 129, 129, 0.13);}

.intro2 #point_wrap .box {border-bottom: 1px solid #f0f0f0;}
.intro2 #point_wrap .box:last-child {border-bottom: none;}
.intro2 #point_wrap .box .box_wrap {padding: 120px 0; }


.intro3 {background: #f9f9f9;}
.intro3 .title h3 {padding: 10px 0 15px 0;}
.intro3 .box_wrap {justify-content: space-between; gap: 20px 0;}
.intro3 .box_wrap img {width: 24%; height: auto;}
.intro4 {background: #f9f9f9;}
.intro4 .box_wrap {box-shadow:0 0 51px  rgba(117, 117, 117, 0.13);}

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

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

@media all and (max-width: 1024px) {
    .intro1 .title p br { display: none;}
    .intro3 .box_wrap img {width: 49%; }
}

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

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

@media all and (max-width: 768px) {
}
@media all and (max-width: 600px) {
}
/* 메뉴 요금안내 */
/* 공통 */
.menu_box_wrap {display: flex; margin-top: 80px; gap: 60px 0; justify-content: space-between; align-items: center; flex-wrap: wrap;}
.menu_box_wrap .box {text-align: center; width: 25%;}
.menu_box_wrap .box img {max-width: 270px; width: 100%; height: auto;}
.menu_box_wrap .box p {font-size: var(--fs18) ; font-weight: 600;  margin-top: 30px;}
.menu_box_wrap .box span {font-size: var(--fs16) ; display: inline-block; margin: 10px 0 0 0;  font-weight: 600; color: #ccc; letter-spacing: 0.025em;}

.menu_page2 .title ,.menu_page3 .title,.menu_page4 .title{text-align: left;}

.menu_page2 .notice {margin-top: 24px;}
.menu_page2 .notice p {font-size: var(--fs18); text-align: right; }
.menu_page2 .box_wrap {margin-top: 80px; justify-content: space-between;}
.menu_page2 .box_wrap .box {width: 49.5%;}
.menu_page2 .box_wrap .box img {width: 100%; height: auto; box-shadow: 0 0 51px rgba(129, 129, 129, 0.13);}


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

@media all and (max-width: 1200px) {
    .menu_box_wrap .box { width: 24%;}
}

@media all and (max-width: 1024px) {
    .menu_box_wrap {margin-top: 40px; gap: 40px 0;}
    .menu_box_wrap .box { width: 48%; }
    .menu_page2 .box_wrap .box {width: 100%;}
.menu_page2 .box_wrap {margin-top: 40px;  gap: 20px 0;}
.menu_box_wrap .box p {  margin-top: 20px;}
.menu_box_wrap .box span { margin: 5px 0 0 0;}

}

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

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

@media all and (max-width: 768px) {
    .menu_box_wrap .box p {font-size: var(--fs22) ;}
.menu_box_wrap .box span {font-size: var(--fs18) ; }

.menu_page2 .notice p {font-size: var(--fs18);  }
}
@media all and (max-width: 600px) {
}
/* 이용절차 */
.procedure1 .title h3 {padding-top: 15px;}
.procedure1 .box_wrap {margin-top: 120px; justify-content: space-between; gap: 100px 0;}
.procedure1 .box_wrap .box {text-align: center; border: 2px solid #dfdfdf ; border-radius: 20px; width: 32%; padding: 35px 0 50px 0; height: 451px; transition: all 0.3s; cursor: pointer;}
.procedure1 .box_wrap .box .num {position: relative;}
.procedure1 .box_wrap .box .num::before {content: ""; position: absolute; left: 50%; top: -78px; transform: translate(-50%, 0%); width: 78px; height: 78px; border-radius: 50%; z-index: 11;  background: #121212;}
.procedure1 .box_wrap .box .num span {display: inline-block;font-size: var(--fs28) ; font-weight: 800; color: #fff; line-height: 1;  z-index: 22; position: relative; line-height: 78px;  top: -78px; }

.procedure1 .box_wrap .box img {height: 65px; width: auto; }
.procedure1 .box_wrap .box h4 {font-size: var(--fs30) ; font-weight: 800; margin:60px 0 33px 0;} 
.procedure1 .box_wrap .box p {font-size: var(--fs20) ; line-height: 1.4;}


.procedure1 .box_wrap .box:hover {border: 2px solid var(--main-color);}
.procedure1 .box_wrap .box:hover .num::before {background: var(--main-color);}
.procedure1 .box_wrap .box:hover img{filter: invert(47%) sepia(100%) saturate(666%) hue-rotate(85deg) brightness(97%) contrast(96%); opacity: 0.6;}

.procedure2 .title h3 {padding-top: 15px;}
.procedure2 .faq_box {margin-top: 60px;}

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

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

@media all and (max-width: 1024px) {
.procedure1 .box_wrap {margin-top: 80px; justify-content: space-between; gap: 60px 0;}
.procedure1 .box_wrap .box { padding: 0 0 0 0; height: 350px; width: 49%;}

.procedure1 .box_wrap .box .num::before { top: -25px; width: 50px; height: 50px;}
.procedure1 .box_wrap .box .num span { line-height: 50px;  top: -25px; }



.procedure1 .box_wrap .box img { width: auto; }
.procedure1 .box_wrap .box h4 {margin:30px 0 20px 0; font-size: var(--fs35) ; } 


.procedure2 .faq_box {margin-top: 40px;}


}

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

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

@media all and (max-width: 768px) {
    .procedure1 .box_wrap .box { height: 300px; width: 100%;}
}
@media all and (max-width: 600px) {
}
/* 무료 견적문의 */

.contact .contact_wrap{margin-top: 60px;}
.contact .sub_common {padding: 160px 0;}
.contact .title {text-align: left;}
.contact .title h3 {padding-top: 15px;}





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

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

@media all and (max-width: 1024px) {
    .contact .sub_common {padding: 80px 0;}
}

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

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

@media all and (max-width: 768px) {
}
@media all and (max-width: 600px) {
}
/* 하단 */
#ft{background: #181818 ;padding: 50px 0px; width: 100%;}
#ft .box_wrap {justify-content: space-between;}
#ft .foot_info {text-align: left;}
#ft .foot_call { text-align: right ;}

#ft .copyright {display: none; margin-top: 30px;}
#ft .copyright span {font-size: var(--fs15); color: #8b8b8b; font-weight: 500; line-height: 1.4;}


#ft .foot_info span {font-size: var(--fs15); color: #8b8b8b; font-weight: 500; line-height: 1.4;}
#ft .foot_call  p {margin-bottom: 10px; font-size: var(--fs18); color: #fff; font-weight: 500; }
#ft .foot_call  h4 {font-size: var(--fs30); color: var(--main-color); font-weight: 800; line-height: 1.1; }
#ft .foot_call  h4 br {display: none;}

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

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

@media all and (max-width: 1024px) {
    #ft .foot_info  {width: 100%; text-align: center;}
#ft .foot_call {width: 100%; text-align: center; margin-top: 30px;}
#ft .copyright {display: block;}
#ft .foot_call  h4  {line-height: 1.2;}
#ft .foot_call  h4 br {display: block;}
}

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

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

@media all and (max-width: 768px) {
}
@media all and (max-width: 600px) {
}

/* sub_visual */
.sub_visual{width: 100%;height: 490px;background-repeat: no-repeat !important;background-size: cover !important;background-position: center top !important; display: flex; flex-direction: column; align-items: center; justify-content: center;}
.sub_visual .sub_top_text{text-align: center;  padding-top: 90px;}
.sub_visual .sub_top_text h3{font-size: var(--fs50); font-weight: 800; color: #fff;}
.sub_visual .sub_top_text p{font-size: var(--fs18);font-weight: 800; color: #fff; margin-bottom: 10px; letter-spacing: 0.025em;}

@media all and (max-width: 1024px) {
	.sub_visual{height: 300px;}
	.sub_visual .sub_top_text{padding-top: 80px;}
}


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

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

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

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

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

@media all and (max-width: 768px) {
}
@media all and (max-width: 600px) {
}


/* 페이지 네비, 게시판 등 */
/* .bo_cate_link{border-radius: 30px;}
.bo_v_topcon .bo_v_cate{border-radius: 30px;} */
#bo_gall .is_notice{border-radius: 30px;}
.quick_banner{z-index: 99; right: 20px; bottom: 20px; position: fixed; animation: quickBounce .5s infinite alternate;}
.quick_banner a img {width: 50px;}
@keyframes quickBounce {
    from {
      transform: translateY(0px);
    }
    to {
      transform: translateY(-5px);
    }
  }

@keyframes quickBounce2 {
	0%,
	80%,
	100% {
		-webkit-transform: scale(0);
		transform: scale(0);
	}

	40% {
		-webkit-transform: scale(1.0);
		transform: scale(1.0);
	}
}

/* 갤러리 */
@media all and (max-width: 1024px) {
	.gall_row .col-gn-4{width: 33.33333%;}
	.gall_row .col-gn-5{width: 25%;}
}

@media all and (max-width: 850px) {
	.gall_row .col-gn-4, .gall_row .col-gn-3, .gall_row .col-gn-5{width: 49.5%;}
	#bo_cate li{width: 25%; margin-bottom: 10px;}
	#bo_cate ul{flex-wrap: wrap;}
}

@media all and (max-width: 600px) {
	.gall_row .col-gn-4, .gall_row .col-gn-3, .gall_row .col-gn-5, .gall_row .col-gn-2{width: 100%;}
}

/* 리스트 */
@media all and (max-width: 850px) {
	.prdt_list .prdt_top th.psize, .prdt_list .prdt_table .psize{display: none;}
	.prdt_list .prdt_top th.pcolor, .prdt_list .prdt_table .pcolor{display: none;}
}

@media all and (max-width: 650px) {
	.prdt_list .prdt_top th.num{min-width: 60px;}
	.prdt_list .prdt_top th.pintro, .prdt_list .prdt_table .pintro{display: none;}
	.prdt_list .prdt_top th.pname{width: 100%;}
	.prdt_list .prdt_table .pname{text-align: center;}
    .quick_banner{ right: 10px; bottom: 10px;}
    .quick_banner a img {width: 45px;}
}

/* 애니메이션 */



/*  */


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

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

@media all and (max-width: 1024px) {
    html{font-size: 55% !important;}
}

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

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

@media all and (max-width: 768px) {
    html{font-size: 45% !important;}
}
@media all and (max-width: 600px) {
}