@charset "utf-8";
@import url('https://fonts.googleapis.com/css?family=Noto+Sans+JP:100,400,500,700&subset=japanese');

/*----------------------------------------------------------
/* 基本定義
/* last 2020.11.13
-----------------------------------------------------------*/
/*フォント設定*/
html{
	font-size: 10px; /* initial 10px */
}
body{
	font-family: 'Noto Sans JP', 'ヒラギノ角ゴシック Pro', 'Hiragino Kaku Gothic Pro', メイリオ, Meiryo, Osaka, 'ＭＳ Ｐゴシック', 'MS PGothic', sans-serif;
	font-size:1.6rem; /* default font-size 16px */
	line-height : 1.5;
}
/* Google fonts  ->  Noto Sans JP */
/* Regular 400/Medium 500/Bold 700 */


/* アンカー／初期化 */
a,
a:link,
a:visited{
	text-decoration: none;
	color:#000;
}
a:active,
a:hover{
	text-decoration: underline;
}

/* imgホバー透過 */
a:hover img{
	opacity:0.65;
	-webkit-transition:all 0.2s linear;
	transition:all 0.2s linear;
}

/* 画像レスポンシブ・インライン */
.img-respo{
display:block;
max-width:100%;
height: auto;
}
.img-respo_inline{
display:inline-block;
max-width:100%;
height: auto;
}

/*----------------------------------------------------------
/* レイアウト
-----------------------------------------------------------*/
article{
	margin:0 auto 50px;
}
/* Bootstrap override */
.container{
	width:100%;
	max-width:960px !important;
}
.manga-intro-cont{
	position:relative;
}

/* コンテンツ全包含 */
@media (max-width:767px){
	#sec_nana01{
		margin-bottom:20px;
	}
	/* コンテンツ全包含 */
	#wrapper{
		margin:20px auto 40px;
	}
	/* SPでは導入部の上の掲載日スペース削除 */
	.intro-block{
		margin-top:0;
		-webkit-box-ordinal-group: 3;
		-ms-flex-order: 2;
		order: 2;
	}
	#manga-block{
		margin-top:50px;
		-webkit-box-ordinal-group: 2;
		-ms-flex-order: 1;
		order: 1;
	}
	.author-block{
		-webkit-box-ordinal-group: 4;
		-ms-flex-order: 3;
		order: 3;
	}
	.player-block{
		-webkit-box-ordinal-group: 5;
		-ms-flex-order: 4;
		order: 4;
	}
}
@media (min-width:768px){
	#sec_nana01{
		margin-bottom:30px;
	}
	/* コンテンツ全包含 */
	#wrapper{
		width:100%;
	}
	/* PCでは導入部の上に掲載日スペース空ける */
	.intro-block{
		margin-top:45px;
	}
	/* 4コマまんが部の表示位置調整 */
	#manga-block{
		position: absolute;
		top:0;
		right:0;
	}
}
@media (min-width:960px){
	/* コンテンツ全包含 */
	#wrapper{
		margin:20px auto 100px;
		max-width:960px;
	}
}


/*** 見出し ***/
#sec_nana01 h1{
	margin:0 auto 10px;
}
@media (min-width:768px){
}

/*----------------------------------------------------------
/* 導入・選手・作者紹介
----------------------------------------------------------*/
/*** 選手・作者共通 ***/
/*** 見出し、コメント ***/
#sec_nana02 h2{
	margin:0 0 15px 0;
	padding:0 0 4px 0;
	font-weight: bold;
	font-size:2.4rem;
	border-bottom:solid 1px #000;
}
#sec_nana02 h2 span{
	font-size:1.8rem;
	color:#000;
}
.comment{
	margin:0 0 10px 0;
	line-height:1.6;
	font-size:1.4rem;
}
.comment{
	margin:0 0 10px 0;
	line-height:1.6;
	font-size:1.4rem;
}
.comment.btm{
	margin-bottom:30px;
}

.infoblock-wrap > div p:nth-last-of-type(1){
	margin-bottom:0;
}

/*** 導入 ***/
.record{
	position:absolute;
	top:0;
	left:0;
	margin:0 0 0 0;
	padding:0 15px 0 15px;
	width:100%;
}
.record > span{
	display: inline-block;
	margin:0 0 0 0;
	padding:0 0 2px 0;
	width:100%;
	text-align: right;
	font-size:1.2rem;
	border-bottom:solid 1px #000;
}

.contents-intro{
	margin:0 0 20px 0;
	padding:0 0 0 0;
	line-height:1.7;
	font-size:1.4rem;
}
.kaidan-photo > div{
	text-align: center;
}

/*** 選手プロフィール ***/
#sec_nana02 .player-block h2{
	color:#e4007f;
}
#sec_nana02 .player-block h2 span:nth-child(1){
	color:#e4007f;
}
.player-block h3{
	margin:0 0 10px 0;
	font-size:1.6rem;
}
.player-block h3 span{
	font-size:1.2rem;
}
.player-profile{
	margin:0 0 0 0;
	font-size:1.4rem;
}

