スライサーに出来ない

スライサーを作っているんですが、javascriptが反映されません。
ネットにあるコピペを元に作っていて
画像をいれるスライサーは出来ましたが、
画像を作る(wrapで画像を伸ばしてく)スライサーができません。
画像を4つ作ることはできたんですが、
色々試してもjavascriptが反映されないのはどうしてですか？

<div id="bg1">
	<br>
	<div class="wrapper" style="margin: 0 0%">
     <div>
	<div class="swiper-container">
		<!-- メイン表示部分 -->
		<div class="swiper-wrapper">
			<!-- 各スライド -->

	<div id="swiper">
		<div class="col_2">

	<div class="swiper-slide1">
		<div id="swiperf"></div>
		<div id="swiperwrap">
			<div id="container">
				<div id="text9">
					<strong>資産運用したいけど、<br>
					何から始めれば良いか分からない…</strong><br>
					<br>
					▼<br>
					<br>
					各領域のスペシャリストが、<span style="background: linear-gradient(transparent 70%, #ffff7f 0%);"><strong>｢明日から使える知識｣</strong></span>を<br>
					分かりやすく講義しています。テキスト上の知識だけで<br>
					はなく実際に<span style="background: linear-gradient(transparent 70%, #ffff7f 0%);"><strong>｢経済的に豊かになる｣ための知識が満載<br>
					です。</strong></span><br>
					
					<br>
					<img style="float:center" src="images/hito1.png">
			</div></div></div>
			<div id="swiperl"></div></div>

			<div class="swiper-slide2">
				<div id="swiperf"></div>
		<div id="swiperwrap">
			<div id="container">
				<div id="text9">
					<strong>投資を始めたものの、安心感が持てない。<br>
					もっと良い方法を見つけたい</strong><br>
					<br>
					▼<br>
					<br>
					<span style="background: linear-gradient(transparent 70%, #ffff7f 0%);"><strong>｢お金の学び方｣</strong></span>が分からない人のため、ステップごと<br>
					に学べます。幅広い分野をカバー(金融経済教育推進会<br>
					議の金融リテラシーマップの則り構成)していますの<br>
					で、<span style="background: linear-gradient(transparent 70%, #ffff7f 0%);"><strong>｢お金の知識ゼロ｣の方でも体系的に知識を習得で<br>
					きるようになっています。</strong></span><br>
					<br>
					<img style="float:center" src="images/hito2.png">
			</div></div></div>
			<div id="swiperl"></div></div>
		
			

			<div class="swiper-slide3">
				<div id="swiperf"></div>
		<div id="swiperwrap">
			<div id="container">
				<div id="text9">
					<strong>お金や経済の知識を体系的に身につけて、<br>
					経済的な安心感を得たい</strong><br>
					<br>
					▼<br>
					<br>
					独自のカリキュラムによって、
					<span style="background: linear-gradient(transparent 70%, #ffff7f 0%);"><strong>いつでも何度でも無制限に自分のペース</strong></span>で無理なく学ぶことが出来ます。<br>
					動画による講義だけでなく、
					<span style="background: linear-gradient(transparent 70%, #ffff7f 0%);"><strong>各分野の専門家により配信されるメールマガジン</strong></span>も受け取ることが出来ます。<br>
					<br>
					<img style="float:center" src="images/hito3.png">
			</div></div></div>
			<div id="swiperl"></div></div>
				

				<div class="swiper-slide4">
				<div id="swiperf"></div>
		<div id="swiperwrap">
			<div id="container">
				<div id="text9">
					<strong>将来の漠然とした不安を無くし<br>
					いきいきと前向きに過ごしたい</strong><br>
					<br>
					▼<br>
					<br>
					定期的に更新されるお金や経済の最新ニュースの<br>解説講座を見ることで、
					<span style="background: linear-gradient(transparent 70%, #ffff7f 0%);"><strong>常に知識、情報のアップデートをすることが出来る</strong></span>ので、<br>
					先を見越した経済を学んでいくことが出来ます。<br>
					<br>
					<img style="float:center" src="images/hito4.png">
			</div></div></div>
			<div id="swiperl"></div></div>
				
			

		<div class="swiper-button-prev"></div>
		<div class="swiper-button-next"></div>
		<div class="swiper-pagination"></div>
	</div></div></div>
</div>
		
	<script>
		var mySwiper = new Swiper('.swiper-container', {
		spaceBetween: 10,
		slidesPerView: 3,
		loop: true,
		autoplay: {
			delay: 3000,
			stopOnLastSlide: false,
			disableOnInteraction: false,
			reverseDirection: false
		},
		navigation: {
			nextEl: '.swiper-button-next',
			prevEl: '.swiper-button-prev'
		},
		pagination: {
			el: '.swiper-pagination',
			type: 'bullets',
			clickable: true
		}
		
	});
	
	</script>
	
</div></div>





</div>

```.swiper-slide1 { background: url("../images/bg01.png") no-repeat top center; height:    688px; } 
.swiper-slide2 { background: url("../images/bg01.png") no-repeat top center; height:    688px; } 
.swiper-slide3 { background: url("../images/bg01.png") no-repeat top center; height:    688px; } 
.swiper-slide4 { background: url("../images/bg01.png") no-repeat top center; height:    688px; } 

/* 全体のスタイル */
.swiper-wrapper {
	width: 100%;
	height: 250px;
}
/* 全スライド共通スタイル */
.swiper-slide {
	color: #ffffff;
	width: 100%;
	height: 100%;
	text-align: center;
	line-height: 250px;
}