@charset "UTF-8";

@font-face{
	font-family:"myfont_1";
	src:url("../fonts/Thesignature.ttf") format("truetype");
}

@font-face{
	font-family:"myfont_2";
	src:url("../fonts/ArsenicaTrial-Italic.ttf") format("truetype");
}

@font-face{
	font-family:"myfont_3";
	src:url("../fonts/Arimo-Regular.ttf") format("truetype");
}

@font-face{
	font-family:"myfont_4";
	src:url("../fonts/Arimo-Bold.ttf") format("truetype");
}

@font-face{
	font-family:"myfont_6";
	src:url("../fonts/Summer Wind.ttf") format("truetype");
}

html {
	margin: 0;
	padding: 0;
	font-size: 15px;	/*基準となるフォントサイズ。*/
}

body {
	width:100vw;
	margin:0;
	font-family: "Noto Serif JP", "Hiragino Mincho Pro", "ヒラギノ明朝 Pro W3", "HGS明朝E", "ＭＳ Ｐ明朝", "MS PMincho", serif;	/*フォント種類*/
	background:#FFF;	/*背景色*/
	/*color: ;		/*文字色*/
}

img{max-width:100%;
}

main{
	margin-top:27%;
}

.title h1{
	font-family:"myfont_6";
	font-size:4.5rem;
	text-align: center;
}

.content{
	margin-top:7%;
}

.btn{
	width: -webkit-fit-content;
	padding:15px;
	margin: 0 auto;
	color: #5d5d5d;
	border: 0.5px solid #5d5d5d;
	border-radius: 100vh;
	transition: .5s;
}

.btn:hover{
	color: #fff;
	background: #5d5d5d;
}

.img{
	width: 25%;
    position: absolute;
    right: 4%;
    top: 30%;
}

@media screen and (min-width:700px){
	main{
		margin-top:20%;
	}
	
	.title h1{
		font-size:7rem;
	}
	
	.img{
		width: 25%;
        right: 7%;
	}
}

@media screen and (min-width:1000px){
	main{
		margin-top:10%;
	}
	
	.title h1{
		font-size:14rem;
	}
	
	.img{
		width: 30%;
		right:7%;
		top:333px;
	}
}