/*
To change this license header, choose License Headers in Project Properties.
To change this template file, choose Tools | Templates
and open the template in the editor.
*/
/* 
    Created on : 2015/02/07, 10:54:28
    Author     : atsushi
*/

#fs_slide{
    margin: 0 auto;
    position: relative;
    overflow: hidden;
    max-height:9999px;
}

/**********************/
/*ビューポートのスタイル*/
/**********************/
.sViewType1{
    max-width: 1200px;
    margin: 0 auto;
}
.sViewType2{
    max-width: 100%;
}

/************/
/* thumbs  */
/************/
.thumbs{
    text-align: center;
    margin-top: 5px;
    margin-bottom: 5px;
}
#fs_slide .thumbs img{
    max-width:100px;
    margin: 5px 5px 5px 5px; 
}
#fs_slide .thumbs a{
    text-decoration:none;
}

/************/
/* caption  */
/************/
#fs_slide #captions {
    width: 100%;
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%,-50%);
    -webkit-transform: translate(-50%,-50%);
    -moz-transform: translate(-50%,-50%);
    text-align: center;
}

#fs_slide #captions .captionMain{
	font-family: 'satellite', arial,"ヒラギノ角ゴ Pro W3", "Hiragino Kaku Gothic Pro", "メイリオ", Meiryo;
	font-size: 50px; font-size: 5rem;
	color: #EEE;
	letter-spacing: 1px;
	margin-bottom: 1em;
	text-shadow: 0 3px 3px rgba( 0, 0, 0, 0.3 ),0 -3px 3px rgba( 0, 0, 0, 0.3 );

}

#fs_slide #captions .captionSub{
	font-family: 'open_regular', arial,"ヒラギノ角ゴ Pro W3", "Hiragino Kaku Gothic Pro", "メイリオ", Meiryo;
	font-size: 23px; font-size: 2.3rem;
	font-weight: normal;
	color: #AAA;
	margin-bottom: 2em;
}

#fs_slide #captions a{
	padding: 15px 80px;
	background: #4d4d4d;
	color: #fff;
	font-family: 'open_semibold', arial,"ヒラギノ角ゴ Pro W3", "Hiragino Kaku Gothic Pro", "メイリオ", Meiryo;
	font-weight: bold;
	font-size: 18px;
	text-transform: uppercase;
	text-decoration: none;

	-webkit-border-radius: 100px;
	-moz-border-radius: 100px;
	-o-border-radius: 100px;
	border-radius: 100px;
}

#fs_slide #captions a:hover{
	background: #ffffff;
	color: #4d4d4d;
}

#fs_slide #captions a i{
	width: 17px;
	height: 5px;
	display: inline-block;
	background: url('./images/right_arrow.png') no-repeat;
	margin: 0 0 4px 6px;
}

#fs_slide #captions a:hover i{
	background: url('./images/right_arrow_black.png') no-repeat;
}

/** Shadow Effect 
===================================*/
 
.shadowEfx{
  position: relative;
}
.shadowEfx:before, .shadowEfx:after{
  z-index: -1;
  position: absolute;
  content: "";
  bottom: 60px;
  left: 10px;
  width: 50%;
  top: 80%;
  max-width:300px;
  background: #777;
  -webkit-box-shadow: 0 15px 10px #777;
  -moz-box-shadow: 0 15px 10px #777;
  box-shadow: 0 15px 10px #777;
  -webkit-transform: rotate(-3deg);
  -moz-transform: rotate(-3deg);
  -o-transform: rotate(-3deg);
  -ms-transform: rotate(-3deg);
  transform: rotate(-3deg);
}
.shadowEfx:after{
  -webkit-transform: rotate(3deg);
  -moz-transform: rotate(3deg);
  -o-transform: rotate(3deg);
  -ms-transform: rotate(3deg);
  transform: rotate(3deg);
  right: 10px;
  left: auto;
}