@charset "UTF-8";
/* home.css */



#header .logo a {
	pointer-events : none;
}

/* top_main */
.top_main {
	background:url(/img/main_bg01.png) no-repeat;
	background-position:center center;
	background-size:cover;
	height:480px;
	padding-top:150px;
}


/*PC Layout
------------------------------------------------------ */
@media print, screen and (min-width: 769px) {
	/* service_wrap */
	.service_wrap .service_list .box_cts:nth-child(3n) {
		margin-right:0;
	}
	.service_wrap .service_list .box_cts:nth-child(n+4) {
		margin-top:20px;
	}
	
}


/*SP Layout
------------------------------------------------------ */
@media only screen and (max-width: 768px) {
	/* top_main */
	.top_main {
	height: 240px;
	padding: 60px 3.125% 0;
	background-position: right -70px bottom 0;
	background-size: auto 100%;
	height: 60vw;
	}
	.top_main img {
		height:auto;
		width:280px;
	}
}
@media only screen and (max-width: 320px) {
	/* top_main */
	.top_main {
	padding: 30px 3.125% 0;
	}
}


/* text1 animation */
.top_main .textWrap .txUpper {
	margin-top: 15px;
	position: relative;
	animation: txUp1 15s ease forwards;
	-webkit-animation: txUp1 15s ease forwards;
}
.top_main .textWrap .txUpper .tx1 {
	font-size: 4.2rem;
	font-family: YakuHanMP, Noto Serif Japanese, "ヒラギノ明朝 ProN W6", "HiraMinProN-W6", "HG明朝E", "ＭＳ Ｐ明朝", "MS PMincho", "MS 明朝",serif;
	font-weight:500;
}

@keyframes txUp1 {
  0% { opacity: 0; }
	30% { opacity: 1; }
  100% { opacity: 1; }
}

/*SP Layout
------------------------------------------------------ */
@media only screen and (max-width: 768px) {
	.top_main .textWrap .txUpper {
		margin-top: 0;
	}
	.top_main .textWrap .txUpper .tx1 {
		font-size: 2.1rem;
	}
}

/* text2 animation */
.top_main .textWrap .txLower {
	margin-top: 15px;
	position: relative;
	animation: txUp2 10s ease forwards;
	-webkit-animation: txUp2 10s ease forwards;
}
.top_main .textWrap .txLower .tx2 {
	font-size: 2.2rem;
	line-height: 1.8;
}
.top_main .textWrap .txLower .tx2 + p {
	margin-top: 20px;
}

@keyframes txUp2 {
  0% { opacity: 0; top: 10px; }
	10% { opacity: 0; }
  30% { top: 0; }
	40% { opacity: 1; }
  100% { opacity: 1; }
}

/*SP Layout
------------------------------------------------------ */
@media only screen and (max-width: 768px) {
	.top_main .textWrap .txLower {
		margin-top: 7px;
	}
	.top_main .textWrap .txLower .tx2 {
		font-size: 1.1rem;
		line-height: 1.4;
	}
	.top_main .textWrap .txLower .tx2 + p {
		margin-top: 10px;
	}
}