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

#custom_header {
  margin-top: 0px;
  margin-bottom: 20px;
}

.channel-area , .course-area , .custom_header_area {
  display:flex;
  flex-wrap: wrap;
  justify-content:space-between;
}

.custom_header_area {
  margin-left:30px;
}

.custom_header_area .banner_area {
  width:30%;
}

.custom_header_area .new_news_area {
  display: flex;
  width:70%;
}

.custom_header_area div .skyperfectv_btn {
  float:none;
  text-align:left;
}

.channel-area .top-box {
  width:22.5%;
}

.course-area .top-box {
  width:30%;
}

.top-box {
  display:flex;
  flex-direction:column;
  justify-content:space-between;
  border: solid 5px;
  text-align:center;
  margin:10px 0px;
  background-color:#fff;
}

.top-box.channel {
  border-color:#0b6f34;
}

.top-box.course {
  border-color:#ffba00;
}

.top-box .channel_img {
  margin-top: 10px;
}

.channel h3 {
  font: bold 100% "メイリオ",Meiryo,"ＭＳ Ｐゴシック","Hiragino Kaku Gothic Pro","ヒラギノ角ゴ Pro W3",sans-serif;
  font-size:16px;
  border:none;
  margin:0px;
  padding:5px !important;
  color:#fff;
  background-color:#0b6f34;
}

.race-info {
  padding:10px;
  list-style-type:none;
  margin:0px !important;
  /* text-align:left; */
}

.race-info li {
  padding-bottom: 5px;
}


.box-btn {
  border:solid 1px;
  border-radius:2rem;
  font-size:14px;
  text-align:center;
  margin:10px auto;
}

.box-btn.channel {
  border-color:#206b32;
  background-color:#206b32;
  max-width:200px;
  padding:10px 0px;
}

.box-btn.course {
  border-color:#bc8810;
  background-color:#bc8810;
  max-width:200px;
  padding:10px 0px;
  width:100%;
}

.box-btn.news{
  border-color:#aeaeaf;
  background-color:#aeaeaf;
  max-width:200px;
  padding:10px 0px;
  width:100%;
  margin: 0px 0px 0px auto;
}

.box-btn a , .box-btn a:visited , .box-btn a:hover {
  text-decoration:none !important;
  color:#fff;
  padding:10px 15px;
  font-weight:bold;
}

.new_news_area {
  display:flex;
  flex-direction:column;
}

.new_news_area ul {
  border:solid 1px #999;
  margin: 0px 0px 20px 0px;
  padding: 10px;
  list-style-type:none;
  font-size:14px;
  /* width:100%; */
}

.new_news_area .news_btn {
  float:none;
  margin:0px auto;
}

@media screen and (min-width:1200px) {
  #custom_header {
    width: 920px;
  }
  .custom_header_area {
    margin-left:0px;
  }
}

@media screen and (min-width:979px) {
  #custom_header .row {
    margin-left:-20px;
  }
  .custom_header_area div .skyperfectv_btn {
    padding-left:0px;
  }
}

@media screen and (min-width: 768px) and (max-width: 979px) {
  #custom_header .row {
    margin-left:0px;
  }
}

@media screen and (max-width:979px) {
  .channel-area .top-box {
    width:45%
  }
  .custom_header_area .banner_area , .custom_header_area .new_news_area {
    width:100%;
  }
  .custom_header_area {
    margin-left:0px;
  }
  .custom_header_area .banner_area {
    display:flex;
    flex-wrap:wrap;
  }
  .box-btn.channel {
    max-width:200px;
    width:100%;
  }
  .box-btn.course {
    max-width:180px;
  }
}

@media screen and (max-width:767px) {
  #custom_header {
    margin: 150px 15px 20px 15px;
  }
  .new_news_area ul {
    margin-left:0px;
  }
  .course-area .top-box {
    width:45%
  }
}

@media screen and (max-width:640px) {
  .channel-area .top-box {
    width:100%;
    margin:10px;
  }
}

@media screen and (max-width:480px) {
  .course-area .top-box {
    width:100%
    margin:10px;
  }
}