@charset "utf-8";
#header .navArea ul.navi a.p_home:before {background: #ddd;}
#header .navArea ul.navi a.p_home:hover:before {background: transparent;}
/* -----------------------------------------------------------

   #topImg

   ----------------------------------------------------------- */
#topImg { min-height: 100vh; width: 100%; z-index: 2; position: relative }


/* ----- .catchArea ----- */ 
#topImg .catchArea { position: absolute; bottom: 0; right: 0; left: 0; text-align: center; z-index: 2; }
#topImg .catchArea h2 { font-size: 12px; font-family: 'Catamaran', sans-serif; font-weight:300; letter-spacing: 8px; line-height: 50px; }
#topImg .catchArea h2 span { font-size: 11px;font-family: 'Open Sans'; vertical-align:0; font-weight:300;}
/* ----- .arrowArea ----- */ 
#topImg .arrowArea { position: absolute; bottom: 50px; right: 0; width: 5%; z-index: 2; }
#topImg .arrowArea a { position: absolute; top: -90px; left: 0; bottom: 0; right: 0; z-index: 3; }
/* span */
#topImg .arrowArea span { display: block; height: 60px; text-align: center; position: relative; z-index: 2; }
#topImg .arrowArea span:before { position: absolute; top: 0; left: 50%; bottom: 0; width: 0; content: ""; border-left: #ddd 1px dotted; z-index: -2; -webkit-transition: all 0.3s ease; -moz-transition: all 0.3s ease; -o-transition: all 0.3s ease; transition: all 0.3s ease; }
#topImg .arrowArea:hover span:before { border-left: #7eccd6 1px solid; top: 0px; }
/* .dot */
#topImg .arrowArea span .dot { position: absolute; top: 0; left: 50%; width: 1px; height: 20px; /*margin-left:-1px;*/ background: #8ed7d0; background:#7eccd6; z-index: -2; z-index: 1; -webkit-animation: scroll-next 4s infinite; -moz-animation: scroll-next 4s infinite; -o-animation: scroll-next 4s infinite; animation: scroll-next 4s infinite; -webkit-border-radius: 5px; -moz-border-radius: 5px; border-radius: 5px; -webkit-transition: all 0.3s ease; -moz-transition: all 0.3s ease; -o-transition: all 0.3s ease; transition: all 0.3s ease; }
#topImg .arrowArea:hover span .dot { background: transparent; }
/* .arrow */
#topImg .arrowArea .arrow { position: absolute; bottom: -15px; left: 50%; margin-left: -3px; width: 7px; height: 7px; border-bottom: #fefefe 1px solid; border-left: #fefefe 1px solid;/*opacity:0; */ -webkit-transition: all 0.5s ease; -moz-transition: all 0.5s ease; -o-transition: all 0.5s ease; transition: all 0.5s ease; opacity: 0; /*font-family: 'themify'; content: "\e64b"*/ z-index: 3; -webkit-transform: rotate(-45deg); -moz-transform: rotate(-45deg); -o-transform: rotate(-45deg); -ms-transform: rotate(-45deg); transform: rotate(-45deg); }
#topImg .arrowArea:hover .arrow { opacity: 1; bottom: -8.5px; bottom: 0px; border-bottom: #7eccd6 1px solid; border-left: #7eccd6 1px solid; }
/* .txt */
#topImg .arrowArea span .txt { position: absolute; top: -45px; left: 0; right: 0; width: auto; color:#7eccd6; font-size: 11px;font-family: 'Catamaran', sans-serif; font-weight:300;
text-transform: uppercase; letter-spacing: 4px; line-height: 0; -webkit-transform: rotate(90deg); -moz-transform: rotate(90deg); -o-transform: rotate(90deg); -ms-transform: rotate(90deg); transform: rotate(90deg); -webkit-transition: all 0.5s ease; -moz-transition: all 0.5s ease; -o-transition: all 0.5s ease; transition: all 0.5s ease; }
#topImg .arrowArea:hover span .txt { /*letter-spacing:5px; */ }
/* ----- .img ----- */ 
#topImgSlide { width: 100%; z-index: 2; position: relative }
#topImgSlide section .img { position: absolute; top: 125px; left: 5%; bottom: 50px; right: 5%; background-size: cover; z-index: -1; }

