@charset "UTF-8";
/* =================================================== *

    ページ全体

 * =================================================== */
body{
  
}
/*
body:not( .loaded ) * {
  -webkit-transition: none !important;
  -moz-transition: none !important;
  -ms-transition: none !important;
  -o-transition: none !important;
  transition: none !important;
}
*/

html.fix, body.fix {
  width: 100%;
  height: 100%;
  position: fixed;
}
html.fix {
  overflow-y: scroll;
}
.content1180 {
  width: 100%;
  max-width: 1180px;
  margin-right: auto;
  margin-left: auto;
  position: relative;
}


@media screen and (max-width: 1200px) {
  .content1180 {
    padding-left: 15px;
    padding-right: 15px;
  }  
}
@media screen and (max-width: 767px) {
  .content1180 {
    padding-left: 5%;
    padding-right: 5%;
  }
}

/* =================================================== *

   ヘッダ

 * =================================================== */




/* =================================================== *

  ページ部品 パネルデザイン共通

 * =================================================== */
.panel {
  position: relative;
  width:100%;
}
.panel.mb20 {
  margin-bottom:20px;
}
.panel.mb30 {
  margin-bottom:30px;
}
.panel.mb40 {
  margin-bottom:40px;
}
.panel.mb50 {
  margin-bottom:50px;
}
.panel.mb60 {
  margin-bottom:60px;
}
.panel.mb70 {
  margin-bottom:70px;
}
.panel.mb80 {
  margin-bottom:80px;
}
.panel.mb90 {
  margin-bottom:90px;
}
.panel.mb100 {
  margin-bottom:100px;
}
.panel .text {
  line-height:2;
}
@media screen and (max-width: 767px) {
  
  .panel.mb20 {
    margin-bottom:10px;
  }
  .panel.mb30 {
    margin-bottom:15px;
  }
  .panel.mb40 {
    margin-bottom:20px;
  }
  .panel.mb50 {
    margin-bottom:25px;
  }
  .panel.mb60 {
    margin-bottom:30px;
  }
  .panel.mb70 {
    margin-bottom:35px;
  }
  .panel.mb80 {
    margin-bottom:40px;
  }
  .panel.mb90 {
    margin-bottom:45px;
  }
  .panel.mb100 {
    margin-bottom:50px;
  }
}

/* =================================================== *

   ページ部品

 * =================================================== */



/* =================================================== *

   トップページ

 * =================================================== */
#top-mainvisual {
    height: 100vh;
    width: 100%;
    position: relative;
    overflow: hidden;
}
#top-mainvisual > .slide {
    position: absolute;
    width: 100%;
    height: 100%;
    top: 0;
    left: 0;
    z-index: 0;
    padding: 0 50px;
}
#top-mainvisual > .slide > .bg {
  position:absolute;
  width:100%;
  height:100%;
  top: 0;
  left: 0;
  z-index: 0;
}
#top-mainvisual > .slide > .inner {
   width: 100%;
  position: relative;
  z-index: 1;
}

#top-mainvisual > .slide.show {
  z-index: 10;
}
#top-mainvisual > .slide.standby{
  z-index:9;
}
#top-mainvisual > .slide.moving > .inner {
  display: none;
}

#top-mainvisual > .slide.yellow {
  color:#000000;
}
#top-mainvisual > .slide.yellow > .bg {
  background: #FFF10F;
}
#top-mainvisual > .slide.black {
  color:#FFFFFF;
}
#top-mainvisual > .slide.black > .bg {
  background: #000000;
}

#top-mainvisual > .slide .clogo {
    width: 28.125vw;
    margin-top: 3vw;
}
#top-mainvisual > .slide .jlogo {
    width: 16.4vw;
    margin-top: 3vw;
}
#top-mainvisual > .slide .navmenu-wrap {
    position: absolute;
top: 4vw;
right: 40px;
  display: none;
}
#top-mainvisual > .slide .navmenu-wrap .navmenu {
    text-align: right;
}
#top-mainvisual > .slide .navmenu-wrap .navmenu > li {
    font-size: 20px;
    font-weight: 500;
margin-bottom: .4em
}

