@charset "UTF-8";

.groupLayout #pageTitle {
	background-image: url(../img/h2_bg.jpg);
}

.groupLayout #main {
	background: url(../img/bg01.png) no-repeat center top / contain;
}

			/* 【タブレット用のスタイル記述】 */
			@media screen and (min-width: 761px) {
			}		
			/* 【PC用のスタイル記述】 */
			@media screen and (min-width: 1200px) {
			}

.groupLayout #main #c02 {
	padding: 65px 0 0;
}

.groupLayout #main #c02 .cassette h3 {
	line-height: 1;
	padding: 0 0 40px;
}

.groupLayout #main #c02 .cassette h3 .en {
	font-size: 4rem;
	font-weight: 700;
}

.groupLayout #main #c02 .cassette h3 .text {
	font-size: 1.2rem;
	font-weight: 700;
}

.groupLayout #main #c02 .cassette ul {
	position: relative;
	padding: 9px 0 0;
}

.groupLayout #main #c02 .cassette ul:after {
	content: '';
	display: block;
	width: 41px;
	height: 100%;
	background-color: #d70c18;
	border-radius: 20.5px;
	position: absolute;
	left: 0;
	top: 0;
	z-index: 1;
}

.groupLayout #main #c02 .cassette ul li {
	position: relative;
	z-index: 2;
}

.groupLayout #main #c02 .cassette ul li .circle {
	display: inline-block;
	width: 23px;
	height: 23px;
	margin: 0 9px;
	border-radius: 11.5px;
	background-color: #fff;
	vertical-align: middle;
}

.groupLayout #main #c02 .cassette ul li .date {
	display: inline-block;
	color: #d70c18;
	font-weight: 700;
	font-size: 1.4rem;
	padding: 0 0 0 10px;
}

.groupLayout #main #c02 .cassette ul li .text {
	display: block;
	font-weight: 700;
	font-size: 1.4rem;
	padding: 0 0 15px;
	border-bottom: 1px solid #9a9a9a;
	margin: 0 0 15px 51px;
}

			/* 【タブレット用のスタイル記述】 */
			@media screen and (min-width: 761px) {
				.groupLayout #main #c02 .cassette h3 .en {
					font-size: 7rem;
				}
				.groupLayout #main #c02 .cassette h3 .text {
					font-size: 1.6rem;
				}
				.groupLayout #main #c02 .cassette ul li {
					display: flex;
				}
				.groupLayout #main #c02 .cassette ul li .date {
					box-sizing: border-box;
					width: 100px;
					padding: 0 0 0 20px;
				}
				.groupLayout #main #c02 .cassette ul li .text {
					padding: 0 0 20px;
					width: calc(100% - 141px);
					margin: 0 0 20px 20px;
					box-sizing: border-box;
				}
			}		
			/* 【PC用のスタイル記述】 */
			@media screen and (min-width: 1200px) {
				.groupLayout #main #c02 {
					padding: 90px 0 0;
				}
				.groupLayout #main #c02 .cassette h3 .en {
					font-size: 9rem;
				}
				.groupLayout #main #c02 .cassette h3 .text {
					font-size: 2rem;
				}
				.groupLayout #main #c02 .cassette ul li .date {
					width: 140px;
					padding: 0 0 0 40px;
				}
				.groupLayout #main #c02 .cassette ul li .text {
					width: calc(100% - 181px);
					padding: 0 20px 20px;
				}
			}

.groupLayout #main #c03 {
	padding: 65px 0 0;
}

.groupLayout #main #c03 .cassette h3 {
	line-height: 1;
	padding: 0 0 40px;
}

.groupLayout #main #c03 .cassette h3 .en {
	font-size: 4rem;
	font-weight: 700;
}

.groupLayout #main #c03 .cassette h3 .text {
	font-size: 1.2rem;
	font-weight: 700;
}

.groupLayout #main #c03 .cassette .list01 {
	display: flex;
	justify-content: flex-start;
	flex-wrap: wrap;
}

