@media screen and (min-width: 768px) {
    .understand_button { padding: 30px 0; text-align: center;background: #e5e5e5;margin: 60px auto; width: 686px; }
    .understand_button p { font-size: 24px; font-weight: bold; margin-bottom: 20px; }
    .understand_button ul { display: flex; justify-content: center; align-items: center; }
    .understand_button ul li { width: 40%; border: 1px solid #333; max-width: 320px; }
    .understand_button ul li:first-child { margin-right: 20px; }
    .understand_button ul li a { display: block; height: 60px; line-height: 60px; font-size: 16px; color:#333; background: #fff; }
    .understand_button ul li a:hover { opacity:.7; }
    .understand_button ul li a.on { background: #c7c7c7; font-weight: bold; }
}

@media screen and (max-width: 1199px) and (min-width: 768px) {

}

@media screen and (max-width: 980px) and (min-width: 768px) {

}

@media screen and (max-width: 767px) and (min-width: 0px) {
    .understand_button { padding: 8% 5%; margin-top: 10%; margin-bottom: 10%; text-align: center; background: #e5e5e5; }
    .understand_button p { font-size: 5vw; font-weight: bold; margin-bottom: 3%; }
    .understand_button ul { display: flex; justify-content:space-between; align-items: center; padding: 0;}
    .understand_button ul li { width: 48%; border: 1px solid #333; }
    .understand_button ul li a { display: block; height: 12vw; line-height: 12vw; font-size: 3.4vw; color:#333; background: #fff; }
    .understand_button ul li a.on { background: #c7c7c7;  font-weight: bold; }

}

.view-sp { display: none; }
.view-pc { display: block; }

@media screen and (min-width: 0px) and (max-width: 767px) {
	.view-sp { display: block; }
	.view-pc { display: none; }
}