@charset "utf-8";

/* 魚に逢いたくてTOP
------------------------ */
.reaction-top { background: url(/imgs/home/main_bg.jpg) repeat-x center 3em ;
}
.reaction-top #contents { background: #FFF ;
}
.reaction-top .page-title {
	max-width: 960px ;
	margin: 0 auto ;
	position: relative ;
	overflow: hidden ;
}
.reaction-top .page-title .copy-clm {
	color: #e8e8e8 ;
	left: 30px ;
	position: absolute ;
	top: 23px ;
	width: 430px ;
}
.reaction-top .page-title .main-title { font-size: 37px ;
}
.reaction-top .new-bnr {
	margin: 0.75em auto 0 ;
	position: relative ;
}
.reaction-top .new-bnr a {
	background: #f2f4f6 ;
	color: #313131 ;
	display: block ;
}
.reaction-top .new-bnr a:hover { background: #cdd1d5 ;
}
.reaction-top .new-bnr .img01 {
	float: left ;
	width: 29% ;
}
.reaction-top .new-bnr .icon-new {
	font-size: 23px ;
	left: 28% ;
	top: -3px ;
	z-index: 2 ;
}
.reaction-top .new-bnr .copy-clm {
	float: right ;
	width: 60% ;
	padding: 1em 1.5em 0 0 ;
}
.reaction-top .new-bnr .title {
	border-bottom: 1px solid #0082e7 ;
	display: inline-block ;
	margin-bottom: 1em ;
}
.reaction-top .new-bnr .fish-title {
	font-weight: normal ;
	padding: 0 1em 0 0.25em ;
}
.reaction-top .reaction-list {
	margin: 2.75em 0 0 ;
	width: 102% ;
}
.reaction-top .reaction-list li {
	float: left ;
	line-height: 1.4 ;
	margin-bottom: 3.5% ;
	width: 25% ;
	position: relative ;
}
.reaction-top .reaction-list li div {
	background: #ddeefa ;
	padding-bottom: 1em ;
	position: relative ;
	width: 92% ;
}
.reaction-top .reaction-list li p a {
	padding: 0 ;
}
.reaction-top .reaction-list li a {
	display: block ;
	color: #003258 ;
	text-decoration: none ;
	padding: 0.2em 0.4em ;
}
.reaction-top .reaction-list li a:hover {
	color: #3ecbff ;
}
.reaction-top .reaction-list .thumbnail {
	height: 130px ;
	overflow: hidden ;
	margin-bottom: 0.5em;
}
.reaction-top .reaction-list .thumbnail img {

}
.reaction-top .reaction-list .icon-new {
	font-size: 14px ;
	left: 1% ;
	top: -3% ;
	z-index: 3 ;
}
/* 魚に逢いたくて詳細
------------------------ */
.sakana-detail #contents {
	padding-bottom: 0 ;
}
.sakana-detail .bread {
	padding: 0 0 0.25em ;
}
.sakana-detail .page-title {
	background: #cce0f3 ;
	line-height: 1.2 ;
	margin: 0 0 2em ;
}
.sakana-detail .page-title .copy-clm {
	margin: 0 auto ;
	max-width: 960px ;
	padding: 1em 0 ;
}
.sakana-detail .page-title .cat-title {
	color: #3080b0 ;
	padding-bottom: 0.25em ;
}
.sakana-detail .page-title .main-title {
	color: #124f62 ;
}
.sakana-detail .bodycopy-clm {
	padding-bottom: 8em ;
}
.sakana-detail .bodycopy-clm p {
	padding-bottom: 2.5em ;
}
.sakana-detail .bodycopy-clm .fishfinder-img,
.sakana-detail .bodycopy-clm .photo-clm {
	font-size: 87.5% ;
}
.sakana-detail .bodycopy-clm .photo-clm {
	padding-top: 3em;
}
.sakana-detail .bodycopy-clm .fishfinder-img {
	max-width: 83.5% ;
	margin: 0 auto 0.5em ;
}
.sakana-detail .bodycopy-clm .fishfinder-img img {
	display: block ;
	margin: 0 auto 0.2em ;
}
.sakana-detail .bodycopy-clm .list_bg_l {
	background: #f5f6f8 ;
	margin-bottom: 2.5em ;
	padding: 1em 1.75em ;
}
.sakana-detail .bodycopy-clm .list_bg_l h2 {
	color: #3165b2 ;
	font-size: 137.5% ;
	font-weight: normal ;
	margin-bottom: 0.5em ;
}
.sakana-detail .bodycopy-clm .list_bg_l ul li {
	list-style: outside disc ;
	margin-left: 1.5em ;
}
/* 下部ナビ
------------------------ */
.singlelist-clm {
	margin-bottom: 0.5em ;
}
.singlelist-clm .inner,
.newall-clm .inner { padding: 1.5em 0 0.5em;
}
.singlelist-clm h2,
.newall-clm h2 {
	color: #3165b2 ;
	padding-bottom: 0.5em ;
}
.singlelist-clm ul,
.newall-clm ul {
	display: flex ;
	flex-wrap: wrap ;
}
.singlelist-clm li,
.newall-clm li {
	float: none ;
}
.singlelist-clm li a,
.newall-clm li a {
	display: flex ;
	flex-wrap: wrap;
	justify-content: space-between;
	align-items: stretch;
}
.singlelist-clm li a {
	background-color: #0182e8 ;
	color: #fff ;
}
.singlelist-clm li a:hover,
.singlelist-clm li a.active {
	background-color: #52aed3 ;
}
.singlelist-clm li a .title {
	box-sizing: border-box ;
	padding: 0.25em 0 0 0.5em ;
	min-height: 3.5em;
	width: 67% ;
}
.singlelist-clm .thumbnail,
.newall-clm .thumbnail {
	background-position: center center;
	background-repeat: no-repeat ;
	background-size: cover ;
	box-sizing: border-box ;
	float: none ;
	width: 30% ;
}