/* ----- .slick-dots ----- */ 
#topImg .mainImg { min-height: 100%; width: 100%; background-size: cover !important; }
/* ----- .mainSlider ----- */ 
.mainSlider { }
#topImg .slick-list,
#topImg .slick-track { height: 100%; }
/* --- Arrows --- */
#topImg .slick-prev,
#topImg .slick-next { font-size: 0; line-height: 0; position: absolute; /*top: 50%;*/ top: 50%; display: block; width: 55px; height: 55px; padding: 0; margin-top: -25px; /*lte IE 8*/ -webkit-transform: translate(0, -50%); -ms-transform: translate(0, -50%); transform: translate(0, -50%); cursor: pointer; color: #111; border: #111 1px solid; border: none; outline: none; background: none;/*background: #111;*/ -webkit-transition: all 0.3s ease; -moz-transition: all 0.3s ease; -o-transition: all 0.3s ease; transition: all 0.3s ease; z-index: 2; }
#topImg .slick-prev:before,
#topImg .slick-next:before { font-family: 'themify'; font-size: 20px; line-height: 1; -webkit-font-smoothing: antialiased; -moz-osx-font-smoothing: grayscale; }
#topImg .slick-prev { left: 5%; border-right: none; }
#topImg .slick-prev:before { content: "\e64a" }
#topImg .slick-next { right: 5%; border-left: none; }
#topImg .slick-next:before { content: "\e628"; }
#topImg .slick-prev:hover,
#topImg .slick-next:hover { color: #fefefe; background: #b09d7c; }
#topImg .slick-prev:hover:before,
#topImg .slick-prev:focus:before,
#topImg .slick-next:hover:before,
#topImg .slick-next:focus:before { opacity: 1; }
/* ----- .slick-dots ----- */ 
#topImg .slick-dots { position: absolute; top: 50%; bottom:auto; left: -5.25%; list-style: none; display: none; text-align: center; padding: 0px; width: 5%; height: auto; z-index: 100; -webkit-transform: translate(0, -50%); -ms-transform: translate(0, -50%); transform: translate(0, -50%); margin-top: -25px; }
#topImg .slick-dots li { position: relative; display: block; height: 20px; width: 100%; margin: 25px auto 0; padding: 0; cursor: pointer; text-align: center; }
#topImg .slick-dots li button { border: 0; background: #fefefe; display: block; height: 20px; width: 30px; padding: 0; /*overflow: hidden; */ line-height: 20px; font-size: 0; color: transparent; cursor: pointer; position: relative; z-index: 2; margin: 0 auto; text-align: center; -webkit-transition: all 1s ease-out; -moz-transition: all 1s ease-out; -o-transition: all 1s ease-out; transition: all 1s ease-out; -webkit-border-radius: 0; -moz-border-radius: 0; border-radius: 0;}
#topImg .slick-dots li button:after { position: absolute; top: 0; right: 0; bottom: 0; left: 0; font-family: 'Open Sans', sans-serif; font-size: 11px; font-weight:300; color: #111; z-index: -1; letter-spacing: 2px; }
#topImg .slick-dots li button:focus { outline: none; }
#topImg .slick-dots li.slick-active button { outline: none; /*background: #111;*/ }
#topImg .slick-dots li button:before { position: absolute; top: 45%; right: 100%; left: 0; content: ""; border-top: transparent 2px solid; z-index: 1; -webkit-transition: all 0.3s ease-out; -moz-transition: all 0.3s ease-out; -o-transition: all 0.3s ease-out; transition: all 0.3s ease-out; opacity: 0.7; -webkit-border-radius: 0; -moz-border-radius: 0; border-radius: 0;}
#topImg .slick-dots li:hover button:before { right: 0; border-top: #fec6c7 2px solid; opacity: 1; }
#topImg .slick-dots li.slick-active button:before { position: absolute; top: 45%; right: 0; left: 0; content: ""; border:none; border-top: #fec6c7 2px solid; z-index: 1; opacity: 1; -webkit-transition: all 0.5s ease-out; -moz-transition: all 0.5s ease-out; -o-transition: all 0.5s ease-out; transition: all 0.5s ease-out; }

.topMenuImg { width: auto !important; margin-bottom: 10px; }

@media only screen and (max-width: 1440px) {
#topImg { min-height: 100%; min-height: 100vh; }
}

@media only screen and (max-width: 1280px) {
#topImg { min-height: 100%; min-height: 100vh; }
}

@media only screen and (max-width: 1024px) {
#topImg { min-height: 100%; min-height: 100vh; }
.topMenuImg { width: 100% !important; margin-bottom: 10px; }
}

@media only screen and (max-width: 800px) {
#topImg { min-height: 100%; min-height: 100vh; }
/* ----- .catchArea ----- */ 
#topImg .catchArea { position: absolute; bottom: 0; }
#topImg .catchArea h2 { font-size:12px; letter-spacing: 5px; line-height: 50px; }
#topImg .catchArea h2 span { vertical-align:0; }
/* ----- .arrowArea ----- */ 
#topImg .arrowArea { display:none; }
/* ----- .img ----- */ 
#topImg .img { position: absolute; top: 50px; left: 0; bottom: 50px; right: 0; background-size: cover; z-index: -1; }

/* ----- .slick-dots ----- */ 
#topImg .mainImg { min-height: 100%; width: 100%; background-size: cover !important; }
/* ----- .mainSlider ----- */ 
.mainSlider { }
#topImg .slick-list,
#topImg .slick-track { height: 100%; }

/* ----- .slick-dots ----- */ 
#topImg .slick-dots { position: absolute; top: auto; bottom:10px; left: 0; right:0; list-style: none; display: block; text-align: center; padding: 0px; width: 100%; height: auto; z-index: 100; -webkit-transform: translate(0, 0); -ms-transform: translate(0, 0); transform: translate(0, 0); margin-top: 0; }
#topImg .slick-dots li { position: relative; display: inline-block; height: 20px; width: 20px; margin: 0 2%; padding: 0; cursor: pointer; text-align: center; }
#topImg .slick-dots li button { border: 0; background: #fefefe; background:none; display: none; height: 20px; width: 20px; padding: 0; /*overflow: hidden; */ line-height: 20px; font-size: 0; color: transparent; cursor: pointer; position: relative; z-index: 2; margin: 0 auto; text-align: center; -webkit-transition: all 1s ease-out; -moz-transition: all 1s ease-out; -o-transition: all 1s ease-out; transition: all 1s ease-out; }
#topImg .slick-dots li button:after { position: absolute; top: 0; right: 0; bottom: 0; left: 0; font-size: 11px; color: #fefefe; z-index: -1; letter-spacing: 1.5px; }


}

@media only screen and (max-width: 738px) {
#topImg { min-height: 100%; min-height: 100vh; }
#topImg .catchArea h2 { font-size:11px; text-indent:10px; }	
}
@media only screen and (max-width: 414px) {
#topImg { min-height: 100%; min-height: 100vh; }
#topImg .catchArea h2 { font-size:10px;}		
#topImg .slick-dots li button:after { font-weight:600;}
}
@media only screen and (max-width: 380px) {
#topImg .catchArea h2 { letter-spacing: 4px;}		
}
@media only screen and (max-width: 320px) {
#topImg { min-height: 100%; min-height: 100vh; }
#topImg .catchArea h2 { letter-spacing: 3px;}		
}

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

   #introduction

