@charset "utf-8";

html, body {
  width:100%;
  min-width:1000px;
  height:auto;
  min-height:100%;
  background:#fff;
  font-family: YakuHanJP, "Hiragino Sans", Meiryo, sans-serif;
  /*font-family: "游明朝",YuMincho,"ヒラギノ明朝 ProN W3","Hiragino Mincho ProN","HG明朝E","メイリオ",Meiryo,sans-serif;*/
}

a {
  -webkit-transition: 0.5s;
  -moz-transition: 0.5s;
  -o-transition: 0.5s;
  -ms-transition: 0.5s;
  transition: 0.5s;
}

.fancybox-inner {
     overflow:hidden !important;
}

#pagetop,
#toppage {
  position:fixed;
  width:auto;
  height:50px;
  cursor:pointer;
  z-index:9000;
  -webkit-transition: 0.5s;
  -moz-transition: 0.5s;
  -o-transition: 0.5s;
  -ms-transition: 0.5s;
  transition: 0.5s;
}

#pagetop {
  bottom:10px;
  right:10px;
}
#toppage {
  top:10px;
  left:10px;
}

#pagetop:hover,
#toppage:hover {
  opacity:0.3;
}

#pagetop img,
#toppage img {
  height:100%;
}


.wrapper {
  width:100%;
  min-height:100%;
}

.content {
  position:relative;
  width:100%;
  padding:0;
  text-align:center;
  background:#c7161e;
  color:#fff;
}


.content img {
  display:block;
  width:100%;
}



.slider {
  display:none;
}
.slider.slick-initialized {
  display: block;
}



.head {
  position:relative;
}

.head h1 {
  position:absolute;
  top:16%;
  left:33.825%;
  width:32.35%;
}

.head .item {
  position:absolute;
  top:42%;
  left:35%;
  width:30%;
}

.head h2 {
  position:absolute;
  top:75%;
  left:0;
  width:100%;
  font-family: 'Graduate', cursive;
  font-size:24px;
  color:#fff100;
  text-align:center;
}

.head .pnav {
  position:absolute;
  bottom:1.5%;
  left:25.5%;
  width:49%;
  text-align:center;
}

.head .pnav a {
  display:inline-block;
  width:32%;
  margin-left:2%;
  -webkit-transition: 0.3s;
  -moz-transition: 0.3s;
  -o-transition: 0.3s;
  -ms-transition: 0.3s;
  transition: 0.3s;
}

.head .pnav a:nth-of-type(3n + 1) {
  margin-left:0;
}

.head .pnav a:hover {
  transform: rotate(-10deg);
}


.head .cloud {
  position:absolute;
  top:29%;
  left:23.8%;
  width:15.75%;
  animation: pulse 2s ease -1s infinite alternate;
}



.intro {
  position:relative;
  padding:100px 0 0;
  background:url(../img/bg_wave.png) center top;
}

.intro h2 {
  width:22%;
  margin:0 auto;
}

.intro h2 img {
  transform: rotate(-5deg)
}

.intro .nakai {
  float:left;
  width:24.35%;
}

.intro .sasaki {
  float:right;
  width:24.35%;
}

.intro .sensu {
  position:absolute;
  top:23%;
  left:14%;
  width:12.2%;
}

.intro h4 {
  width:45.9%;
  margin:2% auto 1.5%;
}
.intro h3 {
  width:44.45%;
  margin:0 auto;
}

.intro .sliderSet {
  width:50%;
  margin:2.5% auto 0;
  overflow:hidden;
}

.intro .sliderSet h5 {
  margin:0 0 2%;
  font-size:2.1vw;
  font-weight:700;
  color:#fff100;
}

.intro .sliderSet .tx {
  text-align:left;
  font-size:1.3vw;
  line-height:1.7em;
}

.intro .switch {
  margin-top:3%;
  text-align:center;
}

