@charset "UTF-8";
.processlist {position:relative;}
.processlist:before{content:"";width:10%;height:100%;background: linear-gradient(to top, #ff5050, #f0ff4b);position:absolute;left:45%;}
.processlist li{background:#efefef;padding: 0 6% 6% 6%;margin-bottom:5%;border-radius:10px;margin-bottom: 8vw;position:relative;}
.processlist li img{width:25%;margin:0 auto;position: relative;top: -4vw;}
.processlist li .tit{text-align:center;font-weight:bold;font-size:6vw;color:var(--red);margin: -2vw auto 1vw;}

.bnrbox a{margin-bottom:3vw}

/* ============================================= 
pc
================================================*/
@media screen and (min-width: 736px) { 
.processlist:before{width:4%;left:48%;}
.processlist p{text-align:center;}
.processlist li{padding: 0 30px 40px 30px;margin-bottom:60px}
.processlist li img{width:105px;top: -30px;}
.processlist li .tit{font-size:30px;margin: -26px auto 10px;}
.bnrbox{display: -webkit-box;display: -webkit-flex;display: flex;-webkit-flex-wrap: wrap;flex-wrap: wrap;-webkit-justify-content: center;justify-content: center;width:680px;margin:0 auto;}

}

@media screen and (min-width: 1200px) { 
}

/* retina用 ----------------------------------------------- */ 
@media screen and (min-width: 736px) and (-webkit-min-device-pixel-ratio: 2), screen and (min-width: 736px) and (min-resolution: 2dppx) { 

}
