@charset "utf-8";



/*======================
 main-visual
=======================*/
#main-visual {}
#main-visual .slideshow {
 position: relative; /* can either be relative, absolute or fixed. If position is not set (i.e. static), it would be set to "relative" by script */
 overflow: hidden; /* to bound the empty top space created by inner element's top margin */
 width: 100%;
 height: calc(100vh - 80px);
 position: relative;
}
#main-visual .slideshow.sp { display: none;}
#main-visual .slideshow .zs-slide-0 { background-position: 50% 15% !important;}
#main-visual .slideshow .zs-slide-1 { background-position: 100% 100% !important;}
#main-visual .slideshow .zs-slide-2 { background-position: 50% 50% !important;}
#main-visual .slideshow .zs-slide-3 { background-position: 50% 70% !important;}
#main-visual .slideshow .zs-slide-4 { background-position: 50% 80% !important;}
#main-visual .scroll {
 position: absolute;
 bottom: 35px;
 left: 50%;
 margin-left: -30px;
 width: 60px;
 height: 60px;
 border-radius: 50%;
 background: #fff;
 cursor: pointer;
 transition: all 0.3s ease-out;
 z-index: 100;
}
#main-visual .scroll a {
 width: 100%;
 height: 100%;
 position: absolute;
 left: 0;
 right: 0;
}
#main-visual .scroll:hover { opacity: 0.8;}
#main-visual .scroll::before {
 content: '';
 display: block;
 position: absolute;
 top: 30px;
 animation: scroll 3s 0.2s ease infinite;
 left: 50%;
 width: 10px;
 height: 5px;
 margin-left: -5px;
 background: url(../../img/index/main/arrow.png) no-repeat center;
 background-size: contain;
}
#main-visual .scroll::after {
 content: '';
 display: block;
 position: absolute;
 top: 34px;
 left: 50%;
 animation: scroll 3s 0s ease infinite;
 width: 10px;
 height: 5px;
 margin-left: -5px;
 background: url(../../img/index/main/arrow.png) no-repeat center;
 background-size: contain;
}
@keyframes scroll {
 0% {
  transform: translate3d(0, -5px, 0);
  opacity: 0;
 }
 30% {
  opacity: 1;
 }
 70% {
  opacity: 1;
 }
 100% {
  transform: translate3d(0, 5px, 0);
  opacity: 0;
 }
}

#main-visual .cp-bnr { width: 300px; height: auto; position: absolute; bottom: 22px; right: 22px; z-index:100000000000000000000;}
#main-visual .cp-bnr img { width: 100%; height: auto;}
#main-visual .cp-bnr a { display: block;}
#main-visual .cp-bnr a:hover { opacity: 0.7;}
#main-visual .bnr_sp { display: none;}

@media screen and (max-width: 1280px) {
#main-visual .cp-bnr { width: 260px; height: 260px; bottom: 15px; right: 15px;}
}

@media screen and (max-width: 640px) {
 #main-visual {}
 #main-visual .slideshow {}
 #main-visual .slideshow.pc { display: none;}
 #main-visual .slideshow.sp {
  height: calc(100vh - 114px);
  display: block;
}
 #main-visual .slideshow .zs-slide-0 { background-position: 50% 50% !important;}
 #main-visual .slideshow .zs-slide-1 { background-position: 50% 50% !important;}
 #main-visual .slideshow .zs-slide-2 { background-position: 50% 50% !important;}
 #main-visual .slideshow .zs-slide-3 { background-position: 50% 50% !important;}
 #main-visual .slideshow .zs-slide-4 { background-position: 50% 50% !important;}
 #main-visual .scroll {
  position: absolute;
  bottom: 30px;
  left: 50%;
  margin-left: -25px;
  width: 50px;
  height: 50px;
  border-radius: 50%;
  background: #fff;
  cursor: pointer;
  transition: all 0.3s ease-out;
  z-index: 100;
 }
 #main-visual .scroll a {
  width: 100%;
  height: 100%;
  position: absolute;
  left: 0;
  right: 0;
 }
 #main-visual .scroll::before {
  content: '';
  display: block;
  position: absolute;
  top: 25px;
  animation: scroll 3s 0.2s ease infinite;
  left: 50%;
  width: 8px;
  height: 4px;
  margin-left: -4px;
  background: url(../../img/index/main/arrow.png) no-repeat center;
  background-size: contain;
 }
 #main-visual .scroll::after {
  content: '';
  display: block;
  position: absolute;
  top: 30px;
  left: 50%;
  animation: scroll 3s 0s ease infinite;
  width: 8px;
  height: 4px;
  margin-left: -4px;
  background: url(../../img/index/main/arrow.png) no-repeat center;
  background-size: contain;
 }
 #main-visual .right_bnr {display:none;}
 #main-visual #slide { padding-top: 96.875%;}
 #main-visual .cp-bnr { display: none;}
 #main-visual .bnr_sp { width: 100%; padding: 5% 5% 15px; display: block; line-height: 0;}
 #main-visual .bnr_sp a { display: block;}
 #main-visual .bnr_sp img { width: 100%; height: auto;}
}

