ul.course_list{display:flex;flex-wrap:wrap;}
ul.course_list li{width:calc(100%/5 - 22px);margin:10px;border:1px solid #002664;}
ul.course_list li a{display:block;background:white;text-align:center;height:auto;padding:10px;color:#002664;line-height:1.45em;}
ul.course_list li a:hover{background:#ee821f;}
ul.course_list li a span{font-size:12px;margin-left:5px;line-height:1em;}
h1{margin:200px 0;}
ul.course{display:flex;flex-wrap:wrap;}
ul.course li{width:calc(100%/2 - 20px);margin:10px;font-size:15px;line-height:1.6em;}
ul.course li p{margin:0px;}
ul.course img{width:100%;height:auto;}
ul.course iframe{width:100%;height:350px;}
ul.course h4{border-bottom:1px solid #ee821f;text-align:left;font-size:18px;color:black;margin:20px 0 5px;}

.course_end{margin:20px 10px 200px;border-top:1px solid #aaa;}
.course_end h4{float:left;margin:5px 50px 0px 0;}
.course_end h4 span{font-size:15px;font-weight:normal;}

@media all and (min-width: 0px) and (max-width: 767px) {
ul.course_list li{width:calc(100%/3 - 6px);margin:2px;font-size:12px;}
ul.course_list li a span{display:none;}
h1{margin:50px 0;}
ul.course li{width:100%;margin:10px 0;font-size:14px;line-height:1.5em;}
ul.course iframe{width:100%;height:250px;}
.course_end{margin:20px 0px 100px;padding-top:10px;}
.course_end h4{float:none;margin:0px 0px 0px 0;text-align:left;}
a.btn ~ h1{margin-top:150px;}
}