@charset "utf-8";

/*===========================================================
	アニメーション設定
===========================================================*/

@-webkit-keyframes fadein {
	from {
		opacity: 0;
	}
	to {
		opacity: 1;
	}
}

@keyframes fadein {
	from {
		opacity: 0;
	}
	to {
		opacity: 1;
	}
}

/*===========================================================
	メインビジュアル
===========================================================*/

#main-visual .layer {
	background-image: url("../images/patent/Patent_top-2.jpg");
}

/*========== オープニング動作用のレイヤー ==========*/

#main-visual .opening {
	position: absolute;
	top: 0;
	right: 0;
	width: 100%;
	height: 100%;
	background: url("../images/patent/Patent_top-1.jpg") no-repeat center center;
	background-size: cover;
}

/*===========================================================
	メインコンテンツ
===========================================================*/

.patent_wrapper {
	margin-left: auto;
	margin-right: auto;
	max-width: 733px;
}

#main_header img {
	width: 315px;
}

#main_header p {
	position: absolute;
	top: -20px;
	left: calc(50% + 180px);
	font-weight: bold;
	text-align: left;
}

/*===========================================================
	特許技術
===========================================================*/

section#patent {
	
}

#history_wrapper {
	margin-bottom: 60px;
	padding-top: 12px;
	padding-bottom: 22%;
	position: relative;
	background: url("../images/patent/patent_image02.jpg") no-repeat center center;
	background-size: cover;
	color: #ffffff;
}

#history_title {
	position: absolute;
	top: 10px;
	left: 40px;
}

#history_title strong{
	font-weight: bold;
	font-size: 1.4em;
}

#history_list {
	display: flex;
	justify-content: space-around;
	align-items: flex-end;
	flex-wrap: wrap;
}

#history_list li {
	margin: 0 1% 30px;
	flex: 0 1 28%;
	visibility: hidden;
	opacity: 0;
}

#history_list.show .history01 {
	visibility: visible;
	-webkit-animation: fadein 1000ms forwards;
	animation: fadein 1000ms forwards;
}

#history_list.show .history02 {
	visibility: visible;
	-webkit-animation: fadein 1000ms 500ms forwards;
	animation: fadein 1000ms 500ms forwards;
}

#history_list.show .history03 {
	visibility: visible;
	-webkit-animation: fadein 1000ms 1000ms forwards;
	animation: fadein 1000ms 1000ms forwards;
}

.mass_type {
	max-width: 240px;
}

section#patent h4 {
	font-size: 2.4em;
	font-weight: bold;
}

.patent_text {
	margin-top: 40px;
	font-size: 1.4rem;
}

.patent_text span {
	color: #ea5514;
	font-size: 1.54rem;
	font-weight: bold;
}

.patent_box {
	padding-right: 30%;
	background: url("../images/patent/Patented mark.png") no-repeat bottom right 10%;
	background-size: 30%;
}

.patent_box p {
	margin-top: 40px;
	font-size: 1.4rem;
}

#patent_image_list {
	margin-top: 80px;
	display: flex;
	justify-content: center;
}

#patent_image_list li {
	margin: 0 20px;
	flex: 0 1 45%;
}

.patent_image_text {
	margin: 40px auto 0;
	width: 50%;
}

@media print, screen and (max-width:750px) {

	/*===========================================================
		メインビジュアル
	===========================================================*/

	#main-visual .layer {
		background-image: url("../images/patent/sp_patent_top.jpg");
	}

	/*========== オープニング動作用のレイヤー ==========*/

	#main-visual .opening {
		display: none;
	}

	/*===========================================================
		メインコンテンツ
	===========================================================*/
	.patent_wrapper {
		max-width: initial;
	}
	#main_header img {
		margin-top: -50px;
		width: 185px;
	}

	#main_header p {
		margin-top: 40px;
		position: relative;
		top: auto;
		left: auto;
		font-size: 1.6rem;
		text-align: center;
		line-height: 2.333em;
	}

	/*===========================================================
		特許技術
	===========================================================*/

	section#patent {

	}

	#history_wrapper {
		margin: 90px 45px 0;
		padding-top: 400px;
		padding-bottom: 0;
		background: url("../images/patent/sp_patent_image02.jpg") no-repeat top center;
		background-size: contain;
	}

	#history_title {
		position: relative;
		top: auto;
		left: auto;
		color: #9FA0A0;
		font-size: 0.9rem;
	}

	#history_title strong{
		font-weight: bold;
		font-size: 1.8rem;
	}

	#history_list {
		margin-top: 50px;
		display: block;
	}

	#history_list li {
		margin: 30px 0;
		visibility: visible;
		opacity: 1;
		text-align: left;
	}

	#history_list.show .history01,
	#history_list.show .history02,
	#history_list.show .history03 {
		visibility: visible;
		animation: none;
	}

	.patent_box {
		margin: 120px 30px 0;
		padding-right: 0;
		padding-bottom: 140px;
		background: url("../images/patent/Patented mark.png") no-repeat bottom center ;
		background-size: 132px;
	}

	section#patent h4 {
		margin-bottom: 30px;
		color: #3E3A39;
		font-size: 1.6rem;
		font-weight: bold;
	}

	.patent_box p {
		margin-top: 25px;
		font-size: 1.3rem;
		line-height: 1.92em;
	}

	.patent_text {
		margin-top: 25px;
		font-size: 1.5rem;
	}

	.patent_text span {
		font-size: 1.3rem;
	}

	#patent_image_list {
		margin: 120px 45px 0;
		display: block;
	}

	#patent_image_list li {
		margin: 0;
	}

	.patent_image_text {
		display: none;
	}

}