/*--------------------------------------------------------------------------
 lead
---------------------------------------------------------------------------*/
#lead {
 max-width: 920px;
 margin: 0 auto;
 padding: 100px 0 120px;
}
#lead h1 {
  text-align:center;
  padding:0 0 30px;
  letter-spacing: 0.15em;
  color: #000;
  font-size: 30px;
  font-weight: 300;
  font-family: 'Noto Sans JP', sans-serif; 
}
#lead p {
 text-align: center;
 letter-spacing: 0.06em;
 line-height: 2.2;
 font-size: 15px;
}

@media screen and (max-width: 640px) {
 #lead { padding: 50px 6.667%;}
 #lead h1{
  padding:0 0 15px;
  font-size: 25px;
 }
 #lead p {
  line-height: 1.8;
  font-size: 12px;
 }
 #lead p br { display: none;}

}

/*--------------------------------------------------------------------------
 title
---------------------------------------------------------------------------*/
h2.ttl { text-align: center;}
h2.ttl .en {
 display: block;
 letter-spacing: 0.1em;
 line-height: 1;
 font-family: 'Catamaran', sans-serif;
 font-size: 18px;
 font-weight: 800;
}
h2.ttl .underline {
 width: 40px;
 margin: 25px auto;
 display: block;
 line-height: 0;
 border-bottom: 1px solid #1d1d1d;
}
h2.ttl + p {
 margin-bottom: 40px;
 font-size: 12px;
 text-align: center;
}

@media screen and (max-width: 640px) {
 h2.ttl .en { font-size: 14px;}
 h2.ttl .underline {
  width: 30px;
  margin: 20px auto;
 }
 h2.ttl + p {
  margin-bottom: 20px;
  padding: 0 6.667%;
  font-size: 10px;
  text-align: left;
 }
 h2.ttl + p br { display: none;}
}

/*====================================
movie
=====================================*/
#movie .js-modal-btn{
   width: 100%;
   max-width: 1000px;
   margin: 0 auto;
   line-height: 0;
   position: relative;
}
#movie .js-modal-btn .play {
   position: absolute;
   left: 0;
   top: 0;
   display: block;
   width: 100%;
   height: 100%;
   background-color: rgba(0,0,0,.4);
}
#movie .js-modal-btn .play:hover {
   background-color: rgba(0,0,0,.0);
    -webkit-transition: all 0.5s ease;
    -moz-transition: all 0.5s ease;
    -o-transition: all 0.5s ease;
    transition: all  0.5s ease;

}
#movie .js-modal-btn .play span{
   display: block;
   font-size: 90px;
   line-height: 0;
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    -webkit-transform: translate(-50%, -50%);
    -ms-transform: translate(-50%, -50%);
    color: #fff;
    cursor: pointer;
}
#movie .js-modal-btn .movie_title{
   position: absolute;
   right: 10px;
   bottom: 10px;
   color: #fff;
   font-size: 18px;
   font-weight: bold;
   line-height: 1;
}
#movie .movie_link {
   width: 100%;
   max-width: 1000px;
   margin: 0 auto;
   display: flex;
   justify-content: space-between;
   margin-top: 20px;
   margin-bottom: 70px;
}

