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

.page-title{
	display: none;
}

.main-content-inner{
	padding: 0;
}

h2.mb10{
	display: none;
}

#yasashii-wrap{
	background: #fff;
	background: url(../../img/tri_line.jpg) repeat-x center bottom;
	padding: 0 0 2rem;
	color:#000;
}

#yasashii-wrap a:hover{
	-webkit-transform:translateY(5px);
	-ms-transform:translateY(5px);
	transform: translateY(5px);
	transition: 0.5s;
	opacity: 0.7;
}

#yasashii-wrap ul{
	padding: 0;
	margin: 0;
}

#yasashii-wrap ul li {
    list-style: none;
    text-indent: 0;
	/*padding-left: 0;*/
}

#yasashii-wrap ul li::before{
	content: none;
}

#yasashii-wrap ul.yasashii-btn2 {
  width: 700px;
  margin: 0 auto;
}
#yasashii-wrap img{
	max-width: 100%;
}

#yasashii-header{
	text-align: center;
	background: url(../../img/tri_line.jpg) repeat-x center top;
	padding: 5rem 2rem 2rem;
}

#yasashii-header .comment{
	border-bottom: 1px solid #a1c2ab;
	border-top: 1px solid #a1c2ab;
	background: url(../../img/image.png) no-repeat 8% center;
	background-size: auto 80%;
	padding: 1rem 0 1rem 20%;
	width: 640px;
	margin: 1.5rem auto 0;
}

#yasashii-header .comment h5{
	font-size:1.5rem;
	margin: 1rem 0;
}
.yasashii-icon{
	text-align: center;
	padding-bottom: 2rem;
}

.yasashii-icon img{
	margin-bottom: .5rem;
}

.yasashii-btn2{
	list-style: none;
}



html body #yasashii-wrap .yasashii-icon ul li{
	display: inline-block;
	width:48%;
	padding-left:0;
}

.yasashii-btn2 li img {
    width: 100%;
}


.yasashii-detail{
	text-align: center;
	background: url(../../img/tri_line.jpg) repeat-x center top;
	padding-top:2rem;
	margin: 0!important;
}

.yasashii-detail ul{
	list-style: none;
	display: -webkit-box;
    display: -ms-flexbox;
    display: -webkit-flex;
    display: flex;
    -ms-flex-wrap: wrap;
    -webkit-flex-wrap: wrap;
    flex-wrap: wrap;
    -webkit-justify-content: space-between;
    justify-content: space-between;
	width: 95%;
	margin-left: auto!important;
	margin-right: auto!important;
}

.yasashii-detail li{
    width: 45%;
    -webkit-border-radius: 20px;
    -moz-border-radius: 20px;
    border-radius: 20px;
    padding: 2rem;
    box-sizing: border-box;
    /* margin-bottom: 2rem; */
    margin: 2rem;
}



.yasashii-detail li img{
	margin-bottom: .5rem;
}

.yasashii-detail p{
	text-align: left;
}

.yellogreen{
	border: 3px solid #c4d700;
}

.green{
	border: 3px solid #3eb370;
}

.paple{
	border: 3px solid #a59aca;
}

.mama-pink{
	border: 3px solid #eb6ea5;
}
.momo{
	border: 3px solid #ec6d56;
}

.momo2{
	border: 3px solid #ec6d81;
}
.blue{
	border: 3px solid #00b9ef;
}

.yellow{
	border: 3px solid #f39800;
}

.dodome{
	border: 3px solid #d29083;
}

.navy{
	border: 3px solid #1f2c5e;
}

.orange{
	border: 3px solid #f08b61;
}

.mos-green{
	border: 3px solid #82c697;
}

html body #yasashii-wrap .yasashii-icon ul li::before{
	content:none;
}

html body #yasashii-wrap .yasashii-detail ul li::before{
	content:none;
}



@media screen and (max-width:768px) {
  #yasashii-wrap ul.yasashii-btn2 {
    width: 100%;
  }
	#yasashii-header .comment{
    background: url(../../img/image.png) no-repeat left center;
    background-size: 20%;
    padding: 1rem 0 1rem 23%;
    width: 100%;
  }

#yasashii-header .comment h5 {
    font-size: 1.2em;
    margin: .5rem 0;
}
  #yasashii-header .comment p{
    font-size:1em;
  }
    .yasashii-icon{
    width:95%;
      margin-left: auto;
      margin-right: auto;
  }
	.br-none{
		display: none;
	}
	
	.yasashii-detail ul li {
    width: 100%;
    max-width: 400px;
    margin: 1em auto;
    box-sizing: border-box;
}
	
}