@charset "UTF-8";

.l-content202204 .p-dds__introduction{margin: 0 auto 0px auto;padding:75px 0 50px 0;}
.l-content202204 .p-dds__introduction p {margin: 0 auto;max-width: 38em;color:#000; font-family: "Hiragino Kaku Gothic W5 JIS2004", "Hiragino Kaku Gothic W4 JIS2004", "Hiragino Kaku Gothic ProN", "Hiragino Sans", "游ゴシック体", YuGothic, "游ゴシック Medium", "Yu Gothic Medium", Meiryo, sans-serif;}

.l-content202204 .p-dds__summary{margin-top: 75px;}

.l-content202204 .p-ddsIntegration__examples{margin-top: 0;padding-top: 0;}
.l-content202204 .p-ddsIntegration__examples p{font-size: 20px;line-height: 2.5;text-align: center;margin-top: 0px;color:#333;}
.l-content202204 .p-ddsIntegration__examples ul{margin: 90px auto 60px auto;flex-wrap: wrap;}
.l-content202204 .p-ddsIntegration__examples ul li{display: block;flex-basis: calc( 50% - 10px );margin-bottom: 26px;}
.l-content202204 .p-ddsIntegration__examples ul li>span{position: relative;display: flex;justify-content: flex-start;width: 100%;padding: 25px 35px;border: 3px solid #317BC0;border-radius: 16px;}
.l-content202204 .p-ddsIntegration__examples ul li span img{display: block;flex-basis:80px; width: 100%;height: 55px;margin: 0;}
.l-content202204 .p-ddsIntegration__examples ul li span span.title{margin-left: 35px;color:#317BC0;line-height: 55px;font-size: 26px;font-weight: 500;}
/*
.l-content202204 .p-ddsIntegration__examples ul li span:after{position: absolute;content:" ";background-image: url('data:image/svg+xml;charset=utf8,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20viewBox%3D%220%200%2016.7%2023.17%22%3E%3Cdefs%3E%3CclipPath%20id%3D%22a%22%3E%3Cpath%20d%3D%22M0%200h16.7v23.17H0z%22%20style%3D%22fill%3Anone%22%2F%3E%3C%2FclipPath%3E%3C%2Fdefs%3E%3Cg%20data-name%3D%22%E3%83%AC%E3%82%A4%E3%83%A4%E3%83%BC%202%22%3E%3Cg%20data-name%3D%22%E3%83%AC%E3%82%A4%E3%83%A4%E3%83%BC%201%22%20style%3D%22clip-path%3Aurl(%23a)%22%3E%3Cpath%20d%3D%22m1.27%201.25%2014.18%2010.33-14.2%2010.34%22%20style%3D%22stroke%3A%233f7397%3Bstroke-linecap%3Around%3Bstroke-linejoin%3Around%3Bstroke-width%3A2.5px%3Bfill%3Anone%22%2F%3E%3C%2Fg%3E%3C%2Fg%3E%3C%2Fsvg%3E');}
.l-content202204 .p-ddsIntegration__examples ul li span:after{display: block;width: 24px;height: 24px;background-repeat: no-repeat;background-size: contain;right: 15px;top:0;bottom: 0;margin: auto;}
*/
.l-content202204 .p-dds__foot{background-image:url(/en/drivedataservice/assets/data-integration/img/integration-foot.jpg);}

@media screen and (max-width: 1150px){
    .l-content202204 .p-ddsIntegration__examples{padding: 90px 0;}

}
@media screen and (max-width: 980px){
    .l-content202204 .p-ddsIntegration__examples ul li span span.title{line-height: 1.2em;}
}
@media screen and (max-width: 930px){
    .l-content202204 .p-ddsIntegration__examples ul li a span{margin-left: 25px;font-size: 20px;}
}
@media screen and (max-width: 768px){
    .l-content202204 .p-dds__introduction {padding: 50px 4% 5px 4%;margin: 0 auto 0 auto;}
    .l-content202204 .p-dds__summary{margin-top: 45px;margin-bottom: 40px;}
    .l-content202204 .p-ddsIntegration__examples p {font-size: 15px;line-height: 2.0;}

    .l-content202204 .p-dds__introduction__content {margin-top: 0;}
    .l-content202204 .p-ddsIntegration__examples .l-container{margin-top: 0;padding: 0 4%;margin-bottom: 0px;}
    .l-content202204 .p-ddsIntegration__examples ul{display: block;margin: 40px auto 30px auto;}
    .l-content202204 .p-ddsIntegration__examples ul li{margin-bottom: 15px;}
    .l-content202204 .p-ddsIntegration__examples ul li>span{padding: 18px 10px;border-width: 2px;border-radius: 8px;}
    .l-content202204 .p-ddsIntegration__examples ul li>span img{height: 40px;}
    .l-content202204 .p-ddsIntegration__examples ul li>span span.title{margin-left: 8px;line-height: 39px;font-size: 18px;}
/*
    .l-content202204 .p-ddsIntegration__examples ul li span:after {width: 18px;height: 18px;right: 8px;}
*/

}