@charset "UTF-8"; /* CSS Document */


#container {
	padding-top: 100px;
}
#contents #pageTitle {
	background: #ecf9f2;
	border-radius: 0;
}
#contents #pageTitle .wrap {
	padding: 2rem 0;
}
#contents #pageTitle h1 {
	line-height: 1.4;
	color: #323c46;
}

.niconaviBlockBtn {
	display: inline-block;
	font-feature-settings: "palt" on;
	font-size: 1.5rem;
	line-height: 1;
	padding: 1.25rem 2.5rem;
	background: #008e44;
	border-radius: 2rem;
	text-align: center;
	overflow: visible;
}
.niconaviBlockBtn .hoverLine {
	font-weight: bold;
	color: #fff;
}
.niconaviBlockBtn .fa-external-link-alt {
	font-size: .9em;
	color: #fff;
}


/* ----------------------------------------------
   ヘッダー
------------------------------------------------ */
#niconaviHeader {
	position: fixed;
	top: 0px;
	left: 0px;
	width: 100%;
	height: 100px;
	font-feature-settings: "palt" on;
	line-height: 1;
	background: #fff;
	border-bottom: 1px solid #ddd;
	z-index: 10000;
}
#niconaviHeader .logoBox {
	display: flex;
	align-items: center;
}
#niconaviHeader .logoBox .logo img {
	height: 40px;
}
#niconaviHeader .logoBox .tagline {
	margin-left: 1rem;
}
#niconaviHeader #headerNavToggleBtn {
	display: none;
}


/* ----------------------------------------------
   フッター
------------------------------------------------ */
#niconaviFooter {
	color: #fff;
	padding: 2.5rem 0;
	background: #323c46;
	text-align: center;
}
#niconaviFooter .logo img {
	width: 10rem;
}
#niconaviFooter .menu {
	font-size: .875rem;
	margin: 2rem 0;
}
#niconaviFooter .menu a {
	color: #fff;
}
#niconaviFooter .menu .fa-external-link-alt {
	font-size: .9em;
	color: #fff;
}
#niconaviFooter .copyright {
	font-size: .75rem;
}

.pageTopBtn {
	background-image: url("/nico-navi/assets/images/common/pagetop.png");
}


/* ----------------------------------------------
   トップページ
------------------------------------------------ */
#home {
	background: url("/nico-navi/assets/images/top/main_bg_pc.png") no-repeat top center;
	background-size: 100% auto;
}
#home .wrap {
	padding: 0 0 5rem;
	text-align: center;
}
#home .main h1 {
	padding: 3.5rem 0 1.25rem;
}
#home .txt p {
	font-size: 1.25rem;
	font-weight: bold;
	line-height: 2;
	margin: 2.5rem 0;
}
#home .box {
	padding: 2.5rem 0 3.5rem;
	background: #ecf9f2;
	border-radius: 1rem;
}
#home .box .link {
	margin: 0 0 2rem;
}
#home .box .link a::before {
	font-family: "Font Awesome 5 Free";
	font-weight: 900;
	color: #008e44;
	content: "\f054";
	margin-right: .5rem;
}


/* ----------------------------------------------
   利用規約
------------------------------------------------ */
#terms {
	padding: 2.5rem 0;
}
#terms h2 {
	font-size: 1.5rem;
	line-height: 1.3;
	margin: 3rem 0 1rem;
}
#terms h2:first-of-type {
	margin-top: 0;
}
#terms p {
	line-height: 1.7;
	margin: 0 0 1rem;
}
#terms ol {
	position: relative;
	counter-reset: ol_li;
	list-style-type: none;
	margin: 0 0 1rem;
	padding: 0 0 0 2rem;
}
#terms ol li {
	line-height: 1.7;
	margin-bottom: .75rem;
}
#terms ol li::before {
	position: absolute;
	left: 0;
	counter-increment: ol_li;
	content: counter(ol_li)".";
}
#terms ol li ol {
	margin: .5rem 0 1rem;
}
#terms ol li ol li {
	margin-bottom: .25rem;
}
#terms ol.parentheses {
	padding-left: 2.5rem;
}
#terms ol.parentheses li::before,
#terms ol li ol li::before {
	content: "("counter(ol_li)")";
}
#terms .foot {
	margin-top: 3rem;
	padding-top: 1rem;
	border-top: 1px solid #ddd;
}


/* ----------------------------------------------
   Media Queries
------------------------------------------------ */
@media (hover: hover) {
	
	.niconaviBlockBtn .hoverLine,
	#niconaviFooter .menu a span.hoverLine {
		background: linear-gradient(#fff,#fff) 100% 100%/0 1px no-repeat;
		transition: background-size .4s cubic-bezier(.23,1,.32,1) 0s !important;
	}
	
}