.intro .switch .num {
  display:inline-block;
  width:30px;
  height:30px;
  margin:0 5px;
  line-height:30px;
  font-family: 'Graduate', cursive;
  font-size:20px;
  text-align:center;
  cursor:pointer;
  border:1px solid #fff;
}

.intro .switch .num:hover,
.intro .switch .num.active {
  background:#fff;
  color:#e60012;
}

.intro .photoSet {
  position:relative;
  clear:both;
  padding:0 0 50px;
  text-align:left;
  background:url(../img/bg_gold.jpg) center top no-repeat;
  background-size:100% auto;
  z-index:2;
}

.intro .photoSet .ph {
  position:relative;
  display:inline-block;
  vertical-align:middle;
  box-shadow:5px 5px 5px rgba(0,0,0,0.2);
}

.intro .photoSet .ph:nth-of-type(1) {
  width:22%;
  margin-top:-0.5%;
  z-index:2;
}

.intro .photoSet .ph:nth-of-type(2) {
  width:24%;
  margin-top:-6.5%;
  margin-left:-2%;
  z-index:3;
}

.intro .photoSet .ph:nth-of-type(3) {
  width:21%;
  margin-top:-1.2%;
  margin-left:-2%;
  z-index:4;
}

.intro .photoSet .ph:nth-of-type(4) {
  width:20%;
  margin-top:-7%;
  margin-left:-2%;
  z-index:5;
}

.intro .photoSet .ph:nth-of-type(5) {
  width:22%;
  margin-top:-1.2%;
  margin-left:-3%;
  z-index:6;
}


.story {
  position:relative;
  padding:100px 0;
  background:url(../img/bg_hexa.png) center top;
}

.story h2 {
  width:22%;
  margin:0 auto;
}

.story h2 img {
  transform: rotate(5deg)
}

.story .sliderSet {
  width:66%;
  margin:0 auto;
}

.story .paper {
  margin:30px 0 0;
  padding:8.5% 10% 5%;
  box-sizing:border-box;
  background:url(../img/bg_paper.png) center center no-repeat;
  background-size:100% 100%;
}

.story h3 {
  width:94%;
  margin:0 auto;
}

.story h4 {
  width:82%;
  margin:5% auto;
}

.story .tx {
  text-align:left;
  color:#000;
  font-size:1.3vw;
  line-height:1.7em;
}

.story .photoSet {
  margin:40px 0 0;
}

.story .ph {
  display:inline-block;
  width:40%;
  margin:2%;
}

.story .switch {
  margin-top:3%;
  text-align:center;
}

.story .switch .num {
  display:inline-block;
  width:30px;
  height:30px;
  margin:0 5px;
  line-height:30px;
  font-family: 'Graduate', cursive;
  font-size:20px;
  text-align:center;
  cursor:pointer;
  border:1px solid #fff;
}

.story .switch .num:hover,
.story .switch .num.active {
  background:#fff;
  color:#4d6b33;
}

.story .cloud1 {
  position:absolute;
  top:7.2%;
  right:12%;
  width:18.3%;
  animation: pulse 2s ease -1s infinite alternate;
}

.story .cloud2 {
  position:absolute;
  top:50%;
  left:2.5%;
  width:20%;
  animation: pulse 2s ease -1s infinite alternate;
}

.story .cloud3 {
  position:absolute;
  top:77%;
  right:4%;
  width:20.35%;
  animation: pulse 2s ease -1s infinite alternate;
}




.chara {
  position:relative;
  padding:100px 0 0;
  background:url(../img/bg_arrow.png) center top;
}

.chara h2 {
  width:22%;
  margin:0 auto;
}

.chara h2 img {
  transform: rotate(-8deg)
}

.chara .diagramSet {
  position:relative;
  width:100%;
  padding:0 0 120px;
}

.chara .diagram {
  position:relative;
  width:52%;
  margin:50px auto 0;
  z-index:2;
}

