@charset "UTF-8";



.page_title {background: #facd89;padding: 60px 0;text-align: center;}
.page_title h1 {font-size: 30px;line-height: 1.6;
font-weight: 700;margin: 0 5%;}

@media screen and (max-width: 1060px) {
.page_title {background: #facd89;padding: 5% 0;text-align: center;}
.page_title h1 {font-size: 2vw;line-height: 1.6;
font-weight: 700;margin: 0 5%;}

}
@media screen and (max-width: 767px) {
.page_title {background: #facd89;padding: 5% 0;text-align: center;}
.page_title h1 {font-size: 4vw;line-height: 1.6;
font-weight: 700;margin: 0 5%;}

}


.topics_list_back {background: #fffde9;padding: 100px 0;}
.topics_list {width: 1060px;margin: auto; background: #ffffff;padding: 60px;}
.topics_list ul {width: 100%; border-top: 1px solid #cccccc;}
.topics_list ul li {
text-align: left;
width: 100%;
display:-webkit-box;
display:-moz-box;
display:-ms-flexbox;
display:-webkit-flex;
display:-moz-flex;
display:flex;
-webkit-box-lines:multiple;
-moz-box-lines:multiple;
-webkit-flex-wrap:wrap;
-moz-flex-wrap:wrap;
-ms-flex-wrap:wrap;
flex-wrap:wrap;
padding: 20px 0;
border-bottom: 1px solid #cccccc;
}
.topics_list ul li a {text-decoration: none;display: flex;color: #000;transition: .5s;width: 100%;}
.topics_list ul li a:hover {opacity: .4;}
.topics_list ul li .topics_list_title {width: 70%;margin-right: 5%;}
.topics_list ul li p.topics_day{font-size: 16px;line-height: 1.6;font-weight: 700;color: #facd89;margin: 0 0 10px;}
.topics_list ul li p.topics_title{font-size: 16px;line-height: 1.6;}
.topics_list ul li {}
.topics_list ul li {}
.topics_list ul li .topics_pic {width: 25%;position: relative;}
.topics_list ul li .topics_pic::before {
content: '';
display: block;
padding-top: 66.7%;
}
.topics_list ul li .topics_pic img {object-fit: cover;height: 100%;width: 100%;
position: absolute;
top: 50%;
left: 50%;
transform: translateY(-50%) translateX(-50%);
-webkit- transform: translateY(-50%) translateX(-50%);}
@media screen and (max-width: 1060px) {
.topics_list_back {background: #fffde9;padding: 5% 0;}
.topics_list {width: 80%;margin:0 auto 0; background: #ffffff;padding: 5%;}
.topics_list ul {width: 100%; border-top: 1px solid #cccccc;}
.topics_list ul li {
text-align: left;
width: 100%;
display:-webkit-box;
display:-moz-box;
display:-ms-flexbox;
display:-webkit-flex;
display:-moz-flex;
display:flex;
-webkit-box-lines:multiple;
-moz-box-lines:multiple;
-webkit-flex-wrap:wrap;
-moz-flex-wrap:wrap;
-ms-flex-wrap:wrap;
flex-wrap:wrap;
padding: 20px 0;
border-bottom: 1px solid #cccccc;
}
.topics_list ul li a {text-decoration: none;display: flex;color: #000;transition: .5s;width: 100%;}
.topics_list ul li a:hover {opacity: .4;}
.topics_list ul li .topics_list_title {width: 70%;margin-right: 5%;}
.topics_list ul li p.topics_day{font-size: 16px;line-height: 1.6;font-weight: 700;color: #facd89;margin: 0 0 10px;}
.topics_list ul li p.topics_title{font-size: 16px;line-height: 1.6;}
.topics_list ul li {}
.topics_list ul li {}
.topics_list ul li .topics_pic {width: 25%;position: relative;}
.topics_list ul li .topics_pic::before {
content: '';
display: block;
padding-top: 66.7%;
}
.topics_list ul li .topics_pic img {object-fit: cover;height: 100%;width: 100%;
position: absolute;
top: 50%;
left: 50%;
transform: translateY(-50%) translateX(-50%);
-webkit- transform: translateY(-50%) translateX(-50%);}

}
@media screen and (max-width: 767px) {
.topics_list_back {background: #fffde9;padding: 5% 0;}
.topics_list {width: 80%;margin:0 auto; background: #ffffff;padding: 5%;}
.topics_list ul {width: 100%; border-top: 1px solid #cccccc;}
.topics_list ul li {
text-align: left;
width: 100%;
display:-webkit-box;
display:-moz-box;
display:-ms-flexbox;
display:-webkit-flex;
display:-moz-flex;
display:flex;
-webkit-box-lines:multiple;
-moz-box-lines:multiple;
-webkit-flex-wrap:wrap;
-moz-flex-wrap:wrap;
-ms-flex-wrap:wrap;
flex-wrap:wrap;
padding: 20px 0;
border-bottom: 1px solid #cccccc;
}
.topics_list ul li a {text-decoration: none;display: block;color: #000;transition: .5s;width: 100%;}
.topics_list ul li a:hover {opacity: .4;}
.topics_list ul li .topics_list_title {width: 100%;margin-right: inherit;display: block;margin: 0 0 5%;}
.topics_list ul li p.topics_day{font-size: 3vw;line-height: 1.6;font-weight: 700;color: #facd89;margin: 0 0 10px;}
.topics_list ul li p.topics_title{font-size: 3vw;line-height: 1.6;}
.topics_list ul li {}
.topics_list ul li {}
.topics_list ul li .topics_pic {width:100%;position: relative;display: block;}
.topics_list ul li .topics_pic::before {
content: '';
display: block;
padding-top: 66.7%;
}
.topics_list ul li .topics_pic img {object-fit: cover;height: 100%;width: 100%;
position: absolute;
top: 50%;
left: 50%;
transform: translateY(-50%) translateX(-50%);
-webkit- transform: translateY(-50%) translateX(-50%);}

}




.topics_detail_back {background: #fffde9;padding: 100px 0;}
.topics_detail_back .topics_detail {width: 1060px;margin: auto; background: #ffffff;padding: 60px;}
.topics_detail_back .topics_detail ul {width: 100%;}
.topics_detail_back .topics_detail ul li {text-align: center;padding: 60px 0 0;}
.topics_detail_back .topics_detail ul li:first-child {border-bottom: 1px solid #cccccc;padding:0 0 20px;}
.topics_detail_back .topics_detail ul li .img {margin: 0 0 10px;}

.topics_detail_back .topics_detail ul li p.topics_day{font-size: 16px;line-height: 1.6;font-weight: 700;color: #facd89;}
.topics_detail_back .topics_detail ul li p {font-size: 16px;line-height: 1.6; text-align: left;}
.topics_detail_back .topics_detail ul li .topics_detail_pic {width: 600px;height: 400px;overflow: hidden;margin: 0 auto 30px;}
.topics_detail_back .topics_detail ul li .topics_detail_pic img {width: auto;height: 100%;}

.topics_detail_back .topics_detail ul li .topics_detail_movie {width: 600px;margin: 0 auto 30px;}
.topics_detail_back .topics_detail ul li .topics_detail_movie .movie{
  position: relative;
  width: 100%;
  padding-top: 56.25%;
}
.topics_detail_back .topics_detail ul li .topics_detail_movie iframe{
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
}

.topics_detail_back .topics_detail ul li .link {text-align: left}
.topics_detail_back .topics_detail ul li .link dl {width: 100%;}
.topics_detail_back .topics_detail ul li .link dl dt {font-size: 16px;line-height: 1.6;padding: 10px;background: #eeeeee;}
.topics_detail_back .topics_detail ul li .link dl dd {font-size: 16px;line-height: 1.6;padding: 10px;}
.topics_detail_back .topics_detail ul li .link dl dd a {text-decoration: underline;color: #000000;}

@media screen and (max-width: 1060px) {
.topics_detail_back {background: #fffde9;padding: 5% 0;}
.topics_detail_back .topics_detail {width: 80%;margin: auto; background: #ffffff;padding: 60px;}
.topics_detail_back .topics_detail ul {width: 100%;}
.topics_detail_back .topics_detail ul li {text-align: center;padding: 60px 0 0;}
.topics_detail_back .topics_detail ul li:first-child {border-bottom: 1px solid #cccccc;padding:0 0 20px;}
.topics_detail_back .topics_detail ul li p.topics_day{font-size: 16px;line-height: 1.6;font-weight: 700;color: #facd89;}
.topics_detail_back .topics_detail ul li p {font-size: 16px;line-height: 1.6; text-align: left;}
.topics_detail_back .topics_detail ul li .topics_detail_pic {width: 600px;height: 400px;overflow: hidden;margin: 0 auto 30px;}
.topics_detail_back .topics_detail ul li .topics_detail_pic img {width: auto;height: 100%;}

.topics_detail_back .topics_detail ul li .topics_detail_movie {width: 600px;margin: 0 auto 30px;}
.topics_detail_back .topics_detail ul li .topics_detail_movie .movie{
  position: relative;
  width: 100%;
  padding-top: 56.25%;
}
.topics_detail_back .topics_detail ul li .topics_detail_movie iframe{
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
}

.topics_detail_back .topics_detail ul li .link {text-align: left}
.topics_detail_back .topics_detail ul li .link dl {width: 100%;}
.topics_detail_back .topics_detail ul li .link dl dt {font-size: 16px;line-height: 1.6;padding: 10px;background: #eeeeee;}
.topics_detail_back .topics_detail ul li .link dl dd {font-size: 16px;line-height: 1.6;padding: 10px;}
.topics_detail_back .topics_detail ul li .link dl dd a {text-decoration: underline;color: #000000;}

}
@media screen and (max-width: 767px) {
.topics_detail_back {background: #fffde9;padding: 5% 0;}
.topics_detail_back .topics_detail {width: 80%;margin: auto; background: #ffffff;padding: 5%;}
.topics_detail_back .topics_detail ul {width: 100%;}
.topics_detail_back .topics_detail ul li {text-align: center;padding: 10% 0 0;}
.topics_detail_back .topics_detail ul li .img img {width: 100%;height: auto;}

.topics_detail_back .topics_detail ul li:first-child {border-bottom: 1px solid #cccccc;padding:0 0 20px;}
.topics_detail_back .topics_detail ul li p.topics_day{font-size: 3vw;line-height: 1.6;font-weight: 700;color: #facd89;}
.topics_detail_back .topics_detail ul li p {font-size: 3vw;line-height: 1.6; text-align: left;}
.topics_detail_back .topics_detail ul li .topics_detail_pic {width: 100%;height: auto;overflow: hidden;margin: 0 auto 5%;}
.topics_detail_back .topics_detail ul li .topics_detail_pic img {width: 100%;height: auto;}

.topics_detail_back .topics_detail ul li .topics_detail_movie {width: 100%;margin: 0 auto 5%;}
.topics_detail_back .topics_detail ul li .topics_detail_movie .movie{
  position: relative;
  width: 100%;
  padding-top: 56.25%;
}
.topics_detail_back .topics_detail ul li .topics_detail_movie iframe{
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
}

.topics_detail_back .topics_detail ul li .link {text-align: left}
.topics_detail_back .topics_detail ul li .link dl {width: 100%;}
.topics_detail_back .topics_detail ul li .link dl dt {font-size: 3vw;line-height: 1.6;padding: 10px;background: #eeeeee;}
.topics_detail_back .topics_detail ul li .link dl dd {font-size: 3vw;line-height: 1.6;padding: 10px;}
.topics_detail_back .topics_detail ul li .link dl dd a {text-decoration: underline;color: #000000;}

}





@media screen and (max-width: 1060px) {


}
@media screen and (max-width: 767px) {


}





@media screen and (max-width: 1060px) {


}
@media screen and (max-width: 767px) {


}





.pager {padding: 60px 0 0;text-align: center;}
.pager ul.pagination {width: inherit; text-align: center;display: inline-flex;border: none;}
.pager .pagination li {
font-weight: 700;
margin: 0 2px;
padding: 0;
display: inline-block;
background:#facd89;
width: 40px;
height: 40px;
text-align: center;
position: relative;
border: none;
}
.pager .pagination li:nth-child(2n) {margin: 0 2px;}
.pager .pagination li a{
font-size: 12px;
vertical-align: middle;
position: absolute;
top: 0;
left: 0;
width: 100%;
height: 100%;
text-align: center;
display:table;
color: #fff;
text-decoration: none;
-webkit-transition: all 0.3s ease;
-moz-transition: all 0.3s ease;
-o-transition: all 0.3s ease;
transition: all  0.3s ease;

}
.pager .pagination li a span{display:table-cell;vertical-align:middle;}
.pager .pagination li a:hover,
.pager .pagination li a.active{color: #facd89;background: #fff;border:1px solid #facd89;}
@media screen and (max-width: 1060px) {
.pager {padding: 5% 0 0;}
.pager .pagination {text-align: center;display: inline-flex;}
.pager .pagination li {
font-weight: 700;
margin: 0 2px;
padding: 0;
display: inline-block;
background:#facd89;
width: 40px;
height: 40px;
text-align: center;
position: relative;

}
.pager .pagination li:nth-child(2n) {margin: 0 2px;}
.pager .pagination li a{
font-size: 12px;
vertical-align: middle;
position: absolute;
top: 0;
left: 0;
width: 100%;
height: 100%;
text-align: center;
display:table;
color: #fff;
text-decoration: none;
-webkit-transition: all 0.3s ease;
-moz-transition: all 0.3s ease;
-o-transition: all 0.3s ease;
transition: all  0.3s ease;

}
.pager .pagination li a span{display:table-cell;vertical-align:middle;}
.pager .pagination li a:hover,
.pager .pagination li a.active{color: #facd89;background: #fff;border:1px solid #facd89;}
}
@media screen and (max-width: 767px) {
.pager {padding: 20px 0 0;}
.pager .pagination {text-align: center;display: inline-flex;}
.pager .pagination li {
font-weight: 700;
margin: 0 2px;
padding: 0;
display: inline-block;
background:#facd89;
width: 40px;
height: 60px;
text-align: center;
position: relative;

}
.pager .pagination li:nth-child(2n) {margin: 0 2px;}
.pager .pagination li a{
font-size: 12px;
vertical-align: middle;
position: absolute;
top: 0;
left: 0;
width: 100%;
height: 100%;
text-align: center;
display:table;
color: #fff;
text-decoration: none;
-webkit-transition: all 0.3s ease;
-moz-transition: all 0.3s ease;
-o-transition: all 0.3s ease;
transition: all  0.3s ease;

}
.pager .pagination li a span{display:table-cell;vertical-align:middle;}
.pager .pagination li a:hover,
.pager .pagination li a.active{color: #facd89;background: #fff;border:1px solid #facd89;}
}