/*---------------------------------------

  	クロスフェーダー
    
----------------------------------------*/
/*
  	スライドショー　
----------------------------------------*/

.top_slide {
	position:relative;
	width:auto;
	margin:0;
	padding:0;
}
.top_slide .slide_txt {
	position:absolute;
	top:0;
	right:15px;
	margin:auto;
	width:43%;
	height:120px;
	background:none;
	z-index:1000;
}
.top_slide .slide_txt img {
	width:100%;
	height:auto;
}
.viewer {
    position: relative;
	display:block;
    width:auto;
	max-width:1920px;
	height:860px;
 	margin: 0 auto;
    overflow: hidden;
}
.viewer .cover {
    position: relative;
	width:100%;
	height:100%;
	background:none;
	background:rgba(0,0,0,0.21);
}
.viewer ul {
	display: inline-block;
    overflow: hidden;
	margin:0;
	padding:0;
}
.viewer ul li {
   	position:absolute;
	margin:auto;
	top:0;
	left:0;
	right:0;
	padding:0;
	width:100%;
	height:860px;
	background-size: cover;
	background-repeat:no-repeat;
	list-style:none;
	text-align:center;
	background-position: center;
}
.viewer ul li .inner {
	position:relative;
	width:100%;
	height:100%;
}
.viewer ul li .cont {
	color:#fff;
	position:absolute;
	background:rgba(0,0,0,0.3);
	margin:auto;
	display:inline-block;
	top:14.8%;
	max-width:900px;
	padding-bottom:1.6em;
	left:0;
	right:0;
	text-align:center;
}
.viewer ul li .cont figure img {
	max-width:100%;
	height:auto;
	margin:0 auto;
}
.viewer ul li .cont p {
	font-size:2.3em !important;
	font-weight:bold !important;
	padding:0.9em 0.4em;
}
.viewer ul li .cont h2 {
	font-size:5em;
	font-family: 'Oswald', sans-serif;
	letter-spacing:0.09em;
}
.viewer ul li .inner .cont p {
	font-size:1.9em;
	font-weight:normal;
	padding:0.2em;
	margin:0;
}
@media screen and (max-width:980px) {
	.viewer {
		height:640px;
	}
	.viewer ul li {
		height:640px;
	}
}
@media screen and (max-width: 767px) {
	.viewer {
		height:410px;
	}
	.viewer ul li {
		height:410px;
	}
	.viewer ul li .cont {
		top:12.8%;
		max-width:82%;
	}
	.viewer ul li .cont h2 {
		font-size:2.2em;
		letter-spacing:0.05em;
	}
	
	.viewer ul li .cont p {
	font-size:2.3em !important;
	font-weight:bold !important;
	padding:0.9em 0.4em;
}
.viewer ul li .inner .cont p {
	font-size:1.9em;
	font-weight:normal;
	padding:0.2em;
	margin:0;
}

	
	.viewer ul li .inner .cont p {
		font-size:1.2em !important;
	}
}

.btn {
	/*
    margin-top: calc(50% + 25px);
    */
	position: relative;
    display: inline-block;
    width: 277px;
    height: 50px;
    font-size:150% !important;
    font-weight: bold;
    line-height: 62px;
    text-align: center;
    text-transform: uppercase;
    background-color: transparent;
    cursor: pointer;
    text-decoration:none;
    font-weight: bold;
    letter-spacing: 0.012em;
}
.btn svg {
    position: absolute;
    top: 0;
    left: 0;
}
.btn svg rect {
    //stroke: #EC0033;
    stroke-width: 4;
    stroke-dasharray: 353, 0;
    stroke-dashoffset: 0;
    -webkit-transition: all 600ms ease;
    transition: all 600ms ease;
}
.btn span{
  background: rgb(255,130,130);
  background: -moz-linear-gradient(left,  rgba(255,130,130,1) 0%, rgba(225,120,237,1) 100%);
  background: -webkit-linear-gradient(left,  rgba(255,130,130,1) 0%,rgba(225,120,237,1) 100%);
  background: linear-gradient(to right,  rgba(255,130,130,1) 0%,rgba(225,120,237,1) 100%);
  filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#ff8282', endColorstr='#e178ed',GradientType=1 );
  -webkit-background-clip: text;
  -webkit-text-fill-color: transparent;
}
.btn:hover svg rect {
    stroke-width: 4;
    stroke-dasharray: 196, 543;
    stroke-dashoffset: 437;
}
@media screen and (max-width: 767px) {

	.slide_submit {
		position:absolute;
		margin:auto;
		background:rgba(255,255,255,0.8);
		left:0;
		right:0;
		bottom:-220px;
		width:290px;
		height:62px;
		text-align:center;
		border-radius:3px;
		z-index:800;
	}
}

