@charset "utf-8";
/* CSS Document */
h1{
	font-size: 30px;
	font-weight: normal;
	margin: 0 auto;
	margin-bottom: 100px;
	width: 90%;
	max-width: 1200px;
	color: #fdd207;
}
h1 span{
	display: inline-block;
}
.blog-content-page h1 span{
	color: #FFF;
}
h2{
	color: #FFF;
	font-size: 20px;
	font-weight: normal;
	margin-top: 0px;
	margin-bottom: 10px;
	text-align: left;
	transition: all 0.3s ease-in-out 0s;
}
a:hover h2{
	color: #fdd207;
	transition: all 0.3s ease-in-out 0s;
}

.blog-wrapper{
	width: 90%;
	margin: 0 auto;
	max-width: 1500px;
	letter-spacing: normal;
	line-height: normal;
}
.blog-wrapper li{
	float: left;
	width: 23.5%;
	margin-right: 2%;
	margin-bottom: 100px;
	border-bottom: 1px solid #CCC;
	padding-bottom: 20px;
}

.blog-wrapper li:hover{
	/*background-color: #1a1a1a;*/
}
.blog-wrapper li:nth-child(4n){
	margin-right: 0;
}
.blog-wrapper li .mask-img{
	line-height: 0;
	overflow: hidden;
}
.blog-wrapper li img{
	transition: all 0.3s ease-in-out 0s;
}
.blog-wrapper li a:hover img{
	opacity: 0.8;
	transform: scale(1.1,1.1);
	transition: all 0.3s ease-in-out 0s;
}
.blog-wrapper li p{
	transition: all 0.3s ease-in-out 0s;	
}
.blog-wrapper li .date{
	font-size: 14px;
	text-align: left;
	padding-top: 10px;
	padding-bottom: 10px;
	margin-bottom: 20px;
	border-bottom: 1px dotted #AAA;
}
.blog-wrapper li .content{
	font-size: 16px;
	text-align: left;
	margin-bottom: 10px;
	color: #AAA;
	display: -webkit-box;
	-webkit-line-clamp: 4;
	-webkit-box-orient: vertical;
	overflow: hidden;
	line-height: 1.5;
}
.blog-wrapper li a:hover p.content{
	color: #FFF;
	transition: all 0.3s ease-in-out 0s;	
}
.blog-wrapper li .goto-blog-page{
	display: none;
	padding: 15px 0;
	text-align: center;
	font-size: 16px;
	color: #fdd207;
	border: 1px solid #fdd207;
	border-radius:10px;
	background-image: url(../../../images/arrow-y.svg);
	background-repeat: no-repeat;
	background-size: 11px 20px;
	background-position: 95% center;
	transition: all 0.3s ease-in-out 0s;
}
.blog-wrapper li a:hover .goto-blog-page{
	color: #000;
	background-color: #fdd207;
	transition: all 0.3s ease-in-out 0s;
}

