@charset "UTF-8";
/*! Writen  by SCSS */
img {
  max-width: 100%;
  height: auto;
  border: 0;
  -ms-interpolation-mode: bicubic;
  vertical-align: bottom; }

/*スマホ*/
@media screen and (max-width: 640px) {
  body {
    margin: 0px;
    padding: 0px;
    text-align: center;
    font-family: 'Kosugi Maru', sans-serif; }

  .topcontent {
    margin: 0px auto 0px auto;
    padding: 70px 0px 0px 0px; }

  img {
    max-width: 100%;
    height: auto;
    border: 0;
    -ms-interpolation-mode: bicubic;
    vertical-align: bottom; }

  .gfont {
    font-family: 'Kosugi Maru', sans-serif; }

  .fadeUpTrigger {
    opacity: 0; }

  .br-s {
    display: block; }

  .sp {
    display: block !important; }

  .pc {
    display: none !important; }

  .delay-time02 {
    animation-delay: 0.6s; }

  .delay-time04 {
    animation-delay: 1.0s; }

  .fadeUp {
    animation-name: fadeUpAnime;
    animation-duration: 0.7s;
    animation-fill-mode: forwards;
    opacity: 0; } }
@keyframes fadeUpAnime {
  from {
    opacity: 0;
    transform: translateY(100px); }
  to {
    opacity: 1;
    transform: translateY(0); } }
/*PC*/
@media print, screen and (min-width: 641px) {
  body {
    margin: 0px;
    padding: 0px;
    text-align: center;
    font-family: 'Kosugi Maru', sans-serif; }

  .topcontent {
    margin: 0px auto 0px auto;
    padding: 90px 0px 0px 0px; }

  .gfont {
    font-family: 'Kosugi Maru', sans-serif; }

  .fadeUp {
    animation-name: fadeUpAnime;
    animation-duration: 0.7s;
    animation-fill-mode: forwards;
    opacity: 0; }

  .fadeUpTrigger {
    opacity: 0; }

  .delay-time02 {
    animation-delay: 0.6s; }

  .delay-time04 {
    animation-delay: 1.0s; }

  .br-s2 {
    display: block; }

  .br-s {
    display: none; } }
@keyframes fadeUpAnime {
  from {
    opacity: 0;
    transform: translateY(100px); }
  to {
    opacity: 1;
    transform: translateY(0); } }
.sec0 {
  padding: 100px 0 70px; }
  @media screen and (max-width: 480px) {
    .sec0 {
      padding: 40px 0 30px; } }
  .sec0 .inner {
    max-width: 1380px;
    margin: 0 auto;
    width: calc(100% - 40px); }
    .sec0 .inner .box0 {
      max-width: 940px;
      margin: 0 auto;
      position: relative; }
      .sec0 .inner .box0 .txt1 {
        width: calc(586% / 9.4);
        margin-bottom: 25px; }
        @media screen and (max-width: 480px) {
          .sec0 .inner .box0 .txt1 {
            width: 100%;
            margin: 0 auto 10px; } }
      .sec0 .inner .box0 .txt2 {
        position: absolute;
        width: calc(110% / 9.4);
        right: calc(45% / 9.4);
        top: calc(-115% / 4.78);
        top: calc(45% / 6.85);
        z-index: 5; }
        @media screen and (max-width: 480px) {
          .sec0 .inner .box0 .txt2 {
            position: static;
            width: 20%;
            margin: 0 auto 15px; } }
      .sec0 .inner .box0 .img {
        position: relative;
        margin-bottom: 15px; }
        @media screen and (max-width: 480px) {
          .sec0 .inner .box0 .img {
            width: calc(100% + 40px);
            margin: 0 -20px 8px; } }

.sec .ttl {
  text-align: center;
  margin-bottom: 20px; }
.sec .ttl_sub {
  text-align: center;
  margin-bottom: 40px;
  font-size: 130%;
  line-height: 160%;
  color: #0c2f54;
  font-weight: 700; }
  @media screen and (max-width: 480px) {
    .sec .ttl_sub {
      margin-bottom: 25px;
      font-size: 105%; } }

.sec1 {
  padding: 0 0 100px; }
  @media screen and (max-width: 480px) {
    .sec1 {
      padding: 0 0 40px; } }
  .sec1 .inner {
    max-width: 940px;
    margin: 0 auto;
    width: calc(100% - 40px); }

.sec2 {
  padding: 0 0 100px; }
  @media screen and (max-width: 480px) {
    .sec2 {
      padding: 0 0 40px; } }
  .sec2 .inner {
    max-width: 940px;
    margin: 0 auto;
    width: calc(100% - 40px); }

.sec3 {
  padding: 0 0 100px; }
  @media screen and (max-width: 480px) {
    .sec3 {
      padding: 0 0 40px; } }
  .sec3 .inner {
    max-width: 980px;
    margin: 0 auto;
    width: calc(100% - 40px); }
    .sec3 .inner .cap_r {
      margin-top: 10px;
      margin-right: 20px; }
      @media screen and (max-width: 480px) {
        .sec3 .inner .cap_r {
          margin-right: 0; } }

.sec4 {
  padding: 0 0 100px; }
  @media screen and (max-width: 480px) {
    .sec4 {
      padding: 0 0 40px; } }
  .sec4 .inner {
    max-width: 1070px;
    margin: 0 auto;
    width: calc(100% - 40px); }

@media screen and (max-width: 480px) {
  .sld1 img {
    width: 680px;
    max-width: 680px; }

  .sld2 img {
    width: 680px;
    max-width: 680px; }

  .sld3 img {
    width: 680px;
    max-width: 680px; } }

/*# sourceMappingURL=shijyu.css.map */