/* CSS Document */
html {
    font-size: 62.5%;
}
h1,h2,h3,h4,h5,p,li,dt,dd {
	font-family: 'Noto Sans JP', sans-serif;
}
.sp {
    display: none;
}
.sp-540{
    display: none;
}
.imp_sp-540 {
	display: none!important;
}
.sp-850{
    display: none;
}
.sp-920{
    display: none;
}
.tablet{
    display: none;
}
.color__blue {
	color: #0000ff!important;
	text-decoration: none;
}
.color__red {
	color: #ff0200;
}
/*=============== フェイドイン ===============*/
.fade {
  /* 最初は非表示 */
  opacity: 0;
  visibility: hidden;
  transform: translateY(30px);
  transition: opacity 1s, visibility 1s, transform 1s;
}
/* フェードイン時に入るクラス */
.is-fadein {
  opacity: 1;
  visibility: visible;
  transform: translateX(0);
}
/*--------------
      intro 
----------------*/
.intro__container {
	background: url("../img/mv_bg.png");
	max-width: 1440px;
	margin: 70px auto;
}
.intro__content--title {
	font-size: 51px;
	font-weight: 500;
	margin-bottom: 35px;
}
.intro__content--wrap {
	display: flex;
	max-width: 1160px;
	margin: 0 auto;
	padding-top: 58px;
	padding-bottom: 22px;
}
.intro__content--text p {
	font-size: 15px;
	font-weight: 400;
	max-width: 560px;
}
.intro__content--img {
	max-width: 545px;
	width: 100%;
	margin-left: -10rem;
}
/*--------------
     navの調整 
----------------*/
.mt-6 {
	max-width: 1200px;
	margin: 0 auto;
}
.c-borderList-fit a {
	font-size: 14px;
}
.c-borderList-fit ul {
	gap: 2.4rem 3rem;
}
/*--------------
     content 
----------------*/
.content05 .content__container {
	padding-bottom: 6.5rem;
}
.content__title--box {
	max-width: 1160px;
	margin: 6.5rem auto;
	border: 1px solid #000;
	position: relative;
}
.content__title--band {
	background: #000;
	color: #fff;
	max-width: 20rem;
	padding: .8rem;
	text-align: center;
	position: absolute;
	top: 0;
	left: 0;
}
.content02 .content__title--band,
.content03 .content__title--band,
.content04 .content__title--band {
	max-width: 21rem;
}

.content__title {
	font-size: 4rem;
	font-weight: 500;
	margin-left: 6.3rem;
	margin-top: 4rem;
}
.content05 .content__title,
.content06 .content__title{
	margin-bottom: 4rem;
}
.content__title span {
	font-size: 5.1rem;
}
.content__title--text {
	font-size: 2.5rem;
	font-weight: 700;
	margin: 2rem auto 3rem 6.3rem;
	color: #686868;
}
.content__title--img {
	max-width: 24.8rem;
	width: 100%;
	position: absolute;
	top: 0;
	right: 0;
}
.mt-5 {
	text-align: center;
}
.mt-5:last-of-type {
	padding-top: 5rem;
}
rt {
	font-size: 1rem;
}
.content__arrow {
	font-size: 1rem;
}
.content__title--sp {
	pointer-events: none;
}

