@charset 'UTF-8';

/*===========================================
mv
===========================================*/
.mv{
margin-top: 6%;
}
.mv .txt{
margin-top: 2em;
}
.mv .link{
margin-top: 2em;
}

@media screen and (max-width:767px){
.mv .img{
display: none;
}
.mv .link{
margin-top: 3em;
}
}

/*===========================================
tab
===========================================*/
.mod_tab.top{
margin-top: 6%;
}
.mod_tab.under{
margin-top: 6%;
}

/*===========================================
btnBlock
===========================================*/
.btnBlock{
max-width: 740px;
margin: 6% auto 0 auto;
}

.btnBlock .mod_btn_01_red a{
opacity: 0.6;
}
.btnBlock.top .mod_btn_01_red a:after{
transform: rotate(135deg);
}
.btnBlock.under .mod_btn_01_red a:after{
transform: rotate(-45deg);
}


/*===========================================
knowledgeContents
===========================================*/
.knowledgeContents{
margin-top: 6%;
}
.knowledgeContents .img{
margin-top: 4%;
}
.knowledgeContents .img img{
width: auto;
max-width: 100%;
margin: auto;
}
.knowledgeContents .table{
margin-top: 6%;
}
.knowledgeContents .table th{
padding: 1em 1.5em;
white-space: nowrap;
text-align: center;
vertical-align: middle;
font-weight: bold;
}
.knowledgeContents .table td{
background: transparent;
}
.knowledgeContents .table .img{
position: relative;
padding: 10px;
}
.knowledgeContents .table .img:after{
content: '';
display: block;
position: absolute;
width: 0;
height: 100%;
top: 0;
bottom: 0;
left: 0;
border-left: 1px solid transparent;
}
.knowledgeContents .table .img img{
max-width: none;
}

@media screen and (max-width:767px){
.knowledgeContents .txt p {
  text-align: left;
}
.knowledgeContents .table tr{
display: flex;
flex-wrap: wrap;
}
.knowledgeContents .table th,
.knowledgeContents .table .img{
flex-basis: 50%;
margin: 0;
padding: 0.5em 0;
}
.knowledgeContents .table th{
display: flex;
align-items: center;
justify-content: center;
}
.knowledgeContents .table .img:after{
border-color: #ccc;
}
.knowledgeContents .table td{
flex-basis: 100%;
}
}