/*
Theme Name: PATLABOR EZY OFFICIAL WEBSITE
Theme URI: https://patlabor.tokyo/
Author: PATLABOR EZY
Author URI: https://patlabor.tokyo/
Description: 
Version: 
License: 
License URI: 
*/

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

/* 共通 */
body{
	margin:0;
	padding:0;
	color: #000000;
    /*  font-family: "tbudgothic-std", "Hiragino Sans", "ヒラギノ角ゴシック", "ヒラギノ角ゴ Pro W3", "Hiragino Kaku Gothic Pro", "Meiryo", "メイリオ", "HG丸ｺﾞｼｯｸM-PRO", "HGMaruGothicMPRO", sans-serif; /*add1111*/
}

#header{
	position:absolute;
	top:0;
	width:100%;
	text-align:center;
}

#headtitle{
	position:relative;
	top: 50%;
	left:50%;
	transform: translateY(-50%) translateX(-50%);
	-webkit-transform: translateY(-50%) translateX(-50%);
}

#main{
	position:absolute;
	width:100%;
}

.headline{
	font-size:28px;/*add181111*/
	
	font-weight: 600; 
/*	font-family: acumin-pro, sans-serif;    */
}

.text01{
	width:100%; /*add1111*/
	text-indent: 3px;
	color: #000000;
	line-height: 39px;
/*	font-family: acumin-pro, sans-serif;    */
	font-weight: 500;
}

.text02{
	width:100%;  /*add1111*/
/*	font-family: acumin-pro, sans-serif;    */
	font-weight: 400;
}

a{text-decoration: none;color: #000000; }
a:hover{text-decoration: none;color: #ff0000;}


/* 共通 */

/* メディアクエリ */
@media screen and (max-width : 600px) {
	.headline{
		/* font-size:4vw;letter-spacing: 3px; */
		font-size:4.3vw;letter-spacing: 2px;  /*add1111*/
	}
	.text01{
		/* font-size:3.66vw;letter-spacing: 2.5px; */
		font-size:3.8vw;letter-spacing: 2px; /*add1111*/
		margin:20px auto 0 auto; /*add1111*/
	}
	#header{height:11.6vw;}
	#main,#menu_sp{top:11.6vw;}
	#main{height:calc(100vh - 11.6vw);}
	/* .text02 br{display: none;} */
	.text02 span::before {content: "\A" ;white-space: pre ;}
}
@media screen and (min-width : 601px) {
	.headline{
		/*font-size:24px;letter-spacing: 6px;*/
		font-size:28px;letter-spacing: 8px; /*add1111*/
	}
	.text01{
		/* font-size: 22px;letter-spacing: 4px; */
		font-size: 26px;letter-spacing: 5px; /*add1111*/
		margin:30px auto 10px auto; /*add1111*/
	}
	#header{height:70px;}
	#main,#menu_sp{top:70px;}
	#main{height:calc(100vh - 70px);}
}
@media screen and (max-width : 800px) {
	.text02{
		margin:0 auto 30px auto; /*add1111*/
		/* font-size:1.75vw;line-height: 2.375vw;  */
		font-size:2vw;
		line-height: 1.3;
	}
	#copyright{font-size: 10px;line-height: 13.5px;}
	#menu_pc{display:none;}
	#sp-menu-btn{display:block;}
	#keyvisual{height:70vw;}
	#contents{top:70vw;height:calc(32vh - 70px);}
	
	.good-img-box{ width: 100%;}
	.good-img-box img{ width: 100%; }
}
@media screen and (min-width : 801px) {
	.text02{
		margin:0 auto 40px auto; /*add1111*/
		font-size:14px;
		line-height: 19px;
	}
	#copyright{font-size: 11px;line-height: 15px;}
	#menu_pc{display:block;}
	#sp-menu-btn{display:none;}
	#keyvisual{height:60vh;}
	#contents{top:60vh;height:calc(40vh - 70px);}
	
	.good-img-box{display:table-cell;}
}

@media screen and (orientation: landscape) {
	/* 横向きの場合のスタイル */
	@media screen and (max-height : 783.3px) {
		#logo02{width:93.1vh;height:100%;margin:auto;}
	}
	@media screen and (min-height : 783.4px) {
		#logo02{width:100%;padding-bottom:64.4%;margin:auto;}
	}
}

@media screen and (orientation: portrait) {
	/* 縦向きの場合のスタイル */
	#logo02{width:100%;padding-bottom:64.4%;margin:auto;}
}
/* メディアクエリ */


/* メニュー */
ul {
	list-style: none;
	margin: 0;
	padding: 0;
}

/* メニュー：スマホ用 */
#sp-menu-btn{
	position:absolute;
		top:50%;
		right:0%;
	transform: translateY(-50%); -webkit-transform: translateY(-50%) ;
	box-sizing: border-box;
	padding: 10px 2.5%;
	height: 50px;
}

.menu-btn,.menu-btn span {
	display: inline-block;
	transition: all .4s;
	box-sizing: border-box;
}

.menu-btn {
	display: block;
	float: right;
	margin: 0 auto;
	position: relative;
	width: 30px;
	height: 30px;
}

.menu-btn span {
	position: absolute;
	left: 0;
	width: 100%;
	height: 2px;
	background: #000000;
}

.menu-btn span:nth-of-type(1) {
	top: 0;
}

.menu-btn span:nth-of-type(2) {
	/* top: 13px; */ top: 9px;
}

.menu-btn span:nth-of-type(3) {
	/* bottom: 0; */ top: 18px;
}

#menu_sp {
	position:absolute;
	top:40px; /*add*/
	width:100%;
	text-align:center;
	/*background-color: rgba(255,255,255,0.7);*/
	background-color: rgba(0,0,0,0.7); color:#fff; /*add*/
	display: none;
}