@media print, screen and (min-width: 768px) {
	
	#container {
		margin: 0;
	}
	
	/* ヘッダー */
	#niconaviHeader {
		display: flex;
		justify-content: space-between;
		align-items: center;
		padding: 0 2.5rem;
		text-align: left;
	}
	#gNav {
		display: block !important;
	}
	#gNav ul {
		display: flex;
		align-items: center;
	}
	#gNav ul li+li {
		margin-left: 2.5rem;
	}
	#gNav ul li a {
		position: relative;
		display: block;
		font-size: 1rem;
		font-weight: bold;
		line-height: 2;
	}
	#gNav ul li a.lineBtn::after {
		position: absolute;
		display: block;
		bottom: 0px;
		left: 0px;
		width: 0%;
		height: 4px;
		content: "";
		background: linear-gradient(90deg, #008e44, #008e44);
		transition: width .1s;
	}
	#gNav ul li a.lineBtn:hover::after {
		width: 100%;
	}
	#gNav ul li a.niconaviBlockBtn {
		font-size: .875rem;
		padding: .5rem 1rem;
	}
	
	/* フッター */
	#niconaviFooter .menu ul {
		display: flex;
		justify-content: center;
	}
	#niconaviFooter .menu li+li {
		margin-left: 2rem;
	}
	
}

@media only screen and (max-width: 767px) {
	
	#container {
		padding-top: 65px;
	}
	#contents #pageTitle {
		margin: 0;
	}
	#contents #pageTitle .wrap {
		padding: 1.5rem 0;
	}
	#contents #pageTitle h1 {
		font-size: 1.5rem;
	}
	
	.niconaviBlockBtn {
		font-size: 1rem;
		padding: 1.125rem 1.5rem;
	}
	
	/* ヘッダー */
	#niconaviHeader {
		height: auto;
		line-height: 1;
		padding-top: 65px;
		background: rgba(0,0,0,0.3);
		box-shadow: none;
	}
	#niconaviHeader .headerWrap {
		position: absolute;
		display: flex;
		justify-content: space-between;
		align-items: center;
		top: 0px;
		left: 0px;
		width: 100%;
		height: 65px;
		padding: 0 .5rem 0 1rem;
		background: #fff;
	}
	#niconaviHeader .logoBox .logo {
	}
	#niconaviHeader .logoBox .logo img {
		width: auto;
		height: 1.5rem;
	}
	#niconaviHeader .logoBox .tagline {
		font-size: .75rem;
		margin-left: .5rem;
	}
	#niconaviHeader #headerNavToggleBtn {
		position: relative;
		display: block;
		width: 44px;
		height: 44px;
		margin: 0;
		padding: 0;
		background: none;
		border: none;
	}
	#niconaviHeader #headerNavToggleBtn::before {
		position: absolute;
		top: 0px;
		left: 0px;
		width: 100%;
		font-family: "Font Awesome 5 Free";
		font-size: 20px;
		font-weight: 900;
		line-height: 44px;
		color: #008e44;
		content: "\f0c9";
		text-align: center;
	}
	#header.open {
		height: 100%;
	}
	#header.open #headerNavToggleBtn::before {
		content: "\f00d";
	}
	#gNav {
		position: fixed;
		display: none;
		top: 0px;
		right: 0px;
		width: 100%;
		height: 100%;
		padding-top: 65px;
		z-index: -1;
	}
	#gNav .gNavWrap {
		max-height: 100%;
		background: #ecf9f2;
		box-shadow: 0px 0px 5px rgba(0, 0, 0, 0.5);
		overflow: auto;
	}
	#gNav ul {
		padding: 1.5rem 1.5rem 2rem;
	}
	#gNav ul li.link {
		background: #fff;
		border: 2px solid #008e44;
	}
	#gNav ul li.link+li.link {
		border-top: none;
	}
	#gNav ul li.link a {
		display: block;
		font-weight: bold;
		line-height: 1.5;
		padding: 1rem;
	}
	#gNav ul li.btn {
		margin-top: 1.5rem;
	}
	#gNav ul li a.niconaviBlockBtn {
		display: block;
		font-size: 1rem;
		padding: 1rem;
	}
	
	/* フッター */
	#niconaviFooter .menu li+li {
		margin-top: .75rem;
	}
	
	/* トップページ */
	#home {
		background-image: url("/nico-navi/assets/images/top/main_bg_sp.png");
	}
	#home .wrap {
		padding: 0 0 3rem;
	}
	#home .main h1 {
		padding: 2rem 0 1rem;
	}
	#home .main h1 img {
		width: 11rem;
	}
	#home .main .img {
		margin: 0 1rem;
	}
	#home .txt p {
		font-size: 1.125rem;
		line-height: 1.5;
		margin: 1.5rem 1rem;
		text-align: left;
	}
	#home .txt p br {
		display: none;
	}
	#home .box {
		margin: 0 1rem;
		padding: 1.5rem 1rem 2rem;
		border-radius: .5rem;
	}
	#home .box .link {
		margin: 0 0 1rem;
	}
	#home .box .link a::before {
		margin-right: .25rem;
	}
	
	/* 利用規約 */
	#terms {
		padding: 1.5rem 1rem;
	}
	#terms h2 {
		font-size: 1.25rem;
		margin: 2rem 0 .75rem;
	}
	
}