.youtube{
  margin:5rem 0 8rem;
}





/*=======================================================
==========================================================
　　　　　　　　　　　　　PC start
==========================================================
========================================================*/
@media screen and (min-width:768px) {
.h1-box{
  background-color: #e8e6e7;
  padding:2em 0;
  width:100%;
}
h1{
  font-family: "myriad-pro", sans-serif;
  font-size:5rem;
  letter-spacing: .1em;
}
h1 span{
  font-family: 'Yu Mincho Light','YuMincho','Yu Mincho','游明朝体','ヒラギノ明朝 ProN','Hiragino Mincho ProN',sans-serif;
  margin-left: 1.5em;
  font-size:1.5rem;
  letter-spacing: .2em;
}
.topics-box{
  padding:70px 0 100px;
}
.topics-box li {
  display: flex;
  flex-direction: row;
  flex-wrap: nowrap;
  justify-content: flex-start;
  width: 100%;
  margin: 2em 0 0;
  border-bottom: 3px dotted #ddd;
  padding-bottom: 2em;
}
.topics-box li p:nth-child(1) {
  font-family: "myriad-pro", sans-serif;
  font-size: 3rem;
  line-height: 3rem;
  margin: 0;
  padding-right: 0.8em;
  position: relative;
  width: 16%;
  min-width: 190px;
}
.topics-box li p:nth-child(1)::after {
  position: absolute;
  top: 0;
  right: 0;
  background-color: #4c4c4c;
  width: 4px;
  height: 3rem;
  content: "";
}
.topics-box li p:nth-child(2) {
  font-size: 1.5rem;
  line-height: 3rem;
  padding: 0 0 0 2em;
  margin: 0;
}

/*個別記事ページ*/
.topics{
  width:100%;
  margin:50px 0 80px;
}
h2{
  font-size: 3rem;
  border-bottom: 3px dotted #ddd;
  padding-bottom: .3em;
  margin:0 0 30px;
  font-family: 'Yu Mincho Light','YuMincho','Yu Mincho','游明朝体','ヒラギノ明朝 ProN','Hiragino Mincho ProN',sans-serif;
}
.topics-img-50{
  width:50%;
  margin:0 auto 30px;
}
.topics-date{
  margin:0;
  font-size:1.4rem;
  color:#7f7f7f;
}
.topics-btn{
  width:fit-content;
  background-color: #757575;
  color: #fff;
  padding: 1em 4em;
  border-radius: 30px;
  font-size: 1.4rem;
  letter-spacing: .2em;
  font-weight: bold;
  display: block;
  text-align: center;
  margin:65px auto 0;
}



}/*=======================================================
==========================================================
　　　　　　　　　　　　　PC end
==========================================================
==========================================================
==========================================================
==========================================================
==========================================================
==========================================================
==========================================================
==========================================================
　　　　　　　　　　　　　SPstart
==========================================================
========================================================*/
@media screen and (max-width:768px) {

.h1-box{
  background-color: #e8e6e7;
  padding:2em 0;
  width:100%;
}
h1{
  font-family: "myriad-pro", sans-serif;
  font-size:4rem;
  letter-spacing: .1em;
}
h1 span{
  font-family: 'Yu Mincho Light','YuMincho','Yu Mincho','游明朝体','ヒラギノ明朝 ProN','Hiragino Mincho ProN',sans-serif;
  margin-left: 1.5em;
  font-size:1.5rem;
  letter-spacing: .2em;
}
.topics-box{
  padding:30px 0 50px;
}
.topics-box li {
  display: flex;
  flex-direction: column;
  justify-content: flex-start;
  width: 100%;
  margin: 2em 0 0;
  border-bottom: 3px dotted #ddd;
  padding-bottom: 2em;
}
.topics-box li p:nth-child(1) {
  font-family: "myriad-pro", sans-serif;
  font-size: 3rem;
  line-height: 3rem;
  margin: 0;
  padding-right: 0.8em;
  position: relative;
  width:fit-content;
}
.topics-box li p:nth-child(2) {
  font-size: 1.5rem;
  line-height: 3rem;
  padding: .5em 0 0;
  margin: 0;
}

/*個別記事ページ*/
.topics{
  width:100%;
  margin:30px 0 60px;
}
h2{
  font-size: 2rem;
  border-bottom: 3px dotted #ddd;
  padding-bottom: .3em;
  margin:0 0 30px;
  font-family:'Yu Mincho Light','YuMincho','Yu Mincho','游明朝体','ヒラギノ明朝 ProN','Hiragino Mincho ProN',sans-serif;
}
.topics-img-50{
  width:100%;
  margin:0 auto 30px;
}
.topics-date{
  margin:0;
  font-size:1.4rem;
}
.topics-btn{
  width:fit-content;
  background-color: #757575;
  color: #fff;
  padding: 1em 4em;
  border-radius: 30px;
  font-size: 1.4rem;
  letter-spacing: .2em;
  font-weight: bold;
  display: block;
  text-align: center;
  margin:40px auto 0;
}



}/*=======================================================
==========================================================
　　　　　　　　　　　　　SP end
==========================================================
==========================================================
==========================================================
==========================================================
==========================================================
==========================================================
==========================================================
==========================================================
  　　　　　　　　　　　　IPAD start
========================================================
========================================================*/
@media screen and (min-width:768px) and ( max-width:1190px) {

.topics-box li p:nth-child(1) {
  font-family: "myriad-pro", sans-serif;
  font-size: 3rem;
  line-height: 3rem;
  margin: 0;
  padding-right: 0.8em;
  position: relative;
  width: 14%;
  min-width: 165px;
}









}/*=======================================================
==========================================================
　　　　　　　　　　　　　IPAD SPend
==========================================================
==========================================================
==========================================================
==========================================================
==========================================================
==========================================================
==========================================================
==========================================================
　　　　　　　　　　　　　共通コード
==========================================================
========================================================*/



/*=======================================================
==========================================================
　　　　　　　　　　　　　共通end
==========================================================
========================================================*/