@charset "utf-8";
/* CSS Document */


/* INDEX */

.main {
	overflow: hidden;
	background: #fff;
	margin-top: 100px;
}
.main div {
	width: 50%;
	height: 31em;
	float: left;
	display: inline-block;
}
.main div:nth-of-type(1) {
	z-index: 5;
}
.main div:nth-of-type(2) {
	overflow:hidden;
	z-index: 2;
	background:#dd5500 url(../../../items/index/love.svg) no-repeat bottom right;
}

.main div .outer {
	position: relative;
	text-align: center;
	display: block;
}
.main div .inner {
	width: 80%;
	top: 50%;
	position: absolute;
	left: 50%;
	transform: translateY(20%) translateX(-50%);
-webkit- transform: translateY(20%) translateX(-50%);
}

.main div:nth-of-type(1) h2 {
	font-size: 3em;
	letter-spacing: 0.3em;
	text-align: center;
	margin: 0 auto 15px;
	width: 8em;
font-family: '游明朝','Yu Mincho',YuMincho,'Noto Serif CJK JP','Hiragino Mincho Pro',serif;}
.main div:nth-of-type(1) p {
	width: 50%;
	margin: 0 auto;
	text-align:left;
	color:#000;
}

@media screen and (max-width: 1214px) {
.main div:nth-of-type(1) p {
	width: 74%;
}
}

	
 @media screen and (max-width: 920px) {
/*ウィンドウ幅が指定px以下の場合に適用　タブレット：1024px [max-width : 1024px]*/

.main div {
	width: 100%;
	float: none;
	display: block;
	height: auto;
}
.main div .outer {
	position: relative;
	text-align: center;
}
.main div .inner {
	position: relative;
	left: 0;
	top: 0;
	text-align: center;
	transform: none;
-webkit- transform: none;
	display: block;
	width: 80%;
	margin: 20px auto;
}
.main div:nth-of-type(2) {
	height:250px;
}
}


 @media screen and (max-width: 598px) {
.main div .inner {
	width: 90%;
}
.main div:nth-of-type(1) h2 {
	font-size: 2.5em;
	letter-spacing: 0em;
	text-align: center;
	margin: 0 auto 10px;
	width: auto;
}
.main div:nth-of-type(2) {
	height:20em;
}

}










/*-興味ある事-*/



#interests{
	margin-top:60px;
	padding:3em 0;
	background-color:#fff;
}

#interests p{
	text-align:center;
	margin:1%;
}


/*- コンタクト -*/

#contact{
	margin-top:160px;
	width:100%;
}




/*--flexboxセット--*/

.container {
margin:0 auto -100px;
width:auto;
justify-content: center;
}

.container a{
width:18%;
padding:20px;
text-align:center;
margin:1%;
background-color: #dd5500;
color:#fff;
position:relative;
text-decoration:none;
}
.container .item h4{
	font-size:2em;
	font-weight:lighter;
}
@media screen and (max-width: 920px) {
.container a{
width: 40%;
}
}
 @media screen and (max-width: 598px) {
/*ウィンドウ幅が指定px以下の場合に適用　スマートフォン：599px [max-width : 599px]*/
.container a{
width:100%;
padding:10px;
}
}

.container a[target="_blank"]:after {
	position:absolute;
	top:10px;
	right:10px;
}