﻿

img { max-width: 100%; }
.video { border-style: none; position: relative; width: 100%; height: 100vh; min-height: 600px; background-color: #fff; margin: 0px auto; }
    .video > video { position: relative; width: 100%; height: 100%; border: none; object-fit: cover; border-style: none; background-color: #fff; }
        .video > video:focus { outline: none }

    .video > .text { z-index: 1; position: absolute; top: 0px; left: 0px; right: 0px; bottom: 0px; display: flex; align-items: center; justify-content: center; flex-direction: column; }
        .video > .text > .box { max-width: 1800px; padding: 0px 10%; width: 100%; flex: 1; display: flex; align-items: center; }
            .video > .text > .box > .bl { flex: 1; }
                .video > .text > .box > .bl > p { font-size: 3rem; color: #fff; line-height: 1.15; font-family: BebasKai; }
                    .video > .text > .box > .bl > p > i { font-style: normal; background-color: #e50112; padding: 0px 10px; }
                .video > .text > .box > .bl > a { display: inline-block; font-family: "IBMPlexSans-Regular"; position: relative; margin-top: 2.5rem; border-radius: 2.5rem; height: 2.5rem; line-height: 2.5rem; padding: 0px 5.6rem; color: #000; background-color: #fff; font-size: 1.125rem; }
                    .video > .text > .box > .bl > a > img { position: absolute; right: 1rem; vertical-align: middle; top: calc(50% - 7px); }
            .video > .text > .box > .br { width: 1%; max-width: 181px; padding-bottom: 6rem; }
                .video > .text > .box > .br > img { width: 100%; }
        .video > .text > .down { margin-bottom: 120px; height: 3.75rem; width: 3.75rem; border: 0.625rem solid rgba(255,255,255,0.6); border-radius: 60px; }
            .video > .text > .down > .mouse { position: relative; height: 2.5rem; width: 2.5rem; background-color: #fff; border-radius: 40px; text-align: center; }
                .video > .text > .down > .mouse::before { content: ''; width: 0.625rem; height: 0.625rem; position: absolute; top: 0.625rem; left: 50%; transform: translateX(-50%); background-color: #333; border-radius: 50%; opacity: 1; animation: wheel 1s infinite; -webkit-animation: wheel 1s infinite; }



.chevron { position: relative; display: block; margin: 0px auto; -webkit-animation: pulse 2s infinite; animation: pulse 2s infinite; color: #666; }
    .chevron::before { border-style: solid; border-width: 3px 3px 0 0; content: ''; display: inline-block; position: relative; vertical-align: top; width: 8px; height: 8px; }
    .chevron.bottom:before { top: 10px; -webkit-transform: rotate(135deg); -ms-transform: rotate(135deg); transform: rotate(135deg); }

@-webkit-keyframes pulse {
    0% { -webkit-transform: translate(0, 0); transform: translate(0, 0); }
    50% { -webkit-transform: translate(0, 7px); transform: translate(0, 7px); }
    100% { -webkit-transform: translate(0, 0); transform: translate(0, 0); }
}

@keyframes pulse {
    0% { -webkit-transform: translate(0, 0); transform: translate(0, 0); }
    50% { -webkit-transform: translate(0, 7px); transform: translate(0, 7px); }
    100% { -webkit-transform: translate(0, 0); transform: translate(0, 0); }
}




@media only screen and (max-width:1600px) {
    .video > .text > .box > .bl > a { padding: 0px 5rem; }
}

@media only screen and (max-width:1440px) {
    .video > .text > .box > .bl > a { padding: 0px 4.5rem; }
}

@media only screen and (max-width:1360px) {
    .video > .text > .box > .bl > a { padding: 0px 4.2rem; }
}

@media only screen and (max-width:1280px) {
    .video > .text > .box > .bl > p { font-size: 2.6rem; }
    .video > .text > .box > .bl > a { padding: 0px 4rem; }
}

@media only screen and (max-width:1024px) {
    .video > .text > .box > .bl > p { font-size: 2.4rem; }
}

@media only screen and (max-width:960px) {
    .video > .text > .box > .bl > p { font-size: 2rem; }
}

@media only screen and (max-width:768px) {
    .video { min-height: 360px; height: 60vh; }
        .video > .text > .box > .bl > p { font-size: 1.8rem; }
        .video > .text > .box > .br { width: 25%; }
        .video > .text > .box > .bl > p > i { padding: 0px 5px; }
        .video > .text > .down { margin-bottom: 50px; height: 3rem; width: 3rem; border: 0.5rem solid rgba(255,255,255,0.6); border-radius: 50px; }
            .video > .text > .down > .mouse { height: 2rem; width: 2rem; }
    .chevron::before { width: 5px; height: 5px; border-width: 2px 2px 0 0; }
    .chevron.bottom:before { top: 7px; }
}



@media only screen and (max-width:480px) {
    .video > .text > .box > .bl > p { font-size: 1.35rem; }
}

@keyframes wheel {
    to { opacity: 0; top: 1.5rem }
}

@-webkit-keyframes wheel {
    to { opacity: 0; top: 1.5rem }
}



.yhtop { width: 100%; max-width: 1920px; transform: translateY(-100px); margin: 0px auto; height: 130px; }
    .yhtop > img { width: 100%; object-fit: cover; }

@media only screen and (max-width:1600px) {
    .yhtop { height: 115px; }
}

@media only screen and (max-width:1440px) {
    .yhtop { height: 100px; }
}

@media only screen and (max-width:1280px) {
    .yhtop { transform: translateY(-80px); height: 90px; }
}

@media only screen and (max-width:1024px) {
    .yhtop { transform: translateY(-60px); height: 75px; }
}

@media only screen and (max-width:768px) {
    .yhtop { transform: translateY(-40px); height: 60px; }
}

@media only screen and (max-width:480px) {
    .yhtop { transform: translateY(-20px); }
}



.reach { width: 100%; }
.reachtitle { display: flex; width: 45%; margin: 0px auto; }
    .reachtitle > b { text-align: center; height: 72px; line-height: 1.5; background-color: #f5f5f5; border-radius: 50px 0px 0px 50px; font-weight: 400; font-size: 3rem; color: #000; font-family: "BebasKai"; }
    .reachtitle > .bl { width: 50%; z-index: -2; position: relative; }
    .reachtitle > .br { flex: 1; position: relative; background-color: #fff; }
        .reachtitle > .br::after { position: absolute; content: "贴心关怀"; color: #fffefd; border-radius: 50px; left: -50px; right: 0px; height: 100%; background: linear-gradient(to right, #0f9a5f, #08cbad); font-weight: 400; font-family: "BebasKai"; }



@media only screen and (max-width:1600px) {
    .reachtitle { width: 60%; }
}

@media only screen and (max-width:1440px) {
    .reachtitle { width: 70%; }
}

@media only screen and (max-width:1280px) {
    .reachtitle { width: 80%; }
        .reachtitle > b { height: 60px; font-size: 2.5rem; }
}

@media only screen and (max-width:1024px) {
    .reachtitle > b { height: 54px; font-size: 2.25rem; }
}

@media only screen and (max-width:768px) {
    .reachtitle { width: 86%; }
        .reachtitle > b { height: 40px; line-height: 40px; font-size: 1.5rem; }
        .reachtitle > .br::after { left: -20px }
}

@media only screen and (max-width:480px) {
    .reachtitle > b { font-size: 1.5rem; }
}

.bgbig { width: 100%; background-image: linear-gradient(to bottom, #fff, #f3eded); z-index: -100; position: relative; }
.reachbig { max-width: 1800px; padding: 0px 2.8%; margin: auto; }
.reachsubtext { text-align: center; margin: 2rem; }
    .reachsubtext > p { font-size: 1.625rem; color: #000; font-family: "IBMPlexSans-Regular"; }

@media only screen and (max-width:768px) {
    .reachsubtext { width: 86%; margin: 1rem; }
        .reachsubtext > p { font-size: 16px; }
}

.reachtext { display: flex; width: 100%; max-width: 1400px; margin: 9rem auto; }
    .reachtext > .subtitle { color: #000; width: 30%; margin-right: 5%; text-transform: uppercase; font-family: "BebasKai"; font-size: 3rem; line-height: 1; }
        .reachtext > .subtitle > i { position: relative; font-style: normal; }
            .reachtext > .subtitle > i::after { z-index: -99; content: ''; position: absolute; left: 0; bottom: 0px; width: 100%; height: 10px; background: #faa531; }
    .reachtext > .conn { flex: 1; }
        .reachtext > .conn > p { font-size: 1.3rem; line-height: 1.75; color: #000; font-family: 'IBMPlexSans-Regular'; }



@media only screen and (max-width:1440px) {
    .reachtext > .subtitle { font-size: 2.85rem; }
}

@media only screen and (max-width:1366px) {
    .reachtext > .subtitle { font-size: 2.75rem; }
}

@media only screen and (max-width:1280px) {
    .reachtext > .subtitle { font-size: 2.5rem; }
}

@media only screen and (max-width:1024px) {
    .reachtext > .subtitle { font-size: 2rem; }
}

@media only screen and (max-width:960px) {
    .reachtext { margin: 5rem auto; }
        .reachtext > .subtitle { font-size: 1.85rem; line-height: 1.25; }
            .reachtext > .subtitle > i::after { bottom: 5px; height: 5px; }
}

@media only screen and (max-width:768px) {
    .reachtext { flex-wrap: wrap; }
        .reachtext > .subtitle { width: 100%; margin-right: 0%; margin-bottom: 1rem; text-align: center; }
        .reachtext > .conn > p { font-size: 16px; }
}


.reachimgs { width: 100%; margin: 0px auto; }
    .reachimgs > .imgitems { width: 100%; height: 90vh; display: grid; grid-template-columns: 25% 6% 16% 12% 16% 25%; grid-template-rows: 42% 28% 30%; grid-template: "A B B B B C" "D D D E E C" "F F G G H H"; gap: 1rem; }
        .reachimgs > .imgitems > .item { border-radius: 2.5rem; overflow: hidden; width: 100%; height: 100%; }
            .reachimgs > .imgitems > .item:nth-child(1) { grid-area: A }
            .reachimgs > .imgitems > .item:nth-child(2) { grid-area: B }
            .reachimgs > .imgitems > .item:nth-child(3) { grid-area: C }
            .reachimgs > .imgitems > .item:nth-child(4) { grid-area: D }
            .reachimgs > .imgitems > .item:nth-child(5) { grid-area: E }
            .reachimgs > .imgitems > .item:nth-child(6) { grid-area: F }
            .reachimgs > .imgitems > .item:nth-child(7) { grid-area: G }
            .reachimgs > .imgitems > .item:nth-child(8) { grid-area: H }
            .reachimgs > .imgitems > .item > img { width: 100%; height: 100%; object-fit: cover; }

            .reachimgs > .imgitems > .item > img { -moz-transition: transform, 1s; -webkit-transition: transform, 1s; -o-transition: transform, 1s; transition: transform,1s }
            .reachimgs > .imgitems > .item:hover img { -webkit-transform: scale(1.15); transform: scale(1.15) }



@media only screen and (max-width:1600px) {
    .reachimgs > .imgitems > .item { border-radius: 2.35rem; }
}

@media only screen and (max-width:1440px) {
    .reachimgs > .imgitems > .item { border-radius: 2.05rem; }
}

@media only screen and (max-width:1280px) {
    .reachimgs > .imgitems > .item { border-radius: 1.85rem; }
}

@media only screen and (max-width:960px) {
    .reachimgs > .imgitems > .item { border-radius: 1.35rem; }
}

@media only screen and (max-width:768px) {
    .reachimgs > .imgitems { display: flex; flex-wrap: wrap; height: auto; grid-template-rows: none; grid-template-columns: none; gap: normal; }
        .reachimgs > .imgitems > .item { height: 100px; width: 48%; margin: 1%; border-radius: 1rem; }
}


.txttitle { position: relative; text-transform: uppercase; font-size: 3rem; color: #000; font-family: "BebasKai"; text-align: center; line-height: 1; }
    .txttitle > i { font-style: normal; position: relative; }
        .txttitle > i::after { z-index: -99; content: ''; position: absolute; left: 0; bottom: 0rem; width: 100%; height: 0.625rem; background: #1c9dd6; }
    .txttitle.bai { color: #fff; }
.txtsubtitle { margin: 2rem auto; text-align: center; font-size: 1.25rem; max-width: 1100px; color: #000; font-family: 'IBMPlexSans-Regular'; }
    .txtsubtitle.bai { color: #fff; }



@media only screen and (max-width:1280px) {
    .txttitle { font-size: 2.5rem; }
}

@media only screen and (max-width:1024px) {
    .txttitle { font-size: 2.15rem; }
}

@media only screen and (max-width:960px) {
    .txttitle { font-size: 2rem; }
}

@media only screen and (max-width:768px) {
    .txttitle { font-size: 20px; }
        .txttitle > i::after { bottom: 5px; height: 5px; }
    .txtsubtitle { font-size: 16px; }
}






.fanganbg { background-color: #f3eded; z-index: -100; position: relative; }
.fanganbig { width: 100%; max-width: 1800px; padding: 10rem 3%; margin: 0px auto; }
    .fanganbig > .subtitle { margin: 2rem auto; text-align: center; font-size: 1.25rem; max-width: 1100px; color: #000; font-family: 'IBMPlexSans-Regular'; }
    .fanganbig > .items { width: 100%; display: flex; }
        .fanganbig > .items > div { overflow: hidden; position: relative; border-radius: 2.5rem; }
            .fanganbig > .items > div > img { width: 100%; height: 100%; object-fit: cover; }
            .fanganbig > .items > div.itema { width: 32.33%; margin-left: 0.5%; margin-right: 0.5%; margin-bottom: 1rem; }
            .fanganbig > .items > div.item { overflow: hidden; flex: 1; margin-left: 0.5%; margin-right: 0.5%; margin-bottom: 1rem; }
            .fanganbig > .items > div > .box { position: absolute; top: 2.5rem; right: 1.5rem; left: 1.5rem; bottom: 2rem; }
                .fanganbig > .items > div > .box > .title { display: flex; align-items: start; }
                    .fanganbig > .items > div > .box > .title > b { flex: 1; line-height: 1; color: #fff; font-size: 1.5rem; font-family: "BebasKai"; }

                .fanganbig > .items > div > .box > ul { position: absolute; bottom: 80px; width: 100%; display: flex; flex-wrap: wrap; margin-top: 30%; }
                    .fanganbig > .items > div > .box > ul > li { margin-bottom: 1rem; line-height: 1; width: 50%; padding-left: 30px; padding-right: 10px; color: #fff; font-size: 1.125rem; font-family: 'IBMPlexSans-Regular'; background-image: url('../images/icon/ib1.png'); background-repeat: no-repeat; background-position: 0px 5px; }
                .fanganbig > .items > div > .box > .link { position: absolute; bottom: 0px; left: 0px; right: 0px; background-color: #fff; height: 36px; border-radius: 36px; line-height: 36px; padding: 0px 20px 0px 20px; font-size: 1.125rem; font-family: 'IBMPlexSans-Regular'; background-image: url('../images/icon/ir2.png'); background-repeat: no-repeat; background-position: top 12px right 20px; }
                    .fanganbig > .items > div > .box > .link > a { display: block; }

            .fanganbig > .items > div.item > img { -moz-transition: transform, 0.5s; -webkit-transition: transform, 0.5s; -o-transition: transform, 0.5s; transition: transform,0.5s }
            .fanganbig > .items > div.item:hover > img { -webkit-transform: scale(1.15); transform: scale(1.15) }
            .fanganbig > .items > div.itema > img { -moz-transition: transform, 0.5s; -webkit-transition: transform, 0.5s; -o-transition: transform, 0.5s; transition: transform,0.5s }
            .fanganbig > .items > div.itema:hover > img { -webkit-transform: scale(1.15); transform: scale(1.15) }




@media only screen and (max-width:1600px) {
    .fanganbig > .items > div > img { border-radius: 2.35rem; }
    .fanganbig > .items > div > .box > .title > b { font-size: 1.25rem; }
}

@media only screen and (max-width:1440px) {
    .fanganbig > .items > div > img { border-radius: 2.05rem; }
}

@media only screen and (max-width:1280px) {
    .fanganbig > .items { flex-wrap: wrap; }
        .fanganbig > .items > div.itema { width: 65.33%; }
        .fanganbig > .items > div.item { flex: none; width: 32.33%; }
        .fanganbig > .items > div { border-radius: 1.85rem; }
}

@media only screen and (max-width:1024px) {
    .fanganbig { padding: 7rem 3%; }
}

@media only screen and (max-width:960px) {
    .fanganbig > .items > div { border-radius: 1.35rem; }
}

@media only screen and (max-width:768px) {
    .fanganbig { padding: 5rem 3%; }
        .fanganbig > .items > div.itema { width: 100%; }
        .fanganbig > .items > div.item { flex: none; width: 49%; max-height: 300px; }
        .fanganbig > .items > div > .box > .title > b { font-size: 1.15rem; }
        .fanganbig > .items > div { border-radius: 1rem; }
            .fanganbig > .items > div > .box > .title > div.smbg { width: 32px; height: 32px; }
            .fanganbig > .items > div > .box > .title > div.sm { width: 22px; height: 22px; }
}

.productbg { width: 100%; background-image: linear-gradient(to bottom, #f3eded, #f8f0ed); z-index: -100; position: relative; }
    .productbg > div { background-color: #010101; border-radius: 3.125rem; max-width: 1800px; margin: 0px auto; }
.productbig { width: 100%; max-width: 1500px; padding: 10rem 3%; margin: 0px auto; }
    .productbig > ul { display: flex; width: 100%; flex-wrap: wrap; align-items: stretch; }
        .productbig > ul > li { width: 31.33%; margin: 1%; }
            .productbig > ul > li > .img { width: 100%; position: relative; overflow: hidden; border-radius: 2rem; }
                .productbig > ul > li > .img > img { object-fit: cover; width: 100%; -moz-transition: transform, 0.5s; -webkit-transition: transform, 0.5s; -o-transition: transform, 0.5s; transition: transform,0.5s }
                .productbig > ul > li > .img > .info { display: flex; position: absolute; bottom: 2rem; left: 1rem; right: 1rem; justify-content: center; }
                    .productbig > ul > li > .img > .info > a { font-family: 'IBMPlexSans-Regular'; color: #000; font-size: 1rem; border-radius: 2.25rem; line-height: 2.25rem; width: 48%; margin: 0% 1%; display: block; height: 2.25rem; text-align: center; background-color: #fff; }
                        .productbig > ul > li > .img > .info > a:nth-child(1) { background-image: url('../images/icon/ic1.png'); background-repeat: no-repeat; background-position: center left 20px; padding-left: 15px; }
                        .productbig > ul > li > .img > .info > a:nth-child(2) { background-image: url('../images/icon/ic2.png'); background-repeat: no-repeat; background-position: center left 20px; padding-left: 15px; }

            .productbig > ul > li > .text { width: 100%; text-align: center; padding: 1.5rem 0px; }
                .productbig > ul > li > .text > b { display: block; position: relative; font-weight: 400; font-size: 1.5rem; color: #fff; font-family: "BebasKai"; line-height: 1.15; }
                    .productbig > ul > li > .text > b > img { position: absolute; right: 0px; }
                .productbig > ul > li > .text > p { color: #fff; font-size: 14px; font-family: 'IBMPlexSans-Regular'; padding: 1rem 0px 0rem 0px; }
            .productbig > ul > li > .img:hover > img { -webkit-transform: scale(1.15); transform: scale(1.15) }



@media only screen and (max-width:1280px) {
    .productbig > ul > li { width: 48%; }
}

@media only screen and (max-width:1024px) {
    .productbig { padding-top: 7rem; padding-bottom: 7rem; }
}


@media only screen and (max-width:768px) {
    .productbig { padding-top: 5rem; padding-bottom: 5rem; }
        .productbig > ul > li > .img { border-radius: 1rem; }
            .productbig > ul > li > .img > .info { flex-wrap: wrap; }
                .productbig > ul > li > .img > .info > a { width: 98%; margin: 1% 1%; }
        .productbig > ul > li > .text > b { font-size: 1.15rem; }
            .productbig > ul > li > .text > b > img { max-width: 32px; }
}


.whobg { width: 100%; background-image: linear-gradient(to bottom, #f8f0ed, #fffefc); }
.whobig { width: 100%; max-width: 1500px; padding: 10rem 3%; margin: 0px auto; }
    .whobig > ul { display: flex; flex-wrap: wrap; }
        .whobig > ul > li { cursor: pointer; width: 48%; margin: 5px 1%; background-color: #fff; border-radius: 100px; line-height: 1.8; font-family: 'IBMPlexSans-Regular'; font-size: 1.125rem; color: #000; padding: 5px 2rem; background-image: url('../images/icon/ir7.png'); background-repeat: no-repeat; background-position: center right 20px; -moz-transition: all, 0.5s; -webkit-transition: all, 0.5s; -o-transition: all, 0.5s; transition: all,0.5s }
            .whobig > ul > li:hover { background-color: #293365; color: #fff; background-image: url('../images/icon/id1.png'); }
            .whobig > ul > li.action { background-color: #293365; color: #fff; background-image: url('../images/icon/id1.png'); }
    .whobig > .map { margin-top: 4rem; position: relative; }
        .whobig > .map > img { max-width: 100% }
    .whobig > .date { margin-top: 2rem; }
        .whobig > .date > img { max-width: 100% }


@media only screen and (max-width:1024px) {
    .whobig { padding-top: 7rem; padding-bottom: 7rem; }
}

@media only screen and (max-width:768px) {
    .whobig { padding-top: 5rem; padding-bottom: 5rem; }
        .whobig > ul > li { width: 98%; }
}





.aboutbg { width: 100%; background-color: #fffefc; }
.aboutbig { width: 100%; max-width: 1500px; padding: 5rem 3%; margin: 0px auto; }
.aboutbg .aboutvideo { width: 100%; max-width: 1800px; }
.aboutbg .aboutvideo { border-style: none; position: relative; width: 100%; height: 70vh; min-height: 600px; margin: 0px auto; }
    .aboutbg .aboutvideo > video { width: 100%; height: 100%; border: none; object-fit: cover; border-style: none; background-color: #000; }
        .aboutbg .aboutvideo > video:focus { outline: none }





.careerbg { width: 100%; background-color: #fff; }
    .careerbg > div { background-color: #010101; border-radius: 0px 0px 3.125rem 3.125rem; max-width: 1800px; margin: 0px auto; }
.careerbig { width: 100%; max-width: 1600px; padding: 10rem 3%; margin: 0px auto; }
    .careerbig > ul { display: flex; margin-top: 3rem; flex-wrap: wrap; }
        .careerbig > ul > li { width: 31.333%; margin: 1%; }
            .careerbig > ul > li > .img { width: 100%; position: relative; border-radius: 1.8rem; overflow: hidden; }
                .careerbig > ul > li > .img > img { max-width: 100%; -moz-transition: transform, 0.5s; -webkit-transition: transform, 0.5s; -o-transition: transform, 0.5s; transition: transform,0.5s }
                .careerbig > ul > li > .img > .icon { position: absolute; right: 1.5rem; top: 1.5rem; }
            .careerbig > ul > li > b { line-height: 1.15; padding: 1rem 0px; font-weight: 400; font-family: 'IBMPlexSans-Regular'; display: block; font-size: 1.675rem; color: #fff; text-align: center; }
            .careerbig > ul > li > a { width: 50%; font-family: 'IBMPlexSans-Regular'; display: block; font-size: 1.125rem; color: #fff; padding: 0.5rem 0px; text-align: center; border: solid 1px #e50012; border-radius: 50px; background-image: url('../images/icon/ir9.png'); background-repeat: no-repeat; background-position: center right 20px; }

            .careerbig > ul > li > .img:hover > img { -webkit-transform: scale(1.15); transform: scale(1.15) }



@media only screen and (max-width:1024px) {
    .careerbig { padding-top: 7rem; padding-bottom: 7rem; }
        .careerbig > ul > li > .img { border-radius: 1.5rem; }
            .careerbig > ul > li > .img > .icon { width: 40px; height: 40px; }
}



@media only screen and (max-width:768px) {
    .careerbig { padding-top: 5rem; padding-bottom: 5rem; }
        .careerbig > ul > li { width: 48%; margin-bottom: 2rem; }
            .careerbig > ul > li > .img { border-radius: 1rem; }
            .careerbig > ul > li > a { width: 100% }
            .careerbig > ul > li > .img > .icon { width: 30px; height: 30px; }
}

@media only screen and (max-width:480px) {
    .careerbig > ul > li { width: 98%; }
}




.blogbig { width: 100%; max-width: 1300px; padding: 0rem 3% 10rem 3%; margin: 0px auto; }
    .blogbig > ul { display: flex; margin-top: 3rem; flex-wrap: wrap; }
        .blogbig > ul > li { width: 48%; margin: 1%; }
            .blogbig > ul > li > .img { width: 100%; position: relative; border-radius: 1.8rem; overflow: hidden; }
                .blogbig > ul > li > .img > img { max-width: 100%; -moz-transition: transform, 0.5s; -webkit-transition: transform, 0.5s; -o-transition: transform, 0.5s; transition: transform,0.5s }
                .blogbig > ul > li > .img > .icon { position: absolute; right: 1.5rem; top: 1.5rem; }
            .blogbig > ul > li > b { line-height: 1.15; padding: 1rem 0px; font-weight: 400; font-family: 'IBMPlexSans-Regular'; display: block; font-size: 1.5rem; color: #000; text-align: center; }
            .blogbig > ul > li > a { width: 50%; font-family: 'IBMPlexSans-Regular'; display: block; font-size: 1rem; color: #000; padding: 0.5rem 0px; text-align: center; border: solid 1px #e50012; border-radius: 50px; background-image: url('../images/icon/ir9.png'); background-repeat: no-repeat; background-position: center right 20px; }

            .blogbig > ul > li > .img:hover > img { -webkit-transform: scale(1.15); transform: scale(1.15) }


@media only screen and (max-width:1024px) {
    .blogbig { padding-bottom: 7rem; }
        .blogbig > ul > li > .img { border-radius: 1.5rem; }
            .blogbig > ul > li > .img > .icon { width: 40px; height: 40px; }
}


@media only screen and (max-width:768px) {
    .blogbig { padding-bottom: 5rem; }
        .blogbig > ul > li > .img { border-radius: 1rem; }
        .blogbig > ul > li > a { width: 100% }
        .blogbig > ul > li > .img > .icon { width: 30px; height: 30px; }
        .blogbig > ul > li > b { font-size: 1.25rem }
}

@media only screen and (max-width:480px) {
    .blogbig > ul > li { width: 98%; margin-bottom: 2rem; }
}