#movie .btn2 {
 width: 49%;
}
#movie .btn2 a {
 text-align: center;
 line-height: 80px;
 display: block;
 position: relative;
 z-index: 10;
}
#movie .btn2 a b {
 letter-spacing: 0.2em;
 color: #fff;
 font-family: 'Catamaran' , sans-serif;
 font-size: 16px;
 font-weight: 600;
}
#movie .btn2 a:hover {
 color: #1d1d1d;
 background: transparent;
}
#movie .btn2 a:hover b,#movie .btn2 a:hover span { color: #1d1d1d;}
#movie .btn2 a::before {
 content: "";
 width: 0;
 height: 100%;
 background: #fff100;
 position: absolute;
 top: 0;
 left: 0;
 z-index: -1;
}
#movie .btn2 a:hover::before {
 width: 100%;
 -webkit-transition:  all 0.15s ease-out;
 -moz-transition:  all 0.15s ease-out;
 -o-transition:  all 0.15s ease-out;
 transition:  all 0.15s ease-out;
}
#movie .btn2 a::after {
 content: "";
 width: 100%;
 height: 100%;
 background: #2d2d2d;
 position: absolute;
 top: 0;
 left: 0;
 z-index: -2;
}
#movie .btn2 a span {
 width: 24px;
 display: block;
 position: absolute;
 left: 20px;
 top: 50%;
 -webkit-transform: translateY(-50%);
 -ms-transform: translateY(-50%);
 transform: translateY(-50%);
 color: #fff;
}
#movie .btn2 a .material-icons {
 line-height: 1;
 font-size: 24px;
}
@media screen and (max-width: 640px) {
#movie .movie_link {
   display: block;
}
#movie .btn2 a b {
 font-size: 13px;
}
#movie .js-modal-btn .movie_title{
   font-size: 11px;
}
#movie .btn2 {
 width: 100%;
 margin-top: 20px;
}
}
/*====================================
  special_offer
=====================================*/
#special_offer {
 padding: 100px 5%;
 position: relative;
}
#special_offer::before {
 content: "";
 width: 100%;
 height: 340px;
 display: block;
 position: absolute;
 top: 0;
 left: 0;
 background: #f7f7f7;
 z-index: -1;
}
#special_offer .bnr-list {
 margin: 40px auto 0;
 letter-spacing: 0;
 font-size: 0;
}
#special_offer .bnr-list li {
 width: 31.333%;
 margin-left: 3%;
 display: inline-block;
 vertical-align: top;
 position: relative;
}
#special_offer .bnr-list li i {
 width: 60px;
 line-height: 0;
 position: absolute;
 left: 0;
 top: 0;
}
#special_offer .bnr-list li:nth-child(3n+1) { margin-left: 0;margin-bottom: 40px;}
#special_offer a { display: block;}
#special_offer .btn a span {
 margin-top: 0;
}
#special_offer a span {
 margin-top: 1.25em;
 display: block;
 text-align: center;
 letter-spacing: 0.06em;
 font-size: 16px;
 font-weight: 300;
}
#special_offer .btn a span {margin-top: 0;}
#special_offer a:hover { opacity: 0.7;}
#special_offer a img { width: 100%; height: auto;}
#special_offer a img.sp { display: none;}
#special_offer .bnr-list + p { max-width: 1000px; margin: 40px auto 0; }
#special_offer .bnr-list + p + p { max-width: 1000px; margin: 0 auto 60px; }
#special_offer .pickup { max-width: 1120px; margin: 40px auto 0;}
#special_offer .pickup a img { width: 100%; max-width: 1120px; height: auto;}


@media screen and (max-width: 640px) {
 #special_offer { padding: 50px 0;}
 #special_offer::before { height: 280px;}
 #special_offer .bnr-list { width: 100%; margin: 15px 0 0;}
 #special_offer .bnr-list li {
  width: 100%;
  margin: 0 0 24px;
}
#special_offer .bnr-list li:last-child { margin-bottom: 0;}
#special_offer  a { display: block;}
#special_offer a span { font-size: 12px;}
#special_offer  a:hover { opacity: 1.0;}
#special_offer  a img.pc { display: none;}
#special_offer  a img.sp { max-width: none; display: block;}
#special_offer .pickup { max-width: none; margin: 0 auto;}
#special_offer .bnr-list + p { margin-top: 24px;}
}

/*====================================
  JAPAN LOCATION AREA
=====================================*/
#japanArea{
 width:100%;
 padding: 0 0 160px;
 position: relative;
 overflow: hidden;
}
#japanArea .ttl { display: none;}

