@charset "utf-8";
/* =============================================================================
   base
   ========================================================================== */
main { display: block; }
html { background: #fff; color: #000; font-size: 62.5%; line-height: 1.5; }
body { font-family: "Times New Roman", Garamond, serif; text-align: center; -webkit-tap-highlight-color: rgba(0,0,0,0); -webkit-font-smoothing: antialiased; -moz-osx-font-smoothing: grayscale; }
body, div, section, header, footer, nav, article, aside, main, dl, ul, p, a, :after, :before { backface-visibility: hidden; }
a { color: #000; border: 0; background-color: transparent; overflow: hidden; text-decoration: none; }
a:hover,
a:active { outline: 0; }
table { border-collapse: collapse; border-spacing: 0; }
img { border: 0; vertical-align: bottom; line-height: 0px; }
h1, h2, h3, h4, h5, h6 { font-size: 100%; font-weight: normal; }
ol, ul { list-style-type: none; }
em, strong { font-weight: bold; font-style: normal; }


img { max-width: 100%; height: auto; }
svg { max-width: 100%; }
img[src$=".svg"] { max-width: 100%; }

/* ::selection {background: #a1a1a1; }
::-moz-selection {background: #a1a1a1; } */

.is-sp a,
.is-sp input[type="button"],
.is-sp input[type="submit"],
.is-tab a,
.is-tab input[type="button"],
.is-tab input[type="submit"]  {
    -webkit-tap-highlight-color: rgba(0,0,0,.2);
}
/* =============================================================================
   layout
   ========================================================================== */
   #l-body{
      width: 100%;
   }
   #l-wrapper{
      position: relative;
      z-index: 0;
   }
   #l-main{
      position: relative;
      z-index: 2;
   }

@media only screen and (max-width: 1024px) {
   #l-wrapper {
   }
 }
 @media screen and (max-width: 768px) {
   #l-wrapper {
     padding-top: calc(120/768*100vw);

   }
 }
 @media only screen and (max-width: 640px) {
   #l-wrapper {
   }
 }

 #l-header{
   width: 100%;
 }

/* =============================================================================
   utility
   ========================================================================== */
.u-section { max-width: 1080px; width: calc(650/750*100%); margin: 0 auto; text-align: left; }

.u-pcNone { display: none; }
@media only screen and (max-width: 768px) {
  .u-spNone { display: none; }
  .u-pcNone { display: block; }
}

@media only screen and (min-width: 768px) {
  .is-pc .u-target { transition: opacity .3s; }
  .is-pc .u-target:hover { opacity: .6; }
}

.u-bg {
   background-repeat: no-repeat;
   background-position: center center;
   background-size: cover;
 }

.u-target {
   -webkit-transition: opacity .3s;
   transition: opacity .3s
}

.u-target:hover {
   opacity: .6
}


/* =============================================================================
   component
   ========================================================================== */
/* フレックスボックス */
.c-flex{
   display: flex;
   -webkit-box-pack: justify;
   -ms-flex-pack: justify;
   justify-content: space-between;
   -webkit-box-align: start;
   -ms-flex-align: start;
   align-items: flex-start;
 }
/* サブタイトル */
 .c-subtitle{
    font-size: calc(30/1920*100vw);
    font-weight: bold;
    padding: 0 10px;
    margin: 0 auto calc(80/1920*100vw);
    border-left: 1px solid #e2af00;
    border-right: 1px solid #e2af00;
    display: inline-block;
    line-height: 1.1em;
 }
 /* キャプション */
 .c-caption{
   font-size: 18px;
   font-size: calc(18/1920*100vw);
   line-height: 1.6em;
   padding: 0 calc(15/1920*100vw);
   margin: calc(20/1920*100vw) 0 calc(40/1920*100vw) ;
   border-left: 1px solid #ccc;
 }    
 /* 余白 */
