/*----------------------------------------------------
 mainvisual
--------------------------------------------------- */
#tiffany #mainvisual{
	position: fixed;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
	z-index: 1;
	background: #000;
}
#tiffany #mainvisual .image{
	position: fixed;
	z-index: 1;
	top: 0px;
	left: 0;
	width: 100%;
	height: 100%;
	opacity: 0.5;
    -webkit-transition: all 0.8s 0s ease;
       -moz-transition: all 0.8s 0s ease;
        -ms-transition: all 0.8s 0s ease;
         -o-transition: all 0.8s 0s ease;
            transition: all 0.8s 0s ease;
}
#tiffany #mainvisual.out .image{
	opacity: 1;
}
#tiffany #mainvisual .textarea{
	position: absolute;
	z-index: 1;
	top: 50%;
	left: 0%;
	width: 100%;
  -webkit-transform:translate(0%,-50%);
     -moz-transform:translate(0%,-50%);
      -ms-transform:translate(0%,-50%);
       -o-transform:translate(0%,-50%);
          transform:translate(0%,-50%);
          text-align: center;
}
#tiffany #mainvisual .textarea .interview{
    color: #FFF;
	margin-bottom: 25px;
	opacity: 0;
    -webkit-transition: all 0.8s 0.5s ease;
       -moz-transition: all 0.8s 0.5s ease;
        -ms-transition: all 0.8s 0.5s ease;
         -o-transition: all 0.8s 0.5s ease;
            transition: all 0.8s 0.5s ease;
  -webkit-transform:translate(0px,20px);
     -moz-transform:translate(0px,20px);
      -ms-transform:translate(0px,20px);
       -o-transform:translate(0px,20px);
          transform:translate(0px,20px);
}
#tiffany #mainvisual.view .textarea .interview{
	opacity: 1;
  -webkit-transform:translate(0px,0px);
     -moz-transform:translate(0px,0px);
      -ms-transform:translate(0px,0px);
       -o-transform:translate(0px,0px);
          transform:translate(0px,0px);
}
#tiffany #mainvisual.out .textarea .interview{
	opacity: 0;
    -webkit-transition: all 0.8s 0s ease;
       -moz-transition: all 0.8s 0s ease;
        -ms-transition: all 0.8s 0s ease;
         -o-transition: all 0.8s 0s ease;
            transition: all 0.8s 0s ease;
}
#tiffany #mainvisual .textarea .interview .vol{
	font-size: 21px;
    font-family: 'Playfair Display', serif;
    color: #FFF;
}
#tiffany #mainvisual .textarea .interview .category{
	font-size: 21px;
    font-family: 'Playfair Display', serif;
    color: #22C8BD;
}

#tiffany #mainvisual .textarea .interview .category .sh{
	font-family: 'Hiragino Kaku Gothic ProN', 'ヒラギノ角ゴ ProN W3', "メイリオ", Meiryo, "ＭＳ ゴシック", sans-serif;
}
#tiffany #mainvisual .textarea .interview .category:before{
	content: "|";
	padding-left: 10px;
	margin-right: 10px;
}
#tiffany #mainvisual .textarea .name{
    color: #FFF;
	font-size: 42px;
    font-family: 'Playfair Display', serif;
	margin-bottom: 35px;
	opacity: 0;
    -webkit-transition: all 0.8s 0.6s ease;
       -moz-transition: all 0.8s 0.6s ease;
        -ms-transition: all 0.8s 0.6s ease;
         -o-transition: all 0.8s 0.6s ease;
            transition: all 0.8s 0.6s ease;
  -webkit-transform:translate(0px,20px);
     -moz-transform:translate(0px,20px);
      -ms-transform:translate(0px,20px);
       -o-transform:translate(0px,20px);
          transform:translate(0px,20px);
}
#tiffany #mainvisual.view .textarea .name{
	opacity: 1;
  -webkit-transform:translate(0px,0px);
     -moz-transform:translate(0px,0px);
      -ms-transform:translate(0px,0px);
       -o-transform:translate(0px,0px);
          transform:translate(0px,0px);
}