/* PAGER */
.area-nav {
 width:100%;
 margin:20px 0;
 text-align:center;
 position: relative; z-index: 10;
}
.area-nav ul {}
.area-nav ul li {
 display: inline-block; *display: inline; *zoom: 1;
 vertical-align: middle;
}
.area-nav ul li a {
 margin: 0 5px;
 padding:0 5px;
 display: block;
 color: #1d1d1d;
 font-size: 12px;
 position:relative;
 line-height:30px;
}
.area-nav ul li a::before {
 content:'|';
 display:block;
 position: absolute;
 right:-10px;
 top: -1px;
 line-height:30px;
 color: #1d1d1d!important;
}
.area-nav ul li:last-child a::before { content: none;}
.area-nav ul li a:hover{ color:#8A7733;}

/* swiper */
.swiper-container {
 width: 100%;
 height: auto;
 position: relative;
 overflow: visible !important;
}
.swiper-slide {
 width: 810px !important;
 height: auto !important;
/* Center slide text vertically */
 display: -webkit-box;
 display: -ms-flexbox;
 display: -webkit-flex;
 display: flex;
 -webkit-box-pack: center;
 -ms-flex-pack: center;
 -webkit-justify-content: center;
 justify-content: center;
 -webkit-box-align: center;
 -ms-flex-align: center;
 -webkit-align-items: center;
 align-items: center;
}
.swiper-slide a span img {
 -webkit-transition: all 0.4s;
    -moz-transition: all 0.4s;
     -ms-transition: all 0.4s;
      -o-transition: all 0.4s;
         transition: all 0.4s;
}
.swiper-slide a:hover span img { opacity: 0.8;}
.swiper-slide a .areaInfo {
 width: 350px;
 padding: 25px 25px 25px 12px;
 position: absolute;
 left: 0;
 bottom: -60px;
 background: #fff;
}
.swiper-slide a .areaInfo h3 {
 letter-spacing: 0.1em;
 line-height: 1.3;
 font-family : "Arapey" , serif;
 font-size: 24px;
 font-weight: normal;
}
.swiper-slide a .areaInfo p {
 margin-top: 1em;
 padding-top: 1em;
 text-align: left;
 font-size: 12px;
 line-height: 1.8;
 border-top: 1px solid #888 ;
}

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

}

@media screen and (max-width: 640px) {
#japanArea {
 padding: 50px 0;
 background: #f7f7f7;
}
.area-nav { display: none;}
#japanArea .ttl {
 margin-bottom: 20px;
 display: block;
}
.swiper-container {
 width: 100%;
 padding: 0 10%;
 margin: 0 auto !important;
}
.swiper-slide { width: 100% !important;}
.swiper-button-prev { left: 2% !important;}
.swiper-button-next { right: 2% !important;}
.swiper-button-prev,
.swiper-button-next { margin-top: -10px;}
.swiper-slide a .areaInfo{
 width: 100%;
 padding:0;
 position: static;
 left: 0;
 top: 15px;
 background: none;
}
.swiper-slide a .areaInfo h3 {
 margin-top: 12px;
 text-align: center;
 font-size: 16px;
}
.swiper-slide a .areaInfo p { display: none;}
}



/*----------------------
  WORKS
----------------------*/
#works {
 padding-bottom: 40px;
}