.c-blockbtm{
   margin-bottom:calc(110/1920*100vw);
}
.c-titlebtm{
   margin-bottom:calc(75/1920*100vw);
}
.c-secbtm{
   margin-bottom:calc(90/1920*100vw);
}
@media only screen and (max-width: 1024px) {
   .c-subtitle{
      font-size: 30px;
   }
   .c-caption{
      font-size: 18px;
      padding: 0 calc(15/1024*100vw);
      margin: calc(10/1024*100vw) 0 calc(30/1024*100vw) ;
   }    
  
   .c-blockbtm{
      margin-bottom:calc(110/1024*100vw);
   }
   .c-titlebtm{
      margin-bottom:calc(75/1024*100vw);
   }
   .c-secbtm{
      margin-bottom:calc(90/1024*100vw);
   }
}
 @media only screen and (max-width: 768px) {
   .c-flex{
      -ms-flex-wrap: wrap;
      flex-wrap: wrap;
  }
   .c-subtitle{
      font-size: 30px;
   }
   .c-caption{
      font-size: 18px;
      padding: 0 calc(15/750*100vw);
      margin: calc(10/750*100vw) 0 calc(30/750*100vw) ;
   }  
   .c-blockbtm{
      margin-bottom:calc(55/750*100vw);
   }
   .c-titlebtm{
      margin-bottom:calc(35/750*100vw);
   }
   .c-secbtm{
      margin-bottom:calc(45/750*100vw);
   }

 }
/* =============================================================================
   common module
   ========================================================================== */
/* header */
.cm-h{
   width: 100%;
   height: calc(809/1920*100vw);
   background: url(../../assets/images/top/header_bg.jpg);
   background-repeat: no-repeat;
   background-position: top center;
   background-size: contain;
   color: #fff;
   position: relative;
}
.cm-h__nav{
   display: flex;
   -webkit-box-pack: end;
     -ms-flex-pack: end;
   justify-content: flex-end;
}
.cm-h__navList{
   display: flex;
   -webkit-box-pack: end;
     -ms-flex-pack: end;
   justify-content: flex-end;
   padding-top: calc(14em/16);
   padding-right: calc(14em/16);
   font-size: 14px;
   line-height: 2.6em;
}

/* 多言語プルダウン */
.cm-h__navLang {
   position: relative;
   margin-top: calc(10em/14);
   margin-right: calc(10em/14);
   font-size: 14px;
   color: #000;
   &::before {
      content: "▼";
      display: block;
      position: absolute;
      top: 50%;
      right: calc(10em/12);
      transform: translate3d(0px, -50%, 0px);
      font-size: calc(12em/14);
      pointer-events: none;
   }
   @media only screen and (max-width: 768px) {
      position: fixed;
      top: 0;
      right: 0;
      z-index: 5;
      display: flex;
      align-items: center;
      margin: 0 calc(100/768*100vw) 0 auto;
      width: calc(140em/16);
      height: calc(120/768*100vw);
      font-size: 16px;
   }
}
.cm-h__navLangBody {
   cursor: pointer;
   text-overflow: ellipsis;
   outline: none;
   background: transparent;
   background-image: none;
   box-shadow: none;
   appearance: none;
   padding: calc(8em/14) calc(32em/14) calc(8em/14) calc(14em/14);
   line-height: 1.5;
   letter-spacing: 0.04em;
   background-color: #fff;
   @media only screen and (max-width: 768px) {
      background-color: transparent;
   }
}

/*ランゲージリンク*/
.cm-h__navList-la{
   font-size: 20px;
   font-weight: bold;
   line-height: 1.0em;
}
.cm-h__navList-la a{
   color: #e2af00;
   text-decoration: none;
}
.cm-h__navList-ac{
   text-decoration: underline;
}

.cm-h__navListItem{
   display: block;
   margin: 0 5px;
}
.cm-h__navListItem::after{
   content: '/';
   margin-left: 5px;
}
.cm-h__navListItem:last-child::after{
   content: '';
}
.cm-h__navListItemTarget{
   color: #fff;
}

