._esg{
    background-image: url(/img/esg_sub.jpg);
    background-size: cover;
    background-position: center;
    background-repeat: no-repeat;
    height: 300px;
}

.cont{
    padding: 100px 0;
}
.cont .k_tit dl dd div{overflow: hidden;}
.cont .k_tit h3{
    font-size: 48px;
    font-weight: 500;
    line-height: 1.41666;
    letter-spacing: -0.025em;
}
.cont .k_tit h3 em{
    font-weight: 700;
}
.cont .form_list{
    display: flex; column-gap: 55px; row-gap: 60px;
    width: 100%; flex-wrap: wrap;padding-top: 100px;
}
.cont .form{
    display: block;
    background: rgba(0,0,0,0.04);
    position: relative;
    width: calc((100% / 3) - ((55px * 2) / 3));
    padding: 40px;
    box-sizing: border-box;
    border: 1px solid transparent;  
    /* transition: all 0.1s ease; */
}
.cont .form:hover{
    border-color: #0f9fff;
}
/* .form::before{content: ''; display: block; padding-top: calc(390/559*100%);} */
.cont .form .img{position: relative;}
.cont .form .img:before{content: ''; display: block; padding-top: calc(418/309*100%);}
.cont .form .img img{position: absolute; top: 0; left: 0; width: 100%; height: 100%; object-fit: cover;}
.cont .form .tit{
    margin-top: 40px; line-height: 1.3; text-align: center;
    font-weight: 600; font-size: 24px; letter-spacing: -0.025em;
}

.cont .view_more{display: flex; align-items: center; justify-content: center;padding-top: 80px;}
.cont .view_more a{
    display: block;width: 160px;padding: 13px 0;text-align: center;
    border: 1px solid #ececee; border-radius: 22px;
}

@media screen and (max-width: 1680px) {
    .cont .k_tit h3{font-size: 42px;}
    .cont .form .tit {font-size: 22px;}
}
@media screen and (max-width: 1440px) {
    .cont .k_tit h3{font-size: 38px;}
    .cont .form .tit {font-size: 20px;}
}
@media screen and (max-width: 1280px) {
    .cont .k_tit h3{font-size: 35px;}
    .cont .form .tit {font-size: 18px;}
}
@media screen and (max-width: 1024px) {
    .cont{padding: 60px 0;}
    .cont .form_list{padding-top: 80px;}
    .cont .k_tit h3 {font-size: 32px;}
    .cont .form {width: calc((100% / 2) - (55px / 2))}
    .cont .view_more{padding-top: 60px;}
}
@media screen and (max-width: 820px) {
    .cont .form{width: 100%;}
    .cont .k_tit h3{font-size: 28px;}
}
@media screen and (max-width: 500px) {
    .cont .k_tit h3 {font-size: 22px}
    .cont .form .tit {font-size: 16px}
    .cont .view_more a{font-size: 14px;}
}
@media screen and (max-width: 360px) {
    .cont .k_tit h3 {font-size: 20px; word-break: keep-all;}
}