#works .portfolio-list {
 max-width: 1620px;
 margin: 0 auto;
 font-size: 0;
 letter-spacing: 0;
}
#works .portfolio-list li {
 width: 29%;
 margin: 0 2% 60px;
 display: inline-block; *display: inline; *zoom: 1;
}
#works .portfolio-list li:nth-child(2),
#works .portfolio-list li:nth-child(2n+3) {
 -webkit-transition-delay: 0.2s;
    -moz-transition-delay: 0.2s;
     -ms-transition-delay: 0.2s;
      -o-transition-delay: 0.2s;
}
#works .portfolio-list li:nth-child(3),
#works .portfolio-list li:nth-child(3n+3) {
 -webkit-transition-delay: 0.4s;
    -moz-transition-delay: 0.4s;
     -ms-transition-delay: 0.4s;
      -o-transition-delay: 0.4s;
}
#works .portfolio-list li a {
 display: block;
 text-align: left;
 position: relative;
}
#works .portfolio-list li a .thumbnail { overflow: hidden;}
#works .portfolio-list li a .thumbnail img {
 width: 100%;
 height: auto;
 line-height: 0;
 vertical-align: bottom;
 -webkit-transition: 0.5s ease;
 -moz-transition: 0.5s ease;
 -o-transition: 0.5s ease;
 transition: 0.5s ease;
 backface-visibility: hidden;
}
#works .portfolio-list li a:hover .thumbnail img {
-ms-transform: scale(1.075);
transform: scale(1.075);
-webkit-transition: 1s all; -moz-transition: 1s all; -o-transition: 1s all; transition: 1s all;
}
#works .portfolio-list li a h3 {
 padding: 24px 0 0 15px;
}
#works .portfolio-list li a h3 span {
 display: block;
 line-height: 1;
}
#works .portfolio-list li a h3 .loc-info {
 letter-spacing: 0.1em;
 vertical-align: baseline;
 font-size: 18px;
 font-weight: 300;
 text-transform: uppercase;
}
#works .portfolio-list li a h3 .loc-info i {
 vertical-align: baseline;
 line-height: 1;
 font-size: inherit;
 font-weight: inherit;
 font-style: normal;
 font-family: -apple-system, BlinkMacSystemFont, "Open Sans", 'Noto Sans JP', sans-serif;
}
#works .portfolio-list li a h3 span.sp-none { display: inline;}
#works .portfolio-list li a h3 .name {
 margin-top: 10px;
 letter-spacing: 0.05em;
 font-size: 12px;
 font-weight: 400;
}

@media screen and (max-width: 1280px) {
#works .portfolio-list li a h3 { padding: 20px 0 0 0;}
#works .portfolio-list li a h3 .loc-info { font-size: 16px;}
#works .portfolio-list li a h3 .name { margin-top: 8px; font-size: 9px;}
}

@media screen and (max-width: 640px) {
#works {width: 90%; margin: 0 auto; padding: 50px 0 40px;}
#works .portfolio-list li {
 width: 49%;
 margin: 0 0 30px;
 vertical-align: top;
}
#works .portfolio-list li:nth-child(2n+3) {
 -webkit-transition-delay: 0s;
    -moz-transition-delay: 0s;
     -ms-transition-delay: 0s;
      -o-transition-delay: 0s;
}
#works .portfolio-list li:nth-child(3),
#works .portfolio-list li:nth-child(3n+3) {
 -webkit-transition-delay: 0s;
    -moz-transition-delay: 0s;
     -ms-transition-delay: 0s;
      -o-transition-delay: 0s;
}
#works .portfolio-list li:nth-child(even) {
  margin-left: 2%;
 -webkit-transition-delay: 0.2s;
    -moz-transition-delay: 0.2s;
     -ms-transition-delay: 0.2s;
      -o-transition-delay: 0.2s;
}
#works .portfolio-list li a h3 { height: auto; margin-top: 12px; padding: 0; text-align: center;}
#works .portfolio-list li a h3 .loc-info { padding-top: 0; font-size: 14px;}
#works .portfolio-list li a h3 .name { margin-top: 5px; font-size: 9px; opacity: 0.5;}
}

@media screen and (max-width: 480px) {
 #works .portfolio-list li a h3 .loc-info { font-size: 12px;line-height: 1.3em;}
 #works .portfolio-list li a h3 span.sp-none { display: none;}
}

