@charset "utf-8";

/* -------------------------------------
pre
------------------------------------- */
#pre {
	text-align:center;
}
#pre article{
	padding-top:85px;
}
#pre article h1 {
	font-size:21px;
	margin-bottom:20px;
	line-height:2;
}
#pre article p.renewal {
	margin-bottom:35px;
}
#pre article p.logo {
	width:25%;
	max-width:300px;
	min-width:250px;
	margin:0 auto 20px auto;
}
#pre article p.logo img {
	width:100%;
	height:auto;
}
#pre article h2 {
	font-size:18px;
	line-height:2;
	margin-bottom:25px;
}
#pre article p.linkbutton {
	width:230px;
	margin:0 auto 40px auto;
	background-color:#004b47;
}
#pre article p.linkbutton a {
	font-size:14px;
	color:#FFF;
	padding:10px 60px;
	position:relative;
	display:inline-block;
}
#pre article p.linkbutton a:after {
	content: "";
	width:14px;
	height: 18px;
	display: block;
	background: url(../imgs/prearrow.svg) no-repeat right center;
	position: absolute;
	top:55%;
	right:10px;
	transform: translateY(-50%);
	-webkit-transform: translateY(-50%);
	-ms-transform: translateY(-50%);
	-moz-transform: translateY(-50%);
}
#pre article #logo2box {
	width:70%;
	margin:0 auto;
	padding-top:25px;
	margin-bottom:120px;
	border-top:1px solid #4f4946;
}
#pre article #logo2box img {
	width:100%;	
}

@media screen and (max-width:768px) {
	#pre {
		padding:0 20px;
		box-sizing:border-box;
	}
}

@media screen and (max-width:768px) {
	#pre article p.logo {
		width:30%;
	}
}

@media screen and (max-width:640px) {	
	#pre article h1 {
		font-size:18px;
	}
	#pre article p.renewal {
		margin-bottom:15px;
	}
	#pre article p.logo {
		margin-bottom:15px;
	}
	#pre article h2 {
		font-size:16px;
	}	
	#pre article #logo2box {
		width:100%;
	}
}