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

/*ここからボディー*/

#content{
	width:980px;
	height:auto;
	margin-left:auto;
	margin-right:auto;
}

#route{
	width:auto;
	height:auto;
	margin-left:30px;
	font-size:13px;
	margin-top:20px;
	margin-bottom:10px;
}

#lookbook_title{
	font-size:28px;
	font-weight:bold;
	color:#000;
	width:auto;
	height:auto;
	margin-left:30px;
	
}

#second_box_1{
	width:920px;
	height:150px;
	margin-top:30px;
	margin-left:30px;
	margin-right:30px;
	margin-bottom:30px;
}

#left_box_1{
	width:290px;
	height:164px;
	margin-left:0px;
	margin-right:25px;
	float:left;
}

#center_box_2{
	width:290px;
	height:164px;
	margin-left:0px;
	margin-right:25px;

	float:left;

}

#right_box_3{
	width:290px;
	height:164px;
	margin:0px;
	float:left;
}

/*ここからスクリプト*/
.view {
width: 290px;
height: 164px;
/*margin: 10px;*/

float: left;
/*border: 10px solid #fff;*/
overflow: hidden;
position: relative;
text-align: center;
-webkit-box-shadow: 1px 1px 2px #e6e6e6;
-moz-box-shadow: 1px 1px 2px #e6e6e6;
box-shadow: 1px 1px 2px #e6e6e6;
cursor: default;
background: #fff url(../images/bgimg.jpg) no-repeat center center;
}


.view .mask, .view .content {
width: 290px;
height: 164px;
position: absolute;
overflow: hidden;
top: 0;
left: 0;
}


.view h2 {
text-transform: uppercase;
color: #fff;
text-align: center;
position: relative;
font-size: 12px;
padding: 1px;
background: rgba(0, 0, 0, 0.8);
margin: 20px 0 0 0;
}


.view p {
font-family: Georgia, serif;
font-style: italic;
font-size: 12px;
position: relative;
color: #fff;
padding: 10px 20px 20px;
text-align: center;
}

p {
display: block;
-webkit-margin-before: 1em;
-webkit-margin-after: 1em;
-webkit-margin-start: 0px;
-webkit-margin-end: 0px;
}

.view a.info {
display: inline-block;
text-decoration: none;
padding: 0px 14px;
background: #000;
color: #fff;
text-transform: uppercase;
-webkit-box-shadow: 0 0 1px #000;
-moz-box-shadow: 0 0 1px #000;
box-shadow: 0 0 1px #000;
}

.view-first img {
   -webkit-transition: all 0.2s linear;
   -moz-transition: all 0.2s linear;
   -o-transition: all 0.2s linear;
   -ms-transition: all 0.2s linear;
   transition: all 0.2s linear;
}
.view-first .mask {
   -ms-filter: "progid: DXImageTransform.Microsoft.Alpha(Opacity=0)";
   filter: alpha(opacity=0);
   opacity: 0;
   background-color: rgba(219,127,8, 0.7);
   -webkit-transition: all 0.4s ease-in-out;
   -moz-transition: all 0.4s ease-in-out;
   -o-transition: all 0.4s ease-in-out;
   -ms-transition: all 0.4s ease-in-out;
   transition: all 0.4s ease-in-out;
}
.view-first h2 {
   -webkit-transform: translateY(-100px);
   -moz-transform: translateY(-100px);
   -o-transform: translateY(-100px);
   -ms-transform: translateY(-100px);
   transform: translateY(-100px);
   -ms-filter: "progid: DXImageTransform.Microsoft.Alpha(Opacity=0)";
   filter: alpha(opacity=0);
   opacity: 0;
   -webkit-transition: all 0.2s ease-in-out;
   -moz-transition: all 0.2s ease-in-out;
   -o-transition: all 0.2s ease-in-out;
   -ms-transition: all 0.2s ease-in-out;
   transition: all 0.2s ease-in-out;
}
.view-first p {
   -webkit-transform: translateY(100px);
   -moz-transform: translateY(100px);
   -o-transform: translateY(100px);
   -ms-transform: translateY(100px);
   transform: translateY(100px);
   -ms-filter: "progid: DXImageTransform.Microsoft.Alpha(Opacity=0)";
   filter: alpha(opacity=0);
   opacity: 0;
   -webkit-transition: all 0.2s linear;
   -moz-transition: all 0.2s linear;
   -o-transition: all 0.2s linear;
   -ms-transition: all 0.2s linear;
   transition: all 0.2s linear;
}
.view-first:hover img {
   -webkit-transform: scale(1.1,1.1);
   -moz-transform: scale(1.1,1.1);
   -o-transform: scale(1.1,1.1);
   -ms-transform: scale(1.1,1.1);
   transform: scale(1.1,1.1);
}
.view-first a.info {
   -ms-filter: "progid: DXImageTransform.Microsoft.Alpha(Opacity=0)";
   filter: alpha(opacity=0);
   opacity: 0;
   -webkit-transition: all 0.2s ease-in-out;
   -moz-transition: all 0.2s ease-in-out;
   -o-transition: all 0.2s ease-in-out;
   -ms-transition: all 0.2s ease-in-out;
   transition: all 0.2s ease-in-out;
}
.view-first:hover .mask {
   -ms-filter: "progid: DXImageTransform.Microsoft.Alpha(Opacity=100)";
   filter: alpha(opacity=100);
   opacity: 1;
}
.view-first:hover h2,
.view-first:hover p,
.view-first:hover a.info {
   -ms-filter: "progid: DXImageTransform.Microsoft.Alpha(Opacity=100)";
   filter: alpha(opacity=100);
   opacity: 1;
   -webkit-transform: translateY(0px);
   -moz-transform: translateY(0px);
   -o-transform: translateY(0px);
   -ms-transform: translateY(0px);
   transform: translateY(0px);
}
.view-first:hover p {
   -webkit-transition-delay: 0.1s;
   -moz-transition-delay: 0.1s;
   -o-transition-delay: 0.1s;
   -ms-transition-delay: 0.1s;
   transition-delay: 0.1s;
}
.view-first:hover a.info {
   -webkit-transition-delay: 0.2s;
   -moz-transition-delay: 0.2s;
   -o-transition-delay: 0.2s;
   -ms-transition-delay: 0.2s;
   transition-delay: 0.2s;
}
				




