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

/* --------------------------------------------------
 *  トップページのCSSの宣言
 *
 *  ◆  MAIN BLOCK
 *  ◆  BRIDAL RESORT BLOCK
 *  ◆  PICK UP MENU BLOCK
 *  ◆  PHOTO GALLARY BLOCK
 *  ◆  NEWS BLOCK
 * -------------------------------------------------- */



/* --------------------------------------------------
 *  PC
 * -------------------------------------------------- */
@media print, screen and (min-width: 641px) {


/****************************************
 *  ◆  COMMON
*****************************************/

body {
  background: none;
}

#contentsArea {
  }
  #contentsArea #contents {
    padding-top: 0;
  }

  .section {
    widht: 100%;
    }
    .section .sectionInner {
      width: 1200px;
      margin: 0 auto;
    }

/****************************************
 *  ◆  MAIN BLOCK
*****************************************/

  #mainVisualSection {
    position: relative;
    width: 100%;
    }
/*
    #mainVisualSection #mainVisual {
      width: 100%;
      height: 1060px;
      margin: 0 auto;
      }
      #mainVisualSection #mainVisual .bx-wrapper ul li {
        overflow: hidden;
      }
      #mainVisualSection #mainVisual .bx-wrapper ul li img {
        position: relative;
        left: 50%;
        width: auto;
        max-width: none;
        height: 100%;
        -webkit-transform: translateX(-50%);
        -ms-transform: translateX(-50%);
        transform: translateX(-50%);
      }
*/
    #mainVisualSection #mainVisual {
      width: auto;
      height: 800px;
      margin: 0 auto;
      }
      #mainVisualSection #mainVisual .bx-wrapper ul li {
        overflow: hidden;
      }
      #mainVisualSection #mainVisual .bx-wrapper ul li img {
        position: relative;
        left: 50%;
        width: auto;
        max-width: none;
        height: 100%;
        -webkit-transform: translateX(-50%);
        -ms-transform: translateX(-50%);
        transform: translateX(-50%);
      }

        #mainVisualSection #mainVisual .bx-wrapper {
          margin: 0 auto !important;
          padding: 0;
          *zoom: 1;
          }
          #mainVisualSection #mainVisual .bx-wrapper img {
            display: inline !important;
          }
          #mainVisualSection #mainVisual .bx-wrapper .bx-viewport {
            overflow: visible !important;
            left: 0;
            border: none;
            box-shadow: none;
            background: none;
          }

      .bx-controls-direction {
        display: none;
      }


    /*----- PICK UP BLOCK -----*/
    #mainVisualSection #pickupNewsBlock {
      position: absolute;
      bottom: 20px;
      width: 100%;
      background-color: #FFF;
      background: rgba(255, 255, 255, 0.7);
      }
      #mainVisualSection #pickupNewsBlock #pickupNewsBox {
        width: 1200px;
        margin: 0 auto;
        padding: 5px 0;
      }
      #mainVisualSection #pickupNewsBlock #pickupNewsBox div {
        display: table-cell;
        vertical-align: middle;
        }

      /*SLIDE SETTING*/
      #pickupNewsBlock #pickupNewsBox .bx-wrapper .bx-viewport {
        border: none;
        box-shadow: none;
        left: 0;
        background: none !important;
      }

        #mainVisualSection #pickupNewsBlock #pickupNewsBox #pickupDate {
          padding: 0 20px;
          text-align: center;
          font-size: 14px;
          color: #172A88;
        }
        #mainVisualSection #pickupNewsBlock #pickupNewsBox #pickupTitle {
          font-size: 16px;
          color: #172A88;
          }
          #mainVisualSection #pickupNewsBlock #pickupNewsBox #pickupTitle a {
            color: #172A88;
            line-height: 1.4;
            text-decoration: underline;
          }
          #mainVisualSection #pickupNewsBlock #pickupNewsBox #pickupTitle span {
            display: inline-block;
            padding-left: 1em;
            vertical-align: middle;
          }


  #mainSection {
    padding: 30px 0 0;
  }

