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

html{
	overflow-x:hidden;
}

html,body{
	min-width:320px;
}

main {
	position:relative;
	width:100%;
	min-width:320px;
	height:100%;
	text-align:left;
	-webkit-text-size-adjust: none;
}


/* メインポップアップ */
.mfp-inline-holder .mfp-content {
	display: flex;
	align-items: center;
	min-height: auto;
}


#jt_popup {
	position: relative;
	width: 92vw;
	background: #fff;
	border-radius: 2vw;
	box-sizing: border-box;
	padding:10vw 0;
	margin:0 auto 0;
}

.jt-popup_logo_set{
	position:relative;
	width:80%;
	margin:5vw auto 0;
}

.jt-popup_logo{
	display: block;
	width: 20vw;
	margin-left: auto;
}

.jt-popup_caption{
	position:relative;
	margin:0 auto 6vw;
	width:66vw;
	height:auto;
}

.jt-popup_text{
	font-size:3.2vw;
	font-weight:bold;
	color:#166FB0;
	text-align:center;
	line-height:1.8;
}

.jt-popup-transparent.mfp-bg {
	background: #166fb0;
	/*background: transparent;*/
}

/* フェード時の暗転も消す */
.jt-popup-transparent.mfp-fade.mfp-bg {
	/*opacity: 0;*/
}

.jt-popup-transparent .mfp-close {
	font-size: 12vw;
	line-height: 1;
	width: 12vw;
	height: 12vw;
	padding-top:0;
	padding-right:0;
}




/* メインビジュアル */
.jt_mv{
	position: relative;
	width: 100%;
	height: auto;
	min-height: auto;
	overflow: visible;
	margin-bottom:8vw;
	background: #166fb0;
}

.jt_mv_img {
	position: relative;
	top: 0;
	left:0;
	transform:translateX(0);
	height:auto;
	width:100%;
	max-width:none !important; /* グローバルの max-width:100% を打ち消し */
	
}

.jt_mv_caption01{
	position: absolute;
	margin:0 auto 0;
	top:15vw;
	left:50%;
	transform: translateX(-50%);
	width:65vw;
	height:auto;
}

.jt_mv_title01{
	position: absolute;
	margin:0 auto 0;
	top:26vw;
	left:50%;
	transform: translateX(-50%);
	width:88vw;
	height:auto;
}

.jt_mv_text01{
	position: absolute;
	margin:0 auto 0;
	top:47vw;
	left:50%;
	transform: translateX(-50%);
	width:100%;
	height:auto;
}

.jt_mv_text02{
	position: absolute;
	top:3.5vw;
	right:0;
	width:52.4vw;
	height:auto;
}

.jt_mv_popup_btn{
	position: absolute;
	top:63vw;
	right:auto;
	left:50%;
	transform: translateX(-50%);
	width:27.5vw;
	height:auto;
}


.jt_mv_btn_set{
	position: absolute;
	width:100%;
	bottom: 8vw;
	left: 50%;
	transform: translateX(-50%);

	display: flex;
	flex-direction: column;
	align-items: center;
	gap: 6vw;

	box-sizing: border-box;
}

.jt_mv_btn_set img{
	width: 53.3vw;
	max-width: none;
	height: auto;
	flex-shrink: 0;
}




/* 特設サイトについて */
.jt_ct01{
	position:relative;
	padding-top:10vw;
	padding-bottom:10vw;
	
}

.jt_ct01_title{
	position:relative;
	margin:0 auto 8vw;
	width:100%;
	height:auto;
}

.jt_ct01_box01{
	position: relative;
	display: flex;
	flex-direction: column;
	align-items: center;
	gap: 8vw;
}

.jt_ct01_box01 img{
	width: 23.5vw;
	height: auto;
	flex-shrink: 0;
	max-width: none;
}

.jt_ct01_text{
	position: relative;
	margin-top:0;
	color: #2F2F2F;
	font-size: 3.8vw;
	line-height: 2;
	font-weight: bold;
	text-align: center;  
}




/* 自転車交通安全ゲーム */
.jt_ct02_mv{
	position: relative;
	width: 100%;
	height: auto;
	overflow: visible;
	margin-top:10vw;
	margin-bottom:8vw;
}

.jt_ct02_mv_img {
	position: absolute;
	top: 0;
	left: 0;
	transform: translateX(0);
	height: auto;
	width: 100%;
	max-width: none !important; /* グローバルの max-width:100% を打ち消し */
}

.jt_ct02_title{
	position:relative;
	left:0;
	transform: translateX(0);
	bottom:0;
}


.jt_ct02_box01{
	position: relative;
	padding-bottom:8vw;
}

.jt_ct02_caption{
	position: relative;
	left:0;
	margin-left:0;
	width:100%;
	height:auto;
	
}