#tiffany #mainvisual.out .textarea .name{
	opacity: 0;
    -webkit-transition: all 0.8s 0s ease;
       -moz-transition: all 0.8s 0s ease;
        -ms-transition: all 0.8s 0s ease;
         -o-transition: all 0.8s 0s ease;
            transition: all 0.8s 0s ease;
}
#tiffany #mainvisual .textarea .type{
    color: #FFF;
	font-size: 21px;
    font-family: 'Playfair Display', serif;
	opacity: 0;
    -webkit-transition: all 0.8s 0.7s ease;
       -moz-transition: all 0.8s 0.7s ease;
        -ms-transition: all 0.8s 0.7s ease;
         -o-transition: all 0.8s 0.7s ease;
            transition: all 0.8s 0.7s ease;
  -webkit-transform:translate(0px,20px);
     -moz-transform:translate(0px,20px);
      -ms-transform:translate(0px,20px);
       -o-transform:translate(0px,20px);
          transform:translate(0px,20px);
}
#tiffany #mainvisual.view .textarea .type{
	opacity: 1;
  -webkit-transform:translate(0px,0px);
     -moz-transform:translate(0px,0px);
      -ms-transform:translate(0px,0px);
       -o-transform:translate(0px,0px);
          transform:translate(0px,0px);
}

#tiffany #mainvisual.out .textarea .type{
	opacity: 0;
    -webkit-transition: all 0.8s 0s ease;
       -moz-transition: all 0.8s 0s ease;
        -ms-transition: all 0.8s 0s ease;
         -o-transition: all 0.8s 0s ease;
            transition: all 0.8s 0s ease;
}
@media only screen and (max-width: 768px) {

  #tiffany #mainvisual .image{
    top: 44px;
    height: 100%;
    height : -webkit-calc(100% - 88px) ;
    height : calc(100% - 88px) ;
  }
	#tiffany #mainvisual .textarea{
	}
	#tiffany #mainvisual .textarea .interview .vol{
		font-size: 16px;
	}
	#tiffany #mainvisual .textarea .interview .category{
		font-size: 16px;
	}
	#tiffany #mainvisual .textarea .name{
		font-size: 34px;
		margin-bottom: 35px;
	}

	#tiffany #mainvisual .textarea .type{
		font-size: 18px;
	}

}

/*----------------------------------------------------
 mainvisual_out
--------------------------------------------------- */
#tiffany #mainvisual_out{
	position: relative;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
	z-index: 1;
}
/*----------------------------------------------------
 interview
--------------------------------------------------- */
#tiffany .interview_block{
	position: relative;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
	z-index: 1;
	background: #FFF;
}

#tiffany .interview_block .inner{
	position: absolute;
	top: 50%;
	left: 50%;
	width:820px;
	margin-left: -410px;
	text-align: center;
  -webkit-transform: translate(0%,-50%);
     -moz-transform: translate(0%,-50%);
      -ms-transform: translate(0%,-50%);
       -o-transform: translate(0%,-50%);
          transform: translate(0%,-50%);
}

#tiffany .interview_block .interview{
	margin-bottom: 20px;
/*  -webkit-transform: translate(0%,20px);
     -moz-transform: translate(0%,20px);
      -ms-transform: translate(0%,20px);
       -o-transform: translate(0%,20px);
          transform: translate(0%,20px);
          opacity: 0;
    -webkit-transition: all 0.4s 0s ease;
       -moz-transition: all 0.4s 0s ease;
        -ms-transition: all 0.4s 0s ease;
         -o-transition: all 0.4s 0s ease;
            transition: all 0.4s 0s ease;*/
}
#tiffany .interview_block.view .interview{
	opacity: 1;
  -webkit-transform: translate(0%,0px);
     -moz-transform: translate(0%,0px);
      -ms-transform: translate(0%,0px);
       -o-transform: translate(0%,0px);
          transform: translate(0%,0px);
    -webkit-transition: all 0.8s 0s ease;
       -moz-transition: all 0.8s 0s ease;
        -ms-transition: all 0.8s 0s ease;
         -o-transition: all 0.8s 0s ease;
            transition: all 0.8s 0s ease;
}
#tiffany .interview_block .interview .vol{
	font-size: 16px;
    font-family: 'Playfair Display', serif;
}
#tiffany .interview_block .interview .category{
	font-size: 16px;
    font-family: 'Playfair Display', serif;
    color: #22C8BD;
}
#tiffany .interview_block .interview .category .sh{
	font-family: 'Hiragino Kaku Gothic ProN', 'ヒラギノ角ゴ ProN W3', "メイリオ", Meiryo, "ＭＳ ゴシック", sans-serif;
}
#tiffany .interview_block .interview .category:before{
	content: "|";
	padding-left: 10px;
	margin-right: 10px;
}

