@charset "UTF-8";
.articleNav:after {
	content: "";
	display: table;
	clear: both;
}

#lead span {
	font-family: "a-otf-gothic-bbb-pr6n", "游ゴシック", "Yu Gothic", "游ゴシック体", "YuGothic", "ヒラギノ角ゴ Pro W3", "Hiragino Kaku Gothic Pro", "メイリオ", Meiryo, sans-serif;
}

#lead, #preLead, #preLead2, #title h2, #tag > span,
#archivesTag > span, #member > ul > li, .article h3, .article dl dt, .article h4, .articleNav a, #profile h3, #articleIndex, #info dl dd > strong, #schedule, #link {
	font-family: "a-otf-midashi-go-mb31-pr6n", "游ゴシック", "Yu Gothic", "游ゴシック体", "YuGothic", "ヒラギノ角ゴ Pro W3", "Hiragino Kaku Gothic Pro", "メイリオ", Meiryo, sans-serif;
}

#lead, #member, #profile, #preLead, #info, #link {
	background-color: rgba(60, 55, 54, 0.64);
}

.article, #articleIndex, #date, #schedule {
	background-color: rgba(255, 255, 255, 0.9);
	color: #3C3736;
}

#lead, #preLead, #preLead2 {
	font-size: 18px;
	line-height: 2.15;
}

#background > li {
	display: none;
	position: fixed;
	background-color: #3C3736;
	background-repeat: no-repeat;
	background-position: center top;
	background-size: cover;
	width: 100%;
	z-index: -1;
}

#background > li:nth-child(1) {
	background-image: url(../images/making/bg2.jpg);
}

#background > li:nth-child(2) {
	background-image: url(../images/making/bg3.jpg);
}

#title {
	position: relative;
	height: 0;
	padding-bottom: 66.36364%;
}

#title h2 {
	position: absolute;
	bottom: 0;
	left: 50%;
	width: 144px;
	height: 100%;
	margin-left: -72px;
	padding-top: 66.36364%;
	background: rgba(255, 255, 255, 0.68) url(../images/making/title.png) no-repeat center/contain;
	text-indent: -9999px;
	line-height: 1.6;
}

#titleBg {
	position: relative;
	width: 100%;
	height: 0;
	top: 0;
	left: 0;
	padding-bottom: 66.36364%;
	background: url(../images/making/bg1.jpg) no-repeat center bottom/100% auto;
}

#titleBg.fixed {
	position: fixed;
	z-index: -1;
}

#tag,
#archivesTag {
	position: absolute;
	top: 28px;
	right: 0;
	width: 32px;
	height: 280px;
	background: #FF4000 url(../images/making/tag.png) no-repeat center/17px auto;
	text-indent: -9999px;
}

#tag > span,
#archivesTag > span {
	display: inline-block;
	padding: 10px 15px;
	background-color: #FF4000;
	line-height: 1;
}

#title.title4 #titleBg {
	background-image: url(../images/making/bg4.jpg);
}

#title.title4 h2 {
	top: 36px;
	bottom: auto;
	left: 50%;
	width: 243px;
	height: 257px;
	margin-left: -122px;
	padding-top: 0;
	background: url(../images/making/title_no4_2x.png) no-repeat center/contain;
}

#title.title4 #tag {
	display: none;
}

#lead {
	padding-top: 70px;
	padding-bottom: 100px;
	text-align: center;
}

#lead span {
	display: inline-block;
	margin-top: 40px;
	font-size: 14px;
}

#member {
	margin-top: 460px;
}

#member > ul {
	position: relative;
	width: 83.63636%;
	height: 280px;
	margin: 0 auto;
}

#member > ul > li {
	width: 200px;
	margin-left: -100px;
	font-size: 16px;
	position: absolute;
	text-align: center;
	line-height: 1.6;
}

#member > ul > li > span {
	font-size: 13px;
}

#member > ul > li:nth-child(1) {
	top: 140px;
	left: 5.43478%;
}

#member > ul > li:nth-child(2) {
	top: 82px;
	left: 21.73913%;
}

#member > ul > li:nth-child(3) {
	top: 24px;
	left: 33.69565%;
}

#member > ul > li:nth-child(4) {
	top: 24px;
	right: 28.26087%;
}

#member > ul > li:nth-child(5) {
	top: 82px;
	right: 13.04348%;
}

#member > ul > li:nth-child(6) {
	top: 140px;
	right: -4.34783%;
}

#member > ul#member4 {
	width: 90.90909%;
	height: 190px;
}

#member > ul#member4 > li:nth-child(1) {
	top: 28px;
	left: 6%;
}

#member > ul#member4 > li:nth-child(2) {
	top: 28px;
	left: 30.4%;
}

