@charset "utf-8";

#include02{background:#323337 url(/sh_img/include/include_02/img/in02_bg.jpg) top center no-repeat}
#include02 .include_wrapper{position:relative}
#include02 .tit_area{padding-top:115px;text-align:right}
#include02 .menu_area:after{display:block;visibility:hidden;clear:both;content:""}
#include02 .menu_area li{position:relative;float:left;width:577px;height:295px;box-sizing:border-box;box-shadow:3px 4px 23px 5px rgba(0, 0, 0, 0.38);transition:all 0.2s}
#include02 .menu_area li:nth-child(odd){margin-right:46px}
#include02 .menu_area li:nth-child(even){margin-top:46px}
#include02 .menu_area li a{overflow:hidden;display:block;position:relative;height:100%;padding:35px;box-sizing:border-box}
#include02 .menu_area li a .menu_tit{position:relative;padding-top:200px;font-size:23px;color:#fff;letter-spacing:0.3px;transition:all 0.2s;z-index:10;font-family:notokr-medium}
#include02 .menu_area li a .menu_cont{position:relative;padding-top:10px;line-height:23px;color:#fff;opacity:0;transition:all 0.2s;z-index:10}
#include02 .menu_area li a .menu_img{position:absolute;left:0;right:0;top:0;bottom:0;z-index:0;transition:all 0.45s ease-in-out}
#include02 .menu_area li:hover .menu_tit{padding-top:150px}
#include02 .menu_area li:hover .menu_cont{opacity:1}
#include02 .menu_area li a .overlay{position:absolute;left:0;right:0;top:0;bottom:0;z-index:1;opacity:0;background:rgba(180, 47, 74, 0.61);transition:all 0.45s ease-in-out}
#include02 .menu_area li:hover .overlay{opacity:1}
#include02 .menu_area li:hover .menu_img{-webkit-transform:scale(1.05,1.05);-ms-transform:scale(1.05,1.05);transform:scale(1.05,1.05)}
#include02 .more_btn{display:block;position:absolute;bottom:-108px;left:47%;width:76px;height:76px;margin:0 auto;border-radius:50%;font-size:15px;line-height:76px;color:#fff;background-color:#b42f4a;text-align:center;box-shadow:0px 4px 10px 0px rgba(0, 0, 0, 0.25098039215686274);transition:all 0.2s;font-family:'poppins'}
#include02 .more_btn:hover{box-shadow:0px 4px 28px 0px rgba(0, 0, 0, 0.25098039215686274)}

/* 효과css */
.animated {-webkit-animation-duration:.6s;animation-duration:.6s;-webkit-animation-fill-mode:both;animation-fill-mode:both}
.fadeInUp {-webkit-animation-name:fadeInUp;animation-name:fadeInUp}
@-webkit-keyframes fadeInUp {from {opacity:0;webkit-transform:translate3d(0, 50%, 0);transform:translate3d(0, 50%, 0)}to {opacity:1;webkit-transform:none;transform:none}}
@keyframes fadeInUp {from {opacity:0;webkit-transform:translate3d(0, 50%, 0);transform:translate3d(0, 50%, 0)}to {opacity:1;webkit-transform:none;transform:none}}
#include02 .menu_area li:nth-child(1){-webkit-animation-delay:.2s;-ms-animation-delay:.2s;animation-delay:.2s}
#include02 .menu_area li:nth-child(2){-webkit-animation-delay:.4s;-ms-animation-delay:.4s;animation-delay:.4s}
#include02 .menu_area li:nth-child(3){-webkit-animation-delay:.6s;-ms-animation-delay:.6s;animation-delay:.6s}
#include02 .menu_area li:nth-child(4){-webkit-animation-delay:.8s;-ms-animation-delay:.8s;animation-delay:.8s}