/* blog-page-wrapper */
.blog-content-page h1{
	color: #FFF;
	margin-bottom: 10px;
}
.blog-content-page .blog-date{
	color: #fdd207;
	width: 90%;
	margin: 0 auto;
	margin-bottom: 100px;
}
.blog-page-wrapper.menu{
	text-align: left;
	margin-bottom: 50px;
}
.blog-page-wrapper{
	width: 90%;
	margin: 0 auto;
	max-width: 1200px;
	letter-spacing: normal;
	line-height: normal;
}
.blog-page-wrapper section{
	text-align: left;
	padding: 0;
	margin-bottom: 100px;
}
.blog-page-wrapper section h2.title{
	color: #FFF;
	font-size: 22px;
	margin-bottom: 50px;
}
.blog-page-wrapper.using-physically section h2.title{
	color: #FFF;
	font-size: 22px;
	padding-bottom: 20px;
	margin-bottom: 30px;
	border-bottom: 1px dotted #333;
}
.blog-page-wrapper section h3.title-sub{
	color: #FFF;
	font-size: 18px;
	margin-bottom: 30px;
}
.blog-page-wrapper section h4.title-sub{
	color: #FFF;
	font-size: 18px;
	margin-bottom: 20px;
}
.blog-page-wrapper section .pic{
	width: 80%;
	max-width: 1000px;
	margin: 50px auto;
	text-align: center;
}
.blog-page-wrapper section .pic2{
	width: 60%;
	max-width: 1000px;
	margin: 50px auto;
}
.blog-page-wrapper p{
	text-align: left;
}
.blog-page-wrapper p.pic-txt{
	text-align: center;
	font-size: 14px;
	color: #AAA;
}
.blog-page-wrapper p a{
	color: #fdd207;
	overflow-wrap:break-word;
}
.blog-page-wrapper p a:hover{
	border-bottom: 1px solid #fdd207;
}
.blog-page-wrapper section p span{
	color: #fdd207;
}
section.blog20181220 .blog-page-wrapper section p span{
	color: #ccc;
}
.blog-page-wrapper p strong{
	color: #FFF;
}
.blog-page-wrapper p span.italic{
	font-style:italic;
	color: #ccc;
}
.blog-page-wrapper p span.sub-txt{
	margin-left: 50px;
	color: #999;
}
.blog-page-wrapper section ul{
	margin-bottom: 30px;
}
.blog-page-wrapper section li{
	list-style: disc;
	margin-left: 50px;
	text-align: left;
	padding-left: 0px;
	margin-bottom: 10px;
}
.blog-page-wrapper section .youtube{
	margin-bottom: 30px;
	text-align: center;
}
.blog-page-wrapper section .youtube iframe{
	width: 980px;
	height: 555px;
}

.blog-page-wrapper section .columnL{
	float: left;
	width: 49%;
}
.blog-page-wrapper section .columnR{
	float: right;
	width: 49%;
}
.blog-page-wrapper section .twoColumn .pic{
	margin: 0 auto;
}
.blog-page-wrapper section .twoColumn .hardware{
	margin-bottom: 20px;
}
.blog-page-wrapper table{
	margin: 0 auto;
	margin-bottom: 50px;
	background-color: #111;
	border-top: 1px solid #ccc;
}
.blog-page-wrapper table th{
	background-color: #555;
	padding: 10px 20px;
	border-left: 1px solid #ccc;
	border-right: 1px solid #ccc;
	border-bottom: 1px solid #ccc;
}
.blog-page-wrapper table td{
	padding: 10px 20px;
	border-left: 1px solid #ccc;
	border-right: 1px solid #ccc;
	border-bottom: 1px solid #ccc;
}
.blog-page-wrapper table tr:nth-child(2n){
	background-color: #222;
}
.blog20190222 img{
	border: 1px solid #CCC;
}
.blog20190527 img{
	border: 1px solid #CCC;
	background-color: #FFF;
}
.mw550 img{max-width: 550px;}

.blog20190603 .blog-page-wrapper section ul{
	margin-bottom: 0;
}
.blog20190603 .blog-page-wrapper section li{
	width: 49.5%;
	float: left;
	margin-left: 0;
	list-style: none;
	margin-bottom: 0;
}
.blog20190603 .blog-page-wrapper section li:nth-child(2){
	width: 49.5%;
	float: right;
}

/** .blog20200805  */
.blog20200805 .blog-page-wrapper section h2.title{
	font-size: 26px;
	font-weight: bold;
	margin-bottom: 30px;
}
.blog20200805 h3{
	color: #fff;
	font-size: 22px;
	font-weight: bold;
	margin-bottom: 20px;
}
.blog20200805 h4{
	color: #fff;
	font-weight: bold;
	margin-bottom: 10px;
}

.blog20200805 table{
	background-color: #000;
	color: #FFF;
	margin-bottom: 30px;
	border: 1px solid #FFF;
	border-left: none;
}
.blog20200805 table th{
	padding: 10px 0;
	text-align: center;
	border-bottom: 1px solid #FFF;
	border-left: 1px solid #FFF;
}
.blog20200805 table td{
	padding: 10px 0;
	text-align: center;
	border-left: 1px solid #FFF;
}
.blog20200805 table td img{
	width: 90%;
	margin: 0 auto;
}
.blog20200805 .pic-small{
	margin-bottom: 50px;
}
.blog20200805 .pic-small img{
	max-width: 450px;
}
.blog20200805 img.sPic{
	max-width: 600px;
}
.trialBtn{
	padding-bottom: 100px;
	text-align: center;
}
@media only screen and (max-width: 1200px) {	
	.blog-wrapper li{
		width: 32%;
		margin-right: 2%;
	}
	.blog-wrapper li:nth-child(3n){
		margin-right: 0;
	}
	.blog-wrapper li:nth-child(4n){
		margin-right: 1%;
	}
	.blog-page-wrapper section .youtube iframe{
		width:880px;
		height:498px;
	}
}