/*----------------------
  photographer
----------------------*/
#photographer {
 padding: 50px 0 100px;
 text-align: center;
 background: #f7f7f7;
}
#photographer .pht { margin-bottom: 20px;}
#photographer .pht img { max-width: 100%; height: auto;}
#photographer .pht img.sp { display: none; }
#photographer h2.ttl { margin-bottom: 20px;}
#photographer h2.ttl .en {
 letter-spacing: 0.025em;
 font-size: 30px;
}
.btn  {
 width: 380px;
 margin: 50px auto 0;
}
.btn a {
 display: block;
 text-align: center;
 letter-spacing: 0.1em;
 line-height: 78px;
 font-size: 14px;
 border: 1px solid #808080;
 -webkit-border-radius: 40px;
         border-radius: 40px;
 position: relative;
 cursor: pointer;
 background: #FFF;
 -webkit-transition: .4s ease-out;
 -moz-transition: .4s ease-out;
 transition: .4s ease-out;
}
.btn a::after {
 content: "";
 width: 10px;
 height: 10px;
 position: absolute;
 right: 28px;
 top: 34px;
 border-top: 1px solid #2d2d2d;
 border-right: 1px solid #2d2d2d;
 -webkit-transform: rotate(45deg);
 transform: rotate(45deg);
}
.btn a:hover {
 background: #2d2d2d;
 color: #FFF;
}
.btn a:hover::after { border-color: #FFF;}

@media screen and (max-width: 1200px) {
 .btn {
  width: 340px;
  margin-top: 40px;
 }
 .btn a {
  text-align: center;
  line-height: 66px;
  font-size: 12px;
 }
 .btn a::after {
  content: "";
  width: 10px;
  height: 10px;
  position: absolute;
  right: 28px;
  top: 29px;
 }
}
@media screen and (max-width: 640px) {
 #photographer { padding: 0 0 50px;}
 #photographer .pht { margin-bottom: 20px;}
 #photographer .pht img.pc { display: none;}
 #photographer .pht img.sp { display: block;}
 #photographer h2.ttl {
  width: 90%;
  margin: 0 5% 15px;
  text-align: left;
 }
 #photographer h2.ttl .en {
  line-height: 1.5;
  font-size: 20px;
 }
 #photographer h2.ttl + p { text-align: left;}
 #photographer h2.ttl + p br { display: none;}
 #photographer h2.ttl + p {}
 .btn {
  width: 300px;
  margin: 35px auto 0;
 }
 .btn a {
  line-height: 58px;
  font-size: 10px;
  -webkit-border-radius: 29px;
          border-radius: 29px;
 }
 .btn a::after {
  content: "";
  width: 8px;
  height: 8px;
  position: absolute;
  right: 20px;
  top: 24px;
 }
}


/*----------------------
  dress
----------------------*/
#dress { width: 100%; position: relative;}
#dress .pht { line-height: 0;}
#dress img.sp { display: none;}
#dress a {
 width: 100%;
 height: 100%;
 position: absolute;
 top: 0;
 left: 0;
 background: rgba(0,0,0,0.5);
}
#dress a div {
 position: absolute;
 top: 50%;
 left: 0;
 right: 0;
 -webkit-transform: translateY(-50%);
 -ms-transform: translateY(-50%);
 transform: translateY(-50%);
}
#dress a div h2.ttl .en { color: #FFF;}
#dress a div h2.ttl .underline { border-bottom: 1px solid #ddd;}
#dress a div h2.ttl + p {
 margin-bottom: 0;
 color: #fff;
}
#dress a:hover { background: none;}
#dress a:hover * {}
#dress a,
#dress a * { -webkit-transition: 1s ease; -moz-transition: 1s ease; -o-transition: 1s ease; transition: 1s ease;}
#dress .btn  {
 width: 380px;
 margin: 50px auto 0;
}
#dress .btn span {
 display: block;
 text-align: center;
 letter-spacing: 0.1em;
 line-height: 78px;
 color: #FFF;
 font-size: 14px;
 border: 1px solid #fff;
 -webkit-border-radius: 40px;
         border-radius: 40px;
 position: relative;
 cursor: pointer;
 -webkit-transition: .4s ease-out;
 -moz-transition: .4s ease-out;
 transition: .4s ease-out;
}
#dress .btn span::after {
 content: "";
 width: 10px;
 height: 10px;
 position: absolute;
 right: 28px;
 top: 34px;
 border-top: 1px solid #fff;
 border-right: 1px solid #fff;
 -webkit-transform: rotate(45deg);
 transform: rotate(45deg);
}
#dress .btn span:hover {
 background: none;
 color: #FFF;
}
@media screen and (max-width: 1200px) {
 #dress .btn {
  width: 340px;
  margin-top: 40px;
 }
 #dress .btn span {
  text-align: center;
  line-height: 66px;
  font-size: 12px;
 }
 #dress .btn span::after {
  content: "";
  width: 10px;
  height: 10px;
  position: absolute;
  right: 28px;
  top: 29px;
 }
}
@media screen and (max-width: 640px) {
 #dress { width: 100%; position: relative;}
 #dress img.pc { display: none;}
 #dress img.sp { display: block;}
 #dress a div h2.ttl .en { font-size: 20px;}
 #dress .btn {
  width: 300px;
  margin: 35px auto 0;
 }
 #dress .btn span {
  line-height: 58px;
  font-size: 10px;
  -webkit-border-radius: 29px;
          border-radius: 29px;
 }
 #dress .btn span::after {
  content: "";
  width: 8px;
  height: 8px;
  position: absolute;
  right: 20px;
  top: 24px;
 }
}
@media screen and (max-width: 480px) {
 #dress a div { height: 130px;}
 #dress a div h2.ttl .en { font-size: 18px;}
}

