.top-img {
    position: relative;
}
.top-img .img-text {
    color: #4ce59e;
    font-size: 28px;
    font-weight: bold;
    position: absolute;
    bottom:50px;
    left: 50%;
    transform: translateX(-50%);
    line-height: 120%;
}
.flx-ai--end{
align-items:flex-end;
}
.flx-ai--center{
align-items:center;
}
.tbl-r02 th {
    background: rgb(141, 137, 164);
    border: 1px solid rgb(63, 58, 96);
    color: rgb(255, 255, 255);
    padding: 10px;
}
.tbl-r02 td {
    border: 1px solid rgb(63, 58, 96);
    padding: 10px;
}
.dev {
    margin: 0px auto;
    height: 360px;
    width: 640px;
}
.ttl-List-flx li {
    cursor: pointer;
    padding-top: 1.3em !important;
    padding-bottom: 0.8em !important;
    border-bottom: 1px solid #ccc;
}
.ttl-List-flx li:hover {
    background-color: #F2F8FC !important;
}
.ttl-List-flx li a {
    color: #000;
    font-size: 18px;
    font-weight: bold;
}
.link-box{
width:300px;
margin-bottom:1em;
}
.link-box a{
display:block;
width:300px;
}
.link-box a span.title-head{
display:block;
background:#1A2792;
padding:10px;
color:#FFF;
height:40px;
}
.link-box a span.title-head span.title{
font-size:16px;
font-weight:bold;
}
.link-box a img{
width:300px;
height:170px;
object-fit: cover;
}
/*.link-box a span.title-head span.sub-title{
font-size:12px;
font-weight:normal;
}*/
.link-box a:hover{
color:#FFF!important;
}
.h-ttl05{
text-indent:0;
padding-left:0;
}
.obj-fit--cover{
object-fit:cover;
}
.dataTable01b td a,
.dataTable01b th a{
display:block;
}
.dataTable01b th a:hover{
color:#FFF!important;
}
@media screen and (max-width:767px) and (min-width:1px) {
.top-img .img-text {
font-size:16px;
bottom:10px;
left:20px;
transform:translateX(0);
width:80%;
letter-spacing:-0.6px;
}
.sp-flx-jc--center{
justify-content:center;
}
.link-box{
width:100%;
margin-bottom:1em;
}
.link-box a{
width:100%;
}
.link-box a span.title-head{
height:auto;
}

.link-box a img{
width:100%;
height:auto;
}
/* 丸みを持たせるための明示的なスタイル */
.bd-radius--25 {
    border-radius: 25px !important;
    -webkit-border-radius: 25px !important;
    -moz-border-radius: 25px !important;
    overflow: hidden;
}

/* 特にh3要素に対して確実に適用されるようにする */
h3.h-ttl10b2.bd-radius--25 {
    border-radius: 25px !important;
    -webkit-border-radius: 25px !important;
    -moz-border-radius: 25px !important;
    background-color: #0033CC;
    color: white;
    padding: 10px 20px;
    box-sizing: border-box;
}

/* bg-blueクラスのスタイル定義 */
.bg-blue {
    background-color: #0033CC;
}

/*---  製品資料ダウンロード  ---------------------------------*/
ul.dl_material li span.download-img {
    display: table-cell;
    vertical-align: middle;
    width:140px; 
    padding:10px 40px;
}
ul.dl_material li span.download-img img {
    width:60px!important;
}
ul.dl_material li span.download-text {
    display: table-cell;
    vertical-align: middle;
    height: 100%;
    width:calc(100% - 140px);
    font-weight:normal;
    font-size:90%!important;
}
.flx-ai--end{
align-items:flex-end;
}


/*---  製品資料ダウンロード  ---------------------------------*/
/* レスポンシブ対応 */
ul.dl_material li span.download-img {
    width:100px; 
    padding:10px 20px;
}
ul.dl_material li span.download-text {
    width:calc(100% - 100px);
}
.dl_material li.narrow {
  height: 100px; /* 例：適切な高さを指定 */
}

/* または、テキスト部分の高さを固定する場合 */
.dl_material li.narrow .download-text {
  height: 50px; /* 例：適切な高さを指定 */
  overflow: hidden; /* はみ出したテキストを非表示にする */
}
}
}
.flex-container {
display: flex;
flex-wrap: wrap;
justify-content: space-between;
}

.top-lineup {
width: 300px;
border-top: 5px solid #1A2792;
border-left:1px solid #ccc;
border-right:1px solid #ccc;
border-bottom:1px solid #ccc;
margin-bottom: 1em;
}

.top-lineup:hover {
border-top: 5px solid #1A2792;
border-left:1px solid #1A2792;
border-right:1px solid #1A2792;
border-bottom:1px solid #1A2792;
}

.top-lineup a {
display: block;
height: 100%;

color: #000 !important;
}

.top-lineup a:hover {
background: #1A2792 !important;
color: #FFF !important;
text-decoration: none !important;
}

.top-lineup a span.lineup-text1 {
display: block;
color: #000;
font-weight: bold; /* テキストを太字にする */
position: relative;
padding-bottom: 5px;
padding: 10px;
}

.top-lineup a:hover span.lineup-text1 {
color: #FFF !important;
}

.top-lineup a span.lineup-text1:after {
font-family: "Font Awesome 5 Free";
content: "\f105";
font-weight: 900 !important;
position: absolute;
top: 100%;
right: 0;
margin-top: -33px;
color: #666;

width: 20px;
height: 20px;

}

.top-lineup a:hover span.lineup-text1:after {
background: #1A2792 !important;
color: #FFF;
}
.top-lineup a img {
width: 298px;
height: 170px;
object-fit: cover;
}