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

@import url("https://use.fontawesome.com/releases/v5.6.1/css/all.css");

.chartBox{max-width:960px; margin: auto; padding: 50px 20px 20px;}
.chartBox .tit{margin-bottom: 40px; text-align: center;}
.chartBox .titQ{text-align: center; background-color: #6c513c; border-radius: 5px; color: #fff; font-size: 24px; padding: 10px; margin:0 auto 30px;width: 95%;}

.chartBox ul.answer{text-align: center; width: 90%; margin: auto}
.chartBox ul.answer li{margin-bottom: 20px; text-align: center;}
.chartBox ul.answer li a{display: block;padding: 15px; font-size: 24px; border-radius: 15px; transition: 0.5s; font-size: 18px;}
.chartBox ul.answer li a:hover{opacity: 0.7}
.chartBox ul.answer li:nth-child(1) a{background-color: #f6c4c4;}
.chartBox ul.answer li:nth-child(2) a{background-color: #d2f0f0;}


.beansBox{max-width:960px; margin: auto; padding: 50px 20px 20px;}
.beansBox .tit{margin-bottom: 40px; text-align: center;}
.beansBox .titOsusume{text-align: center; background-color: #6c513c; border-radius: 5px; color: #fff; font-size: 24px; padding: 10px; margin:0 auto 30px;width: 95%;}
.beansBox ul.btnBeans{display: flex; flex-wrap: wrap; justify-content: space-between; max-width: 800px; margin: auto}
.beansBox ul.btnBeans li{margin-bottom: 30px;}
.beansBox ul.btnBeans a{transition:0.5s}
.beansBox ul.btnBeans a:hover{opacity: 0.7}
.hBack{text-align: center; font-size: 12px;}
.hBack i{margin-right: 5px;}
.hBack a{transition: 0.5s;}
.hBack a:hover{opacity: .7}