/*---------------------------------------

	装飾系
  
----------------------------------------*/
.dots {
   	position:absolute;
	top:0;
	left:0;
	width:100%;
	height:99.3%;
	background: url(images/dot.png) repeat top left;
	z-index:505;
	overflow:hidden;
}
.mask {
   	position:absolute;
	top:0;
	left:0;
	width:100%;
	height:100%;
	background: rgba(0,0,0,0.05);
	z-index:505;
}
.images01 {
	background: url("images/overview_fig.png") no-repeat center;
	background-size: cover;
	padding-top:66.7%;
}

article.test {
	display:none;
}
.slick_slide {
	position:relative;
	height:auto;
    width:auto;
	padding:0;
	margin:0 auto;
}
.slick_slide .slide_main {
	position:relative;
	width:auto;
	max-width:940px;
	margin:0 auto;
	overflow:hidden;
	
}
.slick_slide ul {
	padding:0;
	margin:0;
}
.slick_slide ul li {
	position:relative;
}
.slick_slide img {
	display: block;
	height: auto;
	width: 100%;
}
.slick_slide .simg {
   	position:absolute;
	top:0;
	left:0;
	width:100%;
	height:300px;
	z-index:501;
	padding-top:64%;
	background-size: cover;
	background-repeat:no-repeat;
	background-position: center center;
}
.slick-slide:not(.slick-current) {
  	opacity: .5;
}
.slick-prev {
	top:50%;
	width:100px;
	height:100px;
	left:0;
	z-index: 10000;
}
.slick-next {
	/* slick-nextに関係する箇所が右にややずれるバグを修正するためによく検証する */
	top:50%;
	width:100px;
	height:100px;
	right: 2px !important;
	z-index: 10001;
}

/* スライダーの矢印を変える */
.slick-prev::before {
	position:absolute;
	top:50%;
	left:70px;
	content:'' !important;
	height:36px;
	width:36px;
	display:block;
	border:2px solid #fff;
	border-top-width:0;
	border-left-width:0;
	transform:rotate(135deg);
	-webkit-transform:rotate(135deg);
	-moz-transform:rotate(135deg);
	-o-transform:rotate(135deg);
	-webkit-transition: 0.5s;
	-moz-transition: 0.5s;
	-o-transition: 0.5s;
	-ms-transition: 0.5s;
	transition: 0.5s;
}
.slick-next::before{
	position:absolute;
	top:50%;
	right:70px;
	content:'' !important;
	height:36px;
	width:36px;
	display:block;
	border:2px solid #fff;
	border-top-width:0;
	border-left-width:0;
	transform:rotate(-45deg);
	-webkit-transform:rotate(-45deg);
	-moz-transform:rotate(-45deg);
	-o-transform:rotate(-45deg);
	-webkit-transition: 0.5s;
	-moz-transition: 0.5s;
	-o-transition: 0.5s;
	-ms-transition: 0.5s;
	transition: 0.5s;
}
@media screen and (max-width: 767px) {
	.cont_left {
		float:none;
		width:auto;
	}
	.cont_right {
		float:none;
		width:auto;
	}
	body.single .head .mimg {
		height:360px;
	}

	.slick-prev {
		width:60px;
		height:60px;
	}
	.slick-next {
		width:60px;
		height:60px;
	}


	/* スライダーの矢印を変える */
	.slick-prev::before {
		top:50%;
		left:20px;
		height:20px;
		width:20px;
	}
	.slick-next::before{
		position:absolute;
		top:50%;
		right:20px;
		height:20px;
		width:20px;
	}
}
@media screen and (max-width: 480px) {
	body.single .head .mimg {
		height:230px;
	}
}




/*---------------------------------------

	ゆっくり流れるスライダー　（シンプルjQuery）
  
----------------------------------------*/

.slider {
	display: flex;
	margin:0;
    max-width: 100% !important;
    overflow: hidden;
}
.slider_inner {
	display: flex;
	margin-left:-1px;
}
.slide_item {
	background-size: cover;
	background-repeat:no-repeat;
	background-position: center center;
}
.slide_item .dmy {
	width:260px;
	height:250px;
}
@media screen and (max-width: 767px) {
	.slider {
		margin-bottom:2em;
	}
	.slide_item .dmy {
		width:130px;
		height:125px;
	}
}
.slider_inner:first-child {
  	animation: loop 90s linear infinite;
}
.slider_inner:nth-child(2) {
	animation: loop2 90s -60s linear infinite;
}
.slider_inner:last-child {
  	animation: loop3 90s -30s linear infinite;
	-webkit-backface-visibility:hidden;
	backface-visibility:hidden;
}
@keyframes loop {
	0% {
    	transform: translateX(200%);
  	}
  	to {
    	transform: translateX(-100%);
		-webkit-backface-visibility:hidden;
		backface-visibility:hidden;
	}
}
@keyframes loop2 {
	0% {
		transform: translateX(100%);
	}
  	to {
    	transform: translateX(-200%);
	}
}
 @keyframes loop3 {
	0% {
		transform: translateX(0%);
  	}
  	to {
    	transform: translateX(-300%);
  	}	
}