@charset "utf-8";
/* common */ 
.cloud01 .keyvisual{background-image:url(../images/sub/img-cloud01-visual.png)} 
.cloud03 .keyvisual{background-image:url(../images/sub/img-cloud03-visual.jpg)} 
.cloud .left .desc{color:#005eb8; margin-top: 5px;}
.cloud .right .logo{float:right; max-width:300px;}  
.cloud .right .logo img{ max-width:160px;}
.cloud .division p .color{color:#005EB8; font-size: 1em;} 
.cloud .division p strong.color{color:#005EB8; font-size: 1em;} 
.cloud .division p strong{font-size:22px;font-weight:700;color:#000;}
.cloud .division li,
.cloud .division p {font-size:18px;color:#555;line-height:33px;letter-spacing:-0.02em;word-break:keep-all} 
.cloud .case-list li + li{margin-top: 4rem;} 
.cloud .case-list li .logo{float:none; margin-left:auto; text-align:right; margin-bottom: 20px;}
.cloud .case-list li .ptn-img{position:relative; width:100%; height:340px; }
.cloud .case-list li .ptn-img img{width:100%; height:100%; object-fit:cover;  position:absolute; left:0; top:0; z-index:-1;}
.cloud .case-list li .ptn-img p{position:absolute; padding:60px 40px; color: #fff; width:100%;}
.cloud .case-list li .ptn-img strong{font-size: 24px; color:#fff; margin-bottom: 20px; display:block; line-height: 1.4;}

.cloud .flex-wr {display:flex; justify-content:space-between; align-items:center;}
.cloud .flex-wr .flex-box{width:50%;}

@media screen and (max-width:640px) {/* mobile */ 
    .cloud .division p strong {font-size: 20px;}
    .cloud .division .right{margin:14px 0 0} 
	.cloud .division li, .cloud .division p { font-size: 14px;   line-height: 24px;}
	.cloud .right .logo{float:none; margin-bottom:10px;}
	.cloud .right .logo img{ max-width:100px;}
	.cloud .case-list{margin-top: 20px;}
	.cloud .case-list li + li{margin-top:40px;}
	.cloud .case-list li .ptn-img {height:300px;}
	.cloud .case-list li .ptn-img p{padding:40px 20px;}
	.cloud .case-list li .ptn-img strong{font-size: 20px;}
	.cloud .case-list li .logo{max-width:200px;}
	.cloud .case-list li:first-child .logo{max-width:150px;}
    .cloud .flex-wr{flex-wrap:wrap; gap:20px;}
	.cloud .flex-wr .flex-box{width: 100%;} 
}