@media only screen and (max-width: 1000px) {
	.blog-page-wrapper section .youtube iframe{
		width:800px;
		height:453px;
	}
}

@media only screen and (max-width: 910px) {
	.blog-page-wrapper section .youtube iframe{
		width:700px;
		height:396px;
	}
}

@media only screen and (max-width: 810px) {
	.blog-page-wrapper section .youtube iframe{
		width:600px;
		height:340px;
	}
}
@media only screen and (max-width: 750px) {
	h1{
		font-size: 24px;
		padding: 0 5%;
		line-height: normal;
	}	
	.blog-page-wrapper p{
		font-size: 16px;
		line-height: 2;
	}
	.blog-wrapper li{
		width: 49%;
		margin-right: 2%;
	}
	.blog-wrapper li:nth-child(3n){
		margin-right: 2%;
	}
	.blog-wrapper li:nth-child(2n),
	.blog-wrapper li:nth-child(4n){
		margin-right: 0;
	}
	.blog-page-wrapper section h2.title{
		font-size: 18px;
	}	
	.blog-page-wrapper section h3.title-sub{
		font-size: 16px;
	}	
	.blog-page-wrapper section .youtube iframe{
		width:500px;
		height:283px;
	}
	.blog-page-wrapper section .pic{
		width: 100%;
	}	
	.blog-page-wrapper section .pic2{
		width: 80%;
	}	
	.blog-page-wrapper p.pic-txt{
		font-size: 12px;
	}
}

@media only screen and (max-width: 610px) {
	.blog-page-wrapper section .youtube iframe{
		width:400px;
		height:227px;
	}
	
	.blog20190603 .blog-page-wrapper section li,
	.blog20190603 .blog-page-wrapper section li:nth-child(2){
		width: 100%;
		float: none;
	}
}

@media only screen and (max-width: 510px) {
	.blog-page-wrapper section .youtube iframe{
		width:350px;
		height:198px;
	}
}
@media only screen and (max-width: 450px) {
	h1{
		font-size: 28px;
		margin-bottom: 50px;
		line-height: 1.5;
	}	
	.blog-content-page h1{
		text-align: left;
	}
	.blog-content-page .blog-date{
		margin-bottom: 50px;
		text-align: left;
	}
	.blog-page-wrapper section h2.title{
		margin-bottom: 30px;
	}	
	.blog20200805 .blog-page-wrapper section h2.title{
		font-size: 22px;
	}
	.blog20200805 h3{
		font-size: 18px;
	}
	.blog-wrapper li{
		width: 100%;
		margin-right: 0 !important;
		padding-bottom: 20px;
		margin-bottom: 100px;
		border-bottom: none;
	}
	.blog-wrapper li .content{
		margin-bottom: 20px;
	}
	.blog-wrapper li .date{
		border-bottom: 1px dotted #666666;
	}
	.blog-wrapper li .goto-blog-page{
		display: block;
	}	
	.blog-page-wrapper p.pic-txt{
		text-align: left;
	}	
	.blog-page-wrapper section{
		margin-bottom: 50px;
	}
	.blog-page-wrapper section li{
		margin-left: 30px;
	}
	.en .contact-mail-btn a span{
		padding: 15px 15%;
		font-size: 16px;
	}
}

@media only screen and (max-width: 410px) {
	.blog-page-wrapper section .youtube iframe{
		width:300px;
		height:170px;
	}
}
@media only screen and (max-width: 400px) {
}
@media only screen and (max-width: 350px) {
	.blog-page-wrapper section .youtube iframe{	
		width:250px;
		height:142px;
	}
}