@charset"uft-8";

/*ここからリセットCSS*/

body {
	margin: 0;
	padding: 0;
	position: relative;
	background-color: #EAF2F6;
}

p,h1,h2,h3,h4,h5,h6 {
	margin-top: 0;
}

img {
	vertical-align: bottom;
}

ul {
	margin: 0;
	padding: 0;
}

/*ここまで*/


/*ロゴ位置ここから*/

.logo {
	float: left;
	margin-top: 20px;
	margin-left: 30px;
	position:  relative;
	z-index: 10;
}

@media screen and (max-width: 600px) {
	.logo {
		margin-top: 16px;
		margin-left: 16px;
	}
}

.logo img {
	width: 16vw;
}

@media screen and (max-width: 600px) {
	.logo img {
		width: 28vw;
	}
}

/*ロゴ位置ここまで*/


.sns {
	float: right;
	margin-top: 20px;
	margin-right: 20px;
	position:  relative;
	z-index: 10;
}

@media screen and (max-width: 600px) {
	.sns {
		margin-top: 16px;
		margin-right: 20px;
	}
}

.sns img {
	width: 44px;
	transition : 0.2s;
	margin-left: 5px;
}

@media screen and (max-width: 600px) {
	.sns img {
		width: 44px;
		margin-left: 5px;
	}
}

.sns img:hover {
	opacity: 0.5;
	transition : 0.2s;
}


header {
	height: 30px;
/*	background-color: red;*/
}

body {
	color: #333;
	letter-spacing: 0.05em;
}


#wrap {
/*	background-color: yellowgreen;*/
    height: 90vh;
    position:  absolute;
	z-index: 5;
	width: 100vw;
	display: flex;
	align-items: center;
	justify-content: center;
	vertical-align: middle;
}

.content {
/*	background-color: yellow;*/
	text-align: center;
	vertical-align: middle;

}

@media screen and (max-width: 600px) {
	.content {
		padding: 20px;
	}
}

h1 {
	font-family: "FOT-筑紫明朝 Pr6 L";
	font-size: 48px;
}

@media screen and (max-width: 600px) {
	h1 {
		font-size: 30px;
	}
}

p {
	font-family: "TsuMinPr6RB-JansonTextPro55R";
	font-size: 16px;
	margin-top: 20px;
	line-height: 1.7;
	word-break: keep-all;
}

@media screen and (max-width: 600px) {
	p {
		font-size: 14px;
	}
}


a {
	text-decoration: underline;
	color:#CD4145;
}


footer {
	position: fixed;
	left: 0;
	bottom: 0;
	width: 100%;
	height: 30px;
	text-align: center;
/*  background-color: green;*/
}

h6 {
	font-family: "TazuganeGothicStdN-Thin";
	color: #aaa;
	font-size: 12px;
}

@media screen and (max-width: 600px) {
	h6 {
		font-size: 9px;
	}
}

/* スマホ向け（画面幅が600px以下） */
@media (max-width: 600px) {
    .responsive-image {
        background-image: url('small-image.jpg');
    }
}