/****************************************
 *  ◆ commercialBlock
*****************************************/
#commercialBlock {
  margin-bottom: 10px;
}
#commercialBlock .movie {
  width: 100%;
  aspect-ratio: 16 / 9;
}
#commercialBlock .movie iframe {
  width: 100%;
  height: 100%;
}
/****************************************
 *  ◆ CAMPAIGN BANNER BLOCK
*****************************************/

  /*
   *  CAMPAIGN BANNER BLOCK
   *--------------------------------------------------------*/
  #campaignBnrBlock {
    margin-bottom: 10px;
    }

    #campaignBnrBlock .bx-wrapper .bx-viewport,
    #campaignBnrListBlock .bx-wrapper .bx-viewport {
      left: 0;
      border: none;
      background: none;
      box-shadow: none;
    }

    #campaignBnrBlock .bx-wrapper,
    #campaignBnrListBlock .bx-wrapper {
      max-width: 100% !important;
      margin: 0 auto !important;
      padding: 0;
      *zoom: 1;
    }

    #campaignBnrBlock .bx-wrapper .bx-pager,
    #campaignBnrBlock .bx-wrapper .bx-controls-auto {
      position: absolute;
      width: 50%;
    }

      /*「Next」と「Prev」 */
      #campaignBnrBlock .bx-wrapper .bx-controls-direction a {
        width: 29px;
        height: 60px;
        z-index: 9998;
      }
      #campaignBnrBlock .bx-wrapper .bx-prev {
        left: -13px;
        background: url(../img/top/btn_prev.png) left center no-repeat;
      }
      #campaignBnrBlock .bx-wrapper .bx-next {
        right: -13px;
        background: url(../img/top/btn_next.png) left center no-repeat;
      }

    #campaignBnrBlock .bx-wrapper .bx-controls-direction a.disabled,
    #campaignBnrBlock .bx-wrapper .bx-controls-direction a.disabled {
      display: none;
    }

    /*スライダー追記*/
    .campaignBnr {
      margin-bottom: 10px;
    }
    .campaignBnr .inner {
      width: 954px;
      overflow: hidden;
    }
    .campaignBnr ul li {
      display: block;
      float: left;
      margin-right: 8px;
      width: calc(100% / 4 - 8px); /* バナーの数によって変更する */
    }
    .campaignBnr ul li a img {
      width: 100%;
    }


  /*
   *  CAMPAIGN BANNER LIST BLOCK
   *--------------------------------------------------------*/

  /*サムネイル一覧*/
  #campaignBnrListBlock {
    margin-bottom: 20px;
    }

    #campaignBnrListBlock .inner {
      }

      #campaignBnrListBlock #thumb-slider {
        margin: 0 auto;
        }

        #campaignBnrListBlock #thumb-slider .bx-wrapper .bx-pager,
        #campaignBnrListBlock #thumb-slider .bx-wrapper .bx-controls-auto {
          position: absolute;
          width: 50%;
        }

          /*「Next」と「Prev」 */
          #campaignBnrListBlock #thumb-slider .bx-wrapper .bx-controls-direction a {
            width: 20px;
            height: 39px;
            z-index: 9998;
          }
          #campaignBnrListBlock .bx-wrapper .bx-prev {
            left: -33px;
            background: url(../img/top/btn_prev_thumb.png) left center no-repeat;
          }
          #campaignBnrListBlock .bx-wrapper .bx-next {
            right: -33px;
            background: url(../img/top/btn_next_thumb.png) left center no-repeat;
          }

        #campaignBnrListBlock #thumb-slider ul {}
          #campaignBnrListBlock #thumb-slider ul li {
            float: left;
            width: 312px !important;
            height: 104px;
            overflow: hidden;
            margin-right: 8px;
            vertical-align: middle;
            }
            #campaignBnrListBlock #thumb-slider ul li img {
              width: 100%;
            }


/****************************************
 *  ◆ INFORMATION BLOCK
*****************************************/


  #informationBlock {
    width: 100%;
    padding-bottom: 40px;
    }

    #informationBlock .informationBox {
      width: 414px;
      min-height: 597px;
      padding: 10px 30px;
      background: url(../img/top/info_back.png) left top repeat-x;
      }
      #informationBlock .informationBox .titleBox {
        position: relative;
        text-align: left;
        margin-bottom: 20px;
        }
        #informationBlock .informationBox .titleBox h3 {
          padding: 10px 0;
        }
        #informationBlock .informationBox .titleBox .sub {
          position: absolute;
          top: 50%; right: 0;
          font-family: 'ヒラギノ明朝 Pro W3', 'HiraMinPro-W3', '游明朝', 'YuMincho', 'HG明朝E', 'メイリオ', 'Meiryo', serif !important;
          font-size: 16px;
          font-weight: bold;
          line-height: 1.2;
          color: #FFF;
          -webkit-transform: translateY(-50%);
          -ms-transform: translateY(-50%);
          transform: translateY(-50%);
        }


    /*NEWS BOX*/
    #informationBlock #newsBox {
      float: left;
      position: relative;
      }
      #informationBlock #newsBox .newsList {
        margin-bottom: 30px;
        }
        #informationBlock #newsBox .newsList dt {
          margin-bottom: 10px;
          font-size: 14px;
          color: #FFF;
        }
        #informationBlock #newsBox .newsList dt .iconNew {
          padding-left: 1em;
        }
        #informationBlock #newsBox .newsList dd {
          font-size: 16px;
          line-height: 1.6;
          color: #FFF;
          }
          #informationBlock #newsBox .newsList dd a {
            color: #FFF;
            text-decoration: underline;
          }
      #informationBlock #newsBox .btn {
        position: absolute;
        left: 30px; bottom: 10px;
      }

    /*FACEBOOK BOX*/
    #informationBlock #facebookBox {
      width: 444px;
      min-height: 607px;
      float: right;
      padding: 10px 15px 0;
      }
      #informationBlock #facebookBox #facebook {
        width: 445px;
        height: 520px;
        overflow: hidden;
      }




