@charset "utf-8";

/* ************************************************ 
*	お知らせ
* ************************************************ */	
.news-block {
margin: 0 auto;
padding: 0 0 100px 0;
width: 1000px;
max-width: 90%;
}
.news-box {
margin: 0 auto 50px auto;
padding: 10px 0;
width: 100%;
position:relative;
z-index: 0;
background-color: #fff;
box-shadow: 0 0 5px #ccc;
border-radius: 10px;
}

.news-box-inner {
margin: 0;
padding: 40px 30px;
width: calc(100% - 60px);
background-color: #fff;
display: flex;
justify-content: space-between;
flex-wrap: wrap;
}

.news-box-inner h3.sub-title{
margin: 0 0 50px 0;
padding: 20px 0 20px 90px;
min-height: 60px;
width: 100%;
color: #333;
font-size: min(2.4vw,24px);
align-content: center;
text-align: left;
font-weight: 500;
position: relative;
border-top: 10px solid #c1db81;
border-bottom: 10px solid #c1db81;
}
.news-box-inner h3.sub-title::before{
position:absolute;
top: 50%;
left: 0;
transform: translateY(-50%);
content:"";
display:inline-block;
width:70px;
height:70px;
background:url("../images/icon_news.svg") no-repeat;
background-size:contain;
}

.news-box-inner p{
margin: 0;
padding: 0;
font-size: min(1.8vw,16px);
}


/* ************************************************ 
*   レスポンシブ
* ************************************************ */
/* PC 画面の横幅が960px以上 */
@media only screen and (min-width: 960px){

}


/* Tablet (Portrait) 画面の横幅が768px〜959pxまで */
@media only screen and (min-width: 768px) and (max-width: 959px) {
.news-block { padding: 0 0 50px 0; }
}


/* Mobile (Portrait) 画面の横幅が767pxまで */
@media only screen and (max-width: 767px) {
.news-block { padding: 30px 0; }
.news-box-inner {
width: calc(100% - 30px);
padding: 30px 15px;
}
.news-box-inner h3.sub-title{
margin: 0 0 30px 0;
padding: 15px 0 15px 50px;
min-height: 30px;
font-size: 4.5vw;
border-top: 5px solid #c1db81;
border-bottom: 5px solid #c1db81;
}
.news-box-inner h3.sub-title::before{
width:40px;
height:40px;
}
.news-box-inner p{
font-size: 4vw;
}
}