@charset "utf-8";
/* =============================================================================
   page
   ========================================================================== */
/* elevenfaced ----------------------*/
.p-elevenfaced {}

/* main */
.p-elevenfaced__main01 {
   margin-bottom: calc(90/1600*100vw);
   position: relative;
   max-height: 684px;
   height: calc(684/1600*100vw);
}
.p-elevenfaced__main01 img{
   max-width: 684px;
   width: calc(684/1600*100vw);
   height: auto;
   position: absolute;
   top:0;
   left:0;
}
.p-elevenfaced__main01Text{
   color: #fff;
   background: #65386f;
   max-width: 520px;
   width: calc(520/1600*100vw);
   height: auto;
   position: absolute;
   top:calc(55/1600*100vw);
   right:0;
}
.p-elevenfaced__main01Text .c-caption{
   margin: calc(75/1600*100vw) calc(80/1600*100vw);
   display: block;
   line-height: 1.8em;
   font-size: calc(18/1600*100vw);
}

.p-elevenfaced__main02 {
   margin-bottom: calc(140/1600*100vw);
   position: relative;
   max-height: 410px;
   height: calc(410/1600*100vw);
}
.p-elevenfaced__main02 img{
   max-width: 600px;
   width: calc(600/1600*100vw);
   height: auto;
   position: absolute;
   top:0;
   right:0;
}
.p-elevenfaced__main02Text{
   max-width: 470px;
   width: calc(470/1600*100vw);
   height: auto;
   position: absolute;
   top:0;
   left:0;
}
.p-elevenfaced__main02Text .c-caption{
   display: block;
   line-height: 2.0em;
   font-size: calc(18/1600*100vw);
   letter-spacing: .05em;
}

.p-elevenfaced__main03 {
   margin-bottom: calc(85/1600*100vw);
   position: relative;
   max-height: 610px;
   height: calc(610/1600*100vw);
   overflow: hidden;
   background-color: #000;
}
.p-elevenfaced__main03 img{
   max-width: 1600px;
   width: 100%;
   height: auto;
   position: absolute;
   top:0;
   left:50%;
   transform: translateX(-50%) ;
   -webkit-transform: translateX(-50%);
   z-index: 10;
}
.p-elevenfaced__main03Text{
   color: #fff;
   height: 100%;
   position: relative;
   z-index: 11;
   text-align: right;
}
.p-elevenfaced__main03Text .c-caption{
   max-width: 430px;
   width: calc(430/1600*100vw);
   line-height: 1.8em;
   font-size: calc(18/1600*100vw);
   text-align: left;
   position: absolute;
   top: 50%;
   right: 0;
   transform: translateY(-50%) ;
   -webkit-transform: translateY(-50%);
   z-index: 12;
}

@media only screen and (min-width: 1600px) {
   .p-elevenfaced__main01Text .c-caption{
      margin: 75px 80px;
      font-size: 18px;
   }
   .p-elevenfaced__main02Text .c-caption{
      font-size: 18px;
   }
   .p-elevenfaced__main03Text .c-caption{
      font-size: 18px;
   }
}
@media only screen and (max-width: 1420px) {
   .p-elevenfaced__main01Text{
      width: calc(580/1600*100vw);
   }
   .p-elevenfaced__main01Text .c-caption{
      font-size: calc(21/1600*100vw);
   }
   .p-elevenfaced__main02Text .c-caption{
     font-size: calc(21/1600*100vw);
    }
    .p-elevenfaced__main03Text .c-caption{
      font-size: calc(21/1600*100vw);
    }
}
@media only screen and (max-width: 768px) {
   .p-elevenfaced__main01 {
      position: unset;
      height: auto;
      max-height: unset;
   }
   .p-elevenfaced__main01 img{
      width: 100%;
      position: unset;
   }
   .p-elevenfaced__main01Text{
      position: unset;
      top:0;
      max-width: unset;
      width: 100%;
      margin: 0;
      padding: 0;
      display: block;
   }
   .p-elevenfaced__main01Text .c-caption{
      margin: 0;
      padding: calc(40/750*100vw);
      font-size: 16px;
      line-height: 2.0em;
   }
   .p-elevenfaced__main02 {
      margin-bottom: calc(120/750*100vw);
      position: relative;
      max-height: unset;
      height: auto;
   }
   .p-elevenfaced__main02 img{
      width: 100%;
      position: unset;
   }
   .p-elevenfaced__main02Text{
      position: unset;
      top:0;
      width: 100%;
      margin: 0;
      padding: 0;
      display: block;
   }
   .p-elevenfaced__main02Text .c-caption{
      margin: 0;
      padding: calc(50/750*100vw) 0 0;
      font-size: 16px;
   }

   .p-elevenfaced__main03 {
      width: 100%;
      height: auto;
      max-height: unset;
   }
   .p-elevenfaced__main03 img{
      position: unset;
      max-width: unset;
      left: 0;
      transform: unset ;
      -webkit-transform: unset;
   }
   .p-elevenfaced__main03Text{
      background: #000;
      position: unset;
      top:0;
      width: 100%;
      margin: 0;
      padding: 0;
      display: inline-block;
      /* border: 1px solid #f00; */
   }
   .p-elevenfaced__main03Text .c-caption{
      width: calc(650/750*100vw);
      margin: calc(50/750*100vw) auto calc(100/750*100vw);
      font-size: 16px;
      position: unset;
      top: 0;
      right: 0;
      transform: translateY(0) ;
      -webkit-transform: translateY(0);
   }
}