/****************************************
 *  ◆  INSTAGRAM SECTION
*****************************************/

  #instagramSection {
    width: 100%;
    padding: 20px 0;
    /*
    background: url(../img/top/_instagram_back.png) center center no-repeat;
    background-size: 100%;
    */
    }

    #instagramSection .sectionInner {
      width: 1200px;
      margin: 0 auto;
      }

    #instagramSection .sectionInner h3 {
      margin-bottom: 20px;
      text-align: center;
      }

    #instagramSection .sectionInner #instagramBox {
      }
      #instagramSection .sectionInner #instagramBox .sb_instagram_header {
        display: none;
      }



}
@media screen and (max-width:1200px) and (min-width:641px){
  #instagramSection .sectionInner {
    width: 100%;
  }

}
@media screen and (max-width:800px) and (min-width:641px){

    .section .sectionInner {
      width: 100%;
    }

    #mainVisualSection #pickupNewsBlock #pickupNewsBox {
      width: 98%;
    }

    #informationBlock .informationBox {
      width: 45%;
      padding: 2%;
    }
    #informationBlock #facebookBox {
      width: 45%;
      padding: 2%;
      }
      #informationBlock #facebookBox #facebook {
        width: 100%;
      }

}
/* --------------------------------------------------
 *  スマートフォン
 * -------------------------------------------------- */
@media screen and (max-width: 640px) {


/****************************************
 *  ◆  COMMON
*****************************************/

#contentsArea {
  background: none;
  }
  #contentsArea #contents {
    padding-top: 0;
  }

  .section {
    widht: 100%;
    }
    .section .sectionInner {
      width: 100%;
      margin: 0 auto;
    }



/****************************************
 *  ◆  MAIN BLOCK
*****************************************/

  #mainVisualSection {
    width: 100%;
    }
    #mainVisualSection #mainVisual {
    }


    /*----- PICK UP NEWS BLOCK -----*/
    #mainVisualSection #pickupNewsBlock {
      width: 100%;
      background-color: #FFF;
      }
      #mainVisualSection #pickupNewsBlock #pickupNewsBox {
        position: relative;
        width: 96%;
        margin: 0 auto;
        padding: 2% 0;
      }
        #mainVisualSection #mainVisual .bx-wrapper {
          margin: 0 auto !important;
          padding: 0;
          *zoom: 1;
          }
          #mainVisualSection #mainVisual .bx-wrapper img {
            display: inline !important;
          }
          #mainVisualSection #mainVisual .bx-wrapper .bx-viewport {
            left: 0;
            border: none;
            box-shadow: none;
            background: none;
          }

      /*SLIDE SETTING*/
      #pickupNewsBlock #pickupNewsBox .bx-wrapper .bx-viewport {
        border: none;
        box-shadow: none;
        left: 0;
        background: none !important;
      }

      #mainVisualSection #pickupNewsBlock #pickupNewsBox #pickupIcon {
        position: absolute;
        z-index: 999;
        display: inline-block;
        top: 7%; left: 0;
        width: 30%;
      }

      #mainVisualSection #pickupNewsBlock #pickupNewsBox #pickupDate {
        padding: 1% 0 0 33%;
        color: #172A88;
        font-size: 80%;
        font-weight: bold;
      }

      #mainVisualSection #pickupNewsBlock #pickupNewsBox #pickupTitle {
        display: block;
        padding: 3% 2%;
        font-size: 90%;
        font-weight: bold;
        color: #172A88;
        }
        #mainVisualSection #pickupNewsBlock #pickupNewsBox #pickupTitle a {
          color: #172A88;
          line-height: 1.6;
          text-decoration: underline;
        }
        #mainVisualSection #pickupNewsBlock #pickupNewsBox #pickupTitle span {
          display: inline-block;
          width: 20%;
          padding: 1% 0 0 1em;
          vertical-align: bottom;
        }