.content__history--box {
	position: relative;
	max-width: 95rem;
	margin: 0 auto;
}
.content06 .content__history--box {
	padding-bottom: 45rem;
}
.content__history--box::before {
	content: "";
    width: 1px;
    height: 100%;
    background-color: gray;
    position: absolute;
    top: 7.3rem;
    left: 50%;
}
.content05 .content__history--box::before,
.content06 .content__history--box::before{
	height: 98.5%;
}
.content__history--year p {
	font-size: 5.1rem;
	text-align: center;
	position: relative;
	color: #686868;
	max-width: 28rem;
	margin: auto;
}
.content__history--year p::after {
	content: "";
	height: 1px;
	width: 100%;
	position: absolute;
	top: 72px;
	left: 0;
	background: #000;
}
.content__history--box h4 {
	font-size: 1.8rem;
	font-weight: bold;
	color: #686868;
	margin-bottom: 2.7rem;
	margin-top: 3rem;
}
.content__history {
	display: flex;
}
.content__left p {
	max-width: 44rem;
	font-size: 1.5rem;
	font-weight: 400;
}
.content__right {
	flex-direction: row-reverse;
}
.content__right p {
	max-width: 44rem;
	font-size: 1.5rem;
	font-weight: 400;
}
.content__right div {
	flex: 0 0 44%;
}
.content__history dt {
	font-size: 7rem;
	color: #686868;
}
.content__history dt span {
	font-size: 1.4rem;
	display: block;
	margin-top: -1.5rem;
}
.content__history dd {
	font-size: 1.5rem;
	margin-top: 1rem;
	max-width: 44rem;
}
.content__caption {
	font-weight: 400;
}
.content__history dd img{
	margin: 1rem 0;
}
.content__history img {
	display: block;
}
.content__catch {
	font-weight: bold;
	font-size: 1.6rem;
}
.content__link {
	text-align: right;
}
.content__link a {
	text-decoration: none;
}
.content__link span {
	color: #e8001e;
	margin-right: .5rem;
}
.content__img {
	margin-top: 1rem;
}
.content01 .content__catch {
	display: block;
	margin: 5rem auto 1.5rem;
}
.content01 .content__history:nth-of-type(7) {
	margin-top: -7rem;
}
.content01 .content__history:nth-of-type(13) {
	margin-top: -4rem;
}
.content01 .content__history:nth-of-type(14) {
	margin-top: -7rem;
}
.content01 .content__history:nth-of-type(14) img{
	margin-bottom: 1.5rem;
}
.content01 .content__history:nth-of-type(16) {
	margin-top: -31rem;
}
.content02 .content__history:nth-of-type(6) {
	margin-top: -29rem;
}
.content02 .content__history:nth-of-type(8) {
	margin-top: 5rem;
}
.content03 .content__history:nth-of-type(6) {
	margin-top: -7rem;
}
.content03 .content__history:nth-of-type(16) {
	margin-top: -7rem;
}
.content04 .content__history:nth-of-type(4) {
	margin-top: -71rem;
	margin-right: -1rem;
}
.content04 .content__right:nth-of-type(4) div{
	flex: 0 1 auto;
}
.content04 .content__history:nth-of-type(7) {
	margin-top: -5rem;
}
.content04 .content__history:nth-of-type(21) {
	margin-top: -33rem;
}
.content05 .content__history:nth-of-type(2) {
	margin-top: 5rem;
}
.content05 .content__history:nth-of-type(3) {
	margin-top: -5rem;
}
.content05 .content__history:nth-of-type(15) {
	margin-top: -27rem;
}
.content05 .content__history:nth-of-type(18) {
	margin-top: -38rem;
}
.content06 .content__history:nth-of-type(2) {
	margin-top: 5rem;
}
.content06 .content__history:nth-of-type(3) {
	margin-top: -7rem;
}
.content06 .content__history:nth-of-type(9) {
	margin-top: -7rem;
}
.content06 .content__history:nth-of-type(13) {
	margin-top: -27rem;
}
.content06 .content__history:nth-of-type(23) {
	margin-top: -79rem;
}
/*
#content01,
#content02,
#content03,
#content04,
#content05,
#content06 {
	padding-top: .1rem;
	margin-top: -.1rem;
}
*/
/*================================================================================================================================*/

/*=========== 最大ブレイクポイント(PCコンテンツ幅+1) =============*/

@media screen and ( max-width:1161px ) {
	.intro__content--wrap {
		max-width: 1000px;
	}
	.intro__content--title {
		font-size: 39px;
	}
	.intro__content--img {
		max-width: 428px;
	}
	.mt-6 {
		max-width: 1000px;
	}
	.content__title--box {
		max-width: 1000px;
	}
	.content__title {
		font-size: 3.2rem;
	}
	.content__title span {
		font-size: 4.5rem;
	}
	.content__title--img {
		max-width: 22.8rem;
	}
}

/*================ iPadの基準ブレイクポイント ================*/

@media screen and ( max-width:1025px ){
	.intro__content--wrap {
		max-width: 800px;
	}
	.intro__content--title {
		font-size: 33px;
	}
	.intro__content--img {
		max-width: 364px;
	}
	.mt-6 {
		max-width: 800px;
	}
	.content__title--box {
		max-width: 800px;
	}
	.content__title {
		font-size: 2.4rem;
	}
	.content__title span {
		font-size: 3.8rem;
	}
	.content__title--text {
		font-size: 2rem;
	}
	.content__title--img {
		max-width: 20rem;
	}
	.content__history--box {
		max-width: 80rem;
	}
	.content__left p {
		max-width: 38rem;
	}
	.content__left {
		max-width: 38rem;
	}
	.content04 .content__history:nth-of-type(4) {
		margin-right: 0;
	}
	.content04 .content__right:nth-of-type(4) div {
		max-width: 38rem;
	}
    
}

/*========== 実機で検証できるブレイクポイント(第9世代) ==========*/

@media screen and ( max-width:820px ) {
	
}

/*================ 基本的なブレイクポイント ==================*/

