@charset "UTF-8";
/* CSS Document */
.wr {
	display: inline-block;
}
.service-images:hover {
	opacity: 0.6;
	transition-duration: 1.0s;	/*変化に掛かる時間*/
}

.articles-wrapper {
	transition: 1.0s;
	transform: translateY(0);
	top: 0;
	position: fixed;
	z-index: 100;
	width: 100%;
	transform: translateY(-100%);
	opacity: 0.00;
}

.articles-wrapper4 {
	transition: 1.0s;
	top: 0;
	position: fixed;
	z-index: 100;
	width: 100%;
	transform: translateY(-100%);
	opacity: 0.00;
}

.is-fixed {
	transition: 1.0s;
	top: 0;
	width: 100%;
	transform: translateY(0%);
	opacity: 0.95;
}



.hide2 {
	transition: 1.0s;
	transform: translateY(-100%);
	opacity: 0.00;
}
.show2 {
	transition: 1.0s;
	transform: translateY(0);
	opacity: 1.00;
}
.bgwhite {}

/* banner */
.articles-wrapper2 {
	transition: 1.0s;
	transform: translateY(0);
	position: fixed;
	opacity:0.9;
	bottom: 0;
	left: 0;
	z-index: 100;
	width: 100%;

	
}

.is-fixed2 {
	transition: 1.0s;
	transform: translateY(100%);
	opacity: 0.00;
}
.is-hidden {
	display: none;
}
/*Fixed banner*/
/* 画像の共通設定 */
.fixed_right_banner {
	position: fixed;
	top: 20px;
	right: 0;
	/* 横幅 */
	width: 65px;
	/* ブロック要素に変更 */
	display: block;
	z-index: 1;
	/* 透過変更をスムーズにする(任意) */
	-webkit-transition: opacity .2s ease;
	transition: opacity .2s ease;
}
/* マウスオーバー時の表現 */
.fixed_right_banner:hover {
	/* 20%透過させる */
	opacity: .8;
}
.dropmenu {
	*zoom: 1;
	list-style-type: none;
	padding: 0;
}
.dropmenu:before, .dropmenu:after {
	content: "";
	display: table;
}
.dropmenu:after {
	clear: both;
}
.dropmenu li {
	position: relative;
	width: 100%;
	float: right;
	margin: 0;
	padding: 0;
	height: 60px;
	background: #DCDCDC;
	text-align: center;
}
.dropmenu li a {
	display: block;
	margin: 0;
	padding: 20px 0 10px;
	height: 60px;
	background: #DCDCDC;
	color: #000000;
}
.dropmenu li ul {
	list-style: none;
	position: absolute;
	z-index: 9999;
	top: 100%;
	right: 0;
	margin: 0;
	padding: 0;
}
.dropmenu li ul li {
	width: 100%;
}
.dropmenu li ul li a {
	padding: 15px 10px;
	border-top: 1px solid #999999;
	background: #666666;
	color: #FFFFFF;
	text-align: left;
}
.dropmenu li:hover > a {
	background: #FFFFFF;
	background: #DCDCDC;
}
.dropmenu li a:hover {
	background: #DCDCDC;
	color: #000000;
}
.dropmenu li ul li {
	overflow: hidden;
	height: 0;
	transition: .5s;
}
.dropmenu li:hover ul li {
	overflow: visible;
	height: 50px;
}
.anim {
	animation-name: fadein;
	animation-duration: 2s;
	animation-iteration-count: infinite;
}
@keyframes fadein {
	from {
		opacity: 0;
		transform: translateY(20px);
	}
	to {
		opacity: 1;
		transform: translateY(0);
	}
}
@-webkit-keyframes fadeInUp {
	0% {
		opacity: 0;
		-webkit-transform: translate3d(0, 10%, 0);
		transform: translate3d(0, 10%, 0)
	}
	100% {
		opacity: 1;
		-webkit-transform: none;
		transform: none
	}
}
@keyframes fadeInUp {
	0% {
		opacity: 0;
		-webkit-transform: translate3d(0, 10%, 0);
		transform: translate3d(0, 10%, 0)
	}
	100% {
		opacity: 1;
		-webkit-transform: none;
		transform: none
	}
}
.fadeInUp {
	-webkit-animation-name: fadeInUp;
	animation-name: fadeInUp
}
@-webkit-keyframes fadeInUpBig {
	0% {
		opacity: 0;
		-webkit-transform: translate3d(0, 500px, 0);
		transform: translate3d(0, 500px, 0)
	}
	100% {
		opacity: 1;
		-webkit-transform: none;
		transform: none
	}
}
@keyframes fadeInUpBig {
	0% {
		opacity: 0;
		-webkit-transform: translate3d(0, 500px, 0);
		transform: translate3d(0, 500px, 0)
	}
	100% {
		opacity: 1;
		-webkit-transform: none;
		transform: none
	}
}
.fadeInUpBig {
	-webkit-animation-name: fadeInUpBig;
	animation-name: fadeInUpBig
}
.animated {
	-webkit-animation-duration: 1s;
	animation-duration: 1s;
	-webkit-animation-fill-mode: both;
	animation-fill-mode: both;
	-webkit-backface-visibility: hidden
}
.carousel-control.right {
	display: none;
}
.hero-carousel {
	top: 0;
	z-index: 10;
}
.red-box {
	position: absolute;
	z-index: 20;
}
.navm {
	position: fixed;
	top: 0;
	z-index: 60;
}


/*グラデーション 


.gradient {
		animation: bgChange 8s linear 0s infinite alternate;
		-webkit-animation: bgChange 8s linear 0s infinite alternate; 
		background: linear-gradient(-135deg, #F9B672, #FF0000);
		-pie-background:linear-gradient(
			-135deg, #F9B672, #FF0000
		);
		behavior: url(/PIE.htc);
	}
	@keyframes bgChange {
		0% {
		    -webkit-filter: hue-rotate(0deg); 
		    filter: hue-rotate(0deg);
		}
		100% {
		    -webkit-filter: hue-rotate(360deg); 
		    filter: hue-rotate(360deg);
		}
	}
	
	@-webkit-keyframes bgChange {
		0% {
		    -webkit-filter: hue-rotate(0deg);
		}
		100% {
		    -webkit-filter: hue-rotate(360deg);
		}
	}

*/