.chara .cloud1 {
  position:absolute;
  top:-4%;
  right:6%;
  width:14.75%;
  animation: pulse 2s ease -1s infinite alternate;
  z-index:1;
}

.chara .cloud2 {
  position:absolute;
  top:36%;
  left:8%;
  width:11.15%;
  animation: pulse 2s ease -1s infinite alternate;
  z-index:1;
}

.chara .cloud3 {
  position:absolute;
  top:57%;
  left:17%;
  width:15.65%;
  animation: pulse 2s ease -1s infinite alternate;
  z-index:1;
}

.chara .cloud4 {
  position:absolute;
  top:59%;
  right:9%;
  width:12.85%;
  animation: pulse 2s ease -1s infinite alternate;
  z-index:1;
}

.chara .cloud5 {
  position:absolute;
  top:77%;
  left:10%;
  width:10.55%;
  animation: pulse 2s ease -1s infinite alternate;
  z-index:1;
}

.chara .cloud6 {
  position:absolute;
  bottom:0;
  left:0;
  width:21.5%;
  z-index:1;
}

.chara .cloud7 {
  position:absolute;
  bottom:0;
  right:0;
  width:33.15%;
  z-index:1;
}

.chara .photoSet {
  padding-top:12px;
  background:url(../img/bg_gold.jpg) center top no-repeat;
  background-size:100% auto;
}

.chara .photoSet .ph {
  display:inline-block;
  width:32.66%;
  margin-left:1%;
  margin-bottom:8px;
}
.chara .photoSet .ph:nth-of-type(3n + 1) {
  margin-left:0;
}




.pnote {
  position:relative;
  padding:120px 0 0;
  background:url(../img/bg_wave.png) center top;
}

.pnote h2 {
  width:22%;
  margin:0 auto;
}

.pnote h2 img {
  transform: rotate(8deg)
}

.pnote dl {
  width:49.5%;
  margin:80px auto 0;
}

.pnote dt {
  cursor:pointer;
}

.pnote dd {
  position:relative;
  display:none;
  margin-top:-2px;
  padding:30px 11%;
  box-sizing:border-box;
  text-align:left;
  color:#000;
  font-size:1.3vw;
  line-height:1.7em;
  background:url(../img/pnote_role_bg1.jpg) no-repeat;
  background-size:93% auto;
  background-position: 48% 100%;
  overflow:hidden;
}

.pnote dl:nth-of-type(2) dd {
  background:url(../img/pnote_role_bg2.jpg) no-repeat;
  background-size:93% auto;
  background-position: 48% 100%;
}

.pnote dl:nth-of-type(3) dd {
  background:url(../img/pnote_role_bg3.jpg) no-repeat;
  background-size:93% auto;
  background-position: 48% 100%;
}

.pnote dl:nth-of-type(4) dd {
  background:url(../img/pnote_role_bg4.jpg) no-repeat;
  background-size:93% auto;
  background-position: 48% 100%;
}

.pnote dd .close {
  width:80px;
  height:30px;
  margin:40px auto 0;
  cursor:pointer;
}
.pnote dd .close img {
  width:60px;
  margin:10px;
}

.pnote dd .photoSet {
  width:100%;
  margin:20px auto;
}

.pnote dd .photoSet:after {
    content:" ";
    display:block;
    clear:both;
}

.pnote dd .ph {
  float:left;
  width:48%;
  margin:0 0 0 4%;
  color:#fff;
  font-size:1.1vw;
  text-align:right;
}

.pnote dd .ph:nth-of-type(1) {
  margin:0;
}


.sakai_futa {
  display:block;
  width:100%;
  height:5px;
  margin-top:80px;
  background:url(../img/bg_sakai.png) center top repeat-x;
}


.sakai {
  position:relative;
  margin:0;
  padding:0;
  background:rgba(0,0,0,0.15);
}

.sakai .inner {
  padding:120px 0;
}

.sakai .inner > img {
  width:50%;
  margin:0 auto;
}