.cm-h__title{
   position: absolute;
   top:0;
   right:0;
   bottom:0;
   left: 0;
   margin: auto auto auto 13%;
   display: block;
   height: 25%;
   text-align: left;
}
.cm-h__titleMain{
   display: block;
   font-size: calc(85/1920*100vw);
   font-weight: bold;
   line-height: 1.0em;
}
.cm-h__titleSub{
   display: block;
   font-size: calc(45/1920*100vw);
   line-height: 1.2em;
}
.cm-h__lead{
   position: absolute;
   top:0;
   right:0;
   bottom:0;
   left: 0;
   margin: auto 8% auto auto;
   display: block;
   width: calc(.3*100vw);
   height: calc(.05*100vw);
   padding: 3% 0 0 0;
   text-align: left;
   font-size: calc(18/1920*100vw);
   color: #f6f4ec;
}
@media only screen and (max-width: 1024px) {
   .cm-h__lead{
      font-size: 14px;
   }
   
}

@media only screen and (max-width: 768px) {
   .cm-h{
      background: url(../../assets/images/top/header_bg_sp.jpg);
      height: calc(960/750*100vw);
      background-size: cover;
      background-repeat: no-repeat;
      margin-top: calc(-120/768*100vw);
   }
   .cm-h__title{
      position: fixed;
      top: 0;
      right:0;
      margin: 0;
      color: #000;
      background: #fff;
      height: calc(120/768*100vw);
      z-index: 5;
   }
   .cm-h__titleImg{
      width: calc(50/768*100vw);
      position: absolute;
      top:0;
      right:0;
      bottom:0;
      left: 0;
      margin: auto auto auto calc(10/768*100vw);
   }
   .cm-h__titleMain{
      font-size: calc(44/768*100vw);
      position: absolute;
      top:0;
      right:0;
      bottom:0;
      left: 0;
      margin: calc(30/768*100vw) auto auto calc(70/768*100vw);
      height: calc(30/768*100vw);
      line-height: 1.2em;
   }
   .cm-h__titleSub{
      font-size: calc(22/768*100vw);
      position: absolute;
      top:0;
      right:0;
      bottom:0;
      left: 0;
      margin: calc(75/768*100vw) auto auto calc(70/768*100vw);
      height: calc(20/768*100vw);
      line-height: 1.0em;
   }
   .cm-h__lead{
      width: calc(.3*100vw);
      height: calc(.1*100vw);
      font-size: calc(18/768*100vw);
      margin: auto calc(30/768*100vw) calc(255/768*100vw) auto;
   }

      /*ランゲージリンク*/
      .cm-h__navList{
         position: fixed;    /* bodyに対しての絶対位置指定 */
         right: calc(55/760*100vw);
         top: calc(10/760*100vw);
         z-index: 30;
      }
      .cm-h__navList-la{
         color: #8c8c8c;
      }
      .cm-h__navList-ac{
         text-decoration: underline;
      }
   
}

/* menu */
.cm-h__navBg{
   position: fixed; 
   z-index: 10; 
   top: 0; 
   left: 0; 
   width: 100vw;
   height: 100vh;
   background: #bababa;
   opacity: 0;
   transition: .6s;
   pointer-events: none; /* navBgのポインタの動作を無効化 */
}
.cm-h__navBg.active{
   opacity: .6;
   pointer-events:unset;
}

/*ナビメニューのスタイルを指定*/
.cm-h__navMenu{
   display: block;
   position: fixed; 
   z-index: 20; 
   top: 0; 
   left: calc(300/760*100%); 
   background: #faf9f7;
   color: #000; 
   text-align: left; 
   width: calc(460/760*100%); 
   transform: translateX(+100%); /*ナビを右に隠す*/
   transition: all 0.6s; /*アニメーションの時間を指定*/
}
   
.cm-h__navMenuList{
   width: 100%;
   margin: calc(120/768*100vw) auto 0;
   padding: 0;
}
   
.cm-h__navMenuListItem{
   font-size: 14px;
   list-style-type: none;
   padding: 0;
   width: 100%;
   border-bottom: 1px solid #c9c9c9;
   position: relative;
}
.cm-h__navMenuListItem::after{
   content: '';
   position: absolute;
   top: 0;
   bottom: 0;
   right: 20px;
   margin: auto;
   -webkit-transform: rotate(45deg);
   -ms-transform: rotate(45deg);
   transform: rotate(45deg);
   width: 10px;
   height: 10px;
   border-top: 1px solid #8c8c8c;
   border-right: 1px solid #8c8c8c;
}
   
