@charset "utf-8";
/* CSS Document */

/*sm*/
.woman_contents li img{
display: block;
width: 60%;
margin-left: 40%;
margin-bottom: -20px;
border-radius: 20px 0 0 0;
}

.woman_contents li p{
position: relative;
z-index: 2;
margin-right: 10%;
padding: 40px 20px 30px;
box-sizing: border-box;
border-radius: 0 0 20px 0;
background-color: rgba(255,100,0,0.2);
}

.woman_contents li .woman_text_noimage{
margin: 0 auto;
}

.woman_contents li .woman_text_image:after{
content: "";
display: inline-block;
position: absolute;
top: -100px;
left: 20px;
width: 100px;
height: 125px;
}

.woman_contents li:nth-of-type(1) .woman_text_image:after,
.woman_contents li:nth-of-type(3n+1) .woman_text_image:after{
background: url("../img/pic_woman01.svg")top left/cover no-repeat;
}

.woman_contents li:nth-of-type(2) .woman_text_image:after,
.woman_contents li:nth-of-type(3n+2) .woman_text_image:after{
background: url("../img/pic_woman02.svg")top left/cover no-repeat;
}

.woman_contents li:nth-of-type(3n) .woman_text_image:after{
background: url("../img/pic_woman03.svg")top left/cover no-repeat;
}

.woman_contents li:not(:last-child){
margin-bottom: 30px;
}


/*sm 360*/
@media screen and (min-width: 360px) {
.woman_contents li img{
display: block;
width: 65%;
margin-left: 35%;
}
}


/*sm 390*/
@media screen and (min-width: 390px) {
.woman_contents li p:after{
top: -130px;
width: 120px;
height: 150px;
}
}


/*md*/
@media screen and (min-width: 768px) {
.woman_contents li{
display: flex;
align-items: center;
flex-direction:row-reverse;
}

.woman_contents li:not(:last-child){
margin-bottom: 50px;
}

.woman_contents li img{
width: 50%;
margin-left: 0;
margin-bottom: 0;
border-radius: 30px 0 0 0;
}

.woman_contents li p{
padding: 30px 20px;
border-radius: 0 0 30px 0;
}

.woman_contents li .woman_text_image{
width: 55%;
margin-right: -5%;
}

.woman_contents li .woman_text_noimage{
width: 100%;
margin-right: 0;
}

.woman_contents li p:after{
top: -80px;
width: 80px;
height: 100px;
}
}