/****************************************
 *  ◆ CAMPAIGN BANNER BLOCK
*****************************************/

  /*
   *  CAMPAIGN BANNER BLOCK
   *--------------------------------------------------------*/
  #campaignBnrBlock {
    margin-bottom: 3%;
    }

    #campaignBnrBlock .bx-wrapper .bx-viewport {
      left: 0;
      border: none;
      background: none;
      box-shadow: none;
    }

    #campaignBnrBlock .bx-wrapper {
      max-width: 100% !important;
      margin: 0 auto !important;
      padding: 0;
      *zoom: 1;
    }

    #campaignBnrBlock .bx-wrapper .bx-pager,
    #campaignBnrBlock .bx-wrapper .bx-controls-auto {
      display: none;
      position: absolute;
      width: 50%;
    }

    #campaignBnrBlock .bx-wrapper .bx-controls-direction a.disabled,
    #campaignBnrBlock .bx-wrapper .bx-controls-direction a.disabled {
      display: none;
    }


  /*
   *  CAMPAIGN BANNER LIST BLOCK
   *--------------------------------------------------------*/

  /*サムネイル一覧*/
  #campaignBnrListBlock {
    display: none;
    }


	#topPickupCarsBlock {
    margin-bottom: 0;
  }

  .campaignBnr .clearfix {
    display: -webkit-flex;
    display: -moz-flex;
    display: -ms-flex;
    display: -o-flex;
    display: flex;
    -webkit-flex-wrap: wrap;
    -moz-flex-wrap: wrap;
    -ms-flex-wrap: wrap;
    -o-flex-wrap: wrap;
    flex-wrap: wrap;
    justify-content: space-between;
  }

  .campaignBnr .clearfix li {
    width: calc(100% / 2);
  }
  #topPickupCarsBlock #limitedCarsListBox .carImg {
     height: 100%;
}


/****************************************
 *  ◆ INFORMATION BLOCK
*****************************************/


  #informationBlock {
    width: 100%;
    }

    #informationBlock .informationBox {
      width: 90%;
      margin: 0 auto;
      padding: 5% 5% 17%;
      background: url(../img/sp/top/info_back.png) left top repeat-x;
      }
      #informationBlock .informationBox .titleBox {
        position: relative;
        text-align: left;
        margin-bottom: 5%;
        }
        #informationBlock .informationBox .titleBox h3 {
          padding: 1% 0;
        }
        #informationBlock .informationBox .titleBox .sub {
          position: absolute;
          top: 50%; right: 0;
          font-family: 'ヒラギノ明朝 Pro W3', 'HiraMinPro-W3', '游明朝', 'YuMincho', 'HG明朝E', 'メイリオ', 'Meiryo', serif !important;
          font-size: 100%;
          font-weight: bold;
          line-height: 1.2;
          color: #FFF;
          -webkit-transform: translateY(-50%);
          -ms-transform: translateY(-50%);
          transform: translateY(-50%);
        }


    /*NEWS BOX*/
    #informationBlock #newsBox {
      position: relative;
      }
      #informationBlock #newsBox .newsList {
        width: 94%;
        margin: 0 auto;
        padding: 5% 0;
        border-bottom: dashed 1px rgba(255, 255, 255, 0.3);
        }
        #informationBlock #newsBox .newsList dt {
          margin-bottom: 2%;
          font-size: 90%;
          color: #FFF;
        }
        #informationBlock #newsBox .newsList dt .iconNew {
          padding-left: 1em;
        }
        #informationBlock #newsBox .newsList dd {
          font-size: 100%;
          line-height: 1.6;
          color: #FFF;
          }
          #informationBlock #newsBox .newsList dd a {
            color: #FFF;
            text-decoration: underline;
          }
      #informationBlock #newsBox .btn {
        position: absolute;
        left: 8%; bottom: 2%;
      }

    /*FACEBOOK BOX*/
    #informationBlock #facebookBox {
      display: none;
    }



/****************************************
 *  ◆  INSTAGRAM SECTION
*****************************************/

  #instagramSection {
    width: 100%;
    background-color: #171C61;
    }
    #instagramSection .sectionInner {
      width: 100%;
      padding: 5% 0;
      }

      #instagramSection .sectionInner h3 {
        width: 70%;
        margin: 0 auto 3%;
        text-align: center;
      }

    #instagramSection .sectionInner #instagramBox {
      }
      #instagramSection .sectionInner #instagramBox .sb_instagram_header {
        display: none;
      }

    .mb_0 {
      margin-bottom:0!important;
    }




}