.jt_ct02_text{
	position: relative;
	width:77vw;
	left:0;
	margin:6vw auto 6vw;
	font-size:3.2vw;
	font-weight:bold;
	line-height:2.2;
	color:#2F2F2F;
}

.jt_ct02_box01_img01{
	position:relative;
	top:0;
	left:11vw;
	margin-left:0;
	width:35vw;
	height:auto;
}

.jt_ct02_box01_img02{
	position:relative;
	top:-7vw;
	left:auto;
	right:11vw;
	margin-left:auto;
	width:48vw;
	height:auto;
}




/* 全編再生・ダウンロードはこちら */
.jt_ct03{
	text-align:center;
}

.jt_ct03_caption01{
	position:relative;
	width:100%;
	font-size:5vw;
	line-height:1.6;
	color:#166FB0;
	font-weight:bold;
	text-align:center;
	margin-top:8vw;
	margin-bottom:8vw;
}

.jt_ct03_caption02{
	position:relative;
	width:100%;
	font-size:5vw;
	line-height:1.6;
	color:#166FB0;
	font-weight:bold;
	text-align:center;
	margin-top:8vw;
	margin-bottom:8vw;
}

.jt_ct03_movie01_text{
	position:relative;
	font-size:3.2vw;
	font-weight:bold;
	color:#2F2F2F;
	margin-top:4vw;
	margin-bottom:4vw;
}

.jt_ct03_movie_btn01{
	position: relative;
	width: 77vw;
	margin:0 auto 12vw;
	display: block;
	background:#E5E2E2;
	padding-top:6vw;
	padding-bottom:6vw;
	border-radius:2vw;
	font-size:3.2vw;
	font-weight:bold;
	line-height:1;
}

.jt_ct03_movie_icon{
	position:absolute;
	top:50%;
	right:4vw;
	transform: translateY(-50%);
	width:8.5vw;
	height:auto;
}


/* ムービーセット */
.jt_ct03_movie_set{
	position: relative;
	width: 90vw;
	margin-left:5vw;

	display: flex;
	flex-wrap: wrap;              /* ← 折り返しを許可 */
	justify-content: center;      /* ← 全体の中央基準 */
	gap: 7vw;

	margin-bottom: 8vw;
}

.jt_ct03_movie02{
	width:39.5vw;
	height:auto;
}


/* 各ムービー */
.jt_ct03_movie_box{
	width:39.5vw;
	flex: 0 0 39.5vw; /* ← 2つ横並び */
}

/* 3つ目だけ中央配置 */
.jt_ct03_movie_box:nth-child(3){
	width:39.5vw;
	flex: 0 0 39.5vw;                /* ← 横幅いっぱい使う */
}



.jt_ct03_movie_box_caption{
	position: relative;
	font-size:3.2vw;
	line-height:1.6;
	font-weight:bold;
	display:block;
	text-align:left;
	border-bottom:solid 2px #156FB0;
	color:#156FB0;
	padding-bottom:2vw;
	margin-bottom:2.5vw;
}

.jt_ct03_movie_box_text{
	position: relative;
	height:auto;
	font-size:3.2vw;
	line-height:2;
	font-weight:bold;
	display:flex;
	text-align:left;
	border-bottom:solid 2px #156FB0;
	color:#156FB0;
	padding-bottom:2vw;
	align-items: center;
}

.jt_ct03_movie_box_annotation{
	position: relative;
	display:flex;
	justify-content: space-between; /* ← 追加 */
	align-items: center;
	text-align:left;
	border-bottom:solid 2px #156FB0;
	padding-top:2.5vw;
	padding-bottom:2.5vw;
	margin-bottom:2.5vw;
	padding-left:2.5vw;
	padding-right:2.5vw;
	box-sizing:border-box;
}


.jt_ct03_movie_box_annotation_text01{
	text-align:center;
	line-height:1;
	font-size:3.2vw;
	font-weight:bold;
	color:#156FB0;
}


.jt_ct03_plus{
	margin-right:1em;
}


.jt_ct03_movie_box_annotation_text02{
	font-size:2.8vw;
	color:#2F2F2F;
	font-weight:bold;
}



.jt_ct03_movie_btn02{
	position: relative;
	width:39.5vw;
	margin:0 auto 0;
	display: block;
	background:#E5E2E2;
	padding-top:4vw;
	padding-bottom:4vw;
	border-radius:2vw;
	font-size:2.8vw;
	font-weight:bold;
	line-height:1.6;
	text-align:left;
	padding-left:2.5vw;
	box-sizing:border-box;
}

.jt_ct03_movie_btn02 .jt_ct03_movie_icon{
	position:absolute;
	top:50%;
	right:2.5vw;
	transform: translateY(-50%);
}