#member > ul#member4 > li:nth-child(3) {
	top: 28px;
	left: 51.6%;
}

#member > ul#member4 > li:nth-child(4) {
	top: 28px;
	right: 17.8%;
}

#member > ul#member4 > li:nth-child(5) {
	top: 28px;
	right: -3%;
}

.article {
	padding: 86px 0 56px 0;
}

.article .no {
	text-align: center;
}

.article h3 {
	margin-top: 48px;
	margin-bottom: 100px;
	text-align: center;
	font-size: 38px;
	line-height: 1.7;
}

.article dl {
	max-width: 630px;
	margin: 60px auto;
}

.article dl dd {
	margin: -2em 0 30px 5em;
}

.article .image {
	display: block;
	width: 100%;
	max-width: 630px;
	margin: 60px auto;
}

.article .vertical {
	max-width: 420px;
}

.article h4 {
	max-width: 630px;
	margin: 100px auto;
	font-size: 23px;
	line-height: 1.6;
}

.article .continue {
	max-width: 630px;
	margin: 60px auto 0 auto;
}

.articleNav {
	margin-top: 78px;
}

.articleNav .prev {
	float: left;
}

.articleNav .next {
	float: right;
}

.articleNav a {
	display: block;
	font-size: 23px;
	line-height: 40px;
	color: #000;
}

.articleNav .prev > a {
	padding-left: 36px;
	background: url(../images/prev.png) no-repeat left center/23px auto;
}

.articleNav .next > a {
	padding-right: 36px;
	background: url(../images/next.png) no-repeat right center/23px auto;
}

#profile {
	padding: 50px 0 80px 0;
}

#profile h3 {
	font-size: 17px;
}

#profile .colL {
	margin-right: 16%;
}

#profile .colR {
	float: left;
}

#profile dt {
	margin-top: 45px;
	padding-left: 18px;
	font-size: 15px;
	background: url(../images/arrow.png) no-repeat left center/10px auto;
}

#profile dd {
	padding-left: 18px;
	font-size: 13px;
}

#articleIndex {
	padding: 75px 0 65px 0;
	text-align: center;
}

#articleIndex h3 {
	font-size: 20px;
	line-height: 1.6;
}

#articleIndex ul {
	display: inline-block;
	margin-top: 40px;
	margin-left: 3em;
}

#articleIndex ul > li {
	margin-left: 2.35em;
	margin-bottom: 20px;
	text-align: left;
	text-indent: -2.35em;
	font-size: 17px;
	line-height: 1.6;
}

#articleIndex ul > li em {
	color: #3C3736;
}

#articleIndex ul > li span {
	color: #FF4000;
}

#preLead {
	padding-top: 140px;
	padding-bottom: 160px;
	text-align: center;
}

#date {
	padding-top: 70px;
	padding-bottom: 80px;
	text-align: center;
}

#date img {
	max-width: 100%;
}

#info {
	padding-top: 110px;
	padding-bottom: 110px;
}

#info dl dt {
	display: inline-block;
	margin-right: 20px;
	vertical-align: top;
}

#info dl dd {
	display: inline-block;
	vertical-align: top;
	font-size: 14px;
	line-height: 1.86;
}

#info dl dd > strong {
	display: block;
	margin: 26px 0 16px 0;
	font-size: 29px;
	line-height: 1;
}

#preLead2 {
	background-color: rgba(255, 255, 255, 0.6);
	padding-top: 170px;
	padding-bottom: 160px;
	text-align: center;
	color: #3C3736;
}

#schedule {
	padding-top: 76px;
	padding-bottom: 116px;
}

#schedule h3 {
	margin-bottom: 40px;
	font-size: 24px;
	text-align: center;
}

#schedule ul {
	max-width: 600px;
	margin: 0 auto;
	font-size: 18px;
	line-height: 1;
}

#schedule ul > li {
	margin-top: 30px;
	padding-left: 22px;
	background: url(../images/arrow.png) no-repeat left 0.2em/10px auto;
}

#schedule ul > li span {
	display: inline-block;
	width: 7.6em;
}

#link {
	padding-top: 100px;
	padding-bottom: 100px;
	text-align: center;
	font-size: 17px;
}

#link ul {
	max-width: 485px;
	margin: 70px auto 0 auto;
}

#link ul > li {
	display: inline-block;
	vertical-align: top;
}

#link ul > li > a {
	display: block;
	width: 82px;
	height: 72px;
	padding-top: 36px;
	background: url(../images/house.png) no-repeat center top/contain;
	line-height: 1;
}

#link ul > li + li {
	margin-left: 80px;
}

/* archives */
#archives {
	padding-top: 102px;
}

#archives #titleBg.fixed {
	top: 102px;
}