----------------------------------------------------------- */
#introduction { padding: 2em 10%; text-align:center; background: url(../images/index/introduction-bg.jpg); }
@media only screen and (max-width: 800px) { 
#introduction { padding:0px 5% 80px; }
}
@media only screen and (max-width: 738px) { 
#introduction { padding: 20px 5% 20px;}
}
@media only screen and (max-width: 414px) { 
#introduction { padding: 20px 5% 20px;}
}

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

#index-img

----------------------------------------------------------- */
#index-img { padding: 4em 10%; text-align:center;}
@media only screen and (max-width: 800px) { 
#index-img { padding:0px 5% 80px; }
}
@media only screen and (max-width: 738px) { 
#index-img { padding: 30px 5% 30px;}
}
@media only screen and (max-width: 414px) { 
#index-img { padding: 30px 5% 30px;}
}

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

   #catchLink

   ----------------------------------------------------------- */
   
#catchLink{ padding: 59px 0 0; margin: -59px 0 0; }

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

#catch

----------------------------------------------------------- */
      
#catch { padding:0px 0 60px; text-align:center; }
@media only screen and (max-width: 800px) { 
#catch { padding:0px 5% 80px; }
}
@media only screen and (max-width: 738px) { 
#catch { padding: 0px 5% 40px;}
}
@media only screen and (max-width: 414px) { 
#catch { padding: 0px 5% 30px;}
}

/* --- h3 --- */
#catch h3 { font-size:24px; font-family: "ヒラギノ角ゴ Pro W3", "Hiragino Kaku Gothic Pro", "メイリオ", Meiryo, Osaka, "ＭＳ Ｐゴシック", "MS PGothic", sans-serif;letter-spacing:2px;line-height:2; color: #BE0014; font-weight: 600; }
#catch h3 br.spblock { display:none; }
#catch h3 span { font-size: 14px; margin-top: -2px; }
@media only screen and (max-width: 800px) { 
#catch h3 { margin-top:15px; font-size: 20px;}
}
@media only screen and (max-width: 738px) { 
#catch h3 { font-size: 18px; letter-spacing: 2px; line-height: 1.8; margin-top:10px;}
#catch h3 br.spblock { display:block; }
}
@media only screen and (max-width: 414px) { 
#catch h3 { font-size: 16px; letter-spacing: 2px; line-height: 1.8; text-align: center; }
}

/* --- .iconIllust --- */
#catch .iconIllust { width: 200px; height: 196px; margin: 0 auto; background:url(../images/home/illust_logo.png) center center no-repeat; background-size:200px 196px; position:relative; z-index:0;}
@media only screen and (max-width: 738px) { 
#catch .iconIllust { width: 150px; height: 150px; background-size:150px 150px;}
}
@media only screen and (max-width: 414px) { 
#catch .iconIllust { width: 120px; height: 120px; background-size:120px 120px;}
}

/* --- .txtArea --- */
#catch .txtArea { margin: 25px auto 0; max-width:700px; }
#catch .txtArea p{font-size:14px; line-height:2; letter-spacing:2px; margin-top:1em;}

@media only screen and (max-width: 738px) { 
#catch .txtArea { margin: 20px auto 0; padding:0 2.5%; text-align:left; }
#catch .txtArea p { font-size: 13px; line-height: 2; letter-spacing: 1px; margin-top: 1em; text-align: center; }
}
@media only screen and (max-width: 414px) { 
#catch .txtArea p { font-size: 12px;}
}

/* --- .illustArea --- */
.illustArea { margin: 45px auto 0; max-width:650px; height:auto; }
@media only screen and (max-width: 800px) {
.illustArea { margin: 40px auto 0; }
}
@media only screen and (max-width: 738px) {
.illustArea { margin: 35px auto 0;}	
}
@media only screen and (max-width: 414px) {
.illustArea { margin: 30px auto 0;}	
}


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

#index-menu

----------------------------------------------------------- */
      
#index-menu { padding: 0px 10% 60px; text-align:center; }
@media only screen and (max-width: 800px) { 
#index-menu { padding:0px 5% 80px; }
}
@media only screen and (max-width: 738px) { 
#index-menu { padding: 0px 5% 70px;}
}
@media only screen and (max-width: 414px) { 
#index-menu { padding: 0px 5% 40px;}
}

/* --- h3 --- */
#index-menu h3 { font-size:24px; font-family: "ヒラギノ角ゴ Pro W3", "Hiragino Kaku Gothic Pro", "メイリオ", Meiryo, Osaka, "ＭＳ Ｐゴシック", "MS PGothic", sans-serif;letter-spacing:2px;line-height:2; color: #BE0014; font-weight: 600; }
#index-menu h3 br.spblock { display:none; }
#index-menu h3 span { font-size: 14px; margin-top: -2px; }
@media only screen and (max-width: 800px) { 
#index-menu h3 { margin-top:15px; font-size: 20px;}
}
@media only screen and (max-width: 738px) { 
#index-menu h3 { font-size: 18px; letter-spacing: 2px; line-height: 1.8; margin-top:10px;}
#index-menu h3 br.spblock { display:block; }
}
@media only screen and (max-width: 414px) { 
#index-menu h3 { font-size: 16px; letter-spacing: 2px; line-height: 1.8; text-align: center; }
}

.indexPriceList { font-size: 21px; margin-top: 5px;}
@media only screen and (max-width: 800px) { 
.indexPriceList { font-size: 18px; margin-top: 5px;}
}
@media only screen and (max-width: 738px) { 
.indexPriceList { font-size: 18px; margin-top: 5px;}
}
@media only screen and (max-width: 414px) { 
.indexPriceList { font-size: 16px; margin-top: 5px;}
}

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

#index-flow

----------------------------------------------------------- */
      
#index-flow { padding: 2em 10% 60px; text-align:center; background: url(../images/index/flow-bg.jpg); }
#index-flow .flowBox { display: inline-block; margin: 20px 2% 0; width: 29%; }
#index-flow .flowBox img { width: 100%; margin-bottom: 10px; border: solid 1px #BE0014; }
#index-flow .flowBox p { font-size: 12px; line-height: 1.8; text-align: left; }
	
