<!DOCTYPE html>
<html lang="ja">

<head>
	<meta charset="UTF-8">
	<title>SpinNet : Notice of Service Termination</title>
	<meta name="description" content="アクセスいただいたWebサービスは提供を終了いたしました。The Web service you are trying to access has been terminated.">
	<meta name="viewport" content="width=device-width,initial-scale=1">
	<meta name="robots" content="noindex,nofollow,noarchive">
	<meta http-equiv="Pragma" content="no-cache">
	<meta http-equiv="Cache-Control" content="no-cache">
	<link rel="icon" href="/favicon.ico">
	<style>
		/*初期化*/
			*{
				margin: 0;
				padding: 0;
			}

			html{
				height: 100%;
				font-size: 62.5%;
			}

			body{
				box-sizing:border-box;
				height: 100%;
				font-family: -apple-system,"Meiryo UI",Segoe UI,"Yu Gothic UI","YuGothic","Hiragino Sans","Hiragino Kaku Gothic ProN","Helvetica Neue","Helvetica", sans-serif;
				font-size: 1.6rem;
				line-height: 1.5;
				color: #333333;
				background-color: #FFFFFF;
			}

		/*ヘッダー*/
			header{
				box-sizing: border-box;
				height: 55px;
				border-bottom: 3px solid #2d4696;
				display: flex;
				align-items: center;
			}

			h1{
				width: 770px;
				margin: 0 auto;
			}

		/*メイン*/
			main{
				min-height: calc(100% - 110px); /*110px=header+footer*/
				text-align: center;
				display: flex;
				justify-content: center;
				align-items: center;
			}

			main div{
				width: 600px;
			}

			main hr{
				margin: 35px 0;
				background-color: #c5c5c5;
			}

			main p{
				margin-top: 1.6rem;
			}
			
			h2{
				box-sizing: border-box;
				width: 100%;
				margin: 30px 0;
				padding: 25px 0;
				background-color: #CEDFF7;
				font-size: 3.0rem;
				line-height: 1;
				font-weight: bold;
				letter-spacing: 0.3rem;
			}

			h2 span.en{
				font-size: 1.6rem;
				letter-spacing: normal;
			}

			a.top-btn{
				display: inline-block;
				width: 230px;
				margin-top: 30px;
				padding: 12px 0;
				background-color: #2d4696;
				font-size: 1.6rem;
				line-height: 1.6rem;
				font-weight: bold;;
				color: #ffffff;
				text-decoration: none;
				transition: 0.3s;
			}

			a.top-btn:last-of-type{
				margin-bottom: 30px;
			}

			a.top-btn:hover{
				background-color: #CEDFF7;
	    		color: #2d4696;
			}

		/*フッター*/
			footer{
				width: 100%;
				height: 55px;
				background-color: #2d4696;
				text-align: center;
				color: #ffffff;
				line-height: 1.1rem;
				display: flex;
				justify-content: center;
				align-items: center;
			}

			footer span{
				font-size: 1.1rem;
			}

		/*------------------------------------------
		  Responsive Grid Media Queries - 1024, 768, 480
		   1024以下    - タブレット横長
		   768以下     - タブレット縦長
		   480以下     - スマホ
		--------------------------------------------*/
		@media screen and (max-width: 1024px) {
			header{
				padding: 0 5%;
			}
			
			h1{
				width: auto;
				margin: 0;
			}
			
			h2{
				font-size: 3.0rem;
				letter-spacing: 0.3rem;
			}
			
			h2 span.en{
				font-size: 1.6rem;
			}
		}
		
		@media screen and (max-width: 768px) {
			main{
				padding: 0 5%;
			}
			
			main div{
				width: auto;
			}
			
			h2{
				padding: 20px 10px;
				font-size: 2.6rem;
				letter-spacing: 0.1rem;
			}
			
			h2 span.en{
				font-size: 1.2rem;
			}
		}
		
		@media screen and (max-width: 480px) {
			header,
			main{
				padding: 0 15px;
			}
			
			h2{
				font-size: 2.0rem;
			}
			
			main hr{
				margin: 30px 0;
			}
			
			main p{
				font-size: 1.4rem;
			}
			
			a.top-btn{
				margin-top: 20px;
				font-size: 1.4rem;
			}
		}
	</style>
</head>

<body>
	<header>
		<h1><img src="./images/logo_spin.gif" alt="SpinNet"></h1>
	</header>
	
	<main>
		<div>
			<h2>
				<span>
					ご訪問いただいたお客様へのお知らせ<br>
					<span class="en">Information for customers visiting this Web site from SpinNet</span>
				</span>
			</h2>
			<p>
				アクセスいただいたWebサービスは提供を終了いたしました。<br>
				長年にわたり、多くの皆様にご利用いただきましたことを心よりお礼申し上げます。
			</p>
			<a href="https://www.spinnet.jp/" class="top-btn">SpinNetトップページへ</a>
			<hr>
			<p>
				The Web service you are trying to access has been terminated.<br>
				We would like to thank all of you for your patronage over the years.
			</p>
			<a href="https://www.spinnet.jp/indexe.html" class="top-btn">Go to the SpinNet</a>
		</div>
	</main>
	
	<footer>
		<span>&copy;2024 SoftBank Corp. All Rights Reserved.</span>
	</footer>

</body>

</html>