.newall-clm {
	padding-bottom: 3em ;
}
.newall-clm .inner { padding: 1.5em 0 0.5em;
}
.newall-clm li {
	margin-bottom: 2% ;
}
.newall-clm h2 {
	padding-bottom: 1em ;
}
.newall-clm li a {
	background: #ddeefa ;
	color: #003258 ;
	line-height: 1.3 ;
}
.newall-clm li a:hover,
.newall-clm li a.active {
	color: #3ecbff ;
	text-decoration: none;
}
.newall-clm li a.active {
	color: #003258 ;
}
.newall-clm .name {
	box-sizing: border-box ;
	font-size: 13px ;
	display: block ;
	line-height: 1.3 ;
    padding: 0.5em 0 0.5em 0.5em;
    width: 70%;
	min-height: 3em ;
}
.newall-clm li a:hover .name,
.newall-clm li a.active .name {
	color: #3ecbff ;
}
.newall-clm .name::before {
	width: 0.5em ;
}
.newall-clm .thumbnail {
	padding: 0 ;
}

.newall-clm .thumbnail {
	width: 28% ;
}


/* 青物のサムネイル対応 */
.sakana-detail.migratory .singlelist-clm li:first-child .thumbnail img {
	max-width: 111% ;
}
/* スマホサイズ用 */
@media screen and (max-width: 920px) {
	.reaction-top .new-bnr .icon-new { font-size: 18px ;
	}
}
@media screen and (max-width: 870px) {
	.reaction-top { background: none ;
	}

	.reaction-top .new-bnr .copy-clm {
		padding: 0 1em 0 0;
		width: 60% ;
		line-height: 1.4 ;
	}
	.reaction-top .new-bnr .title { margin-bottom: 0.25em ;
	}
}
@media screen and (max-width: 800px) {
	.reaction-top .new-bnr .icon-new { font-size: 14px ;
	}
	.reaction-top .new-bnr .copy-clm { width: 60% ;
	}
	.reaction-top .new-bnr .title {
		line-height: 1.2 ;
	}
	.reaction-top .reaction-list li { width: 33.3% ;
	}
	.reaction-top .reaction-list .thumbnail { height: auto ;
	}
	.reaction-top .reaction-list .thumbnail img { margin-top: 0 !important ;
	}
	.sakana-detail .bodycopy-clm .fishfinder-img { max-width: 100% ;
	}
}
@media screen and (max-width: 710px) {
	.reaction-top .new-bnr { display: none ;
	}
}
@media screen and (max-width: 680px) {
	.reaction-top .new-bnr .fish-title {
		font-size: 24px ;
	}
	.reaction-top .reaction-list li {
		width: 50% ;
	}
	.newall-clm .name::before {
		width: 0.25em ;
	}

}
@media screen and (max-width: 580px) {
	.sakana-detail .page-title .cat-title,
	.sakana-detail .page-title .main-title,
	.writer-clm .writer-title h2 {
		width: 90% ;
		margin-left: auto;
		margin-right: auto;
	}
	.sakana-detail .page-title .cat-title { font-size: 14px ;
	}
	.sakana-detail .page-title .main-title { font-size: 21px ;
	}
	.reaction-top .page-title .main-title {
		line-height: 1.2 ;
	}
	.reaction-top .new-bnr .copy-clm { width: 45% ;
	}

	.sakana-detail .list-two-clm ul,
	.sakana-detail .list-two-clm li,
	.sakana-detail .list-two-clm li a {
		float: none ;
		width: 100% ;
	}
	.sakana-detail .list-two-clm li {
		margin-bottom: 1em ;
	}
}
@media screen and (max-width: 400px) {
	.reaction-top .new-bnr .copy-clm { width: 45% ;
	}
	.newall-clm .name::before {
		display: none ;
	}
	.newall-clm .name {
		padding: 0.5em 0 0.5em 0.25em ;
		text-indent: 0;
	}
}
@media screen and (max-width: 350px) {
}
/* スマホサイズ用 */


