@charset "utf-8";

#inc04{display:flex;flex-flow:column;padding:0}
#inc04 .item{display:flex;}
#inc04 .item .cont{display:flex;flex-flow:column;width:50%;padding:200px 8%;font-size:20px;line-height:1.5;background:url(./img/bg.png) no-repeat center;background-size:cover}
#inc04 .item .cont .tit{display:flex;align-items:center;margin-bottom:50px;font-size:30px;font-weight:900;line-height:1.4;color:#111;font-family:'PuradakGentleGothic'}
#inc04 .item .cont .tit span{margin-left:15px;font-size:30px;font-weight:600;white-space:nowrap}
#inc04 .item .cont div{word-break:keep-all;line-height:1.8}
#inc04 .item .cont .btn_a{display:flex;align-items:center;justify-content:center;position:relative;width:180px;height:60px;margin-top:auto;margin-left:auto;border:1px solid #e1e1e1;border-radius:50px;font-size:16px;font-weight:600;color:#111;line-height:58px;transition:all .4s;z-index: 2;}
#inc04 .item .cont .btn_a:before{display:block;content:"";position:absolute;left:0;z-index:-1;width:0;height:100%;border-color:var(--primary);border-radius: 50px;color:#fff;background:var(--primary);transition:all .6s var(--easing)}
#inc04 .item .cont .btn_a:hover{border-color:transparent;color:#fff}
#inc04 .item .cont .btn_a:hover:before{width:100%}
#inc04 .item .cont .btn_a span{margin:0 0 2px 15px}
#inc04 .item .img_box{overflow:hidden;position:relative;width:50%}
#inc04 .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)}
#inc04 .item.reverse .img_box{order:-1}
#inc04 .item .img_box .img img{width:100%;height:100%;object-fit:cover}
#inc04 .main_img{margin-top:100px;height:500px;background-repeat:no-repeat;background-position:center center;background-attachment:fixed;background-size: cover;background-image:url(/sh_img/include/inc04/img/fix_img.jpg)}


@media (max-width:1700px){
#inc04 .item .cont{padding:120px 7%}
#inc04 .item .cont .tit{font-size:28px}
}
@media (max-width:1320px){
#inc04 .item .cont{padding:55px 5%;font-size:17px}
#inc04 .item .cont a{margin-top:auto}
#inc04 .item .img_box.on .img{height:100%}
#inc04 .item .img_box.on .img img{width:100%;height:100%;object-fit:cover}
}
@media (max-width:1024px){
#inc04{padding:0}
#inc04 .item .cont{padding:40px 30px;background-size:cover}
#inc04 article:nth-child(2) .item .cont{padding:40px 0 40px 30px}
#inc04 .item .cont .tit{font-size:21px;margin-bottom:25px}
#inc04 .item .cont .tit span{font-size:22px}
}
@media (max-width:768px){
#inc04{padding: 0;gap:50px}
#inc04 .item{flex-direction:column}
#inc04 .item .cont{min-height:100vh}
#inc04 .item .cont,#inc04 .item .img_box{width:100%;background-size:contain;}
#inc04 article:nth-child(2) .item .cont{align-items:flex-end;text-align:right}
#inc04 article:nth-child(2) .item .cont .tit{flex-direction:row-reverse}
#inc04 article:nth-child(2) .item .cont .tit span{margin-right:15px}
#inc04 .item.reverse .img_box{order:initial}
#inc04 .main_img{margin-top:0;height:320px;background-attachment:unset;background-size:cover}
}
@media (max-width:480px){
#inc04{padding: 0;gap:30px}
#inc04 .item .cont{align-items:center;padding:0;min-height:610px}
#inc04 .item .cont p{text-align:center;font-size:15px}
#inc04 .item .cont .tit{padding:0 20px;font-size:19px;line-height:1.5;text-align:center;word-break:keep-all}
#inc04 .item .cont .tit span{font-size:15px}
#inc04 .item .cont a{font-size:14px;width:140px;height:50px;margin:25px auto 0}
#inc04 article:nth-child(2) .item .cont{padding:30px 0;align-items:center}
#inc04 article:nth-child(2) .item .cont .tit{flex-direction:initial}
}