#top-mainvisual > .slide.yellow .navmenu-wrap .navmenu > li > a  {
  color:#000000;
}
#top-mainvisual > .slide.yellow .navmenu-wrap .navmenu > li > a :hover {
  color: orange;
}

#top-mainvisual > .slide.black .navmenu-wrap .navmenu > li > a  {
  color:#ffffff;
}
#top-mainvisual > .slide.black .navmenu-wrap .navmenu > li > a :hover {
  color: yellow;
}
.top-footer {
    position: absolute;
    bottom: 30px;
    right: 50px;
    z-index: 1;
}
.top-footer .copyright {
  margin-bottom: 0;
  font-size: 1.1rem;
}
#top-mainvisual > .slide.yellow .top-footer .copyright  {
  color:#000000;
}
#top-mainvisual > .slide.black .top-footer .copyright  {
  color:#ffffff;
}
.custom-rotate {
    display: block;
    overflow: hidden;
    height: 1.5em;
      line-height: 1.5;

}
.custom-rotate > span {
    display: inline-block;
    /* width: 1em; */
    text-align: center;
  height: 1.5em;
   transition: transform 1s ease;
  /* line-break: normal;
  word-break:break-all; */
  /* white-space: pre; */
  opacity:0;
  transition: opacity .4s ease;
}

/*.custom-rotate > span.start {
   transform: translateY(1.5em) !important;
}
.custom-rotate > span.end-1 {
    transform: translateY(-1.5em);
}
.custom-rotate > span.end-2 {
    transform: translateY(-3em);
}
.custom-rotate > span.end-3 {
    transform: translateY(-4.5em);
}
.custom-rotate > span.end-4 {
    transform: translateY(-6em);
}
.custom-rotate > span.end-5 {
    transform: translateY(-7.5em);
}
.custom-rotate > span.end-6 {
    transform: translateY(-9em);
}
.custom-rotate > span.end-7 {
    transform: translateY(-10.5em);
}
.custom-rotate > span.end-8 {
    transform: translateY(-12em);
}
.custom-rotate > span.end-9 {
    transform: translateY(-13.5em);
}
.custom-rotate > span.end-10 {
    transform: translateY(-15em);
}
.custom-rotate > span.end-11 {
    transform: translateY(-16.5em);
}
.custom-rotate > span.end-12 {
    transform: translateY(-18em);
}
*/

.custom-rotate > span.on {
  opacity:1;
}



@media screen and (max-width: 1200px) {
  #top-mainvisual > .slide {
    padding: 0 20px;
  }
  #top-mainvisual > .slide .navmenu-wrap {
    right: 10px;
  }
  #top-mainvisual > .slide .navmenu-wrap .navmenu > li {
    font-size: 16px;
  }
  
  
}

@media screen and (max-width: 767px) {
  #top-mainvisual > .slide {
    padding: 0 5%;
  }
  #top-mainvisual > .slide .clogo {
    width: 70%;
    margin-left: auto;
    margin-right: auto;
    margin-top: 10vw;
  }
  #top-mainvisual > .slide .jlogo {
    width: 55%;
    margin-top: 10vw;
    margin-left: auto;
    margin-right: auto;
}
#top-mainvisual > .slide .navmenu-wrap {
    position: relative;
    right: 5%;
    margin-top: 30px;
  }
  #top-mainvisual > .slide .navmenu-wrap .navmenu > li {
    font-size: 16px;
    margin-bottom: 20px;
  }
  
  .top-footer {
    bottom: 15px;
    right: 5%;
  }
}


#top-mainvisual > .slide .navmenu-wrap .navmenu > li:last-child:before {
    content: '';
    display: block;
    width: 20px;
    height: 2px;
    background: gray;
    margin-left: auto;
    margin-top: 15px;
    margin-bottom: 13px;
    margin-right: 0;
}
#header .con_header #menu ul li.nav_tora:before {
    content: ' ';
    background: #000;
    width: 1px;
    height: 15px;
    display: inline;
    position: absolute;
    left: -14px;
    top: 15px;
}
/* =================================================== *

   表示切り替え

 * =================================================== */
.sp-only {
  display:none;
}

@media screen and (max-width: 767px) {
  .pc-only {
    display: none !important;
  }
  .sp-only {
    display:block;
  }
}