@charset "UTF-8";
/* Scss Document */
html {
  font-size: 62.5%; }

#umaimon {
  font-family: "游ゴシック体", YuGothic, "游ゴシック Medium", "Yu Gothic Medium", "游ゴシック", -apple-system, BlinkMacSystemFont, Roboto, "Segoe UI", "Helvetica Neue", HelveticaNeue, "Yu Gothic Medium", "Yu Gothic", Verdana, Meiryo, sans-serif;
  font-weight: 500;
  font-style: normal;
  line-height: 1.8;
  color: #333333;
  overflow-x: hidden;
  letter-spacing: 0;
  -webkit-text-size-adjust: 100%;
  width: calc(100vw - (100vw - 100%)); }
  #umaimon img {
    border: 0;
    vertical-align: middle;
    max-width: 100%;
    height: auto; }
  @media print, screen and (min-width: 768px) {
    #umaimon {
      font-size: 1.6rem; } }
  @media only screen and (max-width: 767px) {
    #umaimon {
      font-size: 3.5vw;
      margin-bottom: 50px; } }
  #umaimon .header {
    padding: 60px 0 44px;
    background: url("../img/illust_sp.png") no-repeat, url("../img/bg_header.png") repeat;
    width: 100%;
    height: auto;
    margin-bottom: 25px;
    background-size: 90%,auto;
    background-position: top 10px center,center; }
    @media only screen and (min-width: 1025px) {
      #umaimon .header {
        background: url("../img/illust_pc.png") no-repeat, url("../img/bg_header.png") repeat;
        margin-bottom: 70px;
        background-size: 600px,auto;
        background-position: top 30px left calc(50% - 280px), center; } }
    #umaimon .header .inner {
      width: 100%;
      margin: 0 auto; }
      @media only screen and (min-width: 1025px) {
        #umaimon .header .inner {
          max-width: 970px;
          display: flex;
          display: -webkit-flex;
          display: -ms-flexbox;
          justify-content: space-between;
          -webkit-box-pack: space-between;
          -ms-flex-pack: space-between;
          align-items: center;
          -webkit-box-align: center;
          -ms-flex-align: center; } }
      #umaimon .header .inner div h1 {
        width: 90%;
        max-width: 500px;
        margin: 0 auto; }
        @media only screen and (min-width: 1025px) {
          #umaimon .header .inner div h1 {
            width: 100%; } }
      #umaimon .header .inner div h2 {
        width: 70%;
        max-width: 390px;
        margin: 0 auto; }
        @media only screen and (min-width: 1025px) {
          #umaimon .header .inner div h2 {
            width: 100%; } }
      #umaimon .header .inner .top_img {
        width: 90%;
        max-width: 430px;
        margin: 20px auto 0;
        display: block; }
        @media only screen and (min-width: 1025px) {
          #umaimon .header .inner .top_img {
            width: 100%; } }
  #umaimon .sec_inner {
    width: 90%;
    margin: 0 auto; }
    @media only screen and (min-width: 1025px) {
      #umaimon .sec_inner {
        width: 100%;
        max-width: 970px; } }
  #umaimon .sec_vertical {
    padding: 30px 0 10px; }
    @media print, screen and (min-width: 768px) {
      #umaimon .sec_vertical {
        padding: 65px 0 50px; } }
  #umaimon .sec_ttl {
    text-align: center;
    margin-bottom: 17px; }
    @media only screen and (min-width: 1025px) {
      #umaimon .sec_ttl {
        margin-bottom: 55px; } }
    @media only screen and (max-width: 767px) {
      #umaimon .sec_ttl.mb30 {
        margin-bottom: 30px; } }
  #umaimon p.center {
    font-size: 4vw;
    margin-bottom: 30px; }
    @media only screen and (min-width: 768px) and (max-width: 1024px) {
      #umaimon p.center {
        font-size: 2.5vw; } }
    @media only screen and (min-width: 1025px) {
      #umaimon p.center {
        font-size: 2rem;
        text-align: center;
        margin-bottom: 65px; } }
    #umaimon p.center span {
      background: rgba(0, 0, 0, 0) linear-gradient(transparent 60%, #FDD23E 0%) repeat scroll 0 0; }
  #umaimon p.bold {
    font-weight: bold; }
  #umaimon p.center_big {
    font-size: 4vw;
    margin-bottom: 35px; }
    @media only screen and (min-width: 768px) and (max-width: 1024px) {
      #umaimon p.center_big {
        font-size: 2.4rem; } }
    @media only screen and (min-width: 1025px) {
      #umaimon p.center_big {
        font-size: 2.4rem;
        text-align: center;
        margin-bottom: 5px; } }
  #umaimon p.inner_ttl00 {
    font-size: 4vw;
    text-align: center;
    margin-bottom: 10px; }
    @media print, screen and (min-width: 768px) {
      #umaimon p.inner_ttl00 {
        font-size: 2.2rem; } }
  #umaimon p.inner_ttl01 {
    color: #E5811E;
    font-size: 5vw;
    text-align: center;
    font-weight: bold; }
    @media only screen and (min-width: 768px) and (max-width: 1024px) {
      #umaimon p.inner_ttl01 {
        font-size: 2.5rem; } }
    @media only screen and (min-width: 1025px) {
      #umaimon p.inner_ttl01 {
        font-size: 2.8rem;
        text-align: left; } }
  #umaimon p.inner_ttl02 {
    font-size: 5vw; }
    @media only screen and (min-width: 768px) and (max-width: 1024px) {
      #umaimon p.inner_ttl02 {
        font-size: 2.5rem; } }
    @media only screen and (min-width: 1025px) {
      #umaimon p.inner_ttl02 {
        font-size: 2.0rem; } }
    #umaimon p.inner_ttl02 span {
      font-weight: bold; }
  #umaimon p.inner_ttl03 {
    font-size: 4.3vw;
    text-align: center;
    line-height: 1.5;
    margin-bottom: 30px;
    font-weight: bold; }
    @media only screen and (min-width: 768px) and (max-width: 1024px) {
      #umaimon p.inner_ttl03 {
        font-size: 2.8vw; } }
    @media only screen and (min-width: 1025px) {
      #umaimon p.inner_ttl03 {
        font-size: 2.8rem; } }
    #umaimon p.inner_ttl03.txt_left {
      text-align: left; }
  #umaimon p.inner_txt01 {
    font-size: 4vw; }
    @media print, screen and (min-width: 768px) {
      #umaimon p.inner_txt01 {
        font-size: 1.8rem; } }
    #umaimon p.inner_txt01.ind {
      text-indent: -0.5em; }
    #umaimon p.inner_txt01.bold {
      width: 75%;
      margin: 0 auto; }
      @media only screen and (min-width: 1025px) {
        #umaimon p.inner_txt01.bold {
          width: 100%; } }
  #umaimon p.note {
    font-size: 3.3vw;
    margin: 25px 0; }
    @media print, screen and (min-width: 768px) {
      #umaimon p.note {
        font-size: 1.4rem;
        margin: 15px 0 0 0; } }
  @media only screen and (min-width: 1025px) {
    #umaimon .flex_area {
      display: flex;
      display: -webkit-flex;
      display: -ms-flexbox;
      justify-content: space-between;
      -webkit-box-pack: space-between;
      -ms-flex-pack: space-between;
      align-items: center;
      -webkit-box-align: center;
      -ms-flex-align: center;
      -ms-flex-wrap: nowrap;
      flex-wrap: nowrap; } }
  #umaimon .inner_box01 {
    background: #FFFFEA;
    border-radius: 30px;
    box-shadow: 2px 2px #B5A087;
    margin: 0 auto 25px; }
    @media only screen and (min-width: 1025px) {
      #umaimon .inner_box01 {
        margin: 0 auto 70px; } }
    #umaimon .inner_box01 h3 {
      text-align: center; }
      #umaimon .inner_box01 h3 img {
        margin: -30px auto 0; }
      #umaimon .inner_box01 h3.under_b {
        font-size: 4.7vw;
        background: url("../img/deco_b2.png") repeat-x bottom;
        margin: 0 auto 45px;
        padding-bottom: 10px;
        font-weight: bold; }
        @media only screen and (min-width: 768px) and (max-width: 1024px) {
          #umaimon .inner_box01 h3.under_b {
            font-size: 3vw; } }
        @media only screen and (min-width: 1025px) {
          #umaimon .inner_box01 h3.under_b {
            width: 522px;
            font-size: 3.0rem; } }
    #umaimon .inner_box01 img {
      display: block;
      margin: 0 auto 25px; }
      @media only screen and (min-width: 1025px) {
        #umaimon .inner_box01 img {
          width: 495px;
          margin: 0 auto 45px; } }
    #umaimon .inner_box01.subttl_01 {
      position: relative;
      padding: 44px 5% 25px; }
      @media only screen and (min-width: 1025px) {
        #umaimon .inner_box01.subttl_01 {
          padding: 60px 100px 50px; } }
      #umaimon .inner_box01.subttl_01::before {
        content: '';
        background: url("../img/subttl_01.png");
        width: 255px;
        height: 37px;
        top: -19px;
        background-size: contain;
        position: absolute;
        left: 50%;
        transform: translate(-50%);
        -webkit-transform: translate(-50%);
        -ms-transform: translate(-50%); }
        @media only screen and (min-width: 1025px) {
          #umaimon .inner_box01.subttl_01::before {
            width: 425px;
            height: 61px;
            top: -30px; } }
    #umaimon .inner_box01.subttl_03 {
      position: relative;
      padding: 44px 5% 25px; }
      @media only screen and (min-width: 1025px) {
        #umaimon .inner_box01.subttl_03 {
          padding: 60px 100px 50px; } }
      #umaimon .inner_box01.subttl_03::before {
        content: '';
        background: url("../img/subttl_03.png") no-repeat;
        width: 330px;
        height: 37px;
        background-size: contain;
        top: -19px;
        position: absolute;
        left: 50%;
        transform: translate(-50%);
        -webkit-transform: translate(-50%);
        -ms-transform: translate(-50%); }
        @media only screen and (min-width: 1025px) {
          #umaimon .inner_box01.subttl_03::before {
            width: 555px;
            height: 61px;
            top: -30px; } }
    #umaimon .inner_box01.type01 {
      padding: 28px 5%; }
      @media only screen and (min-width: 1025px) {
        #umaimon .inner_box01.type01 {
          padding: 80px 100px 30px; } }
  #umaimon .inner_box02 {
    background: #FFF2F0;
    width: 100%;
    padding: 40px 0 50px;
    margin-top: 40px; }
    @media only screen and (min-width: 1025px) {
      #umaimon .inner_box02 {
        margin-top: 70px; } }
    #umaimon .inner_box02 .img_center img {
      display: block;
      margin: 0 auto 20px;
      width: 70%; }
      @media only screen and (min-width: 768px) and (max-width: 1024px) {
        #umaimon .inner_box02 .img_center img {
          width: auto; } }
      @media only screen and (min-width: 1025px) {
        #umaimon .inner_box02 .img_center img {
          width: auto;
          margin: 0 auto 40px; } }
    #umaimon .inner_box02 .flex_area img {
      width: 78%;
      margin: 0 auto 30px;
      display: block; }
      @media only screen and (min-width: 1025px) {
        #umaimon .inner_box02 .flex_area img {
          max-width: 385px;
          width: 50%;
          margin: 0 auto; } }
    @media only screen and (min-width: 1025px) {
      #umaimon .inner_box02 .flex_area div {
        width: 50%; } }
  #umaimon .inner_box03 {
    position: relative;
    width: auto;
    margin: 25px auto 90px;
    padding: 25px 0; }
    @media only screen and (min-width: 768px) and (max-width: 1024px) {
      #umaimon .inner_box03 {
        padding: 25px; } }
    @media only screen and (min-width: 1025px) {
      #umaimon .inner_box03 {
        display: flex;
        display: -webkit-flex;
        display: -ms-flexbox;
        justify-content: flex-start;
        -webkit-box-pack: flex-start;
        -ms-flex-pack: flex-start;
        align-items: center;
        -webkit-box-align: center;
        -ms-flex-align: center;
        width: 866px; } }
    #umaimon .inner_box03::before {
      position: absolute;
      content: '';
      background: url("../img/deco_b1_sp.png") repeat-x top;
      background-size: contain;
      width: 100%;
      max-width: 330px;
      height: 6px;
      top: 0;
      position: absolute;
      left: 50%;
      transform: translate(-50%);
      -webkit-transform: translate(-50%);
      -ms-transform: translate(-50%); }
      @media print, screen and (min-width: 768px) {
        #umaimon .inner_box03::before {
          background: url("../img/deco_b1_pc.png") repeat-x top;
          max-width: inherit;
          width: 866px;
          height: 9px; } }
    #umaimon .inner_box03::after {
      position: absolute;
      content: '';
      background: url("../img/deco_b1_sp.png") repeat-x bottom;
      background-size: contain;
      width: 100%;
      max-width: 330px;
      height: 6px;
      bottom: 0;
      position: absolute;
      left: 50%;
      transform: translate(-50%);
      -webkit-transform: translate(-50%);
      -ms-transform: translate(-50%); }
      @media print, screen and (min-width: 768px) {
        #umaimon .inner_box03::after {
          background: url("../img/deco_b1_pc.png") repeat-x bottom;
          max-width: inherit;
          width: 866px;
          height: 9px; } }
    #umaimon .inner_box03 img {
      width: 200px;
      margin: 0 auto 30px;
      display: block; }
      @media only screen and (min-width: 1025px) {
        #umaimon .inner_box03 img {
          width: 235px;
          margin: 0 65px 0 35px; } }
  #umaimon .btn {
    background: #FF8A7B;
    width: 66%;
    height: 42px;
    line-height: 42px;
    margin: 25px auto 0;
    border-radius: 21px;
    text-align: center; }
    @media print, screen and (min-width: 768px) {
      #umaimon .btn {
        width: 250px;
        margin: 0 auto; } }
    #umaimon .btn.bold {
      font-weight: bold; }
    #umaimon .btn.left {
      margin: 25px auto; }
      @media only screen and (min-width: 1025px) {
        #umaimon .btn.left {
          margin: 25px auto 65px 0; } }
    #umaimon .btn a {
      color: #fff;
      display: block;
      position: relative; }
      #umaimon .btn a::after {
        position: absolute;
        content: '';
        width: 8px;
        height: 8px;
        border-top: 1px solid #fff;
        border-right: 1px solid #fff;
        -webkit-transform: rotate(45deg);
        transform: rotate(45deg);
        top: calc(50% - 4px);
        right: 10px; }
  #umaimon .flex_db {
    display: flex;
    display: -webkit-flex;
    display: -ms-flexbox;
    justify-content: space-between;
    -webkit-box-pack: space-between;
    -ms-flex-pack: space-between;
    align-items: center;
    -webkit-box-align: center;
    -ms-flex-align: center;
    -ms-flex-wrap: wrap;
    flex-wrap: wrap; }
    #umaimon .flex_db li {
      width: calc(100% / 2 - 5px);
      margin-bottom: 15px; }
      @media only screen and (min-width: 1025px) {
        #umaimon .flex_db li {
          width: calc(100% / 4 - 10px);
          margin-bottom: 0; } }
      #umaimon .flex_db li img {
        margin: 0 auto;
        display: block; }
  @media only screen and (min-width: 1025px) {
    #umaimon .flex_area {
      display: flex;
      display: -webkit-flex;
      display: -ms-flexbox;
      justify-content: space-between;
      -webkit-box-pack: space-between;
      -ms-flex-pack: space-between;
      align-items: center;
      -webkit-box-align: center;
      -ms-flex-align: center; } }
  @media only screen and (min-width: 1025px) {
    #umaimon .flex_area.reverse {
      width: 880px;
      margin: 0 auto;
      flex-flow: row-reverse; } }
  #umaimon .flex_area.reverse img {
    margin: 0 auto 25px;
    display: block; }
    @media only screen and (min-width: 1025px) {
      #umaimon .flex_area.reverse img {
        width: 400px;
        margin: 0; } }
  @media only screen and (min-width: 1025px) {
    #umaimon .flex_area.reverse p {
      width: 50%; } }
  @media only screen and (min-width: 1025px) {
    #umaimon #link04 .flex_area img {
      width: 335px;
      margin-left: 30px; } }
  #umaimon #link04 .flex_area div img {
    width: 172px;
    margin-bottom: 20px; }
    @media only screen and (min-width: 1025px) {
      #umaimon #link04 .flex_area div img {
        width: 286px;
        margin-bottom: 10px;
        margin-left: 0; } }
    #umaimon #link04 .flex_area div img.sp_only.type01 {
      width: 68%;
      display: block;
      margin: 0 auto 20px; }
      @media only screen and (min-width: 768px) and (max-width: 1024px) {
        #umaimon #link04 .flex_area div img.sp_only.type01 {
          width: 40%; } }
      @media only screen and (min-width: 1025px) {
        #umaimon #link04 .flex_area div img.sp_only.type01 {
          display: none; } }
    #umaimon #link04 .flex_area div img.sp_only.type02 {
      width: 100%;
      display: block;
      margin: 0 auto 20px; }
      @media only screen and (min-width: 768px) and (max-width: 1024px) {
        #umaimon #link04 .flex_area div img.sp_only.type02 {
          width: 40%; } }
      @media only screen and (min-width: 1025px) {
        #umaimon #link04 .flex_area div img.sp_only.type02 {
          display: none; } }
  @media only screen and (max-width: 767px) {
    #umaimon #link04 .flex_area:last-of-type {
      margin-top: 45px; } }
  #umaimon #link04 .flex_area .kome {
    vertical-align: super;
    font-size: 10px; }
  #umaimon a:hover {
    opacity: 0.7; }
  #umaimon .sp_only {
    display: block; }
    @media only screen and (min-width: 1025px) {
      #umaimon .sp_only {
        display: none; } }
  #umaimon .sptab_only {
    display: block; }
    @media only screen and (min-width: 1025px) {
      #umaimon .sptab_only {
        display: none; } }
  #umaimon .pc_only {
    display: none; }
    @media only screen and (min-width: 1025px) {
      #umaimon .pc_only {
        display: block; } }