a {cursor: pointer;}

/*＝＝＝＝＝＝＝＝＝
    contents 
＝＝＝＝＝＝＝＝＝＝*/
.contents {margin-top: 10px;}
.contents th {
    background-color: #cfd5ea;
    border: 2px solid #ffffff;
}
.contents th {
    padding: 10px;
    width: 9em;
    position: relative;
    text-align: center;
}
.contents th p {text-align: center;}
/* イメージ画像 */
.contents th img {
    position: absolute;
    bottom: 10px;
    left: 50%;
    translate: -50%;
    width: 7em;
}

.contents td {
    display: flex;
    justify-content: flex-start;
    flex-wrap: wrap;
    border-bottom: 2px solid #cfd5ea;
}
.contents tr:last-child td {
    border-bottom: none;
}

/*＝＝＝＝＝＝＝＝＝
    タイル 
＝＝＝＝＝＝＝＝＝＝*/
.tile {
    border: 3px solid #e6e5e7;
    border-radius: 5px;
    width: 295px;
    margin: 8px;
    height: fit-content;
}

.title-area {
    padding: 5px;
    background-color: #fffaeb;
    border-bottom: 3px solid #e6e5e7;
    height: 97px;
}
.title-area p {margin-bottom: 5px;}

/*----------------
    タグ 
----------------*/
.tag-area {display: flex;}
[class$="-tag"] {
    display: flex;
    justify-content: center;
    align-items: center;
    background: #ffffff;
    color: #555;
    border: solid 2px #a5a5a5;
    font-weight: 700;
    font-size: .7rem;
    line-height: 1.0rem;
    padding: 3px 10px;
    border-radius: 0.2rem;
    margin-left: 0.4em;
    width: fit-content;
}

/* 動画 */
.movie-tag {color: #b3424a;}
.movie-tag::before {
    content: "";
    background-image: url(../img/digitalmaterials/icon_movie.svg);
    background-repeat: no-repeat;
    background-size: 13px;
    object-fit: contain;
    width: 20px;
    height: 13px;
}
/* インタラクティブ */
.interactive-tag {color: #789710;}
.interactive-tag::before {
    content: "";
    background-image: url(../img/digitalmaterials/icon_interactive.svg);
    background-repeat: no-repeat;
    background-size: 13px;
    object-fit: contain;
    width: 20px;
    height: 13px;
}
/* クイズ */
.quiz-tag {color: #35357d;}
.quiz-tag::before {
    content: "";
    background-image: url(../img/digitalmaterials/icon_quiz.svg);
    background-repeat: no-repeat;
    background-size: 13px;
    object-fit: contain;
    width: 20px;
    height: 13px;
}

/*----------------
    ボタン 
----------------*/
.btn-area {display: flex;}
.btn-area>* {
    width: 145px;
    height: 40px;
    display: flex;
    justify-content: center;
    align-items: center;
    font-weight: bold;
}
/* 説明ボタン */
.explanation-btn {
    background-color: #afabab;
    border: none;
    border-right: 3px solid #e6e5e7;
    border-radius: 0 0 0 3px;
    color: #ffffff;
}
.explanation-btn::before {
    content: "";
    background-image: url(../img/digitalmaterials/icon_book.svg);
    background-repeat: no-repeat;
    background-size: contain;
    object-fit: contain;
    width: 25px;
    height: 20px;
}
.explanation-btn:hover {
    opacity: .8;
}
/* 開始ボタン */
[class^="start-btn_"] {
    color: #ffffff;
    border: none;
    border-radius: 0 0 3px 0;
}
.start-btn_kou {background-color: #f6ab00;}
.start-btn_chu {background-color: #37a582;}
.start-btn_sho {background-color: #35b2c4;}
.start-btn_zen {background-color: #b3424a;}
[class^="start-btn_"]::before {
    content: "";
    background-image: url(../img/digitalmaterials/icon_start.svg);
    background-repeat: no-repeat;
    background-size: contain;
    object-fit: contain;
    width: 25px;
    height: 27px;
}
[class^="start-btn_"]:hover {
    opacity: .8;
}

/* ルビ */
rt {zoom: .7;}

/*----------------
    テーブル（教材番号について）
----------------*/
.guide h3 {
    padding: .1em 2.6em .1em 1em;
    width: fit-content;
    color: #181818;
    background-color: #cfd5ea;
}
.guide table {
    margin: auto;
    margin-top: .5em;
    font-size: larger;
}
.guide th {color: #fff;}
.guide th span {font-size: small;}
.guide th, .guide td {
    padding: .5em;
    text-align: center;
    border: 1px solid #fff;
}
.t-head {
    display: flex;
    gap: 1em;
    background-color: #cfd5ea;
    background-image: url('data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHN0eWxlPSJ3aWR0aDoxMDAlO2hlaWdodDoxMDAlOyI+PGxpbmUgeDE9IjAlIiB5MT0iMCUiIHgyPSIxMDAlIiB5Mj0iMTAwJSIgc3R5bGU9InN0cm9rZTogI2ZmZmZmZjtzdHJva2Utd2lkdGg6IDE7Ij48L2xpbmU+PC9zdmc+');
}
.t-head>p {flex: 1;}
.guide tr>th:first-child {
    color: #181818;
    text-align: left;
    padding-left: 1em;
}
.guide tr:nth-child(even){background-color: #e5e5e5;}
.guide tr:nth-child(3){background-color: #cfd5ea;}


.flex {
	display: flex;
}
.flex .digital_leaflet {
	text-align: center;
	margin-right: 10%;
}
.flex .digital_leaflet img {
	height: 250px;
	width: auto;
	margin: auto;
	border: solid 1px #ccc;
}
@media screen and (max-width: 960px) {
.flex {
	display: block;
}
.flex .digital_leaflet {
	margin-top: 15px;
	margin-bottom: 15px;
	width: 100%;
}
.flex .digital_leaflet img {
	width: 100%;
	height: auto;
}
}