@charset "UTF-8";

/* 新着情報（一覧ページ）information
----------------------------*/
div.ttl_wrap {
	width: 100%;
    background-color: rgba(192,210,230,1.0);
}
#main_box {
	position: relative;
	margin: 0 auto;
    padding: 0 10px;
	max-width: 1280px;
	height: 186px;
	overflow: hidden;
    background-image: url("../img/bg_ttl.webp?2601221459");
    background-repeat: no-repeat;
    background-position: 90% top;
    -webkit-background-size: 530px;/*cover か contain*/
    background-size: 530px;
    /*background-color: rgba(255,255,255,.2);*/
}

#main_box img {
    display: block;
    margin: 0 0 0 10%;
    max-width: 337px;
}

/* ########### 800px以下 ########### */
@media (max-width: 800px) {
#main_box {
    background-position: 30vw top;
}
}
/* ########### 600px以下 ########### */
@media (max-width: 600px) {
#main_box img {
    margin: 0 auto;
}
}




/* 記事リスト　info_list
----------------------------------------------- */

#info_list {
    padding: 40px 20px 70px;
    min-height: 200px;
    /*background-color: rgba(201,228,123,.5);*/
}
#info_list .info_wrap {
	max-width: 870px;
	margin: 0 auto;
	
}
#info_list ul.info_box li {
	font-size: 16px;
    line-height: 1.5;
    font-family: "M PLUS 1p", sans-serif;
    font-weight: 400;
    font-style: normal;
	/*padding: 30px 50px;*/
    background-color: rgba(51,128,255,1);
	transition: all .3s;
}
#info_list ul.info_box li.sub_c1 {
    background-color: rgba(107,158,255,1);
}
#info_list ul.info_box li time {
	padding-right: 2rem;
}
@media (any-hover: hover) {
#info_list ul.info_box li:hover {
	background-color: #0042DB;
}
}
#info_list .info_box a {
	display: flex;
	color: #fff;
    padding: 30px 50px;
}

/* ########### 500px以下 ########### */
@media (max-width: 500px) {
#info_list {
    padding: 20px 20px 70px;
}
#info_list ul.info_box li {
	padding: 20px;
	font-size: calc(14px + 2 * (100vw - 320px)/500);/*500px〜320px間・16px〜14pxまで可変*/
}
#info_list .info_box a {
	display: block;
    padding: 0;
}
}