@charset "utf-8";

/* mv
---------------------------------------------------*/
#mv {
	position: relative;
	width: 100%;
	height: 340px;
	background: url('../images/bg_mv.png') no-repeat;
	background-size: cover;
	background-position-y: 70%;
	z-index: 0;
}
.mv_logo {
	position: absolute;
	top: 45px;
	left: calc((100% - 672px) / 2);
	max-width: 672px;
	height: 230px;
	background-size: contain;
	margin-left: -30px;
	z-index: 0;
}
.mv_logo img {
	width: 100%;
}

/* 1100px */
@media screen and (max-width: 1100px) {

	#mv {
		width: 100%;
		height: 30.9vw;
		background-position-y: 70%;
	}
	.mv_logo {
		position: absolute;
		top: 4.09vw;
		left: calc((100% - 61.09%) / 2);
		width: 61.09%;
		height: 20.9vw;
		background-size: contain;
		margin-left: -2.7vw;
		z-index: 0;
	}

}

/* 768px */
@media screen and (max-width: 768px) {

	#mv {
		position: relative;
		width: 100%;
		height: 29.33vw;
		background: url('../images/bg_mv_sp2.png') no-repeat;
		background-size: 100%;
		background-position: top;
		z-index: 0;
	}
	.mv_logo {
		position: absolute;
		top: 3.2vw;
		left: 17.33vw;
		width: 61.86%;
		height: 21.06vw;
		background-size: contain;
		margin-left: 0;
		z-index: 0;
	}

}

/* article
---------------------------------------------------*/
.article {
	width: 100%;
	padding: 50px 0 110px;
}
.article .inner {
	width: 980px;
	margin: 0 auto;
}
.article .date {
	font-size: 14px;
	letter-spacing: 0.05em;
	margin-bottom: 1em;
}
.article h1 {
	font-size: 28px;
	line-height: 1.35;
	color: #006fbc;
	margin-bottom: 40px;
}
.article .txt {
	font-size: 16px;
	letter-spacing: 0.03em;
	line-height: 2.375;
	margin-bottom: 3.125em;
}

.article .txt a {
  text-decoration: underline;
  color: #3399cc;
}

.article .thumb {
	width: 100%;
	height: 600px;
	margin-bottom: 50px;
}
.article .artist {
	font-size: 16px;
	line-height: 2.375;
}
.article .artist .name {
	letter-spacing: 0.1em;
	margin-bottom: 2em;
}

/* detail2 */
#detail2 .thumb_block {
	display: -webkit-flex;
	display: -ms-flex;
	display: flex;
	justify-content: space-between;
	width: 100%;
}
#detail2 .thumb {
	width: 460px;
	height: 600px;
}
#detail2 .url a {
	color: #006fbc;
	border-bottom: 1px solid #006fbc;
}
#detail2 .url a:hover {
	opacity: 0.5;
}

/* detail3 */
#detail3 .thumb {
	margin-bottom: 0;
}

/* detail4 */
#detail4 .txt {
	margin-bottom: 100px;
}
#detail4 .txt p {
	margin-bottom: 50px;
}
#detail4 .txt p:last-child {
	margin-bottom: 0;
}
#detail4 .program {
	width: 100%;
	margin-bottom: 100px;
}
#detail4 .block {
	display: -webkit-flex;
	display: -ms-flex;
	display: flex;
	justify-content: space-between;
	width: 100%;
	margin-bottom: 50px;
}
#detail4 .block:last-of-type {
	margin-bottom: 0;
}
#detail4 .block > .img {
	width: 300px;
	height: 300px;
	background-size: contain;
}
#detail4 .block .content {
	width: 625px;
	line-height: 1.875;
	font-size: 16px;
}
#detail4 .block .content p {
	margin-bottom: 1em;
}
#detail4 .block .note {
	font-size: 16px;
	line-height: 1.625;
	background: #dbebf6;
	padding: 10px 20px;
}
#detail4 .block .note a {
	font-size: 18px;
	letter-spacing: 0.1em;
	line-height: 2em;
	color: #006fbc;
	border-bottom: 1px solid #006fbc;
	border-bottom: 1px solid #006fbc;
}

#detail4 .navigator {
	width: 100%;
}
#detail4 .navigator > p {
	font-size: 16px;
	margin-bottom: 50px;
}
#detail4 .navigator ul {
	display: -webkit-flex;
	display: -ms-flex;
	display: flex;
	width: 100%;
	margin-bottom: 50px;
}
#detail4 .navigator li {
	width: 300px;
	height: 300px;
	background-size: contain;
	margin-right: 40px;
}
#detail4 .logo {
	width: 100%;
}
#detail4 .logo .bnr {
	width: 280px;
	height: 100px;
	background-size: contain;
	margin: 0 auto 30px;
}
#detail4 .logo .bnr a {
	display: block;
}
#detail4 .logo > p {
	font-size: 16px;
	text-align: center;
	letter-spacing: 0.1em;
}

/* detail5 */
#detail5 .thumb_block {
	display: -webkit-flex;
	display: -ms-flex;
	display: flex;
	justify-content: space-between;
	width: 100%;
}
#detail5 .thumb {
	width: 460px;
	height: 600px;
}
#detail5 .url a {
	color: #006fbc;
	border-bottom: 1px solid #006fbc;
}
#detail5 .url a:hover {
	opacity: 0.5;
}

#detail5 .logo {
	width: 100%;
}
#detail5 .logo .bnr {
	width: 280px;
	height: 102px;
	background-size: contain;
	margin: 0 auto 30px;
	border: solid 1px #000;
}
#detail5 .logo .bnr a {
	display: block;
}
#detail5 .logo > p {
	font-size: 16px;
	text-align: center;
	letter-spacing: 0.1em;
	line-height: 1.5em;
}

