@import url('https://fonts.googleapis.com/css?family=Sawarabi+Mincho&subset=japanese');


.show-pc { display: block; }
.show-sp { display: none; }

.banner-ourfeeling { display: block; margin-bottom: 15px;}
.banner-ourfeeling img { width: 100%; }

.content-ourfeeling { text-align: center;  }
.content-ourfeeling .title-brown { font-family: 'Sawarabi Mincho', sans-serif; font-size: 30px; font-weight: bold; color: #3b1705; display: inline-block; margin: 22px auto; background: url(../images/line-blue.png) center bottom repeat-x; padding-bottom: 4px;  }
.content-ourfeeling .text-brown { display: block; font-size: 20px; }

.box-message { margin: 30px auto; } 
.box-message li { display: block; margin: 22px auto; }
.box-message li .title-blue { background: #007ad7; padding: 12px; color: #fff; font-size: 22px;    font-weight: bold; }
.box-message li .title-blue span { border-bottom: 4px solid #bdd75d; display: inline-block; }
.box-message li .text-blue { padding: 8px; font-size: 18px; }

.content-cafe { border: 8px solid #7cd7d5; background: #eefafa; padding: 22px;  }
.content-cafe img { max-width: 100%; margin: auto; }
.content-cafe ul { display: table; margin: 22px auto;  width: 80%;  }
.content-cafe ul li { display: table-row; }
.content-cafe ul li div { display: table-cell; padding: 4px 12px ; text-align: left; vertical-align:middle; color: #262626; font-size: 16px; }
.content-cafe ul li div:first-child { width: 90px; text-align: right; }

.cafe { text-align: center; font-size: 20px; color: #262626; font-size: 18px;  }
.cafe img { max-width: 100%; display: block; margin: auto; }
.cafe img.logo { margin: 22px auto;}
.cafe .line-yellow { border-bottom: 4px solid #fff833; margin: 12px auto; display: inline-block; color: #3b1705; font-size: 28px;  }
.cafe .img-cafe { display: block; text-align: right; margin: 30px auto; }
.cafe .img-cafe img { margin-right: 0;}

@media(max-width:768px) {
    .show-pc { display: none; }
    .show-sp { display: block; }

    .content-ourfeeling .title-brown { font-size: 22px; }
    .content-ourfeeling .text-brown { font-size: 18px; }
    .box-message li .text-blue { font-size: 16px; }

    .content-cafe ul { width: 100%; }

    .cafe { font-size: 16px; }
    .cafe .line-yellow { font-size: 20px; }
}

@media(max-width:480px) {
    .content-cafe ul { display: block; }
    .content-cafe ul li { display: block; }
    .content-cafe ul li div { display: block; width: 100%; }
    .content-cafe ul li div:first-child { width: 100%; text-align: center; }
}