/**/@charset "UTF-8";
/* CSS Document */
body{
	background: #000 url("../images/bg_yellow.jpg") repeat 0 0;
    font-family:"游ゴシック Medium",YuGothic,YuGothicM,"Hiragino Kaku Gothic ProN","Hiragino Kaku Gothic Pro",メイリオ,Meiryo,sans-serif;
    height:auto;
}

a{
    display:inline-block;
}

#media-page{
    padding:60px 0;
}

#media-head{
    max-width:1024px;
    margin:0 auto;
	padding:0 30px;
	text-align: center;
	line-height: 1.6;
    /*box-sizing: border-box;*/
}

#media-head h1{
    max-width:600px;
    width:60%;
    margin:0 auto;
}
#media-head h2{
    font-size: 200%;
    font-weight: bold;
    letter-spacing: 0.1em;
    text-shadow: #fff380 1px 1px 0px;
    margin-top:30px;
}
#media-head p.caution{
    font-size: 86%;
    text-align: left;
    margin-top:30px;
}

#media-navigation{
    margin-top:30px;
}

#media-navigation ul{
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: stretch;
    -ms-flex-align: stretch;
    align-items: stretch;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    -webkit-flex-wrap: nowrap;
    flex-wrap: nowrap;
    align-self: stretch;
    align-items: center;
    justify-content: center;
}

#media-navigation ul li{
   /* display:flex;*/
    width:16.6666%;
    padding: 0.5em 0.2em;
    font-size:14px;
    border-right: 1px solid #000;
    font-weight: bold;
    transition: all 0.3s;
    line-height: 1.4;
}


#media-navigation ul li span.pc{
    display:inline-block;
}


#media-navigation ul li:last-child{
    border-right: none;
}

#media-navigation ul li a{
   text-decoration: none;
   color:#000;
    transition: all 0.3s;
    display: block;
}

#media-navigation ul li:hover{
   background:#000;
}

#media-navigation ul li:hover a{
   color:#edd700;
}

#media-description a{
	color:#fff;
}

#media-description a:hover{
	text-decoration: none;
}


section {
	max-width:1024px;
	padding:60px 30px 0 30px;
	margin:0 auto;
}

section.current {
	display:block;
}

section h3{
	position:relative;
}

section .caution{
    margin-bottom:20px;
    font-size:10px;
}

.media-category h3{
    font-weight: bold;
    padding: 15px;
    color: #edd700;
    font-size: 20px;
    background: #000;
    text-decoration: none;
    /* border: 1px solid #fff; */
    transition: all 0.3s ease-out;
    text-align: left;
    display:block;
}

/*.media-category h3 a:before{
content: "";
position: absolute;
top: 0;
right: 15px;
height: 100%;
width: 20px;
background:url(../images/media/ico_plus@2x.png) no-repeat 50% 50%;
background-size:20px;
}

section.open h3 a:before{
background:url(../images/media/ico_minus@2x.png) no-repeat 50% 50%;
background-size:20px 2px;
}*/


/*section h3 a:hover{
background:rgba(255,255,255,0.8);
}
*/
.list-change{
	text-align: center;
	margin-bottom:20px;
}

.list-change a{
	display:inline-block;
	padding:1% 5%;
	color:#fff;
	text-decoration: none;
	border:1px solid #fff;
	transition:all 0.3s;
	border-radius: 4px;
}


.list-change a:hover{
	color:#000;
	background:#fff;
}


#media-list-lv h3,
#media-list-jp h3{
	color:#fff;
	font-size:20px;
	font-weight:bold;
	margin:40px auto 0 auto;
	text-align: center;
	line-height: 1.4;
}

#media-list-jp,
#media-list .media-category-table{
	/*display:none;*/
}


section table{
width:100%;
box-sizing: border-box;
border-collapse: collapse;
border-spacing: 0;
border:none;
}

section table th{
text-align: center;
font-weight: bold;
padding:20px 15px;
color:#000;
border:none;
border-bottom:1px solid #000;
font-size:16px;
line-height: 1.4;
}

section table td{
padding:20px 15px;
color:#000;
border:none;
font-size:14px;
line-height:1.4;
text-align: center;
}

section table td a{
color:#000;
}

section table td a:hover{
text-decoration: none;
}

section table tr:nth-child(even) td{
background:rgba(206, 187, 6, 0.5);
}

#official-banner{
    padding:30px;
    text-align: center;
}

#official-banner a{
    display: inline-block;
}


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

#media-page{
    padding:40px 0;
}

#media-description{
	padding:0 15px 15px 15px;
	font-size:12px;
	text-align: left;
}

#media-head h2 {
    font-size: 150%;
}
#media-head {
    padding: 0 15px;
}

#media-head p.caution {
    font-size: 12px;
}


#media-navigation ul li{
    font-size:12px;
}


#media-navigation ul li span.pc{
    display:none;
}



section {
	max-width:inherit;
	max-width:auto;
	padding: 30px 15px 0 15px;
}

section h3 a{
font-size:16px;
}

section table th{
padding:10px 5px;
font-size:10px;
}

section table td{
padding:10px 5px;
font-size:10px;
}

}

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

#media-navigation ul li{
    font-size:10px;
}

}