#menu_sp li {
	box-sizing: border-box;
	border-bottom: 1px solid #000000;
	display: block;
/*	font-family: acumin-pro, sans-serif;    */
	font-size: 16px;
	line-height: 26px;
	padding: 5px 10px;
	width: 100%;
	color:#bbbbbb; 
}
#menu_sp .backW{ background-color: rgba(255,255,255,0.7); }
#menu_sp li a{ color:#ffff00; }

#menu_sp li:nth-of-type(1) {border-top: 2px solid #000000;}
#menu_sp li:nth-of-type(9) {border-bottom: 2px solid #000000;}

/* メニュー：スマホ用 */
/* メニュー：PC用 */
#menu_pc{
	/* margin-top:2vh; margin-left:5%; height:30px;*/
	width:90%;
	max-width: 800px;
	margin: 0 auto; padding:0;
	border-top:solid 2px #000000;
	border-bottom:solid 2px #000000;
	font-size:14px;
/*	font-family: acumin-pro, sans-serif;    */
	font-weight: 400;
}
#menu_pc ul{
	display:table;
	width: 100%;
	padding: 3px 0; /*add1111*/
}
#menu_pc li{
	display:table-cell;
	vertical-align:middle;
	color:#bbbbbb;
	width: 15%;
}
#menu_pc .efct a{ 
	display:block; width:90%; height:100%; padding: 5px 0; text-align:center; 
	color:#000; background:#fff; border-radius: 4px; 
	transition: color 0.2s linear 0s; }

#menu_pc .efct a:hover{ 
	color:#ffff00; background:#333;} /*add1111*/

#menu_pc li img{
	height:20px;
	margin-top:5px;
}
/* メニュー：PC用 */
/* メニュー */


/* トップページ用 */
#keyvisual{
	position:absolute;
	width:100%;
	overflow:hidden;
}

#keyvisual img{
	position:absolute;
		left:0%;
	width:100%;
	min-height:100%;
	object-fit: cover;
}

#sub{
	position:absolute;
		top:50%;
		left:50%;
	width:100%;
	height:60vh;
	transform: translateY(-50%) translateX(-50%);
	-webkit-transform: translateY(-50%) translateX(-50%);
}

#logo01{
	position:relative;
	width:100%;
	height:100%;
	max-width:730px;
	margin:auto;
}

#logo02{
	position:absolute;
		top:50%;
		left:50%;
	transform: translateY(-50%) translateX(-50%);
	-webkit-transform: translateY(-50%) translateX(-50%);
}

#logo_main{
	position:absolute;
		top:60%;
	width:88%;
	margin-left:6%;
}

#logo_sub{
	position:absolute;
		bottom:13%;
		left:25.2%;
	width:47.4%;
}

#gear01,#gear02,#gear03,#gear04,#gear05,#gear06{
	width:13.8%;
}

#gear01{
	position:absolute;
		top:8%;
		left:24.3%;
}

#gear02{
	position:absolute;
		top:8%;
		left:43.2%;
}

#gear03{
	position:absolute;
		top:8%;
		right:24.3%;
}

#gear04{
	position:absolute;
		top:31.8%;
		left:33.4%;
}

#gear05{
	position:absolute;
		top:31.8%;
		right:33.4%;
}

@keyframes rotate-gear01 {
	0% { transform: rotate(0deg); }
	100% { transform: rotate(360deg); } 
}

#gear01 img{
	animation: rotate-gear01 12s linear infinite;
}

#gear02 img{
	animation: rotate-gear01 20s linear infinite;
}

#gear03 img{
	animation: rotate-gear01 25s linear infinite;
}

#gear04 img{
	animation: rotate-gear01 16s linear infinite;
}

