@charset "UTF-8";

@media screen and (max-width: 1200px) {}

@media screen and (max-width: 1024px) {}

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

@media screen and (max-width: 520px) {}

@media screen and (max-width: 420px) {}

@media screen and (max-width: 375px) {}

/*-----------------------------------------------------------------------------------------
1001	archives
1002	archives-report
1003	archives-movie
1004	archives-letter



2006	.page .area-contact

----------------------------------------------------------------------------------------- */









/*-----------------------------------------------------------------------------------------
1001	archives & page
----------------------------------------------------------------------------------------- */
.archives .area-report::after,
.archives .area-youtube::after,
.archives .area-letter::after {
	display: none;
}

.archives .area-report,
.archives .area-youtube,
.archives .area-letter {
	border: 0px solid red;
	background: white;
	background: url('../img/common/bg-report.jpg');
	background-size: 100%;
	background-attachment: fixed;
	background-position: top left;
	padding: 0;
	margin: 0;
}

.page .area-contact {
	border: 0px solid red;
	background: white;
	background: url('../img/common/bg-profile.jpg');
	background-size: 100%;
	background-attachment: fixed;
	background-position: top left;
	padding: 0;
	margin: 0;
}


.archives h2,
.page h2 {
	padding: 0;
	margin: 1em 0 0 0;
}

.page main h2.pages {
	display:block;
	margin-top:0;
	padding-top:1em;
}


.archives h6,
.page h6 {
	width: 8%;
	min-width:80px;
	padding: 0;
	margin: 0.2em auto 0;
}

@media screen and (max-width: 1200px) {}

@media screen and (max-width: 1024px) {}

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

@media screen and (max-width: 520px) {}

@media screen and (max-width: 420px) {}

@media screen and (max-width: 375px) {}










.archives .shadow {
	background: white;
	padding: 3.0rem;
	margin: 6.0rem 0 ;
	box-shadow: 3.0rem 3.0rem 4.5rem rgba(0, 0, 0, 0.2);
}

.archives .shadow li {
	width: 33.33333%;
	padding: 1.5rem;
	padding-bottom:3.0rem;
	margin: 0;
	border: 0px solid black;
}

.archives .shadow li a {
	display:block;
}

.archives .shadow li h3 {
	color: #333;
	font-size: 1.6rem;
	font-weight: 600;
	line-height: 1.4;
	padding: 0;
	margin: 0.5em 0;
}

.archives .shadow li p {
	color: #666;
	font-size: 1.2rem;
	font-weight: 400;
	line-height: 1.6;
	padding: 0;
	margin: 0;
	height: calc(1.6 * 4em);
}

.archives .shadow li dl {
	border-bottom: 1px solid #ddd;
	padding: 4.5rem 0;
	margin: 0;
	height: 100%;
}

.archives .shadow li dl dt {
	width:33.33333%;
	padding:0;
}

.archives .shadow li dl dd {
	width:66.66666%;
	padding:0 0 0 3.0rem;
}

.archives .shadow li dl dd h3 {
	font-size:2.0rem;
	margin-top:0;
}

.archives .shadow li dl dd p {
	font-size:1.4rem;
	height:auto;
}

@media screen and (max-width: 1200px) {}

@media screen and (max-width: 1024px) {}

@media screen and (max-width: 768px) {
	.archives .shadow {
		padding: 1.5rem;
	}

	.archives .shadow li {
		padding: 1.0rem;
	}

	.archives .shadow li dl {
		padding: 3.0rem 0;
	}

	.archives .shadow li dl dd {
		padding-left:1.5rem;
	}
}

@media screen and (max-width: 520px) {
	.archives .shadow li dl {
		padding-left:1.5rem;
		padding-right:1.5rem;
	}

	.archives .shadow li:first-child dl {
		border:none;
	}

	.archives .shadow li dl dt {
		width:100%;
	}

	.archives .shadow li dl dd {
		width:100%;
		padding:1.5rem 0 0 0;
	}
}

@media screen and (max-width: 420px) {}

@media screen and (max-width: 375px) {}










/*-----------------------------------------------------------------------------------------
1002	archives-report
----------------------------------------------------------------------------------------- */
.archives.archives-report .shadow li {
	width: 100%;
	padding-top:0;
	padding-bottom:0;
}

@media screen and (max-width: 1200px) {}

@media screen and (max-width: 1024px) {}

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

@media screen and (max-width: 520px) {}

@media screen and (max-width: 420px) {}

@media screen and (max-width: 375px) {}










/*-----------------------------------------------------------------------------------------
1003	archives-movie
----------------------------------------------------------------------------------------- */
.archives.archives-movie .shadow li {
	padding-bottom:3.0rem
}

@media screen and (max-width: 1200px) {}

@media screen and (max-width: 1024px) {}

@media screen and (max-width: 768px) {
	.archives.archives-movie .shadow li {
		width:50%;
	}
}