#tiffany .interview_block .name{
	font-size: 33px;
    font-family: 'Playfair Display', serif;
	margin-bottom: 30px;
/*  -webkit-transform: translate(0%,20px);
     -moz-transform: translate(0%,20px);
      -ms-transform: translate(0%,20px);
       -o-transform: translate(0%,20px);
          transform: translate(0%,20px);
          opacity: 0;
    -webkit-transition: all 0.4s 0s ease;
       -moz-transition: all 0.4s 0s ease;
        -ms-transition: all 0.4s 0s ease;
         -o-transition: all 0.4s 0s ease;
            transition: all 0.4s 0s ease;*/
}
#tiffany .interview_block.view .name{
	opacity: 1;
  -webkit-transform: translate(0%,0px);
     -moz-transform: translate(0%,0px);
      -ms-transform: translate(0%,0px);
       -o-transform: translate(0%,0px);
          transform: translate(0%,0px);
    -webkit-transition: all 0.8s 0.1s ease;
       -moz-transition: all 0.8s 0.1s ease;
        -ms-transition: all 0.8s 0.1s ease;
         -o-transition: all 0.8s 0.1s ease;
            transition: all 0.8s 0.1s ease;
}
#tiffany .interview_block .type{
	font-size: 17px;
    font-family: 'Playfair Display', serif;
	margin-bottom: 50px;
/*  -webkit-transform: translate(0%,20px);
     -moz-transform: translate(0%,20px);
      -ms-transform: translate(0%,20px);
       -o-transform: translate(0%,20px);
          transform: translate(0%,20px);
          opacity: 0;
    -webkit-transition: all 0.4s 0s ease;
       -moz-transition: all 0.4s 0s ease;
        -ms-transition: all 0.4s 0s ease;
         -o-transition: all 0.4s 0s ease;
            transition: all 0.4s 0s ease;*/
}
#tiffany .interview_block.view .type{
	opacity: 1;
  -webkit-transform: translate(0%,0px);
     -moz-transform: translate(0%,0px);
      -ms-transform: translate(0%,0px);
       -o-transform: translate(0%,0px);
          transform: translate(0%,0px);
    -webkit-transition: all 0.8s 0.1s ease;
       -moz-transition: all 0.8s 0.1s ease;
        -ms-transition: all 0.8s 0.1s ease;
         -o-transition: all 0.8s 0.1s ease;
            transition: all 0.8s 0.1s ease;
}
#tiffany .interview_block h2{
	font-size: 27px;
	line-height: 36px;
	color: #22C8BD;
	font-family: "ヒラギノ明朝 ProN W3", "HiraMinProN-W3", "HG明朝E", "ＭＳ Ｐ明朝", "MS PMincho", "MS 明朝", serif;
	margin-bottom: 50px;
/*          opacity: 0;
    -webkit-transition: all 0.4s 0s ease;
       -moz-transition: all 0.4s 0s ease;
        -ms-transition: all 0.4s 0s ease;
         -o-transition: all 0.4s 0s ease;
            transition: all 0.4s 0s ease;*/
}
#tiffany .interview_block.view h2{
	opacity: 1;
    -webkit-transition: all 0.8s 0.2s ease;
       -moz-transition: all 0.8s 0.2s ease;
        -ms-transition: all 0.8s 0.2s ease;
         -o-transition: all 0.8s 0.2s ease;
            transition: all 0.8s 0.2s ease;
}
#tiffany .interview_block p{
	font-size: 13px;
	line-height: 21px;
	text-align: left;
	color: #616161;
	margin-bottom: 25px;
/*          opacity: 0;
    -webkit-transition: all 0.4s 0s ease;
       -moz-transition: all 0.4s 0s ease;
        -ms-transition: all 0.4s 0s ease;
         -o-transition: all 0.4s 0s ease;
            transition: all 0.4s 0s ease;*/
}
#tiffany .interview_block.view .inner p{
	opacity: 1;
    -webkit-transition: all 0.8s 0.2s ease;
       -moz-transition: all 0.8s 0.2s ease;
        -ms-transition: all 0.8s 0.2s ease;
         -o-transition: all 0.8s 0.2s ease;
            transition: all 0.8s 0.2s ease;
}
#tiffany .interview_block .inner .credit{
  position: relative;
	border-top: 1px #61D8D0 solid;
	padding-top: 25px;
	text-align: left;
	font-size: 11px;
	line-height: 25px;
	color: #616161;