#gear05 img{
	animation: rotate-gear01 36s linear infinite;
}

#contents{
	position:absolute;
	width:100%;
	text-align: center;
	min-height:180px;
}

#footer01{
	width:100%;
	text-align: center;
	/*	margin-top:15px; position:absolute; bottom:5px; */
	margin: 30px auto 0 auto;
	padding-bottom:20px;/*add 1111*/ 
}
#footer02{
	width:100%;
	text-align: center;
/*	font-family: Arial, Helvetica Neue, Helvetica, sans-serif;  */
	margin: 50px auto 0 auto; /*add */ 
}
.banner {
	margin: 0 auto 20px;
}


#copyright{
/*	font-family: Arial, Helvetica Neue, Helvetica, sans-serif;  */
}
/* トップページ用  end*/


/*　これ以降は、2018-11-11大幅に追加修正しています*/
/*下層ページ*/
#leaf #menu_pc{ margin-top:10px;}
#leaf #header{ position:relative; margin-top:10px;} 
#leaf #main{
	position:relative;
	margin-top:30px;width:90%;margin-left:5%;
}
@media screen and (max-width : 800px) {
	#leaf .text02{font-size:1.75vw;line-height: 2.375vw;}
	
}
@media screen and (min-width : 801px) {
	#leaf .text02{font-size:14px;line-height: 19px;}
	
	/* #leaf #main{margin-top:50px;width:90%;margin-left:5%;} */
}

/* 購入ボタン*/
.purchase{
	width:100%;
	margin:30px 0 30px 0;
	text-align:right;
}

.purchase-btn{
	display:inline-block;
	width: 238px;
	padding: 0.8em;
	text-align: center;
	text-decoration: none;
	color: #ff0000;
	border: 2px solid #ff0000;
	border-radius: 3px;
	transition: .4s;}

.purchase-btn:hover {
	background: #ff0000;
	color: #fff;
}

.sne_space {
	margin:0px 0 50px 0;
width:100%;text-align:right;
}




/*ページ番号*/
#pasing{ margin-top:30px; }
#pasing ul{ 
	list-style-type: none; margin:0 auto; text-align:center; }
#pasing li{ 
	display: inline; 
	width: 40px; height:40px; 
	margin: 0 0.5vw; padding:10px;
	background:#eeeeee; 
	border:solid 1px #000000; 
}
#pasing .current{ 
	background:#000;  color:#fff; }

/*ニュース記事*/
.article .a_header{ border-bottom:solid 1px #000000; margin:15px 0px 5px 0px ; padding:0px 0px 5px 0px ; }
.article .date{ font-size:12px; vertical-align:bottom; }
.article .title{ font-weight:bold;font-size: 20px; color:#333; letter-spacing: 0.05em; line-height: 1.4;}
.article .txt{ font-size: 14px; line-height: 23px; border-bottom:solid 2px #000000; letter-spacing: 0.05em; padding: 10px 0px 20px 0px; }
.end .txt{ border-bottom:none; }
.article .sns{ width:100%; margin:10px 0 10px 0; text-align:right; }

.product{ width:100%; margin: 0; border-bottom:solid 2px #000000; font-size:14px; }
.end .product{ border-bottom:none; }
.product .pct{ width:100%;display:table;text-align:center;}
.product .spec{ width:100%; background:#eee; text-align:center; margin:20px 0 20px 0; padding: 10px 0px 10px 0px;}
.new{ padding: 2px; color:#fff; background-color: #ff0000; font-size:14px; }

/*
.a_header:after {
    content: "";
    clear: both;
    height: 0;
    display: block;
    visibility: hidden;
}
*/



/* SNSメニュー */
.snsButtons {
  margin: 0px;
  padding: 0px;
  text-align: right;
}
.snsButtons a {
  text-decoration: none;
}
/* 各 SNS ボタンのボックス */
.snsButtons li {
  display: inline-block;  /* 水平に並べる */
  list-style-type: none;  /* 先頭のポッチを消す */
  text-align: center;
  margin: 2px;
  padding: 2px 2px 2px 2px;
  width: 80px;
  color: white;
  font-size: 12px;
  border-radius: 4px;
  box-shadow: 0px 1px 1px rgba(0, 0, 0, 0.29);
}
/* マウスカーソルを重ねたとき */
.snsButtons li:hover {
  opacity: 0.7;
}
/* クリックしたとき */
.snsButtons li:active {
  box-shadow: inset 0 0 1px rgba(128, 128, 128, 0.1);
  transform: translateY(2px);
}
/* 各 SNS のブランドカラー */
.snsButtons_twitter  { background: #1da1f2; }
.snsButtons_facebook { background: #3b5998; }
.snsButtons_line   { background: #5fb937; }