@charset "UTF-8";

/*スマホ*/
h2{
font-size: 3.5vw;
color: #0068b6;
text-align: left;
margin: 15vw auto 2vw auto;
}
h2:nth-of-type(1){
margin: 10vw auto 2vw auto;
}

h2:before {
content:'● ';
color: #ffe000;
}

.ytWrap{
font-size: 0;
max-width: 1120px;
margin: 0 auto;
}
.ytWrap a{
display: inline-block;
background:#FFF;
border: solid 0.4vw #0068b6;
margin-bottom: 0.5vw;
padding: 0.4em 0;
text-align: center;
font-size: 3.6vw;
color: #0068b6;
text-decoration: none;
line-height: 1em;
box-sizing: border-box;
position: relative;
}
.ytWrap a span{
font-size: smaller;
}

#ytWrap1 a,
#ytWrap2 a{
width: 49.7%;
}
#ytWrap3 a{
width: 100%;
}
#ytWrap2 a:nth-of-type(1){
width: 100%;
margin-right: 0;
}
#ytWrap1 a:nth-of-type(2n+1),
#ytWrap2 a:nth-of-type(2n){
margin-right: 0.5vw;
}
.ytWrap .newC{
position: absolute;
width: 6vw;
top: 0.5vw;
left: -3vw;
}
.ytWrap a.ytNow{
background:#0068b6;
color: #FFF;
}
.yt{
width: 100%;
height: 50.625vw;
}

/*PC*/
@media screen and (min-width:835px){

h2{
font-size: 20px;
margin: 150px auto 20px auto;
}
h2:nth-of-type(1){
margin: 50px auto 20px auto;
}

.ytWrap a{
border: solid 2px #0068b6;
margin-bottom: 0.66%;
margin-right: 0.66%;
font-size: 22px;
}
.ytWrap .newC{
position: absolute;
width: 32px;
top:4px;
left:4px;
}
#ytWrap1 a{
width: 24.5%;
}
#ytWrap1 a:nth-of-type(2n+1){
margin-right: 0.66%;
}
#ytWrap2 a,
#ytWrap2 a:nth-of-type(1){
width: 32.87%;
}
#ytWrap3 a{
width: 100%;
}
#ytWrap1 a:nth-last-of-type(1),
#ytWrap3 a:nth-last-of-type(1){
margin-right: 0;
}

#ytWrap2 a:nth-of-type(1),
#ytWrap2 a:nth-of-type(2n){
margin-right: 0.66%;
}
#ytWrap2 a:nth-last-of-type(3n+1){
margin-right: 0;
}
.yt{
width: 100%;
height: 50.625vw;
}
}