.cm-h__navMenuListItem:last-child{
   padding-bottom: 0;
   border-bottom: none; /*最後のメニュー項目のみ下線を消す*/
}
   
.cm-h__navMenuListItem a{
   display: block; 
   color: #000;
   padding: 1em 0;
   transition: 0.6s;
   padding-left: calc(45/760*100%);
}
.cm-h__navMenuListItem a:hover{
   /* color: #fff; */
   background: rgba(114, 113, 113, 0.2);
}
   /*トグルボタンが押されたときに付与するクラス*/
   .cm-h__navMenu.active{
      transform: translateY(0%);
   }
/*トグルボタンのスタイルを指定*/
.cm-h__toggle {
   display: block;
   position: fixed;    /* bodyに対しての絶対位置指定 */
   right: calc(10/760*100vw);
   top: calc(10/760*100vw);
   width: 45px;
   height: 45px;
   cursor: pointer;
   z-index: 30;
   border: 1px solid #c9c9c9;
   transition: 0.6s;
}
.cm-h__toggle::after {
   content: 'MENU';
   position: absolute;
   bottom: 2px;
   left: 0;
   right: 0;
   margin: auto;
   color: #acacac;
}
.cm-h__toggle span {
   display: block;
   position: absolute;
   width: 15px;
   border-bottom: solid 1px #ccc;
   -webkit-transition: .35s ease-in-out;	/*変化の速度を指定*/
   -moz-transition: .35s ease-in-out;		/*変化の速度を指定*/
   transition: .35s ease-in-out;			/*変化の速度を指定*/
   left: 15px;
}
.cm-h__toggle span:nth-child(1) {top: 10px;}
.cm-h__toggle span:nth-child(2) {top: 15px;}
.cm-h__toggle span:nth-child(3) {top: 20px;}
/* 最初のspanをマイナス45度に */
.cm-h__toggle.active span:nth-child(1) {
   top: 15px;
   left: 15px;
   -webkit-transform: rotate(-45deg);
   -moz-transform: rotate(-45deg);
   transform: rotate(-45deg);
}
/* 2番目と3番目のspanを45度に */
.cm-h__toggle.active span:nth-child(2),
.cm-h__toggle.active span:nth-child(3) {
   top: 15px;
   -webkit-transform: rotate(45deg);
   -moz-transform: rotate(45deg);
   transform: rotate(45deg);
}







/* footer */
.cm-f{
   width: 100%;
   height: calc(815/1920*100vw);
   background: url(../../assets/images/common/footer_bg.jpg) #e4b73c;
   background-repeat: no-repeat;
   background-position: bottom center;
   background-size: contain;
   color: #000;
   position: relative;
}
.cm-f__page{
   height: calc(454/1920*100vw);
}
.cm-f__link{
   height: calc(380/1920*100vw);
   background: #fff;
   position: relative;
}
.cm-f__linkList{
   margin: 0 auto;
   display: flex;
   -webkit-box-pack: justify;
   -ms-flex-pack: justify;
   justify-content: space-between;
   -webkit-box-align: start;
   -ms-flex-align: start;
   align-items: flex-start;
   -ms-flex-wrap: wrap;
   flex-wrap: wrap;
   width: calc(470/1920*100vw);
}
.cm-f__linkListItem88{
   width: 100%;
   display: inline-block;
   margin-bottom: calc(55/1920*100vw);
   height: calc(140/1920*100vw);
}

.cm-f__linkListItem{
   display: block;
   width: 48%;
}
.cm-f__linkListItemTarget{}

.cm-f__logo{
   position: absolute;
   top:0;
   right:0;
   bottom:0;
   left: 0;
   margin: auto auto calc(50/1920*100vw) auto;
   height: calc(280/1920*100vw);
}
.cm-f__logoTitle{}
.cm-h__logoTitleMain{
   display: block;
   font-size: calc(72/1920*100vw);
   font-weight: bold;
}
.cm-h__logoTitleSub{
   display: block;
   font-size: calc(37/1920*100vw);
}