/* ムービーセット02 */
/* セット全体 */
.jt_ct03_movie_sets{
	display: flex;
	justify-content: center;
	align-items: flex-start;
	width: 90vw;
	margin-left:5vw;
	gap: 4vw;
	margin-bottom:-14vw;
}


.jt_ct03_movie_set02{
	position: relative;
	display: flex;
	flex-direction: column;   /* ← 縦並び */
	gap: 5vw;
	margin-bottom:9vw;
	width:43vw;
}

.jt_ct03_movie_set02.last{
	margin-bottom:100px;
}


.jt_ct03_movie_set02 .jt_ct03_movie_box{

	position: relative;
	
	padding:2.5vw 2vw;
	box-sizing:border-box;
	border:solid 2px #166FB0;
	border-radius:2vw;
	width:calc(43vw + 4px);

}

.jt_ct03_movie_set02 .jt_ct03_movie_box_annotation{
	padding-top:2vw;
	padding-bottom:4vw;
	margin-bottom:2.5vw;
}

.jt_ct03_movie_set02 .jt_ct03_movie_box_annotation_text01{
	font-size:3.3vw;
	text-align:left;
	margin-left:-1.5vw;
}





/* 教職員の皆さまへの教材 */
.jt_ct04{
	position:relative;
	margin-top:8vw;
	padding-top:8vw;
	padding-bottom:12vw;
	background:#166FB0;
}

.jt_ct04_title{
	position:relative;
	margin:0 auto 0;
	width:100%;
	height:auto;
}

.jt_ct04_img{
	position:relative;
	margin:6vw auto 6vw;
	width:100%;
	height:auto;
}

.jt_ct04_read{
	position:relative;
	text-align:center;
	display:block;
	color:#ffffff;
	font-size:3.2vw;
	font-weight:bold;
	line-height:2;
	margin-bottom:12vw;
}



.jt_ct04_dl_set{
	position:relative;
	width:77vw;
	left:50%;
	margin-left:-38.5vw;
	display:block;
	gap:0;
	align-items: none;
	margin-top:22.5vw;
}

.jt_ct04_dl_set.first{
	margin-top:20vw;
}

.jt_ct04_dl_img{
	position:relative;
	width:51vw;
	height:auto;
	margin:auto;
}


.jt_ct04_dl_text01{
	position:absolute;
	width:100%;
	top:-12vw;
	left:0;
	font-size:6vw;
	line-height:1.4;
	font-weight:bold;
	color:#ffffff;
	text-align:center;
}

.jt_ct04_dl_text02{
	position:relative;
	font-size:3.2vw;
	line-height:1.4;
	font-weight:bold;
	color:#ffffff;
}


.jt_ct04_dl_btn{
	position: relative;
	width: 53.3vw;
	display: block;
	background:#ffffff;
	padding-top:4vw;
	padding-bottom:4vw;
	border-radius:100vw;
	font-size:3.8vw;
	font-weight:bold;
	text-align:center;
	box-sizing:border-box;
	line-height:1;
	color:#166FB0;
	margin-top:6vw;
	margin:6vw auto 6vw;
}

.jt_ct04_dl_icon{
	position:absolute;
	top:50%;
	right:2.5vw;
	transform: translateY(-50%);
	width:8.5vw;
	height:auto;
}






/* 参考情報 */
.jt_ct05{
	position:relative;
	margin-top:8vw;
	padding-top:8vw;
	padding-bottom:18vw;
}

.jt_ct05_box01{
	position:relative;
}

.jt_ct05_title{
	position:relative;
	left:0;
	transform: translateX(0);
	margin-bottom:8vw;
	width:100%;
	height:auto;
}

.jt_ct05_read{
	position:relative;
	text-align:center;
	display:block;
	font-size:3.2vw;
	font-weight:bold;
	line-height:1;
	margin-bottom:8vw;
	color:#2F2F2F;
}

.jt_ct05_site_set{
	position:relative;
	margin:0 auto 0;
	width:90%;
	background:#156FB0;
	border-radius:2.5vw;
	padding-top:12vw;
	padding-bottom:18vw;
}

.jt_ct05_site_set_caption{
	position:relative;
	text-align:center;
	display:block;
	font-size:8.5vw;
	font-weight:normal;
	line-height:1;
	color:#ffffff;
}


.jt_ct05_site_set_box{
	position:relative;
	margin:16vw auto 0;
	width:77vw;
	border-radius:2.5vw;
	padding-top:6vw;
	padding-bottom:10vw;
	box-sizing:border-box;
	border:solid 2px #ffffff;
	text-align:center;
}

.jt_ct05_site_set_box.first{
	margin:12vw auto 0;
}

.jt_ct05_site_set02{
	position:relative;
	margin:8vw auto 0;
	width:90%;
	border-radius:2.5vw;
	padding-top:8vw;
	padding-bottom:2vw;
	box-sizing:border-box;
	border:solid 4px #1370B0;
	text-align:center;
}

