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

@media only screen and (min-width:769px) {
	/*フェードインjs用----------------------*/
	.fade-in {
		opacity: 0;
		transition-duration: 1800ms;
		transition-property: opacity, transform;
	}
	.fade-in-up {transform: translate(0, 100px);}
	.fade-in-down {transform: translate(0, -100px);}
	.fade-in-left {transform: translate(-100px, 0);}
	.fade-in-right {transform: translate(100px, 0);}
	.scroll-in {opacity: 1; transform: translate(0px, 0px);}
	/*フェードインjs用ここまで--------------*/


	.pb_cattower{
		font-family: "游明朝", YuMincho, "Hiragino Mincho ProN W3", "ヒラギノ明朝 ProN W3",
			"Hiragino Mincho ProN", "HG明朝E", "ＭＳ Ｐ明朝", "ＭＳ 明朝", serif;
	}
	/*トップスライダーここから-----------*/
	.pb_cattower .slider_box{
		position: relative;
		z-index: 1;
	}
	.pb_cattower .index-fade__items {
		position: relative;
		width: 100%;
		height: 100vh;
	}
	.pb_cattower .index-fade__items li {
		width: 100%;
		height: 100%;
		position: absolute;
		top: 50%;
		left: 50%;
		-webkit-transform: translate(-50%, -50%);
		transform: translate(-50%, -50%);
		background-position: center top;
	}

	.pb_cattower .slider_img01{
		background-image: url(/img/PB/cattower/slider01.png);
		background-size: cover;
		width: 100%;
	}
	.pb_cattower .slider_img02{
		background-image: url(/img/PB/cattower/slider02.png);
		background-size: cover;
		width: 100%;
	}
	.pb_cattower .slider_img03{
		background-image: url(/img/PB/cattower/slider03.png);
		background-size: cover;
		width: 100%;
	}

/*トップスライダーここまで---------*/

	/*共通タイトル----------------------------*/
	.pb_cattower .section_title .text01{
		padding-top: 10%;
		font-size: 40px;
		text-align: center;
		border-bottom: 1px solid;
		width: 220px;
		margin: 0px auto;
	}
	.pb_cattower .section_title .text02{
		text-align: center;
		margin-top: 10px;
		font-size: 17px;
	}
	
	/*トップスライダー文字部分-----------*/
	#cattower_top{
		position: relative;
	}
	.pb_cattower .slider_title{
		position: absolute;
		width: 260px;
		height: 260px;
		z-index: 2;
		top:9%;
		left: 12%;
		background-color: rgba(0,0,0,0.5);
		display: flex;
		flex-flow: column;
		align-items: center;
		justify-content: center;
	}
	.pb_cattower .slider_title p{
		display: flex;
		align-items: center;
		width: 200px;
		height: 200px;
		padding: 20px;
		border: 1px solid #fff;
		color: #fff;
		font-size: 25px;
		 -ms-writing-mode: tb-rl;
		writing-mode: vertical-rl;
}
	.pb_cattower .cat_scrolldown{
		position: absolute;
		top:45%;
		left:15%;
		z-index: 3;
	}
	.pb_cattower .animation{
		animation-timing-function: ease-in-out;
		animation-iteration-count: infinite;
		animation-direction: alternate;
		animation-duration: 1.5s;
		width: 128px;
	}
	.pb_cattower .keyframe1{
		animation-name: anim_v;
	}
		@keyframes anim_v {
			0% {
				transform: translate(0, 0px);
			}
			100% {
				transform: translate(0, 30px);
			}
		}
	/*イントロダクション--------------------*/
	.pb_cattower #introduction{
		background-image: url(/img/PB/cattower/bg01.png);
		background-size: cover;
		min-height: 1050px;
		position: relative;
	}
	.pb_cattower #introduction img{
		position: absolute;
		bottom: 0;
		right: 40%;
		}
	.pb_cattower #introduction p.intro_text01{
		text-align: center;
		font-size: 40px;
		padding-top: 17%;
		font-weight: bold;
	}
	.pb_cattower #introduction hr{
		display: block;
		width: 600px;
		border-bottom: 2px solid #FFF;
		margin: 20px auto 30px;
	}
	.pb_cattower #introduction p.intro_text02{
		text-align: left;
		font-size: 20px;
		font-weight: bold;
		width: 540px;
		margin: 0 auto;
	}
	
	/*ラインナップ---------------------------*/
	.pb_cattower #line-up{
		background-image: url(/img/PB/cattower/bg02.png);
		background-size: cover;
		min-height: 1050px;
	}
	.pb_cattower #line-up ul{
		display: flex;
		justify-content: center;
		margin-top: 5%;
	}
	.pb_cattower #line-up ul li{
		margin: 0px 60px;
	}
	.pb_cattower #line-up ul li div.itemlist{
		position: relative;
	}
		.pb_cattower #line-up ul div.itemlist::before {
			position: absolute;
			content: '';
			display: block;
			width: 0;
			height: 0;
			border-style: solid;
			border-width: 70px 70px 0 0;
			box-shadow: -1px -1px 1px rgba(50, 50, 50, 0.1);
			left: -10px;
			top: -10px;
			z-index: 3;
		}
		.pb_cattower #line-up ul div.itemlist::after {
			position: absolute;
			content: '';
			display: block;
			width: 0;
			height: 0;
			border-style: solid;
			border-width: 0 0 70px 70px;
			box-shadow: 1px 1px 1px rgba(50, 50, 50, 0.1);
			right: -10px;
			bottom: -10px;
		}
			.pb_cattower #line-up ul li div.item01::before{border-color: #cab466 transparent transparent transparent;}
			.pb_cattower #line-up ul li div.item01::after{border-color: transparent transparent #cab466 transparent;}
			.pb_cattower #line-up ul li div.item02::before{border-color: #799897 transparent transparent transparent;}
			.pb_cattower #line-up ul li div.item02::after{border-color: transparent transparent #799897 transparent;}
			.pb_cattower #line-up ul li div.item03::before{border-color: #769db1 transparent transparent transparent;}
			.pb_cattower #line-up ul li div.item03::after{border-color: transparent transparent #769db1 transparent;}

	.pb_cattower #line-up ul li a{
		display: block;
		text-decoration: none;
		width: 100%;
		height: 100%;
	}
	.pb_cattower #line-up ul li a .item_image{
		width: 350px;
		border: 1px solid #E7E7E7;
	}
	.pb_cattower #line-up ul li p{
		font-size: 20px;
		text-align: center;
		font-weight: bold;
	}
	.pb_cattower .click_act {
		overflow:hidden;
		height: 350px;
		width: 350px;
		
}
	.pb_cattower .click_act .caption {
		text-align: center;
		padding-top:150px;
		color:#fff;
		width: 15%;
		margin: auto;
	}
	.pb_cattower .click_act .mask {
		width:			100%;
		height:			100%;
		position:		absolute;	/* 絶対位置指定 */
		top:			0;
		left:			0;
		opacity:		0;	/* マスクを表示しない */
		background-color:	rgba(0,0,0,0.4);	/* マスクは半透明 */
		-webkit-transition:	all 0.2s ease;
		transition:		all 0.2s ease;
	}
	.pb_cattower .click_act:hover .mask {
		opacity:		1;	/* マスクを表示する */
	}
	/*レビュー---------------------------*/
	.pb_cattower #reviews{
		background-image: url(/img/PB/cattower/bg03.png);
		min-height: 1050px;
		background-size: cover;
		position: relative;
	}
	.pb_cattower #reviews ul{
		display: flex;
		justify-content: center;
		margin-top: 5%;
	}
		.pb_cattower #reviews ul li{
			margin: 0px 60px;
		}
			.pb_cattower #reviews ul li a div{
				width: 350px;
				box-shadow: 5px 5px 5px 3px rgb(0 0 0 / 9%);
				background-color: #FFF
			}
			.pb_cattower #reviews ul li a div img{
				padding: 30px;
				 transform: scale(1.1);
				cursor: pointer;
				filter: grayscale(100%);
			}
			.pb_cattower #reviews ul li a div img:hover{
				filter: grayscale(0);
			}
				.pb_cattower #reviews ul li p.item_name{
					font-size: 20px;
					text-align: center;
					font-weight: bold;
					margin-top: 20px;
					margin-bottom: 20px;
				}
				.pb_cattower .c_item01{border-bottom: solid 1px #cab466;}/*コーナーキャットタワー*/
				.pb_cattower .c_item02{border-bottom: solid 1px #799897;}/*モダンインテリアキャットタワー*/
				.pb_cattower .c_item03{border-bottom: solid 1px #769db1;}/*スライドキャットマンション*/
	
				.pb_cattower #reviews ul li p.cat_name{
					font-size: 20px;
					text-align: center;
					font-weight: bold;
				}
				.pb_cattower #reviews ul li p.owner_name{
					font-size: 20px;
					text-align: center;
					font-weight: bold;
				}
	.pb_cattower #reviews .smalltext{font-size: 15px;}
	.pb_cattower #reviews .link_more a{
		position: absolute;
		right: 0;
		bottom: 10%;
		text-align: left;
		border-bottom: 1px solid;
		width: 12%;
		font-size: 20px;
		text-decoration: none;
	}
	.pb_cattower #reviews .link_more a:hover{
		opacity: 0.7;
	}
	/*製造元-----------------------*/
	.pb_cattower #manufacturer{
		background-image: url(/img/PB/cattower/bg04.png);
		background-size: cover;
		min-height: 1050px;
	}
	.pb_cattower #manufacturer .mf_flexbox{
		display: flex;
		margin-top: 5%;
		align-items: center;
	}
		.pb_cattower #manufacturer .mf_flexbox .mf_left{
			width: 50%;
		}
		.pb_cattower #manufacturer .mf_flexbox .mf_right{
			width: 50%;
		}
	.pb_cattower #manufacturer ul{
		display: flex;
		flex-wrap: wrap;
	}
		.pb_cattower #manufacturer ul li{
			margin: 10px;
		}
	.pb_cattower #manufacturer div.white_box{
		background-color: #FFF;
		border: 1px solid #7f6d2e;
		width: 60%;
		margin: 40px auto 10px;
		padding: 30px;
		font-size: 17px;
		
	}
		.pb_cattower #manufacturer div.white_box img{
			margin-bottom: 10px;
		}
	.pb_cattower #manufacturer div.mf_textbox{
		margin: 10px auto;
		width: 60%;
	}
		.pb_cattower #manufacturer div.mf_textbox p.mf_text01{
			font-size: 27px;
			font-weight: bold;
			margin-left: 10px;
			margin-bottom: 20px;
		}
		.pb_cattower #manufacturer div.mf_textbox p.mf_text02{
			font-size: 20px;
			font-weight: bold;
			margin-top: 10px;
			margin-left: 10px;
	}
}/*PC版閉じタグ*/