@charset "utf-8";
#pageTitle{background-image:url(../img/merit/page_title.jpg)}
#pageTitle h2:after{content:"MERIT"}
#meritList{list-style:none}
#meritList li{position:relative}
#meritList li figure.slide-right,#meritList li figure.slide-left{border-radius:50%;display:flex}
#meritList li h4::before,#meritList li h4::after{display:inline-block;content:""}
#meritList li h4{color:#209fd6;background:#e4f4fa;display:inline-block;line-height:1;position:relative}
#meritList li h4::before{background:url(../img/merit/ico_plane.svg) no-repeat center;position:relative}
#meritList li h4::after{width:0;height:0;border-style:solid;border-color:#e4f4fa transparent transparent transparent;position:absolute;left:50%}
#meritList li h4,#meritList li p{text-align:center}
#meritList li h4,#meritList li p strong{font-weight:700}
#meritList li p strong{background:-moz-linear-gradient(top, rgba(0,0,0,0) 0%, rgba(241,224,233,0) 44%, rgba(246,229,238,1) 45%);background:-webkit-linear-gradient(top, rgba(0,0,0,0) 0%,rgba(241,224,233,0) 44%,rgba(246,229,238,1) 45%);background:linear-gradient(to bottom, rgba(0,0,0,0) 0%,rgba(241,224,233,0) 44%,rgba(246,229,238,1) 45%);filter:progid:DXImageTransform.Microsoft.gradient( startColorstr='#00000000', endColorstr='#f6e5ee',GradientType=0 )}
#meritList li p:last-child{line-height:1.8em}
#meritList li figure img{height:auto}

@media screen and (min-width:961px){
#meritList{margin:0 auto 100px;width:1080px}
#meritList li{min-height:180px;margin:0 auto 60px}
#meritList li figure.slide-right,#meritList li figure.slide-left{border:2px solid #e4f4fa;width:180px;height:180px;position:absolute;top:0;text-align:center;justify-content:center;}
#meritList li h4{font-size:1.375rem;padding:5px 50px 20px;margin:0 auto 40px}
#meritList li h4::before{width:42px;height:42px;top:12px;margin:0 15px 0 0}
#meritList li h4::after{border-width: 14px 10px 0 10px;bottom:-14px;margin-left:-10px}
#meritList li p{font-size:0.937rem;margin:0 0 1.6em}
#meritList li p strong{font-size:1.125rem;padding:0 5px 1px}
#meritList li:nth-child(1){padding:0 0 0 220px}
#meritList li:nth-child(1) figure{float:left;margin-left:-220px}
#meritList li:nth-child(1) h4,#meritList li:nth-child(1) p{width:340px}
#meritList li:nth-child(2){padding:0 0 0 260px}
#meritList li:nth-child(2) figure{float:right}
#meritList li:nth-child(2) h4,#meritList li:nth-child(2) p{width:600px}
#meritList li:nth-child(3){padding:0}
#meritList li:nth-child(3) figure{float:right;margin-right:360px}
#meritList li:nth-child(3) h4,#meritList li:nth-child(3) p{width:500px}
#meritList li:nth-child(4){padding:0 0 0 460px}
#meritList li:nth-child(4) figure{float:left;margin-left:-220px}
#meritList li:nth-child(4) h4,#meritList li:nth-child(4) p{width:390px}
#meritList li:nth-child(5){padding:0 0 0 220px}
#meritList li:nth-child(5) figure{float:left;margin-left:-220px}
#meritList li:nth-child(5) h4{width:360px}
#meritList li:nth-child(5) p{width:380px;margin-left:-10px}
#meritList li:nth-child(6){padding:0 0 0 460px}
#meritList li:nth-child(6) figure{float:right;}
#meritList li:nth-child(6) h4{width:400px}
#meritList li:nth-child(6) p{width:480px;margin-left:-40px}
#meritList li:nth-child(7){padding:0}
#meritList li:nth-child(7) figure{float:right;margin-right:440px}
#meritList li:nth-child(7) h4,#meritList li:nth-child(7) p{width:420px}
}
/* IE11    */ _:lang(x)::-ms-backdrop, #meritList li figure img{width:110px;height:110px;margin-top:30px}
/* Edge    */ _:-ms-lang(x)::backdrop, #meritList li figure img{width:110px;height:110px;margin-top:30px}

/*
    SP 

**********************************************************/

@media screen and (max-width: 960px) {

#meritList li{min-height:80px;margin:0 auto 30px;text-align:center}
#meritList li figure.slide-right,#meritList li figure.slide-left{border:2px solid #e4f4fa;width:80px;height:80px;text-align:center;justify-content:center;display:block;margin:0 auto 10px}
#meritList li figure img{width:60px;margin:8px auto 0}
#meritList li h4{font-size:1.375rem;padding:5px 20px;margin:0 auto 20px;display:inline-block;line-height:1.6em}
#meritList li h4::before{width:21px;height:21px;background-size:cover;top:6px;margin:0 15px 0 0}
#meritList li h4::after{border-width:7px 5px 0 5px;bottom:-7px;margin-left:-5px}
#meritList li p{font-size:1.125em;margin:0 0 1.6em}
#meritList li p strong{font-size:1.25rem;padding:0 5px 1px}


@media screen and (max-width: 320px) {
}
}