.jt_ct05_site_set_box_text01{
	position:relative;
	text-align:center;
	display:block;
	font-size:5vw;
	font-weight:bold;
	line-height:1.4;
	color:#ffffff;
	margin-bottom:8vw;
}

.jt_ct05_site_set_box_text02{
	position:relative;
	width:90%;
	text-align:left;
	display:block;
	font-size:3.2vw;
	font-weight:bold;
	line-height:2;
	color:#ffffff;
	margin-bottom:6vw;
	margin:0 auto 0;
}


.jt_ct05_btn01{
	position:absolute;
	margin-top:4.25vw;
	left:50%;
	width:53vw;
	margin-left:-26.5vw;
	display:block;
}




.jt_ct05_site_set_box02_text01{
	position:relative;
	text-align:center;
	display:block;
	font-size:3.2vw;
	font-weight:bold;
	line-height:1.4;
	color:#1370B0;
	margin-bottom:4vw;
}

.jt_ct05_site_set_box02_text02{
	position:relative;
	text-align:center;
	display:block;
	font-size:5vw;
	font-weight:bold;
	line-height:1.4;
	color:#2F2F2F;
	margin-bottom:4vw;;
}



.jt_ct05_site_set_box02_set{
	position:relative;
	display:block;
	justify-content: center;
	align-items: center; /* ← 上揃え */
	gap:0;          /* ボタン同士の間隔 */
}

.jt_ct05_photo01{
	position:relative;
	margin:6vw auto 6vw;
	width:75.6vw;
	height:auto;
}

.jt_ct05_site_set_box02_text03{
	position:relative;
	text-align:center;
	display:block;
	font-size:3.2vw;
	font-weight:bold;
	line-height:1.8;
	color:#2F2F2F;
	margin-bottom:6vw;
}


.jt_ct05_btn02{
	position: relative;
	left:50%;
	margin-left:-26.5vw;
	width: 53.3vw;
	display: block;
	background:#ffffff;
	padding-top:4vw;
	padding-bottom:4vw;
	border-radius:100vw;
	font-size:3.8vw;
	font-weight:bold;
	text-align:center;
	box-sizing:border-box;
	line-height:1;
	color:#166FB0;
	margin-top:6vw;
	border:solid 2px #166FB0;
}



.jt_ct05_btn02.over03 {
	will-change:transform;
}







/* 最後 */
.jt_ct06{
	position:relative;
	padding-top:24vw;
	padding-bottom:24vw;
}


.jt_ct06_caption{
	position:relative;
	display:block;
	text-align:center;
	font-size:4.2vw;
	font-weight:bold;
	line-height:1.4;
	color:#166FB0;
}



































/* ライン */
.jt_line01 {
	position:relative;
	width: 100%;
	height: 6vw;
	background: url("../images/line_bg_pc.png") repeat-x;
	background-size: auto 100%;
}

.jt_line02{
	position:relative;
	width:100%;
	height:1px;
	background:#166FB0;
	left:0;
	margin-left:6vw;
}













/* 共通アニメ */
.over img{
	transition: none;
}

.over:hover img{
	filter: none;
	animation: none;
}

.over02{
	transition: none;
}

.over02:hover{
	opacity:1;
}

.over03{
	transition: none;
}

.over03:hover{
	animation: none;
}













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







/* スマホ横向きのみ
@media screen and (orientation: landscape) and (max-width: 960px) {
 */
	#jt_popup {
		position: relative;
		height: 92dvh;        /* 画面内に収める */
		overflow-y: scroll;
		-webkit-overflow-scrolling: touch;  iOS慣性スクロール */
	}
	
	/* 標準スクロールバー非表示 */
	#jt_popup {
		overflow-y: scroll;          /* スクロール自体は有効 */
		-ms-overflow-style: none;    /* IE / Edge(旧) */
		scrollbar-width: none;       /* Firefox */
	}
	
	/* Chrome / Safari / iOS */
	#jt_popup::-webkit-scrollbar {
		display: none;
	}

	/* 疑似スクロールバー */
	.fake-scrollbar {
		position: fixed;
		top: 4dvh;
		right: 1vw;
		width: 1vw;
		height: 92dvh;
		background: rgba(255,255,255,0.1);
		z-index: 1200;
		pointer-events: none;
		border-radius: 1vw;
		display:none;
		overflow:hidden;
		box-sizing:border-box;
	}
	
	/* つまみ */
	.fake-scrollbar span {
		position: absolute;
		top: 0;
		left: 0;
		width: 100%;
		height: 20%;
		background: rgba(255,255,255,1);
		border-radius: 1vw;
	}

/*	
} */



}