@media screen and ( max-width:770px ){
    .intro__content--wrap {
		max-width: 600px;
	}
	.intro__content--title {
		font-size: 2.4rem;
	}
	.intro__content--img {
		max-width: 280px;
		margin-left: -3rem;
	}
	.intro__content--text p {
		max-width: 400px;
	}
	.mt-6 {
		max-width: 60rem;
	}
	.content__title--img {
		max-width: 16.6rem;
	}
	.content__title {
		font-size: 1.9rem;
		margin-left: 3.3rem;
	}
	.content__title span {
		font-size: 2.8rem;
	}
	.content__title--text {
		font-size: 1.5rem;
		margin: 2rem auto 3rem 3.3rem;
	}
	.content__history--box {
		max-width: 60rem;
	}
	.content__left p {
		max-width: 28rem;
	}
	.content__left {
		max-width: 28rem;
	}
	.content04 .content__right:nth-of-type(4) div {
		max-width: 28rem;
	}
	.content05 .content__history:nth-of-type(16) {
	margin-top: 7rem;
}
 
}

/*================================================================================================================================*/


/*============== iPhoneの基準ブレイクポイント ================*/

@media screen and ( max-width:540px ) {
	.sp-540 {
		display: block;
	}
	.pc-540 {
		display: none;
	}
	.imp_pc-540 {
		display: none!important;
	}
	.imp_sp-540 {
		display: block!important;
	}
	p,a,th,td,dt,dd {
		font-size: 1.5rem;
    }
	.intro__container {
		background: url("../img/mv_bg_sp.png");
		max-width: 1440px;
		margin: 20px auto;
	}
	.intro__content--title {
		font-size: 2.4rem;
		margin-bottom: 2rem;
	}
	.intro__content--wrap {
		display: block;
		max-width: 33.7rem;
		margin: 0 auto;
	}
	.intro__content--img {
		margin-left: 0;
	}
	.c-borderList-fit ul {
		display: block;
	}
	.mt-6 {
		max-width: 33.7rem;
	}
	.mt-5:last-of-type {
		padding-top: 0;
	}
	.content__history--box h4 {
		width: 33.7rem;
	}
	.content__title--sp{
		pointer-events: all;
		position: relative;
	}
	.content__title--sp::after {
		content: "▼";
		color: #ff0200;
		font-size: 1.5rem;
		position: absolute;
		bottom: 0;
		right: 0;
	}
	.content__toggle--sp{
		display: none;
	}
	.content__close--sp {
		text-align: center;
		margin: 2rem;
	}
	.content__arrow {
		font-size: 1.5rem;
		margin-left: 1.5rem;
	}
	.content__border {
		border: .5px solid #000;
	}
	.content__title span {
		font-size: 3rem;
	}
	.content__title {
		font-size: 2rem;
		margin-left: 1.3rem;
	}
	.content__title--box {
		max-width: 33.7rem;
	}
	.content__title--text {
		font-size: 1.4rem;
		margin-left: 1.3rem;
		margin-right: 1.3rem;
	}
	.content__title--img {
		max-width: 13.5rem;
	}
	.content__history--box::before {
		content: none;
	}
	.content__history--year p::after {
		content: none;
	}
	.content__history {
		max-width: 33.7rem;
		margin: 0 auto;
	}
	.content__history img {
		margin: 0 auto;
	}
	.content__history--sp {
		margin-top: 1rem;
		display: block;
	}
	.content__history--sp p {
		margin-top: 1rem;
	}
	.content__catch {
		font-weight: bold!important;
	}
	.content__link {
		text-align: left;
	}
	.content01 .content__catch {
		margin: 3rem auto 1.5rem;
	}
	.content01 .content__history:nth-of-type(16),
	.content02 .content__history:nth-of-type(6),
	.content02 .content__history:nth-of-type(8),
	.content03 .content__history:nth-of-type(6),
	.content04 .content__history:nth-of-type(7),
	.content04 .content__history:nth-of-type(4),
	.content03 .content__history:nth-of-type(16),
	.content05 .content__history:nth-of-type(3),
	.content06 .content__history:nth-of-type(3) {
		margin-top: 0;
	}
	.content04 .content__history:nth-of-type(4) {
		margin: 0 auto;
	}
	.content01 .content__history:nth-of-type(11) .content__history--sp p,
	.content04 .content__history:nth-of-type(2) .content__history--sp p,
	.content04 .content__history:nth-of-type(4) .content__history--sp p,
	.content05 .content__history:nth-of-type(16) .content__history--sp p,
	.content06 .content__history:nth-of-type(11) .content__history--sp p {
		margin-left: 3rem;
	}
   .content05 .content__history--year,
   .content06 .content__history--year {
		margin-top: 4rem;
	}
	.content06 .content__history--box {
		padding-bottom: 8rem;
	}
    
    .content__left p {
        max-width: 34rem;
        margin: 0 auto;
    }
    .content04 .content__right:nth-of-type(4) div {
        max-width: 34rem;
    }
    .content__right p {
        max-width: 34rem;
        margin: 0 auto;
    }
}

/*============= 実機で検証できるブレイクポイント ==============*/

@media screen and ( max-width:375px ) {
	
}
@media screen and ( max-width:350px ) {
   
}