/*----------------------
  Blog
----------------------*/
.blog, .reviews  {
  width: 100%;
  max-width: 1200px;
  margin: 0 auto;
  padding: 80px 0 40px;
}
.blog h2,.reviews h2 {
  margin-top: 8px;
  display: block;
  letter-spacing: 0.14em;
  line-height: 1;
  font-family: 'Catamaran', sans-serif;
  font-size: 20px;
  font-weight: 400;
}
.blog .square {
  width: 25%;
  float: left;
  text-align: center;
}
.blog .square .other_img {
  padding-bottom: 20px;
}
.blog .square img {
  width: 225px;
  height: 225px;
  object-fit: cover;
  margin:0 auto;
}
.blog .square > div a {
  line-height: 0;
  vertical-align: middle;
  overflow: hidden;
  width: 100%;
  vertical-align: middle;
  line-height: 1;
  display: block;
}

.blog .square > div a img {
  display: block;;
  transition-duration: 0.6s;
}
.blog .square > div a img:hover {
  transform: scale(1.07);
  transition-duration: 0.6s;
}
.blog .square .info {
  padding-top: 15px;
}
.blog .square h3 {
  display: inline;
  font-weight: bold;
  font-size: 1em;
  position: relative;
  padding-bottom: 5px;
}
.blog .square h3 a:hover {
  color:#d21d22;
}
.blog .square h3::after {
  content: "";
  position: absolute;
  left: 0;
  right: 0;
  bottom: 0;
  border-bottom: 1px solid #333;
}
.blog .square h4{
  padding: 8px 40px;
  font-size: 1.1em;
  font-weight: normal;
}
.blog .square h4 a:hover {
  color:#d21d22;
}
.blog .square .entry-meta i {
  vertical-align: middle;
}
.blog .square .entry-meta time {
    text-align: center;
    font-size: 0.9em;
    color: #777;
    vertical-align: middle;
    letter-spacing: 0.5px;
    line-height: 1;
    letter-spacing:1px;
    vertical-align: middle;
}
/*.blog .square .entry-meta i {
  display: none;
}*/
.blog .square .entry-meta .posted-on {
  margin-right: 0;
}
@media screen and (min-width: 768px) and ( max-width:1024px){
.blog {
  width: 70%;
  padding-bottom: 70px;
}
.blog .square {
  width: 50%;
  float: left;
  text-align: center;
  padding-bottom: 30px;
}
}

@media screen and (max-width: 767px) {
.blog {
  width: 100%;
  padding-bottom: 30px;
}
.reviews {
  width: 90%;
}
.blog_main {
  padding-top: 40px;
}
.blog .square {
  width: 100%;
  float: none;
  text-align: center;
  padding-bottom: 0;
}
.blog .other_img {
  display: inline-block;
  width: 30%;
  vertical-align: middle;
}
.blog .other_txt {
  display: inline-block;
  width: 65%;
  padding-left: 3%;
  vertical-align: middle;
  text-align: left;
}
.blog .square img {
  width: 100px;
  height: 100px;
  object-fit: cover;
  margin:0 auto;
}
.blog .square .info {
  padding-top: 10px;
}
.blog .square h4{
  padding: 12px 0;
}
}

/*----------------------
  News
----------------------*/
#news { padding: 60px 0;}