/*** 作者プロフィール ***/
#sec_nana02 .author-block h2{
	color:#14a0e9;
}
#sec_nana02 .author-block h2 span:nth-child(1){
	color:#14a0e9;
}
.author-block h3{
	margin:0 0 12px 0;
	padding:0 0 4px 0;
	font-size:1.6rem;
	border-bottom:solid 1px #000;
}
.comment.author{
	margin:0 0 25px 0;
}
.author-site-link{
	margin:20px 0 0 0;
	line-height:1.6;
	font-size:1.6rem;
	font-weight: bold;
}
.author-site-link a{
	text-decoration:none;
	font-size:1.4rem;
	font-weight: normal;
	font-family:'Font Awesome 5 Pro';
}
.author-site-link a::before{
	content: '\f35d  ';
}
.author-site-link a:hover{
	opacity:0.7;
}

@media (max-width:767px){
	/*** レイアウト ***/
	.manga-intro-cont > div:nth-child(2),
	.manga-intro-cont > div:nth-child(4),
	.manga-intro-cont > div:nth-child(5){
		margin-top:30px;
	}
	/* 会談写真 */
	.kaidan-photo div:nth-child(1){
		margin-bottom:15px;
	}
}
@media (min-width:768px){
	/*** レイアウト ***/
	.manga-intro-cont > div:nth-child(n+4){
		margin-top:60px;
	}
	.offset-right_custom{
		margin-right:50% !important;
	}
	/*** 導入 ***/
	.record{
		padding:0 15px 0 15px;
		width:50%;
	}
}

/*----------------------------------------------------------
/* 最終回あいさつ
----------------------------------------------------------*/
#sec_greeting{
	margin-bottom:30px;
}
#sec_greeting > p{
	margin:0;
	text-align: center;
}

/*----------------------------------------------------------
/* slick スライド部
----------------------------------------------------------*/
footer{
	margin:0 auto;
	padding:8px 0 0 0;
	border-top:solid 1px #000;
}
footer p{
	line-height:1;
	text-align: center;
}



/*----------------------------------------------------------
/* slick スライド部
----------------------------------------------------------*/
.manga-slide{
	-webkit-box-sizing: border-box;
	box-sizing: border-box;
	margin:0 auto 0 !important;
	padding:0;
}
@media (max-width:767px){
	.manga-slide{
		width:90%;
	}
}
@media (min-width:768px){
	.manga-slide{
		width:95%;
		max-width:650px;
	}
}
.manga-slide img{
	padding:0 10px;
	max-width:100%;
	height:auto;
}

/*** slick css override **/
/* ページ送り用← →ボタン */
#iam-nana-cont .slick-prev,
#iam-nana-cont .slick-next{
	width:40px;
	height:40px;
	z-index: 100;
}
#iam-nana-cont .slick-prev{
	left:-30px;
}
#iam-nana-cont .slick-next{
	right:-30px !important;
}
.slick-prev::before,
.slick-next::before{
	color:#193076;
	font-size:2.8rem;
	opacity:1;
}
.slick-prev.slick-disabled::before,
.slick-next.slick-disabled::before{
	opacity:.2;
}
/* 下部ページ送り●ボタン */

/* 1002flex化検証 */
#iam-nana-cont .slick-dots{
	position:static;
	display:-webkit-box;
	display:-ms-flexbox;
	display:flex;
	-ms-flex-wrap: wrap;
	flex-wrap: wrap;
	-webkit-box-pack:start;
	-ms-flex-pack:start;
	justify-content:flex-start;
	margin:12px auto 0;
}

/* 2019.12.26 ボタン1段 10並び */
#iam-nana-cont .slick-dots li{
	margin:0;
	padding:0 5px;
	width:10%;
	height:auto;
}
#iam-nana-cont .slick-dots li:nth-child(n+11){
	margin-top:14px;
}

/* 2019.12.26 ボタン1段 5並び／予備
#iam-nana-cont .slick-dots li{
	margin:0;
	padding:0 5px;
	width:20%;
}
#iam-nana-cont .slick-dots li:nth-child(n+6){
	margin-top:14px;
}
*/


#iam-nana-cont .slick-dots{
	bottom:-55px;
}
#iam-nana-cont .slick-dots li button::before{
	font-size:1.2rem;
	color:#193076;
}
#iam-nana-cont .slick-dots li.slick-active button::before{
	color:#193076;
	opacity:1;
}
/* 数字ナビ調整 */
#iam-nana-cont .slick-dots li span{
	display: inline-block;
	/*
	padding:1px 6px;
	*/
	line-height:1.5;
	text-align: center;
	width:22px;
	height:22px;
	font-size:1.2rem;
	color:#aaa;
	border:solid 1px #aaa;
	border-radius:50%
}
#iam-nana-cont .slick-dots .slick-active span{
	font-weight: bold;
	color:#193076;
	border:solid 1px #193076;
}