.cm-f__copy{
   display: block;
   position: absolute;
   top:0;
   right:0;
   bottom:0;
   left: 0;
   margin: auto auto 5px auto;
   width: calc(.3*100vw);
   height: calc(.02*100vw);
   font-size: calc(15/1920*100vw);
}
@media only screen and (max-width: 768px) {
   .cm-f{
      height: calc(800/750*100vw);
      background-size: cover;
   }
   .cm-f__page{
      height: calc(450/750*100vw);
   }
   .cm-f__link{
      height: calc(350/750*100vw);
   }
   .cm-f__linkList{
      height: calc(350/750*100vw);
      width: calc(470/750*100vw);
      padding-top: 0;
   }
   .cm-f__linkListItem{}
   .cm-f__linkListItem:last-child{}
   .cm-f__linkListItemTarget{}

   
   .cm-f__logo{
      height: calc(200/750*100vw);
      margin: auto auto calc(170/750*100vw) auto;
   }
   .cm-f__logoImg{
      width: calc(60/750*100vw);
   }
   .cm-f__logoTitle{}
   .cm-h__logoTitleMain{
      font-size: calc(72/750*100vw);
      line-height: 1.2em;
   }
   .cm-h__logoTitleSub{
      font-size: calc(37/750*100vw);
      line-height: 1.2em;
   }
   .cm-f__copy{
      font-size: calc(10/750*100vw);
      width: 100%;
      height: calc(.02*100vw);
      margin: auto auto 10px auto;
   }

   .cm-f__logoTitle{}
}



/* slide */
.cm-slide__wrap {
   max-width: 1810px;
   width: calc(1810/1920*100vw); 
   margin: 0 auto calc(-60/1920*100vw);
   padding: 0 35px;
   z-index: 90;
   /* overflow: hidden; */
 }
 .cm-slide__wrap .slick-slide {
   /* width: 526px; */
   margin: 0 calc(30/1920*100vw);
   opacity: 1;
 }
 .cm-slide__wrap .slick-slide img {
   width: 526px;
   margin: 0 auto;
   height: auto;
 }
 .cm-slider .slick-next,
 .cm-slider .slick-prev{
   z-index: 99;
   width: calc(50/1920*100vw);
   height: 250px;
   transition: .3s;
 }
 .cm-slider .slick-next{
   right: calc(-35/1920*100vw);
 }
 .cm-slider .slick-prev{
   left: calc(-35/1920*100vw);
 }
 .cm-slider .slick-next::before,
 .cm-slider .slick-prev::before {
   content: "";
 }
 .cm-slider .slick-next::after,
 .cm-slider .slick-prev::after {
   content: "";
   position: absolute;
   top: 0;
   bottom: 0;
   margin: auto;
   width: calc(40/1920*100vw);
   height: calc(40/1920*100vw);
   border-top: 2px solid #ccc;
   border-right: 2px solid #ccc;
 }
 .cm-slider .slick-next::after {
   left: 0;
   right: 5px;
   -webkit-transform: rotate(45deg);
   transform: rotate(45deg);
 }
 .cm-slider .slick-prev::after {
   left: 5px;
   right: 0;
   -webkit-transform: rotate(225deg);
   transform: rotate(225deg);
 }
 .cm-slider .slick-next:hover,
 .cm-slider .slick-prev:hover {
   opacity: .6;
 }
 .cm-slide__wrap .slick-list {
   overflow: hidden;
 }
 .cm-slider {
   /* max-width: 1100px; */
   margin: 0 auto;
 }
 @media only screen and (max-width: 768px) {
   .cm-slide__wrap {
      width: calc(720/750*100vw);
      padding: 0;
   }
   .cm-slide__wrap .slick-slide {
   margin: 0 0px;
   width: 100%;
   }
   .cm-slide__wrap .slick-slide img {width: 100%;}
   .cm-slider .slick-next,
   .cm-slider .slick-prev{
     width: 30px;
     height: 30px;
     background: #fff;
   }
   .cm-slider .slick-next::after,
   .cm-slider .slick-prev::after {
     width: 12px;
     height: 12px;
     border-top: 1px solid #ccc;
     border-right: 1px solid #ccc;
   }
   .cm-slider .slick-next::after {right: 4px;}
   .cm-slider .slick-prev::after {left: 4px;}
   .cm-slider .slick-next{right: 10px;}
   .cm-slider .slick-prev{left: 10px;}
 }