#news .news-list { max-width: 1080px; height: 300px; margin: 40px auto 0; overflow-y: auto; border-top: 1px dashed #7C7467; border-bottom: 1px dashed #7C7467;}
#news .news-list li { padding: 15px; border-top: 1px dashed #7C7467;}
#news .news-list li:first-child { border-top: none;}
#news .news-list li:nth-child(odd) { background: #f7f7f7;}
#news .news-list li:nth-child(even) { background: #f2ede1;}
#news .news-list li .date { width: 7em; float: left; line-height: 1.6; letter-spacing: 0.5px; font-family: Arial, Helvetica,sans-serif; font-size: 14px;}
#news .news-list li .bg { width: 7em; float: left; text-align: center; line-height: 2; letter-spacing: 0.5px; color: #FFF; font-family: Arial, Helvetica,sans-serif; font-size: 11px; background: #7C7467;}
#news .news-list li p { margin-left: 15px; float: left; line-height: 1.6; font-size: 14px;}
#news .news-list li p a { text-decoration: underline; color: #1d1d1d;}
#news .news-list li p a:hover { text-decoration: none; color: #8a7733;}


#news .news-list::-webkit-scrollbar { overflow:hidden; width:5px; background:#aaaaaa; -webkit-border-radius:3px;border-radius:3px;}
#news .news-list::-webkit-scrollbar:horizontal { height:5px;}
#news .news-list::-webkit-scrollbar-button { display:none;}
#news .news-list::-webkit-scrollbar-piece { background:#aaaaaa;}
#news .news-list::-webkit-scrollbar-piece:start { background:#aaaaaa;}
#news .news-list::-webkit-scrollbar-thumb { overflow:hidden; -webkit-border-radius:3px; border-radius:3px; background:#1d1d1d;}
#news .news-list::-webkit-scrollbar-corner { overflow:hidden; -webkit-border-radius:3px; border-radius:3px; background:#1d1d1d;}


/*----------------------
  Featured
----------------------*/
#featured { padding: 100px 0;}
#featured ul {}
#featured ul li {
 width: 48%;
}
#featured ul li a .pht { line-height: 0;}
#featured ul li a .pht img { backface-visibility: hidden;}
#featured ul li a h3 {
 margin: 25px auto 20px;
 line-height: 1.3;
 font-size: 16px;
 font-weight: 300;
}
#featured ul li a h3 br.sp { display: none; }
#featured ul li a h3 + p {
 line-height: 1.8;
 font-size: 14px;
}
#featured ul li a:hover img {
 -webkit-transition: all 0.4s;
    -moz-transition: all 0.4s;
     -ms-transition: all 0.4s;
      -o-transition: all 0.4s;
         transition: all 0.4s;
}
#featured ul li a:hover .pht img { opacity: 0.8;}
#featured ul li a:hover h3 { text-decoration: underline;}

@media screen and (max-width: 640px) {
#featured { padding: 50px 0 0;}
#featured ul li {
 width: 48.5%;
}
#featured ul li:nth-child(odd) { margin-right: 2.5%;}
#featured ul li a h3 { height: auto; padding: 8px 0; margin: 0; line-height: 1.3; font-size: 14px; background: #FFF;}
#featured ul li a h3 br.sp { display: inline;}
#featured ul li a h3.line1 { padding: 15px 0 16px;}
#featured ul li a h3 + p { display: none;}
}

@media screen and (max-width: 480px) {
#featured ul li a h3 { font-size: 12px;}
#featured ul li a h3.line1 { padding: 14px 0 15px;}
}
/*----------------------
  spとpc 非表示設定
----------------------*/
@media screen and (max-width: 640px) {
  .sp {display: block;}
}
@media screen and (min-width: 641px) {
  .sp {display: none;}
}
#cp_bnr .basic-btn02 a {
    position: relative;
}
#cp_bnr .basic-btn02 a::after {
    content: "";
    width: 7px;
    height: 7px;
    margin-top: -3px;
    position: absolute;
    right: 12px;
    top: 50%;
    border-top: 1px solid #EA5557;
    border-right: 1px solid #EA5557;
    -webkit-transform: rotate(45deg);
    transform: rotate(45deg);
}
#cp_bnr .basic-btn02 a span {
    color: #EA5557;
    font-family: "Catamaran", sans-serif;
}
#cp_bnr .en-tit + p {
    font-size: 14px;
}

.fnvTet {font-size: 12px!important}
.reviews script + a {display: none!important;}