@media screen and (max-width: 520px) {
	.archives.archives-movie .shadow li {
		width:100%;
	}
}

@media screen and (max-width: 420px) {}

@media screen and (max-width: 375px) {}










/*-----------------------------------------------------------------------------------------
1004	archives-letter
----------------------------------------------------------------------------------------- */
.archives.archives-letter .shadow li {
	width: 25%;
}

.archives.archives-letter .shadow li h3 {
	font-weight: 400;
	margin-top: 0;
}

@media screen and (max-width: 1200px) {}

@media screen and (max-width: 1024px) {}

@media screen and (max-width: 768px) {
	.archives.archives-letter .shadow li h3 {
		font-size: 1.4rem;
	}
}

@media screen and (max-width: 520px) {
	.archives.archives-letter .shadow li {
		width: 50%;
	}
}

@media screen and (max-width: 420px) {}

@media screen and (max-width: 375px) {}










/*-----------------------------------------------------------------------------------------
2006	.area-profile .first
----------------------------------------------------------------------------------------- */
.page .area-profile .first {
	border: 0px solid black;
	padding: 6.0rem 0 0 0;
	margin: 0;
}

@media screen and (max-width: 1200px) {}

@media screen and (max-width: 1024px) {}

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

.page .area-profile .first dl {
	padding-left:5%;
	padding-right:5%;

}

.page .area-profile .first dl dt {
	width: 100%;
	height:0;
	overflow: hidden;
	position: relative;
	z-index: 1;
	padding: 7.5%;
	margin: 0;
	display:block;
	padding-bottom:100%;
	background:white;
	box-shadow: 10px 10px 15px rgba(150, 150, 150, 0.1);

}

.page .area-profile .first dl dd {
	border: px solid blue;
	width: 100%;
	position: relative;
	margin:0;
	z-index: 2;
	-webkit-align-items: flex-end;
	-ms-flex-align: flex-end;
	align-items: flex-end;
	display: -webkit-flex;
	display: -ms-flexbox;
	display: flex;
	-webkit-flex-wrap: wrap;
	-ms-flex-wrap: wrap;
	flex-wrap: wrap;
	padding:0;
	box-shadow: 10px 10px 15px rgba(150, 150, 150, 0.1);
}

.page .area-profile .first blockquote {
	padding: 7.5%;
	background: white;
	border:none;
}

.page .area-profile .first h3 {
	font-size: calc(4.0rem * 0.8);
	left-align:left;
}

.page .area-profile .first h4 {
	font-size: calc(3.0rem * 0.8);
}

.page .area-profile .first p {
	font-size: calc(1.6rem * 0.8);
}
}

@media screen and (max-width: 520px) {
	.page .area-profile .first h3 {
		font-size: calc(4.0rem * 0.75);
		left-align:left;
	}

	.page .area-profile .first h4 {
		font-size: calc(3.0rem * 0.75);
	}

	.page .area-profile .first p {
		font-size: calc(1.6rem * 0.75);
	}
}

@media screen and (max-width: 420px) {}

@media screen and (max-width: 375px) {}










/*-----------------------------------------------------------------------------------------
2006	.page .area-contact
----------------------------------------------------------------------------------------- */
.page .area-contact  {
	border: 0px solid black;
	padding: 6.0rem  0;
	margin: 0;
}

.page .area-contact dl.flexbox	{
	padding:0;
	margin:6.0rem auto;
	max-width:960px;
}

.page .area-contact dl.flexbox .col-12 {
	width:100%;
	padding:6.0rem;
	margin:0 0 3.0rem;
	box-shadow: 10px 10px 15px rgba(150, 150, 150, 0);
	background:transparent;
}

.page .area-contact dl.flexbox dt,
.page .area-contact dl.flexbox dd	{
	border:none;
}

.page .area-contact h3 {
	font-family: 'Noto Sans JP', "ヒラギノ角ゴ ProN W3", "Hiragino Kaku Gothic ProN", "メイリオ", "游ゴシック", YuGothic, "游ゴシック体", "ヒラギノ角ゴ Pro W3", "Yu Gothic", sans-serif;
	font-size:3.0rem;
	border-left:10px solid #650002;
	border-bottom:1px solid #650002;
	border-top:1px solid #650002;
	padding:0.3em 0.5em;
}

.page .area-contact dl.flexbox dd h3 {
	border-color:#444444;
}


@media screen and (max-width: 1200px) {}

@media screen and (max-width: 1024px) {}

@media screen and (max-width: 768px) {
	.page .area-contact dl.flexbox .col-12 {
	padding:0
}
.page .area-contact h3 {
font-size:calc( 3.0rem * 0.9);
}
}
@media screen and (max-width: 520px) {
	.page .area-contact h3 {
	font-size:calc( 3.0rem * 0.8);
	border-left:6px solid #650002;
	}
}

@media screen and (max-width: 420px) {}

@media screen and (max-width: 375px) {}