.sakai h1 {
  width:50%;
  margin:0 auto 30px;
}
.sakai h1 img {
  width:32%;
}

.sakai h2 {
  width:50%;
  margin:40px auto 30px;
}
.sakai h2 img {
  width:28.9%;
  transform: rotate(0deg)
}

.sakai .tx {
  width:50%;
  margin:0 auto 40px;
  text-align:left;
  font-size:1.3vw;
  line-height:1.7em;
}

.sakai .photoSet {
  width:50%;
  margin:0 auto;
}

.sakai .photoSet:after {
    content:" ";
    display:block;
    clear:both;
}

.sakai .ph {
  float:left;
  width:48%;
  margin:0 0 0 4%;
  color:#fff;
  font-size:1.1vw;
  text-align:right;
}

.sakai .ph:nth-of-type(1) {
  margin:0;
}

.sakai .ph img {
  margin:0 0 10px;
}



.staff {
  position:relative;
  padding:120px 0;
  background:url(../img/bg_arrow_green.png) center top;
}

.staff h2 {
  width:22%;
  margin:0 auto;
}

.staff h2 img {
  transform: rotate(5deg)
}

.staff h3 {
  margin:0 0 30px;
}

.staff .tx {
  color:#fff;
  text-align:left;
  font-size:1.3vw;
  line-height:1.7em;
}

.staff .person,
.staff .personPh {
  width:50%;
  margin:80px auto 0;
}

.staff .personPh:after {
    content:" ";
    display:block;
    clear:both;
}

.staff .personPh .tx {
  float:left;
  width:48%;
}

.staff .personPh .ph {
  float:right;
  width:48%;
}

.staff .personPh .ph .info {
  margin-top:0.5em;
  font-size:1.2vw;
  text-align:left;
}

.staff .personPh .ph .info a {
  color:#fff;
}
.staff .personPh .ph .info a:hover {
  color:#ff0;
}

.staff .personPh .ph .info span {
  display:inline-block;
  padding:0 0 0.3em;
  border-bottom:rgba(255,255,255,.7);
}


.staff .p1 h3 img,
.staff .p2 h3 img,
.staff .p3 h3 img {
  width:24.6%;
}

.staff .p4 h3 img {
  width:28.2%;
}

.staff .p5 h3 img {
  width:87.7%;
}

.staff .cloud1 {
  position:absolute;
  top:0;
  left:0;
  width:36.35%;
}

.staff .cloud2 {
  position:absolute;
  top:2%;
  right:0;
  width:19.25%;
}

.staff .cloud3 {
  position:absolute;
  bottom:0;
  left:0;
  width:23.85%;
}

.staff .cloud4 {
  position:absolute;
  bottom:0;
  right:0;
  width:25%;
}



.landscape {
  position:relative;
  background:#fff;
  overflow:hidden;
}

.landscape .roadshow {
  position:absolute;
  top:45%;
  left:35%;
  width:30.3%;
}

.landscape .cover {
  position:absolute;
  bottom:0;
  left:0;
}













@media screen and (max-width:1000px) {
  .intro .sliderSet h5 {
    font-size:20px;
  }
  
  .intro .sliderSet .tx,
  .story .sliderSet .tx,
  .pnote dd,
  .sakai .tx,
  .staff .tx ,
  .profSet .tx {
    font-size:13px;
  }
  
  .sakai .ph {
    font-size:11px;
  }

}



.staffs {
  max-width:2000px;
  margin:0 auto;
  padding:2em 3em;
  box-sizing:border-box;
  text-align:center;
  color:#cc121f;
  font-size:.9vw;
  line-height:1.6em;
}
.staffs img {
  display:inline-block;
  height:0.8em;
  margin:0.2em 0 0 0.5em;
  vertical-align:baseline;
}

.staffs > span {
  font-family:Meiryo, sans-serif;
}

.copyright {
  font-size:0.9vw;
  font-weight:300;
  text-align:center;
  color:#cc121f;
}

