@charset "utf-8";

#include01_wrapper{position:relative;width:1200px;margin:0 auto}
#index_wrapper #include01_wrapper .idx_tit_wrap{position:absolute;left:50%;transform:translateX(-50%);width:100%;padding:91px 0 60px}
#index_wrapper #include01_wrapper .idx_tit_wrap .idx_tit{font-size:43px}
#include01_wrapper .in01_icon_wrap{display:flex}
#include01_wrapper .in01_icon_wrap li{position:relative;width:calc(100% / 4);box-sizing:border-box;transition:all .8s ease-out}
#include01_wrapper .in01_icon_wrap li a{display:block;padding:290px 35px 111px}
#include01_wrapper .in01_icon_wrap li .li_tit{padding:20px 0;font-size:23px;color:#333;font-family:'notokr-medium'}
#include01_wrapper .in01_icon_wrap li .arr_img{padding-top:20px}
#include01_wrapper .in01_icon_wrap li:before{display:block;position:absolute;top:0;left:0;width:100%;height:100%;content:'';transition:background-color 1s;z-index:-1}
#include01_wrapper .in01_icon_wrap li p{color:#777}
#include01_wrapper .in01_icon_wrap li .more{position:absolute;left:-30px;top:0;font-size:15px;font-weight:700;color:#333;opacity:0;transition:all 0.3s;font-family:'Raleway'}
#include01_wrapper .in01_icon_wrap li .more_area{position:relative;margin-top:20px}
#include01_wrapper .in01_icon_wrap li .more_area .arr{position:absolute;left:0;top:-5px}

@media(hover:hover){
#include01_wrapper .in01_icon_wrap li:hover:before{display:block;background-color:#eaeff6;z-index:-999}}
#include01_wrapper .in01_icon_wrap li:hover .more{left:0px;opacity:1}
#include01_wrapper .in01_icon_wrap li:hover .arr{left:95px;transition:all 0.3s}
@media(max-width:1230px){
#include01_wrapper{width:100%;padding:0 15px;background-color:#fff}
#index_wrapper #include01_wrapper .idx_tit_wrap{z-index:1}
#include01_wrapper .in01_icon_wrap{border-left:1px solid #ececec;border-right:1px solid #ececec}
#include01_wrapper .in01_icon_wrap li{background-color:#fff}
#include01_wrapper .in01_icon_wrap li+li{border-left:1px solid #ececec}
#include01_wrapper .in01_icon_wrap li a{padding:280px 15px 111px}
#include01_wrapper .in01_icon_wrap li p.pl{white-space:normal}
}
@media(max-width:1024px){
#include01_wrapper{background-color:transparent}
#index_wrapper #include01_wrapper .idx_tit_wrap{position:unset;transform:none;padding-bottom:50px}
#index_wrapper #include01_wrapper .idx_tit_wrap .idx_tit{font-size:35px}
#include01_wrapper .in01_icon_wrap{flex-wrap:wrap;border:0}
#include01_wrapper .in01_icon_wrap li{width:calc(100% / 2);border:1px solid #ececec;border-left:0;border-top:0}
#include01_wrapper .in01_icon_wrap li+li{border-left:0}
#include01_wrapper .in01_icon_wrap li:first-child,#include01_wrapper .in01_icon_wrap li:nth-child(2){border-top:1px solid #ececec}
#include01_wrapper .in01_icon_wrap li:nth-child(even){border-right:0}
#include01_wrapper .in01_icon_wrap li a{padding:50px 15px 40px;text-align:center}
#include01_wrapper .in01_icon_wrap li p.pl{white-space:pre-line}
#include01_wrapper .in01_icon_wrap li .more_area{display:flex;justify-content:center}
#include01_wrapper .in01_icon_wrap li .more{position:unset;opacity:1}
#include01_wrapper .in01_icon_wrap li .more_area .arr{position:unset;margin:-2px 0 0 10px}
}
@media(max-width:600px){
#index_wrapper #include01_wrapper .idx_tit_wrap .idx_tit{font-size:30px}
#index_wrapper #include01_wrapper .idx_tit_wrap .pl{white-space:normal}
#include01_wrapper .in01_icon_wrap li a{padding:50px 10px 40px}
#include01_wrapper .in01_icon_wrap li .li_tit{font-size:20px}
#include01_wrapper .in01_icon_wrap li p.pl{white-space:normal}
#include01_wrapper .in01_icon_wrap li .more{font-size:14px}
}
@media(max-width:450px){
#index_wrapper #include01_wrapper .idx_tit_wrap{padding:80px 0 40px}
#index_wrapper #include01_wrapper .idx_tit_wrap .idx_tit{padding-bottom:15px;font-size:25px}
#include01_wrapper .in01_icon_wrap{flex-direction:column}
#include01_wrapper .in01_icon_wrap li{width:100%}
#include01_wrapper .in01_icon_wrap li:nth-child(2){border-top:0}
#include01_wrapper .in01_icon_wrap li:nth-child(odd){border-right:0}
#include01_wrapper .in01_icon_wrap li a{padding:35px 15px}
#include01_wrapper .in01_icon_wrap li .li_tit{padding:10px 0;font-size:18px}
#include01_wrapper .in01_icon_wrap li p.pl{white-space:pre-line}
}
@media(max-width:450px){
#index_wrapper #include01_wrapper .idx_tit_wrap .idx_tit{font-size:23px}
}