/* reset */

html,body,div,span,applet,object,iframe,h1,h4,h5,h6,p,blockquote,pre,a,abbr,acronym,address,big,cite,code,del,dfn,em,font,img,ins,kbd,q,s,samp,small,strike,strong,sub,sup,tt,var,b,u,i,center,dl,dt,dd,ul,li,fieldset,form,label,legend,table,caption,tbody,tfoot,thead,tr,th,td {border:0;outline:0;vertical-align:baseline;margin:0;padding:0;}

img{vertical-align:bottom;}

body{
*font-size:small;
*font:x-small;
-webkit-text-size-adjust: none;
}

body, textarea { font-size:100%; }
input, select { font-size:100%; }
select,input,button,textarea {font:99% sans-serif}

pre,code,kbd,samp,tt {
*font-size:108%;
line-height:100%;
}

table {
border-collapse:collapse;
border-spacing:0;
font-size:inherit;
font:100%;
}

article, aside, canvas, details, figcaption, figure, footer, header, hgroup, menu, nav, section, summary {display: block}

ul {list-style:none}

blockquote,q {quotes:none}

:focus {outline:0}

ins {text-decoration:none}

del {text-decoration:line-through}

em {font-style:normal}

hr {display:block;height:1px;border:0;border-top:1px solid #cccccc;margin:1em 0;padding:0;}

figure {display:block;margin:0;padding:0;}
svg {line-height:0;}


/* style */
.hero {
  width: 100%;
  height: 800px;
  background:  url(../img/0/bg_left.png) left 50% no-repeat, linear-gradient(-32deg, #ae5d40 30%, #f1df4d);
  background-size: 49.1%, cover;
  position: relative;
  overflow: hidden;
}
@media all and (max-width: 850px) {
  .hero {
    height: inherit;
    background-position: left 90px, right center;
    background-size: 90%, cover;
  }
}

.main-ttl {
  width: 45%;
  position: relative;
  z-index: 100;
  padding: 0 0 0 4.5%;
}
@media all and (max-width: 1200px) {
  .main-ttl {
    padding-bottom: 4.5%;
  }
}
@media all and (max-width: 1090px) {
  .main-ttl {
    padding-bottom: 0;
  }
}
@media all and (max-width: 850px) {
  .main-ttl {
    width: 88%;
    margin-top: -20px;
    padding: 0;
  }
}
.main-ttl img {
  width: 100%;
  display: block;
}

.main-copy {
  width: 10%;
  position: absolute;
  left: 44%;
  top: 16%;
  z-index: 50;
  margin: auto;
}
@media all and (max-width: 1200px) {
  .main-copy {
    top: 30%;
    left: inherit;
    right: 1%;
  }
}
@media all and (max-width: 1090px) {
  .main-copy {
    width: 8%;
    top: 45%;
  }
}
@media all and (max-width: 850px) {
  .main-copy {
    width: 18%;
    top: inherit;
    left: 1%;
    right: inherit;
    bottom: 56px;
  }
}
.main-copy img {
  width: 100%;
  display: block;
}

.gnav {
  width: 124px;
  padding: 1% 1% 0 8.5%;
  position: absolute;
}
.gnav-item {
  margin-top: -15px;
  position: relative;
}
.gnav-item img {
  width: 100%;
}
.gnav-item-01 {
  z-index: 65;
}
.gnav-item-02 {
  z-index: 64;
}
.gnav-item-03 {
  z-index: 63;
}
.gnav-item-04 {
  z-index: 62;
}
.gnav-item-05 {
  z-index: 61;
}
@media all and (max-width: 1090px) {
  .gnav {
    width: 38%;
    padding: 0 0 0 8.5%;
    position: relative;
    overflow: hidden;
  }
  .gnav-item {
    width: 22%;
    float: left;
    margin-top: 0;
    margin-left: -10px;
  }
  .gnav-item img {
    width: 100%;
  }
}
@media all and (max-width: 850px) {
  .gnav {
    width: 100%;  }
  .gnav-item {
    width: 19%;
  }
}

.mini-charas {
  width: 80%;
  margin-top: -15px;
  overflow: hidden;
  padding: 0 0 0 20%;
}
.mini-chara {
  position: relative;
  z-index: 15;
  vertical-align: top;
}
.mini-chara-01 {
  width: 6.5%;
  margin: 1% 5px 0 0;
}
.mini-chara-02 {
  width: 5.7%;
  margin: 3.2% 7px 0px 0;
}
.mini-chara-03 {
  width: 8.2%;
}
.mini-chara-04 {
  width: 5.7%;
  margin: 1% 0 0 5px;
}

.twtl {
  position: relative;
  z-index: 60;
  padding: 0 0 0 20%;
}

@media all and (max-width: 1090px) {
  .mini-charas {
    padding: 15px 0 0 8.5%;
  }
  .twtl {
    padding: 0 0 0 8.5%;
  }
  .mini-chara-01 {
    width: 8.5%;
    margin: 1% 10px 0 0;
  }
  .mini-chara-02 {
    width: 7.7%;
    margin: 3.2% 12px 0px 0;
  }
  .mini-chara-03 {
    width: 10.2%;
  }
  .mini-chara-04 {
    width: 7.7%;
    margin: 1% 0 0 10px;
  }
}
@media all and (max-width: 850px) {
  .mini-charas {
    width: 94%;
    padding: 15px 0 0 3%;
    display: none;
  }
  .twtl {
    width: 300px;
    padding: 0;
    margin: 15px auto 0;
  }
  .mini-chara-01 {
    width: 21.5%;
    margin: 1% 10px 0 0;
  }
  .mini-chara-02 {
    width: 20.7%;
    margin: 3.2% 12px 0px 0;
  }
  .mini-chara-03 {
    width: 26.2%;
  }
  .mini-chara-04 {
    width: 20.7%;
    margin: 1% 0 0 10px;
  }
}

.extend {
  width: 370px;
  display: block;
  position: absolute;
  right: 120px;
  top: 24px;
  z-index: 31;
}
@media all and (max-width: 1120px) {
  .extend {
    right: 80px;
  }
}
@media all and (max-width: 850px) {
  .extend {
    position: relative;
    margin:  auto;
    height: inherit;
    right: inherit;
  }
}

@media all and (max-width: 500px) {
  .extend {
    width: 90%;
    margin: -15px auto;
  }
}

.chara-all {
  position: absolute;
  right: 0;
  bottom: 0;
  height: 100%;
  z-index: 10;
}
@media all and (max-width: 1090px) {
  .chara-all {
    right: -5%;
  }
}
@media all and (max-width: 980px) {
  .chara-all {
    right: -10%;
  }
}
@media all and (max-width: 850px) {
  .chara-all {
    position: relative;
    width: 100%;
    height: inherit;
    right: inherit;
    margin-top: -90px;
  }
}
@media all and (max-width: 500px) {
  .chara-all {
    margin-top: -30px;
  }
}

.cloud {
  position: absolute;
  z-index: 30;
}
.cloud-01 {
  width: 71%;
  top: 0;
  left: 0;
}
.cloud-02 {
  width: 17.4%;
  top: 0;
  right: 0;
}
.cloud-03 {
  width: 17.6%;
  bottom: 0;
  right: 0;
}
.cloud-04 {
  width: 67%;
  bottom: 0;
  left: 0;
}
.kingyo {
  position: absolute;
  z-index: 20;
}
.kingyo-01 {
  width: 8%;
  top: 2.8%;
  right: 3.6%;
}
.kingyo-02 {
  width: 8%;
  top: -9%;
  right: 1%;
}
.kingyo-03 {
  width: 7.6%;
  top: 5%;
  right: 38%;
}
.kingyo-04 {
  width: 8.1%;
  top: 20%;
  left: 0.4%;
}
@media all and (max-width: 1200px) {
  .kingyo-01 {
    top: 5.8%;
  }
  .kingyo-02 {
    top: -5%;
  }
}
@media all and (max-width: 850px) {
  .kingyo-01 {
    width: 16%;
    top: 0.8%;
    right: 1.5%;
  }
  .kingyo-02 {
    width: 15%;
    top: -6%;
    right: 0.4%;
  }
  .kingyo-03, .kingyo-04 {
    display: none;
  }
}
/**
 * Owl Carousel v2.3.2
 * Copyright 2013-2018 David Deutsch
 * Licensed under: SEE LICENSE IN https://github.com/OwlCarousel2/OwlCarousel2/blob/master/LICENSE
 */
.owl-carousel,.owl-carousel .owl-item{-webkit-tap-highlight-color:transparent;position:relative}.owl-carousel{display:none;width:100%;z-index:1}.owl-carousel .owl-stage{position:relative;-ms-touch-action:pan-Y;touch-action:manipulation;-moz-backface-visibility:hidden}.owl-carousel .owl-stage:after{content:".";display:block;clear:both;visibility:hidden;line-height:0;height:0}.owl-carousel .owl-stage-outer{position:relative;overflow:hidden;-webkit-transform:translate3d(0,0,0)}.owl-carousel .owl-item,.owl-carousel .owl-wrapper{-webkit-backface-visibility:hidden;-moz-backface-visibility:hidden;-ms-backface-visibility:hidden;-webkit-transform:translate3d(0,0,0);-moz-transform:translate3d(0,0,0);-ms-transform:translate3d(0,0,0)}.owl-carousel .owl-item{min-height:1px;float:left;-webkit-backface-visibility:hidden;-webkit-touch-callout:none}.owl-carousel .owl-item img{display:block;width:100%}.owl-carousel .owl-dots.disabled,.owl-carousel .owl-nav.disabled{display:none}.no-js .owl-carousel,.owl-carousel.owl-loaded{display:block}.owl-carousel .owl-dot,.owl-carousel .owl-nav .owl-next,.owl-carousel .owl-nav .owl-prev{cursor:pointer;cursor:hand;-webkit-user-select:none;-khtml-user-select:none;-moz-user-select:none;-ms-user-select:none;user-select:none}.owl-carousel .owl-nav button.owl-next,.owl-carousel .owl-nav button.owl-prev,.owl-carousel button.owl-dot{background:0 0;color:inherit;border:none;padding:0!important;font:inherit}.owl-carousel.owl-loading{opacity:0;display:block}.owl-carousel.owl-hidden{opacity:0}.owl-carousel.owl-refresh .owl-item{visibility:hidden}.owl-carousel.owl-drag .owl-item{-ms-touch-action:none;touch-action:none;-webkit-user-select:none;-moz-user-select:none;-ms-user-select:none;user-select:none}.owl-carousel.owl-grab{cursor:move;cursor:grab}.owl-carousel.owl-rtl{direction:rtl}.owl-carousel.owl-rtl .owl-item{float:right}.owl-carousel .animated{animation-duration:1s;animation-fill-mode:both}.owl-carousel .owl-animated-in{z-index:0}.owl-carousel .owl-animated-out{z-index:1}.owl-carousel .fadeOut{animation-name:fadeOut}@keyframes fadeOut{0%{opacity:1}100%{opacity:0}}.owl-height{transition:height .5s ease-in-out}.owl-carousel .owl-item .owl-lazy{opacity:0;transition:opacity .4s ease}.owl-carousel .owl-item img.owl-lazy{transform-style:preserve-3d}.owl-carousel .owl-video-wrapper{position:relative;height:100%;background:#000}.owl-carousel .owl-video-play-icon{position:absolute;height:80px;width:80px;left:50%;top:50%;margin-left:-40px;margin-top:-40px;background:url(owl.video.play.png) no-repeat;cursor:pointer;z-index:1;-webkit-backface-visibility:hidden;transition:transform .1s ease}.owl-carousel .owl-video-play-icon:hover{-ms-transform:scale(1.3,1.3);transform:scale(1.3,1.3)}.owl-carousel .owl-video-playing .owl-video-play-icon,.owl-carousel .owl-video-playing .owl-video-tn{display:none}.owl-carousel .owl-video-tn{opacity:0;height:100%;background-position:center center;background-repeat:no-repeat;background-size:contain;transition:opacity .4s ease}.owl-carousel .owl-video-frame{position:relative;z-index:1;height:100%;width:100%}
/**
 * Owl Carousel v2.3.2
 * Copyright 2013-2018 David Deutsch
 * Licensed under: SEE LICENSE IN https://github.com/OwlCarousel2/OwlCarousel2/blob/master/LICENSE
 */
.owl-theme .owl-dots,.owl-theme .owl-nav{text-align:center;-webkit-tap-highlight-color:transparent}.owl-theme .owl-nav{margin-top:10px}.owl-theme .owl-nav [class*=owl-]{color:#FFF;font-size:14px;margin:5px;padding:4px 7px;background:#D6D6D6;display:inline-block;cursor:pointer;border-radius:3px}.owl-theme .owl-nav [class*=owl-]:hover{background:#869791;color:#FFF;text-decoration:none}.owl-theme .owl-nav .disabled{opacity:.5;cursor:default}.owl-theme .owl-nav.disabled+.owl-dots{margin-top:10px}.owl-theme .owl-dots .owl-dot{display:inline-block;zoom:1}.owl-theme .owl-dots .owl-dot span{width:10px;height:10px;margin:5px 7px;background:#D6D6D6;display:block;-webkit-backface-visibility:visible;transition:opacity .2s ease;border-radius:30px}.owl-theme .owl-dots .owl-dot.active span,.owl-theme .owl-dots .owl-dot:hover span{background:#869791}