#archivesTitle {
	position: relative;
	height: 324px;
	text-align: center;
}

#archivesTitle h2 {
	padding-top: 72px;
}

#archivesTag {
	top: 70px;
	right: 0;
	height: 230px;
	background-size: 14px auto;
}

/* responsive */
@media (min-width: 1000px) {
	#background > li:nth-child(1) {
		background-image: url(../images/making/bg2_l.jpg);
	}
	#background > li:nth-child(2) {
		background-image: url(../images/making/bg3_l.jpg);
	}
	#titleBg {
		background-image: url(../images/making/bg1_l.jpg);
	}
	#title.title4 #titleBg {
		background-image: url(../images/making/bg4_l.jpg);
	}
}

@media (max-width: 1000px) {
	#info .content {
		max-width: 700px;
		margin: 0 auto;
	}
	#info dl dt {
		display: block;
	}
}

@media (max-width: 700px) {
	.adj {
		display: none;
	}
	#title,
	#title.title4 {
		height: auto;
		padding-bottom: 0;
	}
	#title h2,
	#title.title4 h2 {
		position: static;
		width: auto;
		height: auto;
		margin-left: 0;
		padding: 0 10px 22px 10px;
		background: #fff;
		text-indent: 0;
		text-align: center;
		font-size: 20px;
		color: #3C3736;
	}
	#title #tag,
	#title.title4 #tag {
		display: block;
	}
	#tag {
		position: static;
		width: auto;
		height: auto;
		padding: 15px 0;
		text-indent: 0;
		text-align: center;
		background-color: #fff;
	}
	#lead {
		padding-bottom: 60px;
		text-align: left;
		font-size: 17px;
	}
	#lead span {
		margin-top: 30px;
	}
	#member {
		margin-top: 0;
		padding-bottom: 70px;
	}
	#member > ul,
	#member > ul#member4 {
		width: 100%;
		height: auto;
	}
	#member > ul > li,
	#member > ul#member4 > li {
		width: auto;
		margin-left: 0;
		position: static;
		text-align: left;
	}
	.article {
		padding: 50px 0;
		font-size: 14px;
	}
	.article .no > img {
		max-width: 83px;
	}
	.article h3 {
		margin-top: 26px;
		margin-bottom: 50px;
		text-align: left;
		font-size: 30px;
		line-height: 1.6;
	}
	.article dl {
		margin: 40px auto;
	}
	.article dl dd {
		margin: 0 0 28px 0;
	}
	.article .image {
		display: block;
		margin: 40px auto;
	}
	.article h4 {
		margin: 60px auto;
		font-size: 20px;
		line-height: 1.4;
	}
	.articleNav {
		margin-top: 60px;
	}
	.articleNav a {
		display: block;
		font-size: 18px;
		line-height: 30px;
	}
	.articleNav .prev > a {
		padding-left: 26px;
		background-size: 16px auto;
	}
	.articleNav .next > a {
		padding-right: 26px;
		background-size: 16px auto;
	}
	#profile {
		padding: 50px 0;
	}
	#profile dl {
		float: none;
	}
	#profile .colL {
		margin-right: 0;
	}
	#profile dt {
		margin-top: 30px;
	}
	#articleIndex {
		padding: 50px 0;
		text-align: left;
	}
	#articleIndex ul {
		margin-left: 0;
	}
	#preLead {
		padding-top: 60px;
		padding-bottom: 60px;
		text-align: left;
		font-size: 17px;
	}
	#date {
		padding-top: 60px;
		padding-bottom: 60px;
	}
	#info {
		padding-top: 60px;
		padding-bottom: 60px;
	}
	#info dl {
		float: none;
	}
	#info dl + dl {
		margin-top: 60px;
	}
	#preLead2 {
		padding-top: 60px;
		padding-bottom: 60px;
		text-align: left;
		font-size: 17px;
	}
	#schedule {
		padding-top: 60px;
		padding-bottom: 60px;
	}
	#schedule h3 {
		margin-bottom: 30px;
		text-align: left;
		font-size: 20px;
	}
	#schedule ul {
		font-size: 16px;
		line-height: 1.6;
	}
	#schedule ul > li span {
		display: block;
		width: auto;
		margin-bottom: 4px;
		line-height: 1;
	}
	#schedule ul > li + li {
		margin-top: 20px;
	}
	#link {
		padding-top: 80px;
		padding-bottom: 80px;
	}
	#link .content p {
		text-align: left;
	}
	#link .content ul {
		margin-top: 40px;
	}
	#link .content ul > li + li {
		margin-left: 5.15464%;
	}
	#archives {
		padding-top: 72px;
	}
	#member .content {
		width: 95%;
		margin: 0 auto;
	}
}