@charset "utf-8";
/* CSS Document */

.switching-eco {
	margin-bottom: 0;
}
.switching-more{
	position: relative;
	background-color: #f8fcff;
	width: 100%;
	margin-bottom: -20rem;
	padding: 5rem;
	box-shadow: 0.5rem 1rem 1.5rem rgba(0, 0, 0, 0.06);
}
.switching-more::before{
    width:434px;
    height:2px;
    content: "";
	position: absolute;
    top:-1px;
    left:0;
    right:0;
    bottom:auto;
    margin: auto;
    background: #F1C524;
}
.switching-more .service-head strong{
    color:#F0C423;
}
.switching-more .flexBox{
	display: flex;
    justify-content: center;
    align-items: center;
    gap:2.5rem;
}
.switching-plan .planArea h3{
    font-size:2.0rem;
	color: #fff;
	background: #F1C524;
	padding: 10px;
	cursor: pointer;
    margin: 0 0 15px 0;
}
.switching-plan .planArea .table {
	display:none;
}
.switching-plan .planArea .table  table {
	border-collapse: collapse;
	width: 100%;
	table-layout: fixed;
	border: #E5E5E5 solid 1px;
    margin-bottom: 2.0rem;
}
.switching-plan .planArea .table table .center{
	text-align: center
}
.switching-plan .planArea .table table th,
.switching-plan .planArea .table table td {
	padding: 15px 20px;
    text-align: left;
    vertical-align: middle;
	word-wrap:break-word;
	border: #E5E5E5 solid 1px;
}
.switching-plan .planArea .table table th {
	font-weight: bold;
    background: #F1F1F1;
	width: auto;
}
.switching-plan .planArea .table table th.bg {
    background: #FFFAE0;
}
.switching-plan .planArea .table table th.white {
    background: #ffff;
    color: #000;
}
.switching-plan .planArea .table table thead th {
	color: #fff;
    background: #F1C524;
	text-align: center;
}
@media (max-width: 768px) {
    .switching-more{        
        padding: 2rem 2rem 3rem 2rem;
        margin-bottom: -6rem;
    }  
    .switching-more::before{
        width:60%;
        height:2px;
    }
    .switching-more .flexBox{
        flex-direction: column;
        gap:1.5rem;
    }
    .switching-more .flexBox p:first-child{
        width:30vw;
    }
    .switching-plan .planArea h3{
        font-size:1.6rem;
    }
    .switching-plan .planArea .table table th,
    .switching-plan .planArea .table table td {
        padding: 10px 15px;
    }
}

/*--------------------------------------
    clause
--------------------------------------*/

.clause .box{
    margin-bottom: 6.0rem;
}
.clause h2{
    font-size:2.6rem;
    font-weight: 900;
    line-height: 1.4;
    padding-left: 1.7rem;
    border-left:7px solid #F1C524;
    margin-bottom: 3.0rem;
}
.clause h3{
    font-size: 2.0rem;
    font-weight: 900;
    margin-bottom: 2.0rem;
}
.clause ul{
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap:2.0rem 4.0rem;
}
.clause ul li{
    width:100%;
    height:50px;
}
.clause ul li a{
    display: flex;
    justify-content: flex-start;
    align-items: center;
    width:100%;
    height:100%;
    box-sizing: border-box;
    padding-left: 1.5rem;
    background: #F1C524;
    color:#FFFFFF;
    transition: 0.3s;
    font-size:1.8rem;
    border:1px solid #F1C524;
}
.clause ul li a:hover{
    background:#FFFFFF;
    color:#F1C524;
    opacity: 1;
}
@media (max-width: 768px) {
    .clause .box{
        margin-bottom: 4.0rem;
    }
    .clause h2{
        font-size:2.4rem;
        padding-left: 1.8rem;
        margin-bottom: 2.5rem;
    }
    .clause h3{
        font-size: 1.6rem;
        margin-bottom: 1.5rem;
    }
    .clause ul{
        display: grid;
        grid-template-columns: 1fr;
        gap:1.5rem;
    }
    .clause ul li{
        height:auto;
    }
    .clause ul li a{
        height:auto;
        padding: 1.5rem 1.0rem;
        font-size:1.4rem;
    }
}

.inhome .diagnosis-about{
    margin-bottom: 100px;
}  
@media (max-width: 768px) {
    .inhome .diagnosis-about{        
        margin-bottom: 0px;
    }  
}