@media only screen and (max-width: 800px) { 
#index-flow { padding: 2em 5% 80px; }
}
@media only screen and (max-width: 738px) {
#index-flow .flowBox { display: inline-block; margin: 10px 2% 0; width: 96%; }
#index-flow { padding: 2em 5% 70px;}
}
@media only screen and (max-width: 414px) {
#index-flow { padding: 20px 5% 60px;}
}

#index-flow h3 { font-size:24px; font-family: "ヒラギノ角ゴ Pro W3", "Hiragino Kaku Gothic Pro", "メイリオ", Meiryo, Osaka, "ＭＳ Ｐゴシック", "MS PGothic", sans-serif;letter-spacing:2px;line-height:2; color: #BE0014; font-weight: 600; }
#index-flow h3 br.spblock { display:none; }
#index-flow h3 span { font-size: 14px; margin-top: -2px; }
@media only screen and (max-width: 800px) { 
#index-flow h3 { margin-top:15px; font-size: 20px;}
}
@media only screen and (max-width: 738px) { 
#index-flow h3 { font-size: 18px; letter-spacing: 2px; line-height: 1.8; margin-top:10px;}
#index-flow h3 br.spblock { display:block; }
}
@media only screen and (max-width: 414px) { 
#index-flow h3 { font-size: 16px; letter-spacing: 2px; line-height: 1.8; text-align: center; }
}

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

#index-area

----------------------------------------------------------- */
      
#index-area { padding: 2em 10% 60px; text-align:center; }
@media only screen and (max-width: 800px) { 
#index-area { padding:0px 5% 80px; }
}
@media only screen and (max-width: 738px) { 
#index-area { padding: 0px 5% 70px;}
}
@media only screen and (max-width: 414px) { 
#index-area { padding: 20px 5% 60px;}
}

/* --- h3 --- */
#index-area h3 { font-size:24px; font-family: "ヒラギノ角ゴ Pro W3", "Hiragino Kaku Gothic Pro", "メイリオ", Meiryo, Osaka, "ＭＳ Ｐゴシック", "MS PGothic", sans-serif;letter-spacing:2px;line-height:2; color: #BE0014; font-weight: 600; }
#index-area h3 br.spblock { display:none; }
#index-area h3 span { font-size: 14px; margin-top: -2px; }
@media only screen and (max-width: 800px) { 
#index-area h3 { margin-top:15px; font-size: 20px;}
}
@media only screen and (max-width: 738px) { 
#index-area h3 { font-size: 18px; letter-spacing: 2px; line-height: 1.8; margin-top:10px;}
#index-area h3 br.spblock { display:block; }
}
@media only screen and (max-width: 414px) { 
#index-area h3 { font-size: 16px; letter-spacing: 2px; line-height: 1.8; text-align: center; }
}



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

   #photography

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

#photography { padding: 90px 5%; position: relative; z-index: 1; border-top: #a3d9e0 1px solid; background:#fefefe; background: url(../images/noise.png) repeat #fefefe; }
#photography:before { position: absolute; top: -1px; left: 5%; right: 5%; height: 0; content: ""; border-top: #ededed 1px solid; z-index: 2; }
@media only screen and (max-width: 800px) {
#photography { padding: 0 0 80px; }
}
@media only screen and (max-width: 738px) { 
#photography { padding: 0 0 70px; background: url(../images/noise2.png) repeat #fefefe;}
}
@media only screen and (max-width: 414px) { 
#photography{ padding: 0 0 60px; }
}

/* ----- .headlineImg ----- */ 
#photography .headlineImg { background: url(../images/home/bg_photography.jpg) center center no-repeat; background-size: cover; padding: 200px 0; text-align: center; color: #fefefe; position:relative; z-index:1; }
#photography .headlineImg:before{ position: absolute; top: 0; left: 0; right: 0; bottom: 0; content: ""; background: #111; opacity: 0.2; z-index: 2; }
#photography .headlineImg h2.en { font-size: 45px; font-family: 'Catamaran', sans-serif; font-weight:800; line-height: 1; letter-spacing: 5px; position: relative; z-index: 3;}
#photography .headlineImg h2.jp { font-size: 15px; font-weight: bold; letter-spacing: 5px; line-height: 1; margin-top: 20px; position: relative; z-index: 3; }

@media only screen and (max-width: 1024px) {
#photography .headlineImg { padding: 175px 0; } 	
}

@media only screen and (max-width: 800px) {
#photography .headlineImg { padding: 150px 0;margin: 0; } 
#photography .headlineImg h2.en { font-size: 35px; letter-spacing: 4px; position: relative; z-index: 3; }
#photography .headlineImg h2.jp { font-size: 14px; font-weight: bold; letter-spacing: 4px; line-height: 1; margin-top: 15px; position: relative; z-index: 3; }	
}

@media only screen and (max-width: 738px) {
#photography .headlineImg { background: url(../images/home/bg_photographySp.jpg) center center no-repeat; background-size: cover; padding: 125px 0; } 
#photography .headlineImg h2.en { font-size: 30px; letter-spacing: 3px; position: relative; z-index: 3; }	
}

@media only screen and (max-width: 414px) {
#photography .headlineImg { padding: 80px 0; } 
#photography .headlineImg h2.en { font-size: 23px; letter-spacing: 3px; position: relative; z-index: 3; }	
#photography .headlineImg h2.jp { font-size: 12px; font-weight: bold; letter-spacing: 3px; line-height: 1; margin-top: 10px; position: relative; z-index: 3; }	
}


/* ----- .photographyArea ----- */ 
#photography .photographyArea { margin: 0; }
/* .photographyBox */
#photography .photographyBox { display: block; margin: 80px 0 0; position: relative; z-index: 2; background:#fefefe; border:#ededed 1px solid; padding:30px 30px 60px 0;}
#photography .photographyBox:nth-child(even) {padding:30px 0 60px 30px;}