/*          opacity: 0;
    -webkit-transition: all 0.4s 0s ease;
       -moz-transition: all 0.4s 0s ease;
        -ms-transition: all 0.4s 0s ease;
         -o-transition: all 0.4s 0s ease;
            transition: all 0.4s 0s ease;*/
}

#tiffany .interview_block .inner .credit .profile{
  position: absolute;
  top: -14px;
  background: #FFF;
  padding-right: 10px;
  font-size: 17px;
  font-family: 'Playfair Display', serif;
  font-style: italic;
  color: #22C8BD;

}
#tiffany .interview_block.view .inner .credit{
	opacity: 1;
    -webkit-transition: all 0.8s 0.2s ease;
       -moz-transition: all 0.8s 0.2s ease;
        -ms-transition: all 0.8s 0.2s ease;
         -o-transition: all 0.8s 0.2s ease;
            transition: all 0.8s 0.2s ease;
}

@media only screen and (max-width: 768px) {

	#tiffany .interview_block .inner{
		position: absolute;
		top: 50%;
		left: 5.1%;
		width: 89.8%;
		margin-left: 0px;
	}

	#tiffany .interview_block .interview{
		display: none;
	}
	#tiffany .interview_block .name{
		display: none;
	}
	#tiffany .interview_block .type{
		display: none;
	}
	#tiffany .interview_block h2{
		font-size: 21px;
		line-height: 28px;
		margin-bottom: 20px;
		text-align: left;
		font-family: "ヒラギノ明朝 ProN W6", "HiraMinProN-W6", "HG明朝E", "ＭＳ Ｐ明朝", "MS PMincho", "MS 明朝", serif;
	}
	#tiffany .interview_block p{
		font-size: 15px;
		line-height: 23px;
		margin-bottom: 10px;
	}
	#tiffany .interview_block .inner .credit{
    margin-top: 20px;
		border-top: 1px #61D8D0 solid;
		padding-top: 20px;
		font-size: 11px;
		line-height: 18px;
	}
}

@media only screen and (max-width: 320px) {
  #tiffany .interview_block h2{
    /*font-size: 21px;*/
    font-size: 17px
    /*line-height: 28px;*/
    line-height: 24px;
    /*margin-bottom: 20px;*/
    margin-bottom: 5.3vw;
  }
  #tiffany .interview_block p{
    /*font-size: 15px;*/
    font-size: 12px;
    /*line-height: 23px;*/
    line-height: 20px;
  }
  #tiffany .interview_block .inner .credit{
    /*font-size: 11px;*/
    font-size: 9px;
    /*line-height: 18px;*/
    line-height: 15px;
    margin-top: 20px;
    border-top: 1px #61D8D0 solid;
    padding-top: 7px;
  }
}
/*----------------------------------------------------
 photo
--------------------------------------------------- */
#tiffany .photo_block{
	position: relative;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
	z-index: 1;
	background: #FFF;
}
#tiffany .photo_block .image{
	position: absolute;
	z-index: 1;
	top: 53px;
	left: 0;
	width: 100%;
	height: 100%;
	height : -webkit-calc(100% - 106px) ;
	height : calc(100% - 106px) ;
    -webkit-transition: all 0.8s 0s ease;
       -moz-transition: all 0.8s 0s ease;
        -ms-transition: all 0.8s 0s ease;
         -o-transition: all 0.8s 0s ease;
            transition: all 0.8s 0s ease;
}
@media only screen and (max-width: 768px) {
	#tiffany .photo_block .image{
		top: 44px;
		height : -webkit-calc(100% - 88px) ;
		height : calc(100% - 88px) ;
	}

}

#tiffany #page_bottom{
  position: relative;
  top: 0;
  left: 0;
  width: 100%;
  z-index: 1;
  background: #FFF;
}
#tiffany #page_bottom #product{
  padding-top: 53px;
  padding-bottom: 70px;
}
#tiffany #fullpage .interview_list{
  padding: 0;
}
@media only screen and (max-width: 768px) {

  #tiffany #page_bottom #product{
    padding-bottom: 20px;
  }
}