.groupLayout #main #c03 .cassette .list01 li {
	width: 48%;
	margin: 0 0 10px;
}
.groupLayout #main #c03 .cassette .list01 li:nth-child(odd) {
    margin-right: 2%;
}

.groupLayout #main #c03 .cassette .list01 li a {
	display: block;
	border: 1px solid #cfcfcf;
	text-align: center;
	line-height: 1.4;
	padding: 10px;
    background-color: #fff;
}

.groupLayout #main #c03 .cassette .list01 li a:link,
.groupLayout #main #c03 .cassette .list01 li a:visited {
	color: #2e2e2e;
	text-decoration: none;
}

.groupLayout #main #c03 .cassette .list01 li a img {
	width: 7.5px;
}

.groupLayout #main #c03 .cassette h4 {
	position: relative;
	line-height: 1.2;
	padding: 0 0 0 30px;
	margin: 0 0 25px;
}

.groupLayout #main #c03 .cassette h4 .en {
	font-size: 4rem;
	font-weight: 700;
}

.groupLayout #main #c03 .cassette h4 .text {
	font-size: 1.6rem;
	font-weight: 700;
}

.groupLayout #main #c03 .cassette h4:after {
	content: '';
	display: block;
	width: 14px;
	height: 100%;
	background-color: #d70c18;
	position: absolute;
	left: 0;
	top: 50%;
	transform: translateY(-50%);
}

.groupLayout #main #c03 .cassette table th {
	color: #d70c18;
}

.groupLayout #main #c03 .cassette table td {
	border-bottom: 1px solid #9a9a9a;
}

			/* 【タブレット用のスタイル記述】 */
			@media screen and (min-width: 761px) {
				.groupLayout #main #c03 .cassette h3 .en {
					font-size: 7rem;
				}
				.groupLayout #main #c03 .cassette h3 .text {
					font-size: 1.6rem;
				}
				.groupLayout #main #c03 .cassette h4 .en {
					font-size: 6.5rem;
				}
				.groupLayout #main #c03 .cassette h4 .text {
					font-size: 2.4rem;
				}
				.groupLayout #main #c03 .cassette table th {
					border-bottom: 1px solid #9a9a9a;
				}
			}		
			/* 【PC用のスタイル記述】 */
			@media screen and (min-width: 1200px) {
				.groupLayout #main #c03 {
					padding: 90px 0 0;
				}
				.groupLayout #main #c03 .cassette h3 .en {
					font-size: 9rem;
				}
				.groupLayout #main #c03 .cassette h3 .text {
					font-size: 2rem;
				}
				.groupLayout #main #c03 .cassette .list01 li {
					width: 24%;
				}
                .groupLayout #main #c03 .cassette .list01 li:nth-child(odd),
                .groupLayout #main #c03 .cassette .list01 li:nth-child(even) {
					margin-right: 1%;
				}
                .groupLayout #main #c03 .cassette .list01 li:nth-child(4n) {
					margin-right: 0;
				}
				.groupLayout #main #c03 .cassette div {
					padding: 0 40px;
				}
				.groupLayout #main #c03 .cassette table {
					margin: 0 0 40px;
				}
			}

			/* 【タブレット用のスタイル記述】 */
			@media screen and (min-width: 761px) {
			}		
			/* 【PC用のスタイル記述】 */
			@media screen and (min-width: 1200px) {
			}

			/* 【タブレット用のスタイル記述】 */
			@media screen and (min-width: 761px) {
			}		
			/* 【PC用のスタイル記述】 */
			@media screen and (min-width: 1200px) {
			}


/* clearfix
------------------------------------*/

.clearfix:after {
content: ".";
display: block;
clear: both;
height: 0;
visibility: hidden;
overflow:hidden;
}

.clearfix {
display: inline-block;
}

/* exlude MacIE5 \*/
* html .clearfix {
height: 1%
}

.clearfix {
display:block;
}
/* end MacIE5 */