/* ----- .txtArea ----- */ 
#photography .photographyBox .txtArea { position:absolute; top:0; left:0; bottom:0; width: 35%; z-index:1;}
#photography .photographyBox:nth-child(even) .txtArea { left:auto; right:0; }

/* .photographyhHead */
#photography .photographyhHead { display:inline-block; text-align: center; position: absolute; z-index: 2; top:50%; left:50%; -moz-transform: translate(-50%, -50%); -ms-transform: translate(-50%, -50%); -o-transform: translate(-50%, -50%); transform: translate(-50%, -50%);}

/* .iconIllust */
#photography .photographyhHead .iconIllust { width:90px; height:90px;margin:20px auto 0; position:relative; z-index:0; -webkit-border-radius: 100%; -moz-border-radius: 100%; border-radius: 100%;}
#photography .photographyhHead .iconIllust:before { position:absolute; top:0; right:0; bottom:0; left:0; display:block; content:""; border:#f0f0f0 1px solid; z-index:2; -webkit-border-radius: 100%; -moz-border-radius: 100%; border-radius: 100%;}
#photography .photographyhHead .iconIllust_location { background: url(../images/photography/location/icon.png) center center no-repeat; background-size:80px 80px; }
#photography .photographyhHead .iconIllust_wedding { background:url(../images/photography/wedding/icon.png) center center no-repeat; background-size:80px 80px; }
#photography .photographyhHead .iconIllust_family { background:url(../images/photography/family/icon.png) center center no-repeat; background-size:80px 80px; }

/* h2,h3 */
#photography .photographyhHead h2 {font-size: 12px; font-family: 'Catamaran', sans-serif; font-weight:500; letter-spacing: 2.5px; line-height:1.8; position:relative; z-index:4; }
#photography .photographyhHead h3.en { font-size: 20px; font-family: 'Catamaran', sans-serif; font-weight:700;  letter-spacing:2px; line-height: 1.8; }
#photography .photographyhHead h3.jp { font-size: 13px; font-weight: bold;letter-spacing: 3px; line-height: 1.5; }

/* .catchArea */
#photography .catchArea { margin-top:10px; }
#photography .catchArea h4 { font-size: 13px;  font-family: "游明朝", YuMincho, "ヒラギノ明朝 ProN W3", "Hiragino Mincho ProN", "HG明朝E", "ＭＳ Ｐ明朝", "ＭＳ 明朝", Verdana, serif; letter-spacing: 1px; line-height: 2; }
/* .linkAreaHead */
#photography .photographyhHead .linkAreaHead { margin-top:20px; }
#photography .photographyhHead .linkAreaHead a { width: 200px; font-size:13px; }

/* ----- .imgArea ----- */ 
#photography .photographyBox .imgArea { float: right; width: 65%; position: relative; z-index: 2; -webkit-transition: all 0.3s ease; -moz-transition: all 0.3s ease; -o-transition: all 0.3s ease; transition: all 0.3s ease; }
#photography .photographyBox:nth-child(even) .imgArea { float: left; }


@media only screen and (max-width: 1024px) {
#photography .photographyBox .txtArea { width: 30%;}
#photography .photographyBox .imgArea { width: 70%;}
#photography .photographyhHead h3.en { font-size: 18px; }
#photography .catchArea h4  { letter-spacing: 1px; line-height:1.8; }
#photography .photographyhHead .linkAreaHead { margin-top:20px; }
}

@media only screen and (max-width: 1023px) {
#photography .photographyBox .txtArea { width: 35%;}
#photography .photographyBox .imgArea { width: 65%;}
#photography .catchArea { display:none; }	
}


@media only screen and (max-width: 800px) { 
/* ----- .photographyArea ----- */ 
#photography .photographyArea { margin: 0 5%; }
#photography .photographyBox,
#photography .photographyBox:nth-child(even) { margin: 70px 0 0; padding:0; border: #ededed 1px solid; background:#fefefe; overflow:hidden; }

/* ----- .txtArea ----- */ 
#photography .photographyBox .txtArea,
#photography .photographyBox:nth-child(even) .txtArea { position:static; width: 100%; padding:35px 5% 50px; }

/* .photographyhHead */
#photography .photographyBox .photographyhHead { display:block; text-align: center; position: static; -moz-transform: translate(0, 0); -ms-transform: translate(0, 0); -o-transform: translate(0, 0); transform: translate(0, 0);}
#photography .catchArea { display:block; }	
/* .linkAreaHead */
#photography .photographyBox .photographyhHead .linkAreaHead { margin-top:20px; }

#photography .photographyhHead .iconIllust { width:100px; height:100px; }
#photography .photographyhHead .iconIllust_location,
#photography .photographyhHead .iconIllust_wedding,
#photography .photographyhHead .iconIllust_family{background-size:90px 90px; }	

/* ----- .imgArea ----- */ 
#photography .photographyBox .imgArea { float: none; width: 100%; padding:30px 5% 0; padding:0; -webkit-transition: none; -moz-transition: none; -o-transition: none; transition: none; }
#photography .photographyBox:nth-child(even) .imgArea { float: none; }

}
@media only screen and (max-width: 738px) { 
#photography .photographyBox,
#photography .photographyBox:nth-child(even) { margin: 60px 0 0; }
/* ----- .txtArea ----- */ 
#photography .photographyBox .txtArea,
#photography .photographyBox:nth-child(even) .txtArea {padding:30px 5% 45px; }
#photography .photographyhHead .iconIllust { width:70px; height:70px; margin:15px auto 0;}
#photography .photographyhHead .iconIllust_location,
#photography .photographyhHead .iconIllust_wedding,
#photography .photographyhHead .iconIllust_family{background-size:60px 60px; }	
#photography .catchArea h4 { font-size: 12px; }
#photography .photographyBox .photographyhHead .linkAreaHead { margin-top:15px; }
}
@media only screen and (max-width: 414px) { 
#photography .photographyBox,
#photography .photographyBox:nth-child(even) { margin: 50px 0 0; }
}


 
 
 
 
 /* ----- .gallerySlider ----- */ 
