@charset "UTF-8";
/* 共通 ===================*/
dl, dt, dd{
    font-size: 1.3rem;
    line-height: 2.5rem;
}

.shikaku_method{
    font-size: 1.3rem;
    line-height: 2.5rem;
}

.shikaku_method dt{
	font-weight: bold;
}

.shikaku_method dd{
	padding-bottom: 16px;
}

.shikaku_method dd::before {
	content: "ー";
 	margin-right: 0.3em;
}

.shikaku_method_no dd::before {
	content: none;
}

.shikaku_method_no dd.noline::before {
	content: none;
}

ul.circle > li a,
.shikaku_method dd a{
	color: #26a69a;
	border-bottom: solid 1px;
}

.shikaku_n{
	background: #fb547c;
    padding: 5px 10px;
    display: inline-block;
    margin-bottom: 16px;
    color: #ffffff;
    font-weight: bold;
    font-size: 1.6rem;
}

.shikaku_p{
	background: #54a7fb;
    padding: 5px 10px;
    display: inline-block;
    margin-bottom: 16px;
    color: #ffffff;
    font-weight: bold;
    font-size: 1.6rem;
}

.card{
    display: flex;
    flex-wrap: wrap;
    gap: 20px;
    list-style: none;
    padding: 0;
    margin: 0;
}

.card__title {
    padding: 30px 30px 10px 30px;
    height: 300px;
}

.card__item {
    width: calc(33.333% - 27px);
    list-style: none;
    background: #fff;
    overflow: hidden;
    display: flex;
    flex-direction: column;
    border: solid 1px #ccc;
}

.card__item a {
    display: block;
}

.card__img-area {
    width: 100%;
    aspect-ratio: 16 / 9;
    overflow: hidden;
}

.card__img-area img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    display: block;
}

.longer {
    position: relative;
    display: block;
    width: 100%;
    margin-bottom: 30px;
}

.btn.longer a, .btn.longer .under_line {
    width: 90%;
    margin: 0 auto;
}

table tbody tr:not(:first-child) th {
  background: #828282;
}

.text_img_set .img_area .mx604{
    width: 604px;
}

.index {
    background: #f9f9f9;
    border: 1px solid #aaa;
    padding: 10px;
    width: auto;
    display: table;
    margin: 80px auto;
}

.toc_title {
    text-align: center;
    font-weight: 700;
    margin: 0;
    padding: 0;
}

.index li {
    margin: 0;
    padding: 0;
    list-style: none;
}

.index a {
    padding: 5px 0;
    display: block;
}

.shikaku_method dd.no-before::before {
  content: none;
}

@media screen and (max-width: 768px) {
    .card__item {
        width: 100%;
        flex: initial;
    }

    a:hover img {
        opacity: 1;
    }

    .text_img_set .img_area .mx604{
        width: none;
    }

    table.noScroll tbody th{
        display: table-cell;
        width: 30% !important;
    }
}