@charset "utf-8";

#inc01{display:flex;flex-flow:column;gap:100px;padding:175px 100px}
#inc01 .item{display:flex}
#inc01 .item .cont{display:flex;flex-flow:column;width:50%;padding:75px 10%}
#inc01 .item .cont .tit{display:flex;align-items:flex-start;flex-direction:column;gap:22px;margin-bottom:35px;font-size:42px;font-weight:900;line-height:1;color:#111}
#inc01 .item .cont .tit span{font-size:30px;font-weight:600;white-space:nowrap}
#inc01 .item .cont div{word-break:keep-all;line-height:1.8}
#inc01 .item .cont a{display:flex;align-items:center;justify-content:center;position:relative;width:180px;height:60px;margin-top:46px;border:1px solid #e1e1e1;font-size:16px;font-weight:600;color:#111;line-height:58px;transition:all .4s}
#inc01 .item .cont a:before{display:block;content:"";position:absolute;left:0;z-index:-1;width:0;height:100%;border-color:var(--primary);color:#fff;background:var(--primary);transition:all .6s var(--easing)}
#inc01 .item .cont a:hover{border-color:transparent;color:#fff}
#inc01 .item .cont a:hover:before{width:100%}
#inc01 .item .cont a span{margin:0 0 2px 15px}
#inc01 .item .cont > p{font-size:18px;word-break:keep-all}
#inc01 .item .img_box{overflow:hidden;position:relative;width:50%}
#inc01 .item .img_box:before{display:block;content:"";position:absolute;left:0;top:0;width:0;height:100%;background:var(--primary);transition:all 1.2s var(--easing)}
#inc01 .item .img_box .img{opacity:0;overflow:hidden;position:relative;width:0;transition:all 1.8s var(--easing) .3s}
#inc01 .item .img_box.on:before{width:100%}
#inc01 .item .img_box.on .img{opacity:1;width:100%}
#inc01 .item.reverse .img_box{order:-1}