/* Slider */
.p-elevenfaced__slide{
   margin: calc(130/1600*100vw) auto;
   width: calc(1100/1600*100vw);
   max-width: 1100px;
}
@media screen and (max-width: 768px) {
   .p-elevenfaced__slide{
      margin: calc(130/750*100vw) auto;
      width: calc(650/750*100vw);
   }
}

.slick-slider{
    position: relative;
    display: block;
    box-sizing: border-box;
    -webkit-user-select: none;
        -ms-user-select: none;
            user-select: none;
    -webkit-touch-callout: none;
    -khtml-user-select: none;
    touch-action: pan-y;
    -webkit-tap-highlight-color: transparent;
}
.slick-list{
    position: relative;
    display: block;
    overflow: hidden;
    margin: 0;
    padding: 0;
}
.slick-list:focus{
    outline: none;
}
.slick-list.dragging{
    cursor: pointer;
    cursor: hand;
}
.slick-slider .slick-track,
.slick-slider .slick-list{
    transform: translate3d(0, 0, 0);
}
.slick-track{
    position: relative;
    top: 0;
    left: 0;
    display: block;
    margin-left: auto;
    margin-right: auto;
}
.slick-track:before,
.slick-track:after{
    display: table;
    content: '';
}
.slick-track:after{
    clear: both;
}
.slick-loading .slick-track{
    visibility: hidden;
}
.slick-slide{
    display: none;
    float: left;
    height: 100%;
    min-height: 1px;
}
[dir='rtl'] .slick-slide{
    float: right;
}
.slick-slide img{
    display: block;
}
.slick-slide.slick-loading img{
    display: none;
}
.slick-slide.dragging img{
    pointer-events: none;
}
.slick-initialized .slick-slide{
    display: block;
}
.slick-loading .slick-slide{
    visibility: hidden;
}
.slick-vertical .slick-slide{
    display: block;
    height: auto;
    border: 1px solid transparent;
}
.slick-arrow.slick-hidden {
    display: none;
}

.p-honzon__bodySliderThum {
   display: flex;
   justify-content: center;
   margin-top: calc(22 / 1100 * 100%)
 }
 .p-honzon__bodySliderThum .item {
     margin: 0 calc(9 / 1100 * 100%);
     flex-basis: calc(148 / 1100 * 100%)
   }
 @media screen and (max-width: 768px) {
   .p-honzon__bodySliderThum .item {
      flex-basis: calc(212.8 / 1100 * 100%)
   }
   .p-honzon__bodySliderThum .item:first-child {
      margin-left: 0;
   }
   .p-honzon__bodySliderThum .item:last-child {
      margin-right: 0;
   }
}

.p-honzon__bodySliderThum .item.is-active .item__btn {
   position: relative
}

.p-honzon__bodySliderThum .item.is-active .item__btn::before {
   content: "";
   position: absolute;
   top: 0;
   left: 0;
   width: 100%;
   height: 100%;
   background-color: rgba(255, 255, 255, .5);
   display: block;
   z-index: 1;
   border: 2px solid #6f386f;
}

.p-honzon__bodySliderThum .item.is-active .item__btn img {
   position: relative;
   z-index: 0;
}

.p-honzon__bodySliderThum .item__btn {
   outline: 0;
   border: 0;
   background: transparent;
   -webkit-appearance: none;
   -moz-appearance: none;
   appearance: none;
   cursor: pointer;
   display: block;
}




/* actual */
.p-elevenfaced__actual{}
.p-elevenfaced__actual img{
   width: 100%;
}
.p-elevenfaced__actual .c-caption { text-align: center; }