@charset 'utf-8';



/*----헤더 레이아웃(모바일 포함) ---*/
#header  {transition:0.3s ease-out;}
.down_bar  {background:#0098f4; width:80px; height:6px; margin:19px auto;}


.menu_fixed  { font-size:17px;  /*border:1px solid red;*/ position:fixed; z-index:999; width:100%; }
.menu_fixed #logo  {padding-left:30px;}
.menu_fixed #logo img  {max-width:200px;}
.menu_fixed a  {display:block;}
.menu_fixed .header-inner  {transition:0.5s ease-out; background:rgba(255,255,255,0.9);display:flex; margin:auto; margin-top:50px; height:100px; align-items:center; justify-content:space-between; max-width:1200px; }
.menu_fixed .gnb  {display:flex; text-align:center; }
.menu_fixed .gnb .lm  {min-width:140px;}
.menu_fixed .gnb .lm > a  {line-height:100px; /*transition:0.1s;*/}
.menu_fixed .gnb .lm > a:hover  {background:#0098f4; color:#fff; }

/*--모바일---*/
.mobile_menu  {display:none; background:rgba(255,255,255,0.8);}
.mobile_menu img  {max-width:150px;}
.mobile_menu nav  {border-bottom:1px solid rgba(0,0,0,0.3); display:flex; justify-content:space-between; padding:20px 15px;}
.mobile_menu nav ul  {cursor:pointer;}
.mobile_menu nav ul > *  {transition:0.3s ease-out; }
.mobile_menu nav ul li  {background:#fff; width:35px; height:5px; border-radius:5px;}
.mobile_menu nav ul li:nth-of-type(2)  {margin-top:8px;}
.mobile_menu nav ul li:nth-of-type(3)  {margin-top:8px;}
.mobile_menu .m_gnb  {display:none;border-bottom:1px solid rgba(0,0,0,0.3);}
.mobile_menu .m_gnb a  {line-height:24px; padding:15px;}



/*---index----*/
#slider  {width:100%; height:100vh; position:relative;}
#slider div  {height:100%; background-position:center top; background-size:cover; background-repeat:no-repeat;}
#slider span  {display:block; text-align:center;}
#slider .main_text  {align-self:center; width:100%;}
#slider .h56  {font-size:56px; color:#fff;}
#slider .h22  {font-size:22px; line-height:34px; color:#fff; padding-top:20px;}
.slick-next  {right:25px !important; color:#fff;}
.slick-prev  {left:25px !important; z-index:99;}
.slick-dots  {bottom:35px !important;}
.slick-dotted.slick-slider  {margin-bottom:0 !important;}

.about_us  {text-align:center; color:#666; padding:100px 0; transition:0.5s ease-out;}
.about_us span  {display:block;}
.about_us .h40 {font-size:40px; font-weight:bold; color:#333; padding-bottom:20px;}
.about_us .h14  {font-size:14px; line-height:24px; font-weight:lighter;}
.about_us .down_bar  {background:#0098f4; width:80px; height:6px; margin:19px auto;}
.about_us ul  {max-width:1200px; display:flex; margin:auto; margin-top:115px;}
.about_us ul li  {flex:1;}
.about_us .link_box a  {display:block; border:1px solid #666; width:140px; line-height:35px; color:#666; margin:auto; margin-top:30px; transition:0.3s ease-in-out;}
.about_us .link_box a:hover  {background:#0098f4; border:1px solid #0098f4; color:#fff;}

/*.about_us ul li:hover  {  
    box-shadow: 0 0px 10px rgba(51,51,51,0.2);
    
    transform:rotate(-4deg);

}*/
.about_us ul li img  {max-width:100%;}
.about_us ul li strong  {display:block; padding-top:7px; font-weight:normal; font-size:23px; color:#333; line-height:45px;}

/*-----portfolio layout---*/
#portfolio_layout  {width:100%; padding:100px 0; background:#000 url('../img/portfolio_back.png') center top;}
#portfolio_layout span  {display:block;}
#portfolio_layout .h40  {font-size:40px; font-weight:bold; color:#fff; text-align:center;}


/*---our process---*/
.our_process  {transition:0.5s ease-out;background:#f9f9f9; color:#666; text-align:center; padding:200px 0;}
.our_process span  {display:block;}
.our_process .arrow  {width:40px; height:100%; display:flex; align-items:center;}
.our_process .arrow img  {display:block; margin:auto;}
.our_process .h40  {font-size:40px; color:#333; font-weight:bold;}
.our_process .h14  {font-size:14px; color:#666; padding-top:20px; line-height:24px; font-weight:lighter;}
.our_process .order_list  {justify-content:center; max-width:1200px; margin:auto; margin-top:65px; display:flex;}
.our_process .order_list strong  {font-size:17px; color:#333; font-weight:bold;}
.our_process .order_list li  {position:relative; display:flex;}
.our_process .order_list li section  {border:1px solid #ddd; background:#fff; padding-top:30px; width:250px; height:350px;}


/*---footer----*/

footer  {padding:55px 0; border-top:1px solid #ccc; background:#f9f9f9; text-align:center; font-size:14px; color:#272727;}
footer  .h14  {font-size:14px; display:block; line-height:34px; color:#272727;}
footer img  {margin-bottom:60px;}
footer .top_bot  {cursor:pointer; margin:auto; margin-bottom:35px; width:50px; line-height:50px; text-align:center; font-size:14px; color:#fff; border-radius:50px; background:#0098f4;}



/*-----addClass-----*/
.header_hit  {background:rgba(255,255,255,0.9) !important; border-bottom:1px solid #ddd;}
.header_hit .header-inner  {margin-top:0; background:0;}
.header_hit .mobile_menu nav ul li  {background:#272727 !important;}

.mo_hit  {background:rgba(255,255,255,0.9);}
.mo_hit .mobile_menu nav ul li  {background:#272727;}

.exit  {position:relative; width:30px; height:35px;}
.exit li  {position:absolute !important; left:0; top:0; margin:0 !important;}
.exit li:nth-of-type(1)  {left:-5px; top:18px; transform:rotate(-45deg); }
.exit li:nth-of-type(2)  {display:none;}
.exit li:nth-of-type(3)  {left:-5px; top:18px; transform:rotate(45deg);}





/*----animation----*/

.right_ani  {margin-left:-50px; opacity:0;}
.left_ani  {margin-right:-50px; opacity:0;}

.pic_lt ul li  {transform:scale(0); transition:0.3s ease-out;}
.scale_show  {transform:scale(1) !important;}




/*---태블릿 사이즈 ----*/
@media (max-width:1024px) {

.our_process .order_list  {flex-wrap:wrap;}
.our_process .order_list li  {padding:10px;position:relative; width:50%;}
.our_process .order_list li section  {width:100%;}
.our_process .arrow  {display:none;}


}


@media (max-width:768px) {
#slider .h56  {font-size:23px; line-height:33px;}
#slider .h22  {font-size:14px; line-height:24px;}
.menu_fixed .header-inner  {display:none;}
.header_hit  {border-bottom:0 !important;}
.mobile_menu  {display:block; background:0;}

.our_process  {padding:100px 0;}
#slider  {height:600px;}


.about_us  {padding:45px 0; display:none;}
.about_us .h40  {font-size:23px;}
.about_us .h14  {padding-left:10px; font-size:12px;}
.about_us ul  {display:block; margin-top:50px;}
.about_us ul li  {width:100%; padding:20px 0; display:flex;}
.about_us ul li span  {flex:1;}
.about_us ul li img  {display:none;}
.about_us ul li strong  {font-size:17px; line-height:25px;}
.about_us .link_box a  {margin-top:14px;}

}






}


/*---모바일 사이즈----*/

@media (max-width:395px) {

.our_process .order_list  {display:block;}
.our_process .order_list li  {padding:10px;position:relative; width:100%;} 



}