section{min-height: 100%;}
h1{padding: 30px 0; color: var(--color4); font-size: 4vw;}
#list{display: block;}
.b-item{float: left; width: 100%; height: auto; background-color: var(--bg); border-radius: 14px; border: 8px solid var(--bg); margin-bottom: 20px;}
.b-item-cont-left{float: left; width: 50%;}
.b-item-cont-right{float: left; width: 50%; padding: 4px 20px;}
.b-item-img{float: left; width: 50%; background-position: center; background-repeat: no-repeat; background-size: cover; border-right: 1px solid transparent;}
.b-item-img:first-child{border-radius: 6px 0 0 6px;}
.b-item-img::after{content: ""; display: block; padding-bottom: 130%;}
.p-item-1{font-size: 3.3vw; color: var(--color4);}
.p-item-2{line-height: 1.4; font-size: 1.5vw;}
.a-item{background-color: var(--color3); color: var(--bg); padding: 6px 30px; border-radius: 20px; font-size: 1.5vw;}
/************************************************************/
/************************************************************/
@media only screen and (max-width: 767px){
h1{padding: 50px 0 20px 0; font-size: 9vw;}
.b-item{border: 5px solid var(--bg);}
.b-item-cont-left{width: 100%;}
.b-item-cont-right{width: 100%; padding: 4px 5px 10px 5px;}
.b-item-img:first-child{border-radius: 9px 0 0 9px;}
.b-item-img:last-child{border-radius: 0 9px 9px 0; border-right: none;}
.p-item-1{font-size: 7vw;}
.p-item-2{line-height: 1.3; font-size: 4vw;}
.a-item{padding: 6px 30px; border-radius: 20px; font-size: 5vw;}
}