#detail7 .thumb_block {
  display: -webkit-flex;
  display: -ms-flex;
  display: flex;
  justify-content: space-between;
  width: 100%;
}
#detail7 .thumb {
  width: 460px;
}

/* 1100px */
@media screen and (max-width: 1100px) {

	.article {
		width: 100%;
		padding: 4.54vw 0 10vw;
	}
	.article .inner {
		width: 89%;
	}
	.article .date {
		font-size: 1.27vw;
	}
	.article h1 {
		font-size: 2.54vw;
		margin-bottom: 3.6vw;
	}
	.article .txt {
		font-size: 1.45vw;
	}
	.article .thumb {
		width: 100%;
		height: 54.54vw;
		margin-bottom: 4.5vw;
	}
	.article .artist {
		font-size: 1.45vw;
	}

	/* detail2 */
	#detail2 .thumb {
		width: 46.93%;
		height: 54.54vw;
	}

	/* detail4 */
	#detail4 .txt {
		margin-bottom: 9.09vw;
	}
	#detail4 .txt p {
		margin-bottom: 4.54vw;
	}
	#detail4 .program {
		width: 100%;
		margin-bottom: 9.09vw;
	}
	#detail4 .block {
		margin-bottom: 4.54vw;
	}
	#detail4 .block > .img {
		width: 27.27vw;
		height: 27.27vw;
	}
	#detail4 .block .content {
		width: 56.81vw;
		font-size: 1.45vw;
	}

	#detail4 .block .note {
		font-size: 1.45vw;
		padding: 0.9vw 1.8vw;
	}
	#detail4 .block .note a {
		font-size: 1.63vw;
	}

	#detail4 .navigator > p {
		font-size: 1.45vw;
		margin-bottom: 4.54vw;
	}
	#detail4 .navigator ul {
		margin-bottom: 4.54vw;
	}
	#detail4 .navigator li {
		width: 27.27vw;
		height: 27.27vw;
		margin-right: 3.6vw;
	}
	#detail4 .logo .bnr {
		width: 25.45vw;
		height: 9.09vw;
		margin: 0 auto 2.7vw;
	}
	#detail4 .logo > p {
		font-size: 1.45vw;
	}

	/* detail5 */
	#detail5 .thumb {
		width: 46.93%;
		height: 54.54vw;
	}


}

/* 768px */
@media screen and (max-width: 768px) {

	.article {
		width: 100%;
		padding: 6.66vw 0 14.66vw;
	}
	.article .inner {
		width: 89.86%;
	}
	.article .date {
		font-size: 3.2vw;
		letter-spacing: 0.05em;
		margin-bottom: 1em;
	}
	.article h1 {
		font-size: 6.93vw;
		line-height: 1.19;
		margin-bottom: 1em;
	}
	.article .txt {
		font-size: 3.73vw;
		line-height: 1.7;
		text-align: justify;
		margin-bottom: 6.66vw;
	}
	.article .thumb {
		width: 100%;
		height: 54.66vw;
		background-size: contain;
		margin-bottom: 6.66vw;
	}
	.article .artist {
		font-size: 3.73vw;
		line-height: 1.7;
	}

	/* detail2 */
	#detail2 .thumb {
		width: 42.66vw;
		height: 54.66vw;
	}

	/* detail4 */
	#detail4 .txt {
		margin-bottom: 13.33vw;
	}
	#detail4 .txt p {
		margin-bottom: 6.66vw;
	}
	#detail4 .program {
		margin-bottom: 13.33vw;
	}
	#detail4 .block {
		display: block;
		width: 100%;
		margin-bottom: 6.66vw;
	}
	#detail4 .block > .img {
		width: 100%;
		height: 57.6vw;
		margin-bottom: 6.66vw;
	}
	#detail4 .block:nth-of-type(1) > .img {
		background: url('../images/img_program1_sp.png') no-repeat;
		background-size: contain;
	}
	#detail4 .block:nth-of-type(2) > .img {
		background: url('../images/img_program2_sp.png') no-repeat;
		background-size: contain;
	}
	#detail4 .block > .img img {
		display: none;
	}
	#detail4 .block .content {
		width: 100%;
		font-size: 3.73vw;
		line-height: 1.7;
		margin-bottom: 13.33vw;
	}
	#detail4 .block .note {
		font-size: 3.73vw;
		letter-spacing: 0.1em;
		padding: 4vw 6.66vw;
	}
	#detail4 .block .note a {
		font-size: 3.73vw;
		line-height: 2em;
	}

	#detail4 .navigator > p {
		font-size: 3.73vw;
		line-height: 1.7;
		margin-bottom: 6.66vw;
	}
	#detail4 .navigator ul {
		display: -webkit-flex;
		display: -ms-flex;
		display: flex;
		justify-content: space-between;
		flex-wrap: wrap;
		width: 100%;
		margin-bottom: 6.66vw;
	}
	#detail4 .navigator li {
		width: 41.6vw;
		height: 41.6vw;
		background-size: contain;
		margin-right: 0;
		margin-bottom: 6.66vw;
	}
	#detail4 .navigator li:last-child {
		margin-bottom: 0;
	}
	#detail4 .logo .bnr {
		width: 74.66vw;
		height: 26.66vw;
		margin: 0 auto 6.66vw;
	}
	#detail4 .logo .bnr img {
		width: 100%;
	}
	#detail4 .logo > p {
		font-size: 3.73vw;
		text-align: left;
		letter-spacing: 0.1em;
		line-height: 1.7;
	}

	/* detail5 */
	#detail5 .thumb {
		width: 42.66vw;
		height: 54.66vw;
	}


}