@charset "UTF-8";
/* sp用
===============================================================*/
#burger{display: none;}
#gnav ul.burger-only{display: none;}
#wrapper{
	overflow: hidden;
}
img{
	height: auto;
	max-width: 100%;
}
@media (max-width: 1220px) {
	#gnav a br{
		display: inline;
	}
	#h-slist ul{flex-wrap: wrap;}
}
@media (max-width: 1000px){
	header.open #h-siteid{justify-content: flex-start;}
	header.open #h-siteid{width: 200px;}
	header.open #h-snav{width: calc(100% - 200px)}
	#burger-sub{display: block;}
	#burger-sub ul{
		display: flex;
		flex-wrap: wrap;
		font-size: 1.2rem;
	}
	#burger-sub i.gray{opacity: .8;}
	#burger-sub li{width: 100%;}
	#burger-sub a{display: block; text-align: center;}
	#gnav li{
		width: auto;
		margin: 0 .5vw;
	}
	#gnav .mainmenu > li > a{
		padding: 5px;
		font-size: 1.4vw;
	}
}
@media (max-width: 800px) {
	#h-slist li{font-size: 1.3vw;}
	#gnav li{margin: 0;}
	#gnav .dropdown-list{width: 100%; padding: 2rem; left: 0;}
	#gnav .dropdown-item{width: 100%; padding: 2rem 0; border-right: 0 !important; border-bottom: 1px solid #3f3e3d;}
	#gnav .dropdown-item ul{max-width: 95vw;}
	#gnav .dropdown-item li{width: 50%;}
	#gnav .dropdown-item.movie, #gnav .dropdown-item.movie div, #gnav .dropdown-item.movie .w-100 li{
		width: 100%;
	}
	#content, #sidebar{width: 100%;}
	#content{margin-right: 0; margin-bottom: 2rem; padding-bottom: 2rem; border-bottom: 1px solid #ccc;}
	#sidebar {text-align: center;}
	#sidebar .ranking{text-align: left;}
	#f-submenu ul{flex-wrap: wrap; justify-content: flex-start;}
	#f-submenu li{width: 100%; margin: .5rem 1rem;}
	#f-submenu li:not(:last-child)::after{display: none;}
	#f-submenu li::before{content: "■"; margin-right: .4em; color: #fff;}
	#f-sitemap{padding: 2rem 0 12rem;}
	#f-sitemap .wrap{display: none;}
	#copyright{padding: 0;}
	#topicpath{padding: 10px 0 0;}
	#topicpath ul{display: block;}
	#topicpath li{display: inline; line-height: 1;}
	.archive-list{justify-content: flex-start; margin-bottom: 0;}
	.archive-block{margin-bottom: 0;}
	.archive-block + .archive-block{margin-top: 2rem;}
	#sidebar h3{text-align: left;}
	#container{padding-bottom: 0;}
	#news-recently li strong{text-align: left;}
	.news-special{
        display: flex;
        margin-bottom: 1rem;
        flex-wrap: nowrap
    }
    .news-special h2{width: 30%; min-width: 80px;}
	.news-special ul{padding: 1rem; width: 100%}
	.news-special li i {font-size: 1rem; margin-bottom: 5px; text-align: left;}
    .news-special li, .news-special li i{display: block; width: 100%; text-align: left;}
}
@media (max-width: 680px) {
	header.open #h-mailmag a{font-size: 0;}
	#h-mailmag img{margin-right: 0;}
}
@media (max-width: 600px) {
	header, header.open, header.open #h-siteid, #h-siteid{height: 50px;}
	header.open #submenu{height: 50px; justify-content: flex-start; padding: 0;}
	#h-siteid h1{height: 40px; display: block; padding: 5px 10px !important;}
	#h-siteid h1 a{height: 100%; display: block;}
	#h-siteid h1 img{max-height: 100%; height: 30px;}
	.w-80, .w-75, .w-66, .w-60, .w-50, .w-49_75, .w-49_5, .w-48, .w-40{width: 100%;}
	.w-33, .w-32, .w-30, .w-25, .w-24, .w-20, .w-10{width: 48%;}
	.anchor{padding-top: 60px; margin-top: -60px;}
	header{
		position: fixed;
		width: 100%;
		top: 0;
		left: 0;
		z-index: 9999;
		background: #fff;
		box-shadow: 0 3px 3px -3px #c7c7c7;
	}
	main{padding-top: 50px;}
	#pagetop{width: 50px; height: 50px; padding: 10px; bottom: 10px;}
	#submenu{padding: 0; height: 50px;}
	#gnav, #h-search, #h-mailmag, #h-snav{display: none;}
	#gnav-container{display: none; position: absolute; top: 0; right: 0; height: 50px; width: 50px; background: transparent;}
	#burger-menu .dropdown-item.movie div strong{display: none;}
	header.open #gnav-container{height: 50px;}
	.dropdown-item.tool div{display: none;}
	#burger{
		position: absolute;
		right: 0;
		top: 0;
		display: block;
		background: transparent;
		height: auto;
		width: 50px;
		position: fixed;
		z-index: 9999;
	}
	#burger-trig{
		display: block;
		height: 50px;
		position: relative;
		top: 0;
		right: 0;
		width: 50px;
		z-index: 101;
		padding: .4rem 0;
		float: right;
	}
	#burger-menu{
		transition: .3s all;
		position: absolute;
		top: 70px;
		right: -100vw;
		opacity: 0;
		width: 80vw;
		max-width: 300px;
		background: #323232;
		font-size: 1.4rem;
		z-index: 9998;
	}
	#burger-menu .dropdown-trig{
		display: none;
	}
	#burger-menu .head-drop{
		padding: 0;
	}
	#burger-menu .head-drop ul{
		display: none;
	}
	#burger-menu .dropdown-item{
		width: 100%;
		border-bottom: 1px solid #3f3e3d;
	}
	#burger-menu .dropdown-item strong{
		font-weight: normal;
		position: relative;
		display: block;
	}
	#burger img{
		max-height: 20px;
		display: block;
	}
	#burger i{
		text-align: center;
		width: 25px;
		margin-right: .5em;
	}
	#burger i.gray img{
		opacity: .85;
	}
	#burger strong u{
		width: 50px;
		height: 50px;
		display: flex;
		align-items: center;
		justify-content: center;
		color: #fff;
		position: absolute;
		right: 0;
		top: 0;
	}
	#burger strong u::before{
		transition: .3s all;
		content: "▼"
	}
	#burger strong u.open::before{
		content: "▲"
	}
	#burger strong + ul{
		background: #111;
		display: flex;
		flex-wrap: wrap;
	}
	#burger strong + ul li{
		padding: .5rem;
	}
	#burger strong + ul li img{
		margin-right: 1rem;
	}
	#burger-menu .search{
		display: none;
	}
	#burger-menu li{
		border-bottom: 1px solid #3f3e3d
	}
	#burger-menu li a{
		display: flex;
		flex-wrap: wrap;
		align-items: center;
		color: #c5c5c5;
	}
	#burger-menu li br{
		display: none !important;
	}
	#burger.open #burger-menu{
		right: 0;
		opacity: 1;
	}
	#burger-close{display: none;}
	#burger .post-list{
		background: #111;
	}
	#burger .post-item{
		width: 100%;
		clear: both;
		padding: 5px 10px;
		border-bottom: 1px solid #3f3e3d;
		overflow: hidden;
		font-size: 1.2rem;
	}
	#burger .post-item .img{
		width: 40%;
		padding-right: 10px;
		float: left;
	}
	#burger .post-item img{
		width: 100%;
		max-height: none;
	}
	#burger .post-item .content{
		width: 60%;
		float: left;
	}
	#burger-menu{
		top: 50px;
		left: auto;
		right: -100vw;
		z-index: 102;
		position: fixed;
		height: 100%;
		overflow: auto;
		-webkit-overflow-scrolling: touch;
	}
	#burger-menu .search{
		display: block;
		margin: 1rem;
	}
	#burger-menu .search h3{display: none;}
	#burger-menu .search form{
		display: flex;
		flex-wrap: wrap;
	}
	#burger-menu .search-block{
		width: calc(100% - 40px);
	}
	#burger-menu .search-option{
		position: relative;
		min-width: auto;
		top: 0;
		margin-bottom: 2rem;
	}
	#burger-menu .search input{
		border: 0;
		background: #ededed;
	}
	#burger-menu .search button{
		width: 40px;
		background: #ededed;
		border: 0;
	}
	#burger .mainmenu li > a{
		padding: .5em;
	}
	#burger strong > a, #burger .mainmenu > li > a, #burger-sub li a{
		padding: 1em .5em;
		position: relative;
	}
	#burger-trig span{
		color: #e60012;
	}
	#burger.open #burger-menu{
		right: 0;
	}
	#burger-trig:hover{
		cursor: pointer;
	}
	#burger-trig u{
		width: 60%;
		height: 3px;
		background: #e50102;
		display: block;
		margin: 5px auto;
		border-radius: 10px;
		transition: .5s all;
	}
	#burger-trig span{
		display: block;
		text-align: center;
		margin: 5px auto;
		color: #e50102;
		font-weight: bold;
		font-size: .8em;
	}
	#burger.open #burger-trig u:first-child {
		transform: translateY(8px) rotate(-45deg);
	}
	#burger.open #burger-trig u:nth-child(2) {
		opacity: 0;
	}
	#burger.open #burger-trig u:nth-child(3) {
		transform: translateY(-8px) rotate(45deg);
	}
	#burger-close{
		width: 100%;
		height: 100%;
		background: rgba(50,50,50,.5);
		position: fixed;
		top: 50px;
		left: 0;
		z-index: 100;
	}
	#burger-close:hover{cursor: pointer;}
	#burger-sub{margin-bottom: 100px;}
	#sidebar h3+.sidebar{display: none;}
	#sidebar h3.open+.sidebar{display: block;}
	#sidebar h3{overflow: hidden;}
	#sidebar h3 img{margin-top: -1px;}
	#sidebar h3 i{background-image: url(./svg/btn-open.svg);}
	#sidebar h3.open i{background-image: url(./svg/btn-close.svg);}
	#sidebar .magNewText a{font-size: 1.2rem;}
	#topicpath ul{margin: 0;}
	.archive-block h2{margin-bottom: .5rem; position: relative;}
	.archive-block h2 a{width: calc(100% - 40px); position: static}
	.archive-block h2 a::before {
		right: 6px;
	}
	.archive-block h2 a::after{
		width: 60px;
		padding: 0 .5rem 0 0;
		height: 30px;
	}
	.archive-block .archive-item:nth-child(9){display: none;}
	.archive-item {margin-bottom: 2%;}
	.archive-item .date{display: none;}
	.archive-item .content{padding: .8rem 1rem;}
	.archive-item h3{margin: 0;}
	.archive-item .cat{font-size: 1.0rem;padding: .2rem .5rem;}
	.archive-item h3 span.date {margin-bottom: .5rem;font-size: 1rem;}
	.archive-list{justify-content: space-between;}
	.archive-item{width: 49%;}
	.archive-item:nth-child(even){margin-right:0;}
	.archive-block{position: relative;}
	#news-recently ul {padding: 1.5rem;}
	.slick-dotted.slick-slider {margin-bottom: 20px;}
	#maker-recently .btn-red-arrow,#news-recently .btn-red-arrow, #photo-recently .btn-red-arrow, #movie-recently .btn-red-arrow{display: none;}
	.post-list{display: none;}
	#archive-search{
		display: block;
	}
	#archive-search-block{
		text-align: left;
		padding: 0 1rem 1rem;
		background: #434343;
		display: none;
	}
	#archive-search h3{
		margin-top: .5rem;
		padding: .5rem 1rem;
		background: #434343;
		display: block;
		font-weight: bold;
		color: #efefef;
		position: relative;
	}
	#archive-search h3::after{
		content: "▼";
		position: absolute;
		right: 1rem;
		top: .5rem;
	}
	#archive-search h3.open::after{
		content: "▲";
	}
	#archive-search h3:hover{
		cursor: pointer;
	}
	#archive-search select{
		width: 100%;
		margin-top: 1.5rem;
		font-size: 1.6rem;
	}
	#archive-search button{
		background: #e60012;
		border: 0;
		color: #fff;
		text-align: center;
		padding: 1rem;
		display: flex;
		align-items: center;
		position: relative;
		justify-content: center;
		width: 100%;
		max-width: 300px;
		margin: 1.5rem auto 0;
	}
	#archive-search button span{
		font-size: 1.4rem;
	}
	#archive-search button i{
		font-size: 1.2rem;
	}
	#archive-search button u{
		font-size: 1.4rem;
	}
	#entry-item .category li{
		margin-bottom: 1rem;
	}
	#pagetop{right: 0;}
	#pagenation{margin: 3rem 0;}
	#pagenation span{
		margin: 0 0 1rem;
		min-width: 3rem;
		height: 3rem;
		border-right: 0;
	}
	#pagenation a{
		height: 3rem;
		min-width: 3rem;
		margin: 0 0 1rem;
		border-right: 0;
	}
	#pagenation .next{
		border-right: 1px solid #999;
	}
	#maker-recently .archive-item:nth-child(n + 5){display: none;}
	#movie-recently .archive-item:nth-child(n + 3), #photo-recently .archive-item:nth-child(n + 3){display: none;}
	#news-recently li{flex-wrap: wrap;}
	#news-recently li span{width: calc(100% - 8rem); margin: 0;}
	#news-recently li span a {display: inline-block; font-size: 1rem; padding: .2rem 1rem; width: 100%;}
	#news-recently li strong{width: 100%;}
	#news-recently li + li{margin-top: .5rem; padding-top: .5rem}
	#news-recently li:last-child{margin-bottom: 2rem;}
	#news-recently li i {padding:0;width:7rem;font-size:1.2rem;line-height: 1.6;}
	#sidebar h3{margin-top: 0;}
	#sidebar > div:first-of-type{margin-bottom:3rem;}
	#sidebar .ranking {margin-bottom: 3rem;}
	#sidebar .koguRss{padding: 1rem 1rem 2rem;}
	#pickup .archive-item{margin-bottom: 0;}
	#pickup .archive-item:nth-child(3){display: none;}
	.news-special h2{padding: 1rem; font-size: 1rem;}
	.custom-data .spsize1{font-size: 1.2rem;}
	.custom-data .spsize2{font-size: 1rem;}
}