.gallerySlider { margin: 0; padding-bottom: 0; }
/* --- li --- */
.gallerySlider li { margin: 0; position: relative; background: #fefefe; z-index:3; }
/* --- .imgArea --- */
.gallerySlider li .imgArea { overflow: hidden; position: relative; z-index: 4; background: #fefefe; }
.gallerySlider li .imgArea:before { position: absolute; top: 0; right: 0; bottom: 0; left: 0; content: ""; background: #fefefe; z-index: 5; opacity: 0; -webkit-transition: all 0.7s ease; -moz-transition: all 0.7s ease; -o-transition: all 0.7s ease; transition: all 0.7s ease; }
.gallerySlider li:hover .imgArea:before { content: ""; background: #e4f5fd; opacity: 0.8; }
.gallerySlider li .imgArea img { -webkit-transition: all 2s ease; -moz-transition: all 2s ease; -o-transition: all 2s ease; transition: all 2s ease; }
.gallerySlider li:hover .imgArea img { -webkit-transform: scale(1.1); -moz-transform: scale(1.1); -o-transform: scale(1.1); -ms-transform: scale(1.1); transform: scale(1.1); opacity: 0.5; }

/* Arrow */
.gallerySlider .slick-prev,
.gallerySlider .slick-next { font-size: 0; line-height: 0; position: absolute; top: 50%; display: block; width: 60px; height: 60px; padding: 0; /*lte IE 8*/ -webkit-transform: translate(0, -50%); -ms-transform: translate(0, -50%); transform: translate(0, -50%); cursor: pointer; color: #111; border: #ddd 1px solid; border: none; background: #fefefe; outline: none; -webkit-transition: all 0.3s ease; -moz-transition: all 0.3s ease; -o-transition: all 0.3s ease; transition: all 0.3s ease; -webkit-border-radius: 100%; -moz-border-radius: 100%; border-radius: 100%; z-index: 2; }
.gallerySlider .slick-prev:before,
.gallerySlider .slick-next:before { font-family: 'themify'; font-size: 12px; line-height: 1; -webkit-font-smoothing: antialiased; -moz-osx-font-smoothing: grayscale; }
.gallerySlider .slick-prev { left: 0; margin-left: 10px; }
.gallerySlider .slick-prev:before { content: "\e64a"; }
.gallerySlider .slick-next { margin-right: 10px; right: 0; }
.gallerySlider .slick-next:before { content: "\e649"; }

/* --- .slick-dots --- */
.gallerySlider .slick-dots { bottom: 10px; }
.gallerySlider .slick-dots li { position: relative; height: 6px; width: 6px; margin: 0 10px; padding: 0; cursor: pointer; text-align: center; }

/* --- .linkArea --- */
#photography .linkArea { margin-top:70px; position:relative; z-index:1; }


@media only screen and (max-width: 1024px) { 
/* --- Arrows --- */
.gallerySlider .slick-prev,
.gallerySlider .slick-next { width: 40px; height: 40px;  }
.gallerySlider .slick-prev { right:46px; }
.gallerySlider .slick-next { right: 5px; }
#photography .photographyBox:nth-child(even) .gallerySlider .slick-prev { left: 5px; right:auto; }
#photography .photographyBox:nth-child(even) .gallerySlider .slick-next { left:46px; right: auto; }
}

@media only screen and (max-width: 800px) { 
.gallerySlider { margin: 0 -1px 41px; padding-bottom: 0;}
.gallerySlider .slick-dots { position: absolute; top:auto; right:0; left: 0; width: 100%; height: 6px; 
-webkit-transform: translate(0, 0); -ms-transform: translate(0, 0); transform: translate(0, 0); }
.gallerySlider .slick-dots li { position: relative; display: inline-block; height: 6px; width: 6px; margin: 0px 10px; padding: 0; cursor: pointer; -webkit-transition: all 1s ease-out; -moz-transition: all 1s ease-out; -o-transition: all 1s ease-out; transition: all 1s ease-out; border:none; }
/* --- .linkArea --- */
#photography .linkArea { margin-top:60px; }
}

@media only screen and (max-width: 738px) { 
.gallerySlider { margin: 0 -1px 31px; }
.gallerySlider .slick-dots,
#photography .photographyBox:nth-child(even) .gallerySlider .slick-dots { bottom: 10px;}
/* --- .linkArea --- */
#photography .linkArea { margin-top:50px; }
}
@media only screen and (max-width: 414px) { 
#photography .linkArea { margin-top:40px; }
}





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

   #release

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

#release { padding: 90px 5%; position: relative; z-index: 1;  border-top: #a3d9e0 1px solid; }
#release:before { position: absolute; top: -1px; left: 5%; right: 5%; height: 0; content: ""; border-top: #ededed 1px solid; z-index: 2; }

@media only screen and (max-width: 800px) {
#release { padding: 80px 5%; }
}

@media only screen and (max-width: 738px) { 
#release { padding: 70px 5%; }
}

@media only screen and (max-width: 414px) { 
#release { padding: 60px 5%; }
}

/* --- .nameArea --- */
#release .nameArea { margin: 0; position: relative; z-index: 2; }
#release .nameArea:before { position: absolute; top: 7px; left: 0; bottom: 7px; right:0; content: ""; border: #ddd 1px solid; background: #fefefe;z-index: -2; }
#release .nameArea:after { position: absolute; top: 0; left: 7px; bottom: 0; right:7px; content: ""; border: #ddd 1px dotted; z-index: -2; }

/* --- .inner --- */
#release .nameArea .inner { padding:70px 5%; }
/* .imgArea */
#release .nameArea .imgArea { float:left; width:45%; padding: 40px;position:relative; z-index:1; }
#release .nameArea .imgArea:before { position:absolute; top:0; right:10px; left:10px; bottom:0; content:""; border-top:#ddd 1px solid; border-bottom:#ddd 1px solid;z-index:2; }
#release .nameArea .imgArea:after { position:absolute; top:10px; right:0; left:0; bottom:10px; content:""; border-right:#ddd 1px solid; border-left:#ddd 1px solid;z-index:2; }
#release .nameArea .imgArea img { border:#fafafa 1px solid; }
/* .txtArea */
#release .nameArea .txtArea { float:right; width:50%; text-align:left;}
#release .nameArea .txtArea .txtBox { margin:0 auto; max-width:450px; }
#release .nameArea .txtArea h3 {font-size: 12px; font-family: 'Catamaran', sans-serif; font-weight:500; letter-spacing: 2.5px; line-height:1.8; text-align:center;position:relative; z-index:4; }
#release .nameArea .txtArea h4 { font-size: 25px; font-family: 'Playfair Display',"貂ｸ譏取悃", YuMincho, "繝偵Λ繧ｮ繝取・譛� ProN W3", "Hiragino Mincho ProN", "HG譏取悃E", "・ｭ・ｳ ・ｰ譏取悃", "・ｭ・ｳ 譏取悃", Verdana, serif; font-weight:400; letter-spacing: 2px; line-height: 1.6; text-align:center; margin:5px 0 25px; padding-bottom:25px; position:relative; z-index:2;  }
#release .nameArea .txtArea h4 b { display:block; font-size:15px; font-weight:normal; vertical-align:0; margin-top:2px; }
#release .nameArea .txtArea h4:after { position:absolute; bottom:0; left:50%; width:50px; height:0; margin-left:-25px; content:""; border-top:#ddd double; z-index:-1; }
#release .nameArea .txtArea p {font-size: 14px; line-height: 2.4; letter-spacing: 2px;}
#release .nameArea .sign { margin-top:30px; width:100%; height:65px; background:url(../images/about/sign.png) center right no-repeat; }

@media only screen and (max-width: 1024px) { 
#release .nameArea .imgArea { padding: 30px; }
#release .nameArea .txtArea p {font-size: 13px; line-height: 2.2; letter-spacing: 1px;}
}

@media only screen and (max-width: 800px) { 
#release .nameArea .inner { padding:60px 6%; }
#release .nameArea .imgArea { width:40%; padding:15px; }
#release .nameArea .txtArea { width:55%;}
#release .nameArea .txtArea h4 { font-size: 22px;margin:0 0 20px; padding-bottom:20px;  }
#release .nameArea .txtArea h4 b { font-size:14px; margin-top:0; }
}

@media only screen and (max-width: 738px) { 
#release .nameArea .inner { padding:50px 7.5%; }
/* .imgArea */
#release .nameArea .imgArea { float:none; width:65%; margin:0 auto; padding:10px; }
/* .txtArea */
#release .nameArea .txtArea {  float:none; width:100%; margin-top:30px; }
#release .nameArea .txtArea .txtBox { max-width:1000px; padding:0 2.5%; }
#release .nameArea .txtArea h4 { font-size: 20px; }
#release .nameArea .txtArea h4 b { display:block; font-size:15px; font-weight:normal; vertical-align:0; }
#release .nameArea .txtArea p {font-size: 12px; line-height: 2; letter-spacing: 1px;}

}







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

   #instagram

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

#instagram { padding: 90px 5%; position: relative; z-index: 1;  border-top: #a3d9e0 1px solid; }
#instagram:before { position: absolute; top: -1px; left: 5%; right: 5%; height: 0; content: ""; border-top: #ededed 1px solid; z-index: 2; }

@media only screen and (max-width: 800px) {
#instagram { padding: 80px 5%; }
}

@media only screen and (max-width: 738px) { 
#instagram { padding: 70px 5%; }
}

@media only screen and (max-width: 414px) { 
#instagram { padding: 60px 5%; }
}


/* ----- .headline ----- */
#instagram .headline { margin-bottom: 45px; text-align: center; }
#instagram .headline h2.en { font-size:50px; font-family: 'Satisfy', cursive; letter-spacing:0; line-height: 1;}
#instagram .headline h3 { font-size: 14px; font-family: 'Catamaran', sans-serif; font-weight:300;letter-spacing: 2px; line-height:1; margin-top:20px;}
#instagram .headline h3 b { font-weight:600;letter-spacing: 2px;}


@media only screen and (max-width: 800px) {
#instagram .headline { margin-bottom: 40px; }
#instagram .headline h2.en { font-size:40px; }
#instagram .headline h3 { margin-top:15px;}
}

@media only screen and (max-width: 738px) {
#instagram .headline { margin-bottom: 30px; }
#instagram .headline h2.en { font-size:35px; }
}

@media only screen and (max-width: 414px) {
#instagram .headline h2.en { font-size:30px; }	
#instagram .headline h3 { font-size: 13px;margin-top:10px;}	
}



/* ----- ul.imageInstagram ----- */
ul.imageInstagram { margin: 5px -5px 0; padding: 0; }
ul.imageInstagram li { list-style: none; margin: 0; padding: 0; float: left; width: 20%; position: relative; border: transparent 8px solid; -webkit-transition: all 0.2s ease; -moz-transition: all 0.2s ease; -o-transition: all 0.2s ease; transition: all 0.2s ease; overflow: hidden; z-index: 0; }
ul.imageInstagram li .imgArea { border: #ededed 1px solid; padding: 10px; background: #fefefe; position: relative; z-index: 1;}
ul.imageInstagram li .imgArea .inner { overflow: hidden; position:relative; z-index:1; }
ul.imageInstagram li .imgArea:before { position: absolute; top: 0; right: 0; bottom: 0; left: 0; content: ""; background: #fefefe; z-index: 2; opacity: 0; -webkit-transition: all 0.7s ease; -moz-transition: all 0.7s ease; -o-transition: all 0.7s ease; transition: all 0.7s ease; }
ul.imageInstagram li:hover .imgArea:before { content: ""; background: #e4f5fd; z-index: 2; opacity: 0.8; }
ul.imageInstagram li .imgArea:after { position: absolute; top: 0; right: 0; bottom: 0; left: 0; margin: auto; width: 50px; height: 50px; font-family: 'themify'; font-size: 18px; content: "\e73d"; color: #fefefe; background: #fefefe; z-index: 3; opacity: 0; text-align: center; line-height: 50px; -webkit-transition: all 0.5s ease; -moz-transition: all 0.5s ease; -o-transition: all 0.5s ease; transition: all 0.5s ease; -webkit-border-radius: 100%; -moz-border-radius: 100%; border-radius: 100%; -webkit-transform: rotate(-180deg) scale(0.5, 0.5); -moz-transform: rotate(-180deg) scale(0.5, 0.5); -o-transform: rotate(-180deg) scale(0.5, 0.5); -ms-transform: rotate(-180deg) scale(0.5, 0.5); transform: rotate(-180deg) scale(0.5, 0.5); }
ul.imageInstagram li:hover .imgArea:after { color:#7eccd6; opacity: 1; -webkit-transform: rotate(0deg) scale(1, 1); -moz-transform: rotate(0deg) scale(1, 1); -o-transform: rotate(0deg) scale(1, 1); -ms-transform: rotate(0deg) scale(1, 1); transform: rotate(0deg) scale(1, 1); }
ul.imageInstagram li img { display: block; width: 100%; height: auto; -webkit-transition: all 2s ease; -moz-transition: all 2s ease; -o-transition: all 2s ease; transition: all 2s ease; background: #fefefe; }
ul.imageInstagram li:hover img { -webkit-transform: scale(1.1); -moz-transform: scale(1.1); -o-transform: scale(1.1); -ms-transform: scale(1.1); transform: scale(1.1); }
ul.imageInstagram li:first-child { width: 40%; }
ul.imageInstagram li:first-child .imgArea { padding: 15px; }
ul.imageInstagram li:nth-child(8) { display: none; }

/* ----- .il-photo__likes ----- */
.il-photo__likes { position: absolute; bottom: 3px; left: 7px; color: #f27292; font-size: 11px;font-family: 'Catamaran', sans-serif; font-weight:300; height: 20px; line-height: 20px; padding: 0; letter-spacing:1px; z-index: 11; }
.il-photo__likes:before { font-size: 11px; font-family: 'themify'; content: "\e634"; padding-right: 5px; }
#instagram .linkArea .btn:after { font-size: 10px; font-size: 18px; content: "\e73d";right: auto; left:15px; }





@media only screen and (max-width: 800px) {
/* ----- ul.imageInstagram ----- */
ul.imageInstagram { margin: 3px -3px 0; padding: 0; }
ul.imageInstagram li { width: 50%; border: transparent 3px solid; }
ul.imageInstagram li .imgArea { padding: 10px; }
ul.imageInstagram li .imgArea .inner { overflow: hidden; }
ul.imageInstagram li .imgArea:before { display:none; }
ul.imageInstagram li .imgArea:after { display:none; }
ul.imageInstagram li:hover img { -webkit-transform: scale(1); -moz-transform: scale(1); -o-transform: scale(1); -ms-transform: scale(1); transform: scale(1); }
ul.imageInstagram li:first-child { width: 50%; }
ul.imageInstagram li:first-child .imgArea { padding: 10px; }
ul.imageInstagram li:nth-child(8) { display: block; }

}


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

   keyframes

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


@-webkit-keyframes scroll-next {
0% {
-ms-transform:translateX(0)translateY(0px);
-webkit-transform:translateX(0)translateY(0px);
-moz-transform:translateX(0)translateY(0px);
transform:translateX(0)translateY(0px);
opacity:0
}
80% {
opacity:0.7
}
90% {
opacity:0
}
100% {
-ms-transform:translateX(0)translateY(40px);
-webkit-transform:translateX(0)translateY(40px);
-moz-transform:translateX(0)translateY(40px);
transform:translateX(0)translateY(40px);
opacity:1
}
}
@-moz-keyframes scroll-next {
0% {
-ms-transform:translateX(0)translateY(0px);
-webkit-transform:translateX(0)translateY(0px);
-moz-transform:translateX(0)translateY(0px);
transform:translateX(0)translateY(0px);
opacity:1
}
80% {
opacity:0.7
}
90% {
opacity:0
}
100% {
-ms-transform:translateX(0)translateY(40px);
-webkit-transform:translateX(0)translateY(40px);
-moz-transform:translateX(0)translateY(40px);
transform:translateX(0)translateY(40px);
opacity:0
}
}
@-ms-keyframes scroll-next {
0% {
-ms-transform:translateX(0)translateY(0px);
-webkit-transform:translateX(0)translateY(0px);
-moz-transform:translateX(0)translateY(0px);
transform:translateX(0)translateY(0px);
opacity:1
}
80% {
opacity:0.7
}
90% {
opacity:0
}
100% {
-ms-transform:translateX(0)translateY(40px);
-webkit-transform:translateX(0)translateY(40px);
-moz-transform:translateX(0)translateY(40px);
transform:translateX(0)translateY(40px);
opacity:0
}
}
@keyframes scroll-next {
0% {
-ms-transform:translateX(0)translateY(0px);
-webkit-transform:translateX(0)translateY(0px);
-moz-transform:translateX(0)translateY(0px);
transform:translateX(0)translateY(0px);
opacity:1
}
80% {
opacity:0.7
}
90% {
opacity:0
}
100% {
-ms-transform:translateX(0)translateY(40px);
-webkit-transform:translateX(0)translateY(40px);
-moz-transform:translateX(0)translateY(40px);
transform:translateX(0)translateY(40px);
opacity:0
}
}