/* layout sp
--------------------------------------------------*/
@media screen and (max-width: 640px) {

html,body {
	position:relative;
	width:100%;
	min-width:320px;
	height:100%;
	text-align:left;
	-webkit-text-size-adjust: none;
	overflow-x:hidden;
}

html {
	overflow-y: scroll; /* ← スクロールバーの幅を最初から確保 */
}

body{
	padding:0;
	box-sizing:border-box;
	overflow:hidden;
	height:100%;
	
	border-left:5px solid #f00f1d;
	border-right:5px solid #f00f1d;
	border-top:5px solid #f00f1d;
}


body::after{
	content:"";
	position:fixed;
	top:0;
	left:0;
	right:0;
	bottom:0;
	border:5px solid #f00f1d;
	box-sizing:border-box;
	pointer-events:none;
	z-index:9999;
	display:none;
}



/* 共通 */
.over{
	transition:0.2s ease;
}

.over:hover{
	opacity:1;
}

.go_top {
	position: fixed;
	right: 2.5vw;
	bottom: 2.5vw;
	display:none;
	z-index:3;
	transition:0.2s ease;
	width:16vw;
}

.go_top img{
	width:100%;
	height:auto;
	display:block;
}

.go_top:hover{
	opacity:1;
}


/* ヘッダー */
.header_set{
	position:relative;
	display:none;
	z-index:3;
}


header{
	position:fixed;
	width:100%;
	height:auto;
	top:-1px;
	right:auto;
	left:0;
	padding-right:0;
	padding-left:10vw;
	background:#f00f1d;
	line-height:1;
	display:flex;
	flex-direction:column;
	align-items:flex-start;
	justify-content:center;
	border-radius:8px;
	box-sizing:border-box;
	z-index:3;
	padding-top:10vw;
	padding-bottom:10vw;

	opacity:0;
	visibility:hidden;
	transform:translateY(-20px);

	transition:.4s ease;
	pointer-events:none;
}


header.show{
	opacity:1;
	visibility:visible;
	transform:translateY(0);
	pointer-events:auto;
}


header a{
	color:#ffffff;
	display:flex;
	align-items:center;
	justify-content:center;
	gap:5vw;
	text-decoration:none;
	letter-spacing:0.05em;
	height:15vw;
	padding:0;
	font-size:5vw;
}

.header_block{
	position:relative;
	width:5vw;
	height:auto;
	margin-top:1vw;
}

.header_btn{
	position:fixed;
	top:0;
	right:0;
	width:16vw;
	height:16vw;
	background:#f00f1d;
	border-radius:0 0 0 8px;
	z-index:1;
	cursor:pointer;
	z-index:4;
}

.header_btn img{
	width:100%;
	height:auto;
	display:block;
}



.mv{
	position:relative;
	width:100%;
	height:143vw;
}



.line{
	position:absolute;
	top:125vw;
	left:50%;
	transform:translateX(-50%);
	width:2px;
	height:13vw;
	overflow:hidden;
	/*opacity:0;*/
	opacity:1;
	animation:lineFadeIn 1.2s ease forwards;
	z-index:1;
}

.line.active{
	animation:lineFadeIn 1.2s ease forwards;
}

@keyframes lineFadeIn{

	0%{
		opacity:0;
	}

	100%{
		opacity:1;
	}
	}

.line::before{
	content:"";
	position:absolute;
	left:0;
	top:0;
	width:100%;
	height:100%;
	background:#dd2819;

	animation:lineLoop 2s ease-in-out infinite;
}

@keyframes lineLoop{

	0%{
		transform:translateY(-100%);
	}

	45%{
		transform:translateY(0%);
	}

	55%{
		transform:translateY(0%);
	}

	100%{
		transform:translateY(100%);
	}

}





/* ヒストリーベースレイアウト */
.history_parts_set{
	position:relative;
	width:100%;
	z-index:1;
}

.history_parts_set02{
	position:relative;
	width:100%;
	z-index:1;
}

.history_parts01{
	position:absolute;
	top:95vw;
	left:50%;
	margin-left:-30vw;
	width:10vw;
}

.history_parts02{
	position:absolute;
	top:169vw;
	left:50%;
	margin-left:15vw;
	width:30vw;
}


.history_parts03{
	position:absolute;
	top:257vw;
	left:50%;
	margin-left:-23vw;
	width:15vw;
}

.history_parts04{
	position:absolute;
	top:358vw;
	left:50%;
	margin-left:13vw;
	width:28vw;
}


.history_parts05{
	position:absolute;
	top:432vw;
	left:50%;
	margin-left:-23vw;
	width:10vw;
}

.history_parts06{
	position:absolute;
	top:555vw;
	left:50%;
	margin-left:15vw;
	width:25vw;
}


.history_parts07{
	position:absolute;
	top:703vw;
	left:50%;
	margin-left:-25vw;
	width:10vw;
}



/* 後半 */

.history_parts08{
	position:absolute;
	top:8vw;
	left:50%;
	margin-left:20vw;
	width:15vw;
}


.history_parts09{
	position:absolute;
	top:210vw;
	left:50%;
	margin-left:15vw;
	width:22vw;
}


.history_parts10{
	position:absolute;
	top:338vw;
	left:50%;
	margin-left:-30vw;
	width:8vw;
}



.history_parts01 img,
.history_parts02 img,
.history_parts03 img,
.history_parts04 img,
.history_parts05 img,
.history_parts06 img,
.history_parts07 img,
.history_parts08 img,
.history_parts09 img,
.history_parts10 img{
	width:100%;
	height:auto;
	display:block;
}


.history_set{
	position:relative;
	width:100%;
	margin-top:0;
	padding-bottom:40vw;
}

.history_caption01{
	position:relative;
	left:50%;
	width:90%;
	transform:translateX(-50%);
	display:block;
	line-height:1;
	color:#f00f1d;
	font-family: "Lato";
	font-weight:bold;
	letter-spacing:0.1em;
	font-size:6.4vw;
	margin-bottom:-5vw;
}

.gtn_history .date01{
	position:relative;
	text-align:left;
	font-weight:bold;
	margin-bottom:2vw;
	letter-spacing:0.05em;
	line-height:1;
	color:#f00f1d;
	display:block;
	font-size:5vw;
}

.gtn_history{
	position:relative;
	left:5%;
	width:90%;
	margin-left:0;

	display:flex;
	flex-direction:column;
	gap:2vw;
	margin-top:15vw;
	z-index:1;
}

.gtn_history .box{
	width:100%;
	padding:3vw 5vw;
	background:#f00f1d;
	box-sizing:border-box;
	border-radius:8px;
	box-shadow: 0 0 10px 0px rgba(0,0,0,0.25);
}

.gtn_history .caption01{
	font-size:4.2vw;
	font-weight:500;
	line-height:1.8;
	color:#ffffff;
	display:block;
}

.gtn_history .caption02{
	font-size:4.5vw;
	line-height:1.8;
	color:#ffffff;
	display:block;
	letter-spacing:0em;
}

.gtn_history .text01{
	font-size:3.2vw;
	line-height:1.8;
	color:#ffffff;
	display:block;
	margin-top:2vw;
}

.gtn_history .white_box{
	background:#ffffff;
}

.gtn_history .white_box .caption01{
	color:#f00f1d;
}

.gtn_history .white_box .text01{
	color:#f00f1d;
}

.gtn_history .attention{
	font-size:2.8vw;
	line-height:1.8;
	color:#ffffff;
	display:block;
	margin-top:2.5vw;
}

	
	
.society_history{
	position:relative;
	left:5%;   /* ←右カラム位置 */
	margin-left:0;
	width:90%;
	padding:3vw 5vw;
	background:#f5f5f5;
	box-sizing:border-box;
	border-radius:8px;
	box-shadow: 0 0 10px 0px rgba(0,0,0,0.1);
	z-index:1;
}

.foreign_history{
	position:relative;
	left:5%;   /* ←右カラム位置 */
	margin-left:0;
	width:90%;
	padding:3vw 5vw;
	background:#e6f6ff;
	box-sizing:border-box;
	border-radius:8px;
	box-shadow: 0 0 10px 0px rgba(0,0,0,0.1);
	z-index:1;
}

sup{
	font-size:2vw;
	vertical-align: super;
	line-height: 0;
	margin-left:1vw;
	margin-right:1vw;
	letter-spacing:0.2em;
}

.annotation{
	position:relative;
	width:90%;
	left:0;
	margin-left:5%;
	z-index:1;
	margin-top:5vw;
	text-align:right;
}

.annotation_text{
	position:relative;
	font-size:2.5vw;
	line-height:1.8;
	text-align:left;
	display:inline-block;
	color:#999999;
}

.annotation_text_mark{
	margin-left:-1.8em;
}


.right_history01{
	margin-top:10vw;
}

.right_history02{
	margin-top:10vw;
}

.right_history03{
	margin-top:10vw;
}

.right_history04{
	margin-top:10vw;
}

.right_history05{
	margin-top:10vw;
}

.right_history06{
	margin-top:10vw;
}

.right_history07{
	margin-top:10vw;
}

.right_history08{
	margin-top:10vw;
}

.right_history09{
	margin-top:10vw;
}

.right_history10{
	margin-top:10vw;
}



/* ヒストリー世の中の動き見出し */
.society_history .caption,
.foreign_history .caption{
	display:flex;
	align-items:center;
	justify-content:center;
	gap:5vw;
	margin-bottom:3vw;
	line-height:1;
	font-size:3.2vw;
	font-weight:bold;
	letter-spacing:0.075em;
}

.society_history .caption::before,
.society_history .caption::after,
.foreign_history .caption::before,
.foreign_history .caption::after{
	content:"";
	width:20px;
	height:1px;
	background:#d0d0cf;
	display:block;
}


/* ヒストリー世の中の動きテキスト */
.society_history .text_set{
	display:flex;
	gap:3vw;
	align-items:flex-start;
	line-height:1.8;
	margin-bottom:1vw;
	letter-spacing:0em;
	font-size:3.2vw;
}

.society_history .text_set:last-child{
	margin-bottom:0;
}


.society_history .year{
	font-weight:bold;
	white-space:nowrap;
}

.society_history .text{
	display:block;
}


/* 在留外国人をとりまく環境テキスト */
.foreign_history .text_set{
	display:flex;
	gap:3vw;
	align-items:flex-start;
	line-height:1.8;
	margin-bottom:1vw;
	letter-spacing:0em;
	font-size:3.2vw;
}

.foreign_history .text_set:last-child{
	margin-bottom:0;
}

.foreign_history .year{
	font-weight:bold;
	white-space:nowrap;
}

.foreign_history .text{
	display:block;
}



/* ヒストリー赤丸 */
.pulse{
	position:absolute;
	top:-5vw;
	left:50%;
	margin-left:-5vw;
	right:auto;
	width:10vw;
	height:10vw;
}

/* 中央の固定丸 */
.pulse_core{
	position:absolute;
	top:50%;
	left:50%;
	width:3.5vw;
	height:3.5vw;
	transform:translate(-50%,-50%);
	border-radius:50%;
	background:#ff0000;
	z-index:2;
}

.pulse span{
	position:absolute;
	top:50%;
	left:50%;
	width:12vw;
	height:12vw;
	margin:-6vw 0 0 -6vw;
	border-radius:50%;
	background:#ff0000;
	opacity:0;
	transform:scale(0.2);
	animation:pulseCircle 2s infinite;
}

.pulse span:nth-child(2){
	animation-delay:0.4s;
}

@keyframes pulseCircle{

	0%{
		transform:scale(0.2);
		opacity:0.6;
	}

	75%{
		transform:scale(1);
		opacity:0;
	}

	100%{
		transform:scale(1);
		opacity:0;
	}

}


/* ヒストリーバー */
.history_bar_bg{
	position:absolute;
	top:0;
	left:50%;
	transform:translateX(-50%);
	width:2px;
	height:100%;
	background:#f5f5f5;
	opacity:0;
	transition-duration:0.2s;
}

.history_bar{
	position:absolute;
	top:0;
	left:50%;
	transform:translateX(-50%);
	width:2px;
	height:0;
	background:#dd231b;
	border-radius:999px;
	opacity:0;
	transition-duration:0.2s;
}

.history_bar_bg.is-active,
.history_bar.is-active{
	opacity:1;
}


/* スライダー */
.history_photo_set_first{
	margin-top:10vw;
}

.history_photo_set{
	position:relative;
	overflow:hidden;
	width:100%;
	margin-top:10vw;
}

.history_photo_box{
	display:flex;
	width:max-content;
}

.history_photo{
	width:38vw;
	flex-shrink:0;
}

.history_photo img{
	width:100%;
	display:block;
}











/* ミッション */
.mission_parts_set{
	position:relative;
	width:100%;
	z-index:1;
}

.mission_parts01{
	position:absolute;
	top:-25vw;
	left:50%;
	margin-left:-25vw;
	width:10vw;
}

.mission_parts02{
	position:absolute;
	top:0vw;
	left:50%;
	margin-left:27vw;
	width:10vw;
}


.mission_parts03{
	position:absolute;
	top:1vw;
	left:50%;
	margin-left:-42vw;
	width:10vw;
}

.mission_parts04{
	position:absolute;
	top:20vw;
	left:50%;
	margin-left:20vw;
	width:7vw;
}


.mission_parts05{
	position:absolute;
	top:35vw;
	left:50%;
	margin-left:37vw;
	width:14vw;
}

.mission_parts06{
	position:absolute;
	top:-78vw;
	left:50%;
	margin-left:-51vw;
	width:10vw;
}


.mission_parts07{
	position:absolute;
	top:-67vw;
	left:50%;
	margin-left:-38vw;
	width:7vw;
}



.mission_parts01 img,
.mission_parts02 img,
.mission_parts03 img,
.mission_parts04 img,
.mission_parts05 img,
.mission_parts06 img,
.mission_parts07 img{
	width:100%;
	height:auto;
	display:block;
}



.mission_vision_set{
	position:relative;
	width:100%;
	background:#f00f1d;
	padding-bottom:20vw;
}

.mission_bg_parts01{
	position:relative;
	width:auto;
	height:32vw;
	margin-top:-32vw;
}

.mission_bg_parts01 img{
	position:relative;
	left:50%;
	transform: translateX(-50%);
	width:150vw;
	height:32vw;
	display:block;
}

.mission_vision_caption01{
	font-size:5.2vw;
	font-family: "Lato";
	font-weight:bold;
	letter-spacing:0.1em;
	text-align:center;
	color:#ffffff;
	line-height:1;
	display:block;
	margin-bottom:5vw;
}

.mission_vision_text01{
	font-size:6.4vw;
	font-weight:bold;
	letter-spacing:0.025em;
	text-align:center;
	color:#ffffff;
	line-height:1.8;
	display:block;
	margin-bottom:7vw;
	margin-left:0.5em;
}

.mission_vision_text02{
	font-size:3.8vw;
	text-align:center;
	color:#ffffff;
	line-height:2;
	display:block;
	margin-bottom:10vw;
	letter-spacing:0;
}



.mission_vision_movie_set01{
	position:relative;
	width:90%;
	aspect-ratio:16 / 9;
	display:block;
	margin:0 auto 0;
}


.mission_vision_movie_set01 iframe{
	position:absolute;
	top:0;
	left:0;
	width:100%;
	height:100%;
	border:0;
}



	
.mission_vision_link_text01,
.mission_vision_link_text02{
	position:relative;
	display:flex;
	align-items:center;
	justify-content:center;
	margin-top:5vw;
	margin-bottom:3vw;
}

	
.mission_vision_link_text02{
	margin-top:0;
	margin-bottom:0;
}

.mission_vision_link_text01 a,
.mission_vision_link_text02 a{
	position:relative;
	width:90%;
	height:18vw;
	color:#ffffff;
	display:flex;
	align-items:center;
	justify-content:center;
	gap:0;
	text-decoration:none;
	letter-spacing:0.05em;
	line-height:1.6;
	font-size:3.8vw;
	background:#f33f4a;
	transition:0s;
	border-radius:8px;
	text-align:center;
}

.mission_vision_link_text01 a:hover,
.mission_vision_link_text02 a:hover{
	color:#ffffff;
	background:#f33f4a;
	transition:0s;
}


.cursor02{
	position:absolute;
    top: 50%;
    transform: translateY(-50%);
    left: 5vw;
	width:7.2vw;
	height:auto;
}









/* メッセージ */
.message_parts_set{
	position:relative;
	width:100%;
	z-index:1;
}

.message_parts01{
	position:absolute;
	top:-8vw;
	left:50%;
	margin-left:-7vw;
	width:14vw;
}

.message_parts02{
	position:absolute;
	top:-9vw;
	left:50%;
	margin-left:16vw;
	width:43vw;
}

.message_parts01 img,
.message_parts02 img{
	width:100%;
	height:auto;
	display:block;
}


.message_set{
	position:relative;
	width:100%;
	background:#f2f2f2;
	padding-top:20vw;
	padding-bottom:20vw;
}

.message_caption01{
	font-size:5.2vw;
	font-family: "Lato";
	font-weight:bold;
	letter-spacing:0.1em;
	text-align:center;
	color:#f00f1d;
	line-height:1;
	display:block;
	margin-bottom:10vw;
}


.message_box01{
	width:90%;
	padding:8vw;
	background:#ffffff;
	box-sizing:border-box;
	border-radius:8px;
	box-shadow: 0 0 10px 0px rgba(0,0,0,0.25);
	margin:auto;
	display:flex;
	flex-direction:column;
	gap:6vw;
	align-items:flex-start;
}

.message_box_left_set01{
	width:100%;
	flex-shrink:0;
}

.message_box_right_set01{
	flex:1;
}

.message_box_left_photo01{
	position:relative;
	width:55vw;
	height:auto;
	display:block;
	margin:auto;
}

.message_box_left_text01{
	text-align:center;
	line-height:1;
	display:block;
	font-size:4vw;
	margin-top:18px;
	margin-bottom:2vw;
}

.message_box_left_text02{
	text-align:center;
	line-height:1.6;
	display:block;
	font-size:3.2vw;
}

.message_box_right_text01{
	font-size:3.8vw;
	line-height:2;
	letter-spacing:0.05em;
	display:block;
}

.message_box_right_text01_bold{
	font-weight:bold;
}





/* カミングスーン */
.coming_parts_set{
	position:relative;
	width:100%;
}

.coming_parts01{
	position:absolute;
	top:-15vw;
	left:50%;
	margin-left:-37vw;
	width:10vw;
}

.coming_parts02{
	position:absolute;
	top:-9vw;
	left:50%;
	margin-left:-35vw;
	width:21vw;
}

.coming_parts03{
	position:absolute;
	top:-13vw;
	left:50%;
	margin-left:-61vw;
	width:21vw;
}

.coming_parts04{
	position:absolute;
	top:64vw;
	left:50%;
	margin-left:27vw;
	width:7vw;
}

.coming_parts01 img,
.coming_parts02 img,
.coming_parts03 img,
.coming_parts04 img{
	width:100%;
	height:auto;
	display:block;
}

.coming_set{
	position:relative;
	width:100%;
	padding-top:20vw;
	padding-bottom:20vw;

}

.coming_caption01{
	font-size:5.2vw;
	font-family: "Lato";
	font-weight:bold;
	letter-spacing:0.1em;
	text-align:center;
	color:#cccccc;
	line-height:1;
	display:block;
	margin-bottom:10vw;
}

.coming_text01{
	font-size:4.5vw;
	font-weight:bold;
	text-align:center;
	letter-spacing:0.1em;
	color:#999999;
	line-height:2;
	display:block;
}







/* フッター */
footer{
	position:relative;
	width:100%;
	padding-bottom:10vw;
}

.gtn_logo_img01{
	position:relative;
	width:24vw;
	margin:0 auto 5vw;
	display:block;
}

.gtn_logo_img01 img{
	position:relative;
	width:100%;
	height:auto;
	display:block;
}

.gtn_link_text01{
	position:relative;
	display:flex;
	align-items:center;
	justify-content:center;
	margin-bottom:7vw;
}

.gtn_link_text01 a{
	position:relative;
	color:#f00f1d;
	display:flex;
	align-items:center;
	justify-content:center;
	gap:2vw;
	text-decoration:none;
	letter-spacing:0.05em;
	line-height:1;
	font-size:3.2vw
}

.cursor{
	position:relative;
	width:3.2vw;
	height:auto;
	margin-top:3px;
}

.copyright_text01{
	display:block;
	text-align:center;
	font-size:2.8vw;
	color:#666666;
	letter-spacing:0em;
}






/* SP/PC用 */
.rps_del{
	display:none;
}
.rps_visible{
	display:block;
}









}