@charset "UTF-8";

/* ノート表紙 背景 */
.noteTopArea{
	width: 960px;
	padding: 0;	/* デフォルトでpaddingがかかってるのでそれを消す */
	margin: 10px auto 40px;
	background-image: url("/idea_note/images/note_top.png");
	background-repeat: repeat-y;
	border: solid 1px #534741;
	font-size: 24px;
	font-weight: bold;
	line-height: 40px;
}
@media only screen and (max-width: 768px) {
	.noteTopArea{
		width: 100%;
		padding: 10% 0 10%;
		margin: 0;
		background-image: url("/idea_note/images/note_top_sp.png");
		border: none;
		font-size: 5vw;
		line-height: 10vw;
	}
}
/* 表紙タイトル */
.titleArea{
	width: 600px;
	height: 125px;
	padding-left: 96px;
	margin: 175px 0 auto auto;
	font-size: 48px;
	line-height: 135px; /* 125がピッタリだが，ベースラインを下げたくて行幅を広めにとった */
	border-top: solid 2px #E8841E;
	border-bottom: solid 2px #E8841E;
}
@media only screen and (max-width: 768px) {
	.titleArea{
		width: 100vw;
		height: 20vw;
		padding: 0;
		margin: 0 auto auto;
		font-size: 7.2vw;
		text-align: center;
		line-height: 21vw;
		border-top: solid 0.2vw #E8841E;
		border-bottom: solid 0.2vw #E8841E;
	}
}

/* タイトルと記事リストの間 */
.description{
	width: 525px;
	margin: 70px 21px auto auto;
	font-size: 21px;
	font-weight: normal;
	line-height: 32px;
}
@media only screen and (max-width: 768px) {
	.description{
		width: 62.4%;
		margin: 10% auto auto;
		font-size: 4.4vw;
		line-height: 7vw;
	}
}

/* 罫線 */
.line{
	width: 648px;
	padding: 2px  24px 0px;	/* 文字を罫線よりに配置するためにtopのpaddingをとっている */
	margin: 82px 0px 150px auto; /* 上の余白は結果として84pxのつもり */
	background: linear-gradient(to top,#E8841E 1px, #ffffff00 1px) left top / 1px 40px;
}
@media only screen and (max-width: 768px) {
	.line{
		width: 94%;
		padding: 1% 3% 0;
		margin: 12% 0 0;
		background: linear-gradient(to top, #E8841E 1px, #ffffff00 1px) left top / 1px 10vw;
	}
}

/* ナンバリング */
.indexlist li{
	list-style-type: decimal; /* リストの左側に黒丸 */
	margin: 0 auto 0 48px;
	text-align: left;
}
@media only screen and (max-width: 768px) {
	.indexlist li{
		margin: 0 auto 0 10vw;
	}
}

/* 長体 */
.long_title95, .long_title90, .long_title85, .long_title80, .long_title70, .title_reset_pc, .title_reset_sp{
	display: flex; /* 項目番号に当てないためにspanタグを利用したい */
	transform-origin: top left;
}
.long_title95{
	transform: scale(.95, 1);
	width: 105.26%;
}
.long_title90{
	transform: scale(.90, 1);
	width: 111.11%;
}
.long_title85{
	transform: scale(.85, 1);
	width: 117.65%;
}
.long_title80{
	transform: scale(.80, 1);
	width: 125%;
}
.long_title70{
	transform: scale(.70, 1);
	width: 142.57%;
}
/* これと組み合わせることでspだけに当てる */
@media not all and (max-width: 768px){
	.title_reset_pc{
		transform: scale(1,1);
		width: 100%;
	}
}
/* これと組み合わせることでpcだけに長体　*/
@media only screen and (max-width: 768px) {
	.title_reset_sp{
		margin: 0; 
		transform: scale(1,1);
		width: 100%;
	}
}
/* IEでは長体かけた部分が改行される対策 */
_::-ms-backdrop, :root .long_title95, :root .long_title90, :root .long_title80, :root .long_title70 , :root .title_reset_pc, :root .title_reset_sp{
	margin: -40px 0 0 ;
}