/*ここからスクリプト*/
.lookbook_slider {
	    position: relative;
        width: 920px;
        height: 550px;
        overflow: hidden;
		margin-left:30px;
		margin-right:30px;
	
		
}
	
.lookbook_slides {
       height: 100%;
       overflow: hidden;    
       -webkit-backface-visibility: hidden;
       -webkit-transform-style: preserve-3d;
       -webkit-transition: all 500ms cubic-bezier(0.165, 0.840, 0.440, 1.000);
       -moz-transition: all 500ms cubic-bezier(0.165, 0.840, 0.440, 1.000);
       -ms-transition: all 500ms cubic-bezier(0.165, 0.840, 0.440, 1.000);
       -o-transition: all 500ms cubic-bezier(0.165, 0.840, 0.440, 1.000);
       transition: all 500ms cubic-bezier(0.165, 0.840, 0.440, 1.000);
}
	
.lookbook_slide {
      height: 100%;
      float: left;
      clear: none;
	  
}


.lookbook_slide figure {
  display: block;
  position: relative;

}
.lookbook_slide figure figcaption {
  position: relative;
  right: 0%;
  font-size: 1.1em;
  font-weight: bold;
  padding: 8px 14px;
  color: #464646;
  background: rgba(255,255,255,0.8); 
}

.lookbook_slide figure figcaption a {
  color: #5a7fbc;
  text-decoration: none;
}
.lookbook_slide figure figcaption a:hover {
	text-decoration: underline;
}

.lookbook_slide figure img {
  max-height: auto;
}



.lookbook_slider-arrows {}

.lookbook_slider-arrow {
  position: absolute;
  display: block;
  margin-bottom: -40px;
  padding: 10px;
  font-family: 'Alegreya Sans', 'Trebuchet MS', sans-serif;
  text-decoration: none;
  font-weight: 10;
  font-size: 16px;
  color: #FCF;
  border: 1px solid #FCF;
  border-radius: 8px;
  -webkit-transition: all 0.2s linear;
  -moz-transition: all 0.2s linear;
  transition: all 0.2s linear;
}
.lookbook_sliderr-arrow:hover {
  background: #FFF;
  color: #FFF;
  opacity: 0.4;
}
.lookbook_slider-arrow--right {
	bottom: 50%;
	right: 10px;
}

.lookbook_slider-arrow--left {
	bottom: 50%;
	left: 10px;
}

a.lookbook_slider-arrow:link {
	color: #FFF;
}
a.lookbook_slider-arrow:visited {
	color: #FFF;
}
a.lookbook_slider-arrow:hover {
	color: #FFF;
}
a.lookbook_slider-arrow:active {
	color: #FFF;
}


.lookbook_slider-nav {
  position: absolute;
  bottom: 10px;
}

.lookbook_slider-nav__item {
  width: 12px;
  height: 12px;
  float: left;
  clear: none;
  display: block;
  margin: 0 5px;
  background: #999;
  -webkit-border-radius: 7px;
  -moz-border-radius: 7px;
  border-radius: 7px;
}

.lookbook_slider-nav__item:hover {
	background: #F7A4F9;
}

.lookbook_slider-nav__item--current, .slider-nav__item--current:hover {
	background: #F7A4F9;
}