@charset "UTF-8";
/*! ------------------------------------------------
 * ------------------------------------------------
 * Table of Contents
 * ------------------------------------------------
 *  1. Template Backgrounds
 *  2. Fonts
 *  3. Base CSS Styles
 *  4. Typography
 *  5. Buttons & Controls
 *  6. Forms and Forms Reply Groups
 *  7. Animated Backgrounds
 *  8. Main Section
 *  9. Menu
 *  10. Socials
 *  11. Countdown
 *  12. Popup Dialogs
 *  13. Inner Sections
 *  14. Features
 *  15. Gallery
 * ------------------------------------------------
 * Table of Contents End
 * ------------------------------------------------ */
/* ------------------------------------------------*/
/* Template Backgrounds Start */
/* ------------------------------------------------*/
#gw1, #gw3a, #gw3b, #gw5, #gw1-q, #gw2-q, #gw3-q {
  background-color: #D1F0FA; }

#gw2a, #gw2b, #gw4, #gw1-a, #gw2-a, #gw3-a {
  background-color: #EDFAFF; }

#ene1, #ene3a, #ene3b {
  background-color: #F8E5E9; }

#ene2a, #ene2b, #ene2c, #ene4 {
  background-color: #FFF5F7; }

#forest1a, #forest1b, #forest3a, #forest3b, #forest5a, #forest5b {
  background-color: #EBFAE0; }

#forest2a, #forest2b, #forest2c, #forest4, #forest6 {
  background-color: #F5FFEF; }

#food1, #food3a, #food3b {
  background-color: #FFF9C3; }

#food2a, #food2b, #food2c, #food2d, #food4a, #food4b {
  background-color: #FFFCE5; }

#info1, #info3a, #info3b {
  background-color: #F1F1F1; }

#info2a, #info2b, #info2c {
  background-color: #fcfcfc; }

#go1 {
  background-color: #ECE4FC; }

#go2 {
  background-color: #F6F1FF; }

ruby rt {
  text-indent: -4px;
  letter-spacing: -0.2rem !important;
  position: relative;
  top: 0px;
  transform: translateY(0.5em); }

ol.eventlist li p, ul.eventlist li p {
  line-height: 3rem;
  font-size: 1.8rem; }
  @media only screen and (max-width: 576px) {
    ol.eventlist li p, ul.eventlist li p {
      line-height: 2.7rem;
      font-size: 1.6rem; } }

/* ------------------------------------------------*/
/* iOS h title ruby rt margin Start */
/* ------------------------------------------------*/
body.ios-device h1 ruby rt,
body.ios-device h2 ruby rt,
body.ios-device h3 ruby rt,
body.ios-device h4 ruby rt,
body.ios-device h5 ruby rt {
  margin-bottom: 0.5em; }

body.ios-device ol.eventlist li p, ul.eventlist li p {
  line-height: 3rem;
  font-size: 1.6rem; }

/* ------------------------------------------------*/
/* iOS h title ruby rt margin End */
/* ------------------------------------------------*/
/* ------------------------------------------------*/
/* Fonts Start */
/* ------------------------------------------------*/
@font-face {
  font-family: 'hanazome';
  src: url("../fonts/hanazome.ttf"); }
@font-face {
  font-family: 'k-font';
  src: url("../fonts/keifont.ttf") format("truetype"); }
@font-face {
  font-family: 'nikumaru';
  src: url("../fonts/nikumaru.otf") format("opentype"); }
h1, h2, h3, h4, h5 {
  font-family: "hanazome";
  color: #333333; }

.diffont1 {
  font-family: "Zen Kaku Gothic New", sans-serif; }

.diffont2 {
  font-family: "Dela Gothic One", sans-serif; }

.headertitle {
  font-family: "hanazome";
  color: #333333; }

.p {
  font-family: "M PLUS Rounded 1c", sans-serif; }

.lh3 {
  line-height: 3rem; }

p.underline_y span, h1.underline_y span, h2.underline_y span, h3.underline_y span {
  background: linear-gradient(transparent 50%, #FFFE33 50%); }

span.underline_y {
  font-weight: 500;
  background: linear-gradient(transparent 50%, #FFFE33 50%); }

span.underline_p {
  font-weight: 600;
  background: linear-gradient(transparent 50%, #FBB4E7 50%); }

span.underline_b {
  font-weight: 600;
  background: linear-gradient(transparent 50%, #A7D7F9 50%); }

span.underline_b2 {
  font-weight: 400;
  color: #0000FF;
  text-decoration: underline; }

span.underline_g {
  font-weight: 600;
  background: linear-gradient(transparent 50%, #ADF9B8 50%); }

.f-reg {
  font-weight: 400;
  font-style: normal; }

.f-med {
  font-weight: 500;
  font-style: normal; }

.f-bold {
  font-weight: 700;
  font-style: normal; }

.f-exbold {
  font-weight: 800;
  font-style: normal; }

.f-black {
  font-weight: 900;
  font-style: normal; }

h1 {
  font-size: 2.7rem; }

h2 {
  font-size: 2.2rem; }

h3 {
  font-size: 2rem; }

h4 {
  font-size: 1.8rem; }

@media only screen and (min-width: 768px) {
  h1 {
    font-size: 3.2rem; }

  h2 {
    font-size: 2.6rem; }

  h3 {
    font-size: 2.2rem; }

  h3 {
    font-size: 2rem; } }
@media only screen and (min-width: 1200px) {
  h1 {
    font-size: 3.5rem; }

  h2 {
    font-size: 3rem; }

  h3 {
    font-size: 2.5rem; }

  h4 {
    font-size: 2.3rem; } }
@media only screen and (min-width: 1400px) {
  h1 {
    font-size: 4rem; }

  h2 {
    font-size: 3.5rem; }

  h3 {
    font-size: 3rem; }

  h4 {
    font-size: 2.7rem; } }
p {
  font-size: 2rem;
  line-height: 3.6rem;
  color: #333333; }
  @media only screen and (max-width: 576px) {
    p {
      font-size: 1.8rem;
      line-height: 3.2rem; } }
  @media only screen and (min-width: 768px) {
    p {
      font-size: 2.2rem;
      line-height: 4.4rem; } }
  @media only screen and (min-width: 1200px) {
    p {
      font-size: 2.5rem;
      line-height: 5rem; } }

p span {
  font-weight: 600; }

p.caption {
  font-size: 1.6rem;
  line-height: 2.4rem;
  padding: 0rem 0 0; }
  @media only screen and (max-width: 576px) {
    p.caption {
      font-size: 1.4rem;
      line-height: 2rem; } }
  @media only screen and (min-width: 768px) {
    p.caption {
      font-size: 1.6rem;
      line-height: 2.4rem; } }
  @media only screen and (min-width: 1200px) {
    p.caption {
      font-size: 2rem;
      line-height: 3rem; } }

p.small {
  margin-bottom: 2rem; }
  @media only screen and (max-width: 576px) {
    p.small {
      font-size: 1.4rem;
      line-height: 2rem; } }
  @media only screen and (min-width: 576.5px) {
    p.small {
      font-size: 1.6rem;
      line-height: 2.2rem; } }
  @media only screen and (min-width: 1200px) {
    p.small {
      font-size: 1.8rem;
      line-height: 2.4rem; } }

p.mid {
  margin-bottom: 1rem;
  padding-top: 1rem;
  margin-left: 5px; }
  @media only screen and (max-width: 576px) {
    p.mid {
      font-size: 1.8rem;
      line-height: 3rem; } }
  @media only screen and (min-width: 768px) {
    p.mid {
      font-size: 2.1rem;
      line-height: 3.5rem; } }
  @media only screen and (min-width: 1200px) {
    p.mid {
      font-size: 2.4rem;
      line-height: 3.8rem; } }

p.lg {
  font-weight: 800; }
  @media only screen and (max-width: 576px) {
    p.lg {
      font-size: 3.5rem; } }
  @media only screen and (min-width: 576.5px) {
    p.lg {
      font-size: 3.8rem; } }
  @media only screen and (min-width: 768px) {
    p.lg {
      font-size: 4.2rem; } }
  @media only screen and (min-width: 1200px) {
    p.lg {
      font-size: 4.5rem; } }

p.smid {
  margin-bottom: 2rem; }
  @media only screen and (max-width: 576px) {
    p.smid {
      font-size: 1.6rem;
      line-height: 2rem; } }
  @media only screen and (min-width: 576.5px) {
    p.smid {
      font-size: 1.8rem;
      line-height: 2.2rem; } }
  @media only screen and (min-width: 1200px) {
    p.smid {
      font-size: 2rem;
      line-height: 2.4rem; } }

.bigtext {
  font-size: 1.3em;
  font-weight: bold; }

.end-label {
  display: inline-block;
  padding: 0.2em 0.8em;
  font-size: 0.95em;
  color: #fff;
  background: #e74c3c;
  border-radius: 1em;
  font-weight: bold;
  vertical-align: middle; }

.hover-shadow {
  transition: box-shadow 0.3s, background 0.3s; }

.hover-shadow:hover {
  box-shadow: 0 8px 32px rgba(2, 52, 151, 0.561), 0 2.5px 12px #88aadd; }

.true {
  color: #FF1A1A; }

.false {
  color: #0D41DD; }

.chart_mb-0 {
  margin-bottom: 0 !important; }
  @media only screen and (max-width: 768px) {
    .chart_mb-0 {
      margin-bottom: 2rem; } }

/*  Breadcrumb Section Start */
.breadcrumb, .breadcrumb_fr {
  display: flex;
  float: right;
  gap: 0 22px;
  list-style: none;
  padding: 0 1rem 0 0;
  font-size: .9em; }
  @media only screen and (max-width: 576px) {
    .breadcrumb, .breadcrumb_fr {
      gap: 0 12px; } }

.breadcrumb li, .breadcrumb_fr li {
  display: flex;
  align-items: center; }

.breadcrumb li:first-child::before, .breadcrumb_fr li:first-child::before {
  display: inline-block;
  width: 1em;
  height: 1em;
  margin-right: 4px;
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M20 20C20 20.5523 19.5523 21 19 21H5C4.44772 21 4 20.5523 4 20V11L1 11L11.3273 1.6115C11.7087 1.26475 12.2913 1.26475 12.6727 1.6115L23 11L20 11V20ZM11 13V19H13V13H11Z' fill='%23333333'%3E%3C/path%3E%3C/svg%3E");
  background-repeat: no-repeat;
  content: ''; }

.breadcrumb li:not(:last-child)::after, .breadcrumb_fr li:not(:last-child)::after {
  display: inline-block;
  transform: rotate(45deg);
  width: .3em;
  height: .3em;
  margin-left: 10px;
  border-top: 1px solid #333333;
  border-right: 1px solid #333333;
  content: '';
  clear: both; }

.breadcrumb a, .breadcrumb_fr a {
  color: #333333;
  text-decoration: none; }

.breadcrumb a:hover, .breadcrumb_fr a:hover {
  color: #35A51E; }

.clear {
  clear: both !important; }

/*  Breadcrumb Section End */
span.smallcap {
  margin-bottom: 0;
  font-weight: 300; }
  @media only screen and (max-width: 576px) {
    span.smallcap {
      font-size: 1.2rem;
      line-height: 1.5rem; } }
  @media only screen and (min-width: 768px) {
    span.smallcap {
      font-size: 1.4rem;
      line-height: 1.7rem; } }
  @media only screen and (min-width: 1200px) {
    span.smallcap {
      font-size: 1.6rem;
      line-height: 2rem; } }

.spbr {
  display: none; }
  @media only screen and (max-width: 576px) {
    .spbr {
      display: block; } }

.mdbr {
  display: none; }
  @media only screen and (min-width: 820px) {
    .mdbr {
      display: block; } }

.mdbr2 {
  display: none; }
  @media only screen and (max-width: 990px) {
    .mdbr2 {
      display: block; } }

.aligncenter {
  text-align: center; }

.alignleft {
  text-align: left; }

.alignright {
  text-align: right; }

.centerspleft {
  text-align: center; }
  @media only screen and (max-width: 576px) {
    .centerspleft {
      text-align: left; } }

/* 画像上下中央合わせ Start*/
.fleximg {
  height: 180px;
  align-items: center;
  display: flex; }

.fleximg1 {
  align-items: center;
  display: flex;
  padding: 0; }

.fleximg2 {
  align-items: center;
  display: flex;
  padding: 1rem 0; }

.vright {
  justify-content: flex-end; }

.vcenter {
  justify-content: center; }

/* 画像上下中央合わせ End */
/* 文章上下中央合わせ Start*/
.valigncenter {
  display: flex;
  justify-content: center;
  align-items: center; }

/* 文章上下中央合わせ End */
.title-block {
  text-align: center;
  /* 子要素を左右中央揃え */
  padding: 0px;
  width: 100%; }

@media only screen and (min-width: 768px) {
  .image-block, .image-block2 {
    padding: 1rem;
    margin: 2rem 2rem; } }
@media only screen and (min-width: 992px) {
  .image-block, .image-block2 {
    padding: 1rem;
    margin: 2rem 2rem; } }
@media only screen and (min-width: 1200px) {
  .image-block, .image-block2 {
    padding: 1rem;
    margin: 2rem 2rem; } }

.image-block {
  padding: 1rem; }
  @media only screen and (max-width: 576px) {
    .image-block {
      padding: 1rem;
      margin: 2rem 1rem 1rem; } }

.image-block2 {
  padding: 1rem; }
  @media only screen and (max-width: 576px) {
    .image-block2 {
      padding: 1rem;
      margin: 2rem 0 1rem 1rem; } }

.image-block-s {
  padding: 1rem; }
  @media only screen and (max-width: 576px) {
    .image-block-s {
      padding: 1rem;
      margin: 2rem 1rem 0 1rem; } }
  @media only screen and (min-width: 576.5px) {
    .image-block-s {
      padding: 1rem;
      margin: 0rem 1rem 1rem; } }

.image-block.border-red {
  border: solid 12px;
  border-radius: 12px;
  border-color: #EA523D; }

.image-block.border-blue {
  border: solid 12px;
  border-radius: 12px;
  border-color: #2669B3; }

.image-block.border-green {
  border: solid 12px;
  border-radius: 12px;
  border-color: #8ED194; }

.image-block.border-green2 {
  border: solid 8px;
  border-radius: 12px;
  border-color: #7BBEEB;
  background-color: white; }

.image-block.border-yellow {
  border: solid 20px;
  border-radius: 12px;
  border-color: #FFDB5E; }

.image-block.border-orange {
  border: solid 20px;
  border-radius: 12px;
  border-color: #F88748; }

.image-block.border-black, .image-block2.border-black {
  border: solid 6px;
  border-radius: 30px;
  border-color: #333333;
  padding: 5%;
  background-color: white; }

.image-block.border-black-m {
  border: solid 6px;
  border-radius: 30px;
  border-color: #333333;
  padding: 4%;
  background-color: white; }
  @media only screen and (max-width: 768px) {
    .image-block.border-black-m {
      padding: 5%;
      margin: 15px 0; } }

.image-block.border-black-s {
  border: solid 3px;
  border-radius: 12px;
  border-color: #333333;
  background-color: white; }
  @media only screen and (max-width: 576px) {
    .image-block.border-black-s {
      padding: 1rem; } }

.image-block-s.border-black-s {
  border: solid 3px;
  border-radius: 12px;
  border-color: #333333;
  background-color: white; }
  @media only screen and (max-width: 576px) {
    .image-block-s.border-black-s {
      padding: 1rem; } }

.whitebase {
  border: 0;
  border-radius: 30px;
  background-color: white;
  padding: 2rem; }

.yellowbase {
  border: solid 6px;
  border-radius: 12px;
  border-color: #333333;
  background-color: #FDF081;
  padding: 0 0 1rem; }
  @media only screen and (max-width: 576px) {
    .yellowbase {
      border: solid 3px; } }

.orangebase {
  border: solid 6px;
  border-radius: 12px;
  border-color: #333333;
  background-color: #FDC881;
  padding: 0 0 1rem; }
  @media only screen and (max-width: 576px) {
    .orangebase {
      border: solid 3px; } }

.greenbase {
  border: solid 3px;
  border-radius: 12px;
  border-color: #333333;
  background-color: #BEFFBA;
  padding: 0 5% 5% 5%; }
  @media only screen and (max-width: 576px) {
    .greenbase {
      border: solid 2px; } }

.bluebase {
  border: solid 3px;
  border-radius: 12px;
  border-color: #333333;
  background-color: #9EDAFE;
  padding: 0 5% 5% 5%; }
  @media only screen and (max-width: 576px) {
    .bluebase {
      border: solid 2px; } }

.radius10 {
  border-radius: 10%; }

.radius20px {
  border-radius: 20px; }

.imgsize100 {
  width: 100%; }

.imgsize {
  width: 100%; }
  @media only screen and (max-width: 768px) {
    .imgsize {
      width: 90%; } }
  @media only screen and (min-width: 768.5px) {
    .imgsize {
      width: 100%; } }

.imgsize_m {
  width: 80%; }
  @media only screen and (max-width: 576px) {
    .imgsize_m {
      width: 40%;
      margin: 0 auto; } }

.imgsize_s {
  width: 60%; }
  @media only screen and (max-width: 576px) {
    .imgsize_s {
      width: 40%;
      margin: 0 auto; } }

@media only screen and (max-width: 576px) {
  .imgsize_ss {
    width: 60%;
    margin: 0 auto; } }
@media only screen and (max-width: 768px) {
  .imgsize_ss {
    width: 40%;
    margin: 0 auto; } }
@media only screen and (min-width: 768.5px) {
  .imgsize_ss {
    width: 25%;
    margin: 0 auto; } }

@media only screen and (max-width: 576px) {
  .imgsize_qz {
    width: 80%;
    margin: 0 auto; } }
@media only screen and (min-width: 576.5px) {
  .imgsize_qz {
    width: 70%;
    margin: 0 auto; } }
@media only screen and (min-width: 768.5px) {
  .imgsize_qz {
    width: 100%;
    margin: 0 auto; } }

@media only screen and (max-width: 576px) {
  .imgsize_qzthnk {
    width: 100%;
    margin: 0 auto; } }
@media only screen and (min-width: 576.5px) {
  .imgsize_qzthnk {
    width: 90%;
    margin: 0 auto; } }
@media only screen and (min-width: 768.5px) {
  .imgsize_qzthnk {
    width: 60%;
    margin: 0 auto; } }

.inline-titlelogo {
  display: inline-block;
  /* インラインブロック要素にする */
  width: 100px;
  /* 幅指定 */
  text-align: right;
  margin-right: 20px;
  vertical-align: middle;
  /* 要素を上下中央揃えにする */ }
  @media only screen and (max-width: 576px) {
    .inline-titlelogo {
      margin-right: 0px; } }

.inline-title {
  display: inline-block;
  text-align: left;
  vertical-align: middle;
  line-height: 3.8rem; }

.inline-left {
  display: inline-block;
  text-align: right;
  vertical-align: middle; }
  @media only screen and (max-width: 768px) {
    .inline-left {
      text-align: center; } }

.inline-right {
  display: inline-block;
  /* インラインブロック要素にする */
  text-align: center;
  vertical-align: middle;
  /* 要素を上下中央揃えにする */ }
  @media only screen and (max-width: 768px) {
    .inline-right {
      text-align: center; } }

.inline-center {
  display: inline-block;
  /* インラインブロック要素にする */
  text-align: center;
  vertical-align: middle;
  /* 要素を上下中央揃えにする */ }

.inline-titlelogo {
  display: inline-block;
  /* インラインブロック要素にする */
  width: 100px;
  /* 幅指定 */
  text-align: right;
  margin-right: 20px; }

.titleborder1 {
  border: 4px solid #333333;
  border-radius: 12px;
  display: block;
  padding: 0;
  margin: 0 auto 0;
  text-align: center;
  max-width: 50%; }
  @media only screen and (max-width: 576px) {
    .titleborder1 {
      max-width: 80%; } }

.titleborder2 {
  border: 4px solid #333333;
  border-radius: 12px;
  display: block;
  padding: 0;
  margin: 0 auto 0;
  text-align: center;
  max-width: 90%; }
  @media only screen and (max-width: 576px) {
    .titleborder2 {
      max-width: 80%; } }

/* 食品製造プロセス　タイトル */
.fpr {
  background-color: #D9851D;
  width: 70%;
  margin: 0 auto;
  border-radius: 12px; }
  .fpr p {
    line-height: 1rem;
    color: white; }

/* ------------------------------------------------*/
/* Fonts End */
/* ------------------------------------------------*/
/* ------------------------------------------------*/
/* List */
/* ------------------------------------------------*/
ol.normal {
  list-style-type: decimal;
  padding: 1rem; }

ul.normal {
  list-style-type: disc;
  padding: 1rem; }

ol.normal li, ul.normal li {
  margin-left: 2rem;
  padding-bottom: 1rem; }

ol.normal li p, ul.normal li p {
  line-height: 3rem;
  font-size: 1.8rem; }
  @media only screen and (max-width: 576px) {
    ol.normal li p, ul.normal li p {
      line-height: 2.7rem;
      font-size: 1.6rem; } }

p.per98 {
  font-size: 98% !important; }

ol.oldesign1 {
  counter-reset: number;
  /*数字をリセット*/
  list-style-type: none !important;
  /*数字を一旦消す*/
  padding: 0.3em 0.8em;
  border: solid 0px #ffb107; }

ol.oldesign1 li {
  position: relative;
  padding: 2rem 2rem 0 40px;
  line-height: 1rem;
  border-bottom: dashed 2px green; }

ol.oldesign1 li:before {
  /* 以下数字をつける */
  position: absolute;
  counter-increment: number;
  content: counter(number);
  /*数字のデザイン変える*/
  display: inline-block;
  background: #333333;
  color: white;
  font-weight: bold;
  font-size: 15px;
  border-radius: 50%;
  left: 0;
  width: 25px;
  height: 25px;
  line-height: 25px;
  text-align: center;
  /*以下 上下中央寄せのため*/
  top: 50%;
  -webkit-transform: translateY(-50%);
  transform: translateY(-50%); }

ol.oldesign1 li p {
  line-height: 2.4rem;
  margin-bottom: 1rem; }

ol.oldesign2 {
  list-style-type: decimal; }

ol.oldesign2 li, ol.oldesign3 li {
  line-height: 2rem;
  margin: 0.5rem 0 0.5rem 2rem; }

ol.oldesign3 {
  list-style-type: circle; }

ul.eventlist {
  list-style-type: none;
  padding: 1rem; }

ol.eventlist li, ul.eventlist li {
  margin-left: 0rem;
  padding: 1rem 0;
  border-bottom: dashed 2px purple; }

.newtopic {
  font-weight: 600;
  border-bottom: dashed 2px #666; }

ul {
  list-style-type: disc;
  padding: 1rem 0rem;
  text-align: left; }

ul li {
  position: relative;
  padding: 0.2rem;
  margin: 0 0 0 4rem; }
  @media only screen and (max-width: 576px) {
    ul li {
      margin: 0 0 0 3rem; } }
  @media only screen and (min-width: 576.5px) {
    ul li {
      margin: 0 0 0 6rem; } }

ul li p {
  line-height: 3rem; }
  @media only screen and (max-width: 576px) {
    ul li p {
      line-height: 2rem; } }

ul.tight {
  font-size: 1.6rem;
  list-style-type: disc;
  padding-bottom: 1rem;
  text-align: left;
  margin-top: 0;
  padding-top: 0;
  margin-left: 3rem; }

ul.tight li {
  position: relative;
  margin: 0rem;
  padding: 0rem; }
  @media only screen and (max-width: 576px) {
    ul.tight li {
      margin: 0 0 0 1rem;
      padding: 0rem; } }
  @media only screen and (min-width: 576.5px) {
    ul.tight li {
      margin: 0 0 0 2rem;
      padding: 0rem; } }

ul.tight li p {
  font-size: 1.6rem;
  line-height: 2rem; }
  @media only screen and (max-width: 576px) {
    ul.tight li p {
      font-size: 1.4rem;
      line-height: 2rem; } }

/* ------------------------------------------------*/
/* List End */
/* ------------------------------------------------*/
/* ------------------------------------------------*/
/* Base CSS Styles Start */
/* ------------------------------------------------*/
*, *::before, *::after {
  -webkit-box-sizing: border-box;
  -moz-box-sizing: border-box;
  box-sizing: border-box; }

button:active, button:focus {
  outline: none !important; }

button::-moz-focus-inner {
  border: 0 !important; }

input::-moz-focus-inner {
  border: 0 !important; }

::-moz-selection {
  background-color: #FFACA3;
  color: #141414;
  text-shadow: none; }

::selection {
  background-color: #FFACA3;
  color: #141414;
  text-shadow: none; }

::-webkit-scrollbar {
  display: none;
  width: 5px;
  background: #a9accb; }

@media only screen and (min-width: 768px) {
  ::-webkit-scrollbar {
    display: block; } }
::-webkit-scrollbar-track {
  border-radius: 20px;
  background-color: #a9accb; }

::-webkit-scrollbar-thumb {
  background-color: #FFACA3;
  border-radius: 10px; }

html {
  font-family: sans-serif;
  font-size: 62.5%;
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale; }

html,
body {
  width: 100%;
  height: 100%;
  margin: 0;
  /* ブラウザのデフォルトマージンをリセット */
  padding: 0; }

body, body.form {
  position: relative;
  min-width: 320px;
  overflow-x: hidden !important;
  font: normal 400 1.6rem/1.7 "M PLUS Rounded 1c", sans-serif;
  color: #444444;
  background-color: #fbfbfb;
  text-rendering: optimizeLegibility; }

section {
  min-width: 320px;
  padding-top: 5rem; }

a {
  text-decoration: none;
  outline: none;
  -webkit-tap-highlight-color: rgba(0, 0, 0, 0);
  color: #444444;
  -webkit-transition: all 0.2s ease-in-out;
  -o-transition: all 0.2s ease-in-out;
  -moz-transition: all 0.2s ease-in-out;
  transition: all 0.2s ease-in-out; }

a:hover {
  color: #51AD01;
  transition: all 0.2s ease-in-out; }

img.ynbtn {
  width: 70%; }
  @media only screen and (min-width: 768px) {
    img.ynbtn {
      width: 80%; } }

img.ynsign {
  width: 15%; }
  @media only screen and (min-width: 576px) {
    img.ynsign {
      width: 10%; } }
  @media only screen and (min-width: 768.5px) {
    img.ynsign {
      width: 8%; } }
  @media only screen and (min-width: 1200px) {
    img.ynsign {
      width: 5%; } }

.qnum img {
  width: 20%; }
  @media only screen and (min-width: 576px) {
    .qnum img {
      width: 15%; } }
  @media only screen and (min-width: 768px) {
    .qnum img {
      width: 10%; } }
  @media only screen and (min-width: 1200px) {
    .qnum img {
      width: 10%; } }

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

.fullheight {
  position: relative;
  height: auto; }

@media only screen and (min-width: 1200px) {
  .fullheight {
    height: 100%; }

  .fullheight2 {
    height: auto; } }
.color-layer {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%; }

.layer-blue-07 {
  background: -moz-linear-gradient(315deg, rgba(37, 42, 91, 0.7) 0%, rgba(27, 31, 65, 0.7) 100%);
  background: -o-linear-gradient(315deg, rgba(37, 42, 91, 0.7) 0%, rgba(27, 31, 65, 0.7) 100%);
  background: linear-gradient(135deg, rgba(37, 42, 91, 0.7) 0%, rgba(27, 31, 65, 0.7) 100%); }

.layer-blue-04 {
  background: -moz-linear-gradient(315deg, rgba(37, 42, 91, 0.4) 0%, rgba(27, 31, 65, 0.4) 100%);
  background: -o-linear-gradient(315deg, rgba(37, 42, 91, 0.4) 0%, rgba(27, 31, 65, 0.4) 100%);
  background: linear-gradient(135deg, rgba(37, 42, 91, 0.4) 0%, rgba(27, 31, 65, 0.4) 100%); }

.fill-accent-color {
  fill: #FFACA3; }

.fill-accent-color-two {
  fill: #67F2E0; }

.fill-base-color {
  fill: #272F7C; }

.fill-white {
  fill: #ffffff; }

.bg-accent-color {
  background-color: #FFACA3; }

.bg-base-color {
  background-color: #272F7C; }

.bg-white {
  background-color: #ffffff; }

.bg-graypink {
  background-color: #F9F4F4; }

/* ------------------------------------------------*/
/* Base CSS Styles End */
/* ------------------------------------------------*/
/* ------------------------------------------------*/
/* Typography Start */
/* ------------------------------------------------*/
#typed {
  display: inline-block;
  white-space: nowrap; }

.typed-cursor {
  color: #FFACA3;
  font-weight: 100; }

.headline__divider {
  display: block;
  height: 15px;
  background-repeat: no-repeat;
  background-position: left;
  background-image: url("../img/svg/divider-headline.svg");
  margin-top: 1.4rem; }

.headline__divider.centered {
  background-position: center; }

.headline__text {
  font: italic 300 1.6rem/1.5 "M PLUS Rounded 1c", sans-serif;
  color: #ffffff;
  margin: 1.8rem 0 0 0.2rem; }

.headline__text.centered {
  margin: 1.8rem auto 0; }

@media only screen and (min-width: 768px) {
  .headline__text {
    font-size: 1.7rem;
    max-width: 480px; }

  .headline__text.long {
    max-width: 560px; } }
@media only screen and (min-width: 1400px) {
  .headline__text {
    font-size: 1.9rem; } }
.headline__btnholder {
  position: relative;
  text-align: left;
  margin: 4rem 0 0 0.2rem; }

.headline__btnholder.centered {
  text-align: center; }

.section-title__divider {
  display: block;
  height: 15px;
  background-repeat: no-repeat;
  background-position: left;
  background-image: url("../img/svg/divider-title.svg");
  margin: 1.8rem 0 0 0; }

.section-title__subtitle {
  display: block;
  font: italic 400 1.9rem/1.5 "M PLUS Rounded 1c", sans-serif;
  color: #141414;
  margin: 1.6rem 0 0 0.2rem; }

.section-title__text {
  display: block;
  margin: 3rem 0 0 0.2rem; }
  @media only screen and (max-width: 768px) {
    .section-title__text {
      margin: 1rem 0 0 0.2rem;
      padding: 2rem 0.5rem 0.2rem 1rem; } }

.section-title__text.additional-title, .section-title__text.additional-subtitle {
  margin: 0; }

.section-title__btnholder {
  position: relative;
  text-align: left;
  margin: 4rem 0 0 0.2rem; }

.section-title__btnholder.centered {
  text-align: center; }

.main__credits p,
.main__credits a {
  font: normal 400 1.7rem "M PLUS Rounded 1c", sans-serif;
  color: #000000; }

a.cyanbtn:hover {
  color: #67F2E0; }

.main__credits.dark p, .main__credits.dark a {
  color: #141414; }

.no-touch .main__credits.dark a:hover {
  color: #FFACA3; }

.features__item p {
  font-size: 1.4rem; }

.features__item .divider {
  display: block;
  height: 15px;
  margin: 1.4rem 0;
  background-repeat: no-repeat;
  background-position: left;
  background-image: url("../img/svg/divider-small.svg"); }

blockquote {
  display: block;
  position: relative;
  text-align: center; }

blockquote i {
  display: block;
  font-size: 7rem;
  line-height: 0.8;
  color: #272F7C; }

blockquote p {
  font: italic 300 2rem/1.7 "M PLUS Rounded 1c", sans-serif;
  margin: 4rem 0 0 0; }

blockquote p span {
  font-weight: 500; }

blockquote .divider {
  display: block;
  height: 15px;
  margin: 1.4rem 0 0 0;
  background-repeat: no-repeat;
  background-position: center;
  background-image: url("../img/svg/divider-small.svg"); }

blockquote cite {
  display: block;
  font: normal 400 1.2rem/1.5 "M PLUS Rounded 1c", sans-serif;
  margin: 1.8rem 0 0 0;
  color: #999999; }

blockquote cite span {
  display: block; }

@media only screen and (min-width: 768px) {
  blockquote i {
    font-size: 7rem; }

  blockquote p {
    font-size: 2.8rem; }

  blockquote cite {
    font-size: 1.4rem; } }
.popup-title {
  text-align: center; }

.popup-title__title {
  font: normal 700 2.8rem/1.2 "M PLUS Rounded 1c", sans-serif;
  color: #272F7C; }

@media only screen and (min-width: 768px) {
  .popup-title__title {
    font-size: 4rem; } }
.popup-title__divider {
  position: relative;
  display: block;
  height: 15px;
  margin: 1.4rem 0;
  background-repeat: no-repeat;
  background-position: center;
  background-image: url("../img/svg/divider-small.svg"); }

.popup-title__subtitle {
  color: #141414; }

.additional__title {
  font: normal 700 2.8rem/1.2 "M PLUS Rounded 1c", sans-serif;
  color: #272F7C; }

.additional__title.light {
  color: #ffffff; }

@media only screen and (min-width: 768px) {
  .additional__title {
    font-size: 4rem; } }
.additional__divider {
  position: relative;
  display: block;
  height: 15px;
  margin: 1.4rem 0;
  background-repeat: no-repeat;
  background-position: center;
  background-image: url("../img/svg/divider-small.svg"); }

.additional__subtitle {
  font: normal 400 1.6rem/1.7 "M PLUS Rounded 1c", sans-serif;
  color: #141414; }

.additional__subtitle.light {
  color: #ffffff;
  font-weight: 300; }

.footer__slogan p {
  font: italic 300 1.6rem/1.5 "M PLUS Rounded 1c", sans-serif;
  color: #ffffff;
  max-width: 480px;
  margin: 0 auto; }

/* ------------------------------------------------*/
/* Typography End */
/* ------------------------------------------------*/
/* ------------------------------------------------*/
/* Buttons & Controls Start */
/* ------------------------------------------------*/
.menu-close,
.popup-close {
  display: block;
  position: relative;
  width: 54px;
  height: 54px;
  z-index: 3;
  margin: 0 auto;
  -webkit-transform: scale(0);
  -moz-transform: scale(0);
  -ms-transform: scale(0);
  transform: scale(0);
  -webkit-transition: -webkit-transform 0.3s ease-in-out;
  transition: -webkit-transform 0.3s ease-in-out;
  -o-transition: transform 0.3s ease-in-out;
  -moz-transition: transform 0.3s ease-in-out, -moz-transform 0.3s ease-in-out;
  transition: transform 0.3s ease-in-out;
  transition: transform 0.3s ease-in-out, -webkit-transform 0.3s ease-in-out, -moz-transform 0.3s ease-in-out; }

.menu-close::before, .menu-close::after,
.popup-close::before,
.popup-close::after {
  content: "";
  display: block;
  position: absolute;
  left: 50%;
  top: 50%;
  bottom: auto;
  right: auto;
  width: 34px;
  height: 3px;
  -moz-border-radius: 3px;
  border-radius: 3px;
  background-color: #272F7C;
  -webkit-transition: background-color 0.3s ease-in-out;
  -o-transition: background-color 0.3s ease-in-out;
  -moz-transition: background-color 0.3s ease-in-out;
  transition: background-color 0.3s ease-in-out; }

.menu-close::before,
.popup-close::before {
  -webkit-transform: translateX(-50%) translateY(-50%) rotate(45deg);
  -moz-transform: translateX(-50%) translateY(-50%) rotate(45deg);
  -ms-transform: translateX(-50%) translateY(-50%) rotate(45deg);
  transform: translateX(-50%) translateY(-50%) rotate(45deg); }

.menu-close::after,
.popup-close::after {
  -webkit-transform: translateX(-50%) translateY(-50%) rotate(-45deg);
  -moz-transform: translateX(-50%) translateY(-50%) rotate(-45deg);
  -ms-transform: translateX(-50%) translateY(-50%) rotate(-45deg);
  transform: translateX(-50%) translateY(-50%) rotate(-45deg); }

.no-touch .menu-close:hover::before, .no-touch .menu-close:hover::after,
.no-touch .popup-close:hover::before,
.no-touch .popup-close:hover::after {
  background-color: #525996; }

.menu-close.is-scaled-up,
.popup-close.is-scaled-up {
  -webkit-transform: scale(1);
  -moz-transform: scale(1);
  -ms-transform: scale(1);
  transform: scale(1);
  -webkit-transition: -webkit-transform 0.3s 0.8s;
  transition: -webkit-transform 0.3s 0.8s;
  -o-transition: transform 0.3s 0.8s;
  -moz-transition: transform 0.3s 0.8s, -moz-transform 0.3s 0.8s;
  transition: transform 0.3s 0.8s;
  transition: transform 0.3s 0.8s, -webkit-transform 0.3s 0.8s, -moz-transform 0.3s 0.8s; }

@media only screen and (min-width: 1200px) {
  .menu-close,
  .popup-close {
    position: absolute;
    top: 2.4rem;
    left: 2.4rem; } }
@media only screen and (min-width: 1400px) {
  .menu-close,
  .popup-close {
    position: absolute;
    top: 4rem;
    left: 4rem;
    width: 60px;
    height: 60px; } }
.menu-button {
  position: fixed;
  top: 2.4rem;
  left: 2.4rem;
  display: inline-block;
  width: 54px;
  height: 54px;
  z-index: 11; }

.menu-button:active {
  -webkit-transform: translateY(2px);
  -moz-transform: translateY(2px);
  -ms-transform: translateY(2px);
  transform: translateY(2px); }

@media only screen and (min-width: 1400px) {
  .menu-button {
    position: fixed;
    top: 4rem;
    left: 4rem;
    width: 60px;
    height: 60px; } }
.menu-btn-morphing-path {
  fill: #56E464;
  -webkit-transition: fill 0.5s ease-in-out;
  -o-transition: fill 0.5s ease-in-out;
  -moz-transition: fill 0.5s ease-in-out;
  transition: fill 0.5s ease-in-out; }

.menu-trigger {
  position: absolute;
  left: 50%;
  top: 50%;
  bottom: auto;
  right: auto;
  -webkit-transform: translateX(-50%) translateY(-50%);
  -moz-transform: translateX(-50%) translateY(-50%);
  -ms-transform: translateX(-50%) translateY(-50%);
  transform: translateX(-50%) translateY(-50%);
  display: block;
  width: 54px;
  height: 54px;
  -moz-border-radius: 50%;
  border-radius: 50%;
  background-color: transparent; }

.menu-trigger span {
  display: block;
  position: absolute;
  left: 50%;
  top: 50%;
  bottom: auto;
  right: auto;
  -webkit-transform: translateX(-50%) translateY(-50%);
  -moz-transform: translateX(-50%) translateY(-50%);
  -ms-transform: translateX(-50%) translateY(-50%);
  transform: translateX(-50%) translateY(-50%);
  width: 24px;
  height: 3px;
  -moz-border-radius: 3px;
  border-radius: 3px;
  background-color: transparent; }

.menu-trigger span::before, .menu-trigger span::after {
  content: "";
  display: block;
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  -moz-border-radius: 3px;
  border-radius: 3px;
  background-color: #1b2157;
  -webkit-transition: background-color 0.3s ease-in-out;
  -o-transition: background-color 0.3s ease-in-out;
  -moz-transition: background-color 0.3s ease-in-out;
  transition: background-color 0.3s ease-in-out; }

.menu-trigger span::before {
  -webkit-transform: translateY(-4px);
  -moz-transform: translateY(-4px);
  -ms-transform: translateY(-4px);
  transform: translateY(-4px); }

.menu-trigger span::after {
  -webkit-transform: translateY(4px);
  -moz-transform: translateY(4px);
  -ms-transform: translateY(4px);
  transform: translateY(4px); }

.no-touch .menu-trigger:hover span::before, .no-touch .menu-trigger:hover span::after {
  background-color: #272F7C; }

@media only screen and (min-width: 1400px) {
  .menu-trigger {
    width: 60px;
    height: 60px; }

  .menu-trigger span {
    width: 28px; } }
.btn {
  position: relative;
  display: inline-block;
  border: none;
  outline: none;
  font: inherit;
  background-color: transparent;
  min-width: 180px;
  text-align: center;
  font: normal 700 1.2rem/1.7 "M PLUS Rounded 1c", sans-serif;
  text-transform: uppercase;
  letter-spacing: 0.1rem;
  padding: 1.3rem 3rem 1.1rem 3rem;
  cursor: pointer;
  -webkit-user-select: none;
  -moz-user-select: none;
  -ms-user-select: none;
  user-select: none;
  -moz-border-radius: 2px;
  border-radius: 2px;
  -webkit-transition: background-color 0.5s;
  -o-transition: background-color 0.5s;
  -moz-transition: background-color 0.5s;
  transition: background-color 0.5s; }

.btn .btn-caption {
  margin-right: 0.6rem; }

.btn .btn-caption,
.btn i {
  font-size: 1.2rem;
  -webkit-transition: color 0.5s;
  -o-transition: color 0.5s;
  -moz-transition: color 0.5s;
  transition: color 0.5s; }

@media only screen and (min-width: 768px) {
  .btn {
    min-width: auto; } }
.btn-light {
  color: #272F7C;
  background-color: #ffffff;
  border: 2px solid #ffffff; }

.btn-light .btn-caption,
.btn-light i {
  color: #272F7C; }

.no-touch .btn-light:hover {
  background-color: transparent;
  border: 2px solid #ffffff; }

.no-touch .btn-light:hover .btn-caption,
.no-touch .btn-light:hover i {
  color: #ffffff; }

.btn-outline-light {
  color: #ffffff;
  background-color: transparent;
  border: 2px solid #ffffff; }

.btn-outline-light .btn-caption,
.btn-outline-light i {
  color: #ffffff; }

.no-touch .btn-outline-light:hover {
  background-color: #ffffff;
  border: 2px solid #ffffff; }

.no-touch .btn-outline-light:hover .btn-caption,
.no-touch .btn-outline-light:hover i {
  color: #272F7C; }

.btn-dark {
  color: #ffffff;
  background-color: #272F7C;
  border: 2px solid #272F7C; }

.btn-dark .btn-caption,
.btn-dark i {
  color: #ffffff; }

.no-touch .btn-dark:hover {
  background-color: transparent;
  border: 2px solid #272F7C; }

.no-touch .btn-dark:hover .btn-caption,
.no-touch .btn-dark:hover i {
  color: #272F7C; }

.headline .btn {
  margin: 0 1.6rem 1rem 0; }

.headline .btn:last-of-type {
  margin: 0; }

@media only screen and (min-width: 768px) {
  .headline .btn {
    margin: 0 1.6rem 0 0; }

  .headline .btn:last-of-type {
    margin: 0; } }
/* button custom */
button {
  background: none;
  border: none;
  width: 100px;
  margin-top: 0px;
  padding: 10px 0;
  border-radius: 15px; }
  @media only screen and (max-width: 768px) {
    button {
      margin-top: 15px !important; } }

#nextbtn button {
  color: #000;
  font-size: 1.6rem;
  font-weight: bold;
  background: transparent;
  width: 240px;
  height: 60px;
  text-align: center;
  border: 4px solid #333;
  border-radius: 20px;
  position: relative;
  z-index: 1;
  display: block;
  overflow: hidden;
  background: #FFD740;
  transition: .3s; }

#nextbtn button::before {
  content: "";
  width: 120%;
  height: 200%;
  position: absolute;
  top: -50%;
  right: 0;
  z-index: -1;
  border-radius: 0 100% 100% 0;
  transform: translateX(-100%);
  transition: transform ease .3s; }

#nextbtn button:hover {
  background: #333;
  color: #fff; }

#nextbtn button:hover::before {
  transform: translateX(10%); }

#nextbtn1 button {
  color: #000;
  font-size: 1.6rem;
  font-weight: bold;
  background: transparent;
  width: 320px;
  height: 60px;
  text-align: center;
  border: 4px solid #333;
  border-radius: 20px;
  position: relative;
  z-index: 1;
  display: block;
  overflow: hidden;
  background: #FFD740;
  transition: .3s; }

#nextbtn1 button::before {
  content: "";
  width: 120%;
  height: 200%;
  position: absolute;
  top: -50%;
  right: 0;
  z-index: -1;
  border-radius: 0 100% 100% 0;
  transform: translateX(-100%);
  transition: transform ease .3s; }

#nextbtn1 button:hover {
  background: #333;
  color: #fff; }

#nextbtn1 button:hover::before {
  transform: translateX(10%); }

#nextbtn2 button {
  color: #000;
  font-size: 1.6rem;
  font-weight: bold;
  background: transparent;
  width: 280px;
  height: 60px;
  text-align: center;
  border: 4px solid #333;
  border-radius: 20px;
  position: relative;
  z-index: 1;
  display: block;
  overflow: hidden;
  background: #FFD740;
  transition: .3s; }

#nextbtn2 button::before {
  content: "";
  width: 120%;
  height: 200%;
  position: absolute;
  top: -50%;
  right: 0;
  z-index: -1;
  border-radius: 0 100% 100% 0;
  transform: translateX(-100%);
  transition: transform ease .3s; }

#nextbtn2 button:hover {
  background: #333;
  color: #fff; }

#nextbtn2 button:hover::before {
  transform: translateX(10%); }

#applybtn button {
  color: #000;
  font-size: 2rem;
  font-weight: bold;
  padding: 3rem;
  background: transparent;
  width: 80%;
  height: auto;
  text-align: center;
  border: 8px solid #333;
  border-radius: 20px;
  position: relative;
  z-index: 1;
  display: block;
  overflow: hidden;
  background: #FEFA3E;
  transition: .3s; }
  @media only screen and (max-width: 1240px) {
    #applybtn button {
      font-size: 1.8rem;
      width: 90%; } }
  @media only screen and (max-width: 1000px) {
    #applybtn button {
      width: 100%;
      font-size: 1.6rem;
      padding: 2rem; } }
  @media only screen and (max-width: 768px) {
    #applybtn button {
      width: 100%;
      font-size: 1.6rem;
      padding: 2rem; } }
  @media only screen and (max-width: 576px) {
    #applybtn button {
      width: 80%;
      font-size: 1.6rem;
      padding: 2rem; } }

#applybtn button::before {
  content: "";
  width: 120%;
  height: 200%;
  position: absolute;
  top: -50%;
  right: 0;
  z-index: -1;
  border-radius: 0 100% 100% 0;
  transform: translateX(-100%);
  transition: transform ease .3s; }

#applybtn button:hover {
  background: #333;
  color: #fff; }

#applybtn button:hover::before {
  transform: translateX(10%); }

/* button custom End*/
.to-top {
  display: inline-block;
  width: 4rem;
  height: 4rem;
  line-height: 4rem;
  position: fixed;
  right: 20px;
  bottom: 20px;
  -moz-border-radius: 2px;
  border-radius: 2px;
  background-color: #272F7C;
  overflow: hidden;
  z-index: 10;
  color: #ffffff;
  font-size: 1.4rem;
  text-align: center;
  visibility: hidden;
  opacity: 0;
  -webkit-transition: opacity 0.3s 0s, visibility 0s 0.3s;
  -o-transition: opacity 0.3s 0s, visibility 0s 0.3s;
  -moz-transition: opacity 0.3s 0s, visibility 0s 0.3s;
  transition: opacity 0.3s 0s, visibility 0s 0.3s; }

.no-touch .to-top:hover {
  -webkit-transition: opacity 0.3s 0s, visibility 0s 0s;
  -o-transition: opacity 0.3s 0s, visibility 0s 0s;
  -moz-transition: opacity 0.3s 0s, visibility 0s 0s;
  transition: opacity 0.3s 0s, visibility 0s 0s;
  opacity: 1;
  color: #ffffff; }

.to-top.is-visible, .to-top.fade-out {
  -webkit-transition: opacity 0.3s 0s, visibility 0s 0s;
  -o-transition: opacity 0.3s 0s, visibility 0s 0s;
  -moz-transition: opacity 0.3s 0s, visibility 0s 0s;
  transition: opacity 0.3s 0s, visibility 0s 0s; }

.to-top.is-visible {
  visibility: visible;
  opacity: 1; }

.to-top.fade-out {
  opacity: 0.4; }

@media only screen and (min-width: 768px) {
  .to-top {
    position: fixed;
    right: 20px;
    bottom: 20px; } }
/* ------------------------------------------------*/
/* Buttons & Controls End */
/* ------------------------------------------------*/
/* ------------------------------------------------*/
/* Animated Backgrounds Start */
/* ------------------------------------------------*/
.video-background {
  position: absolute;
  width: 100%;
  height: 100%;
  top: 0;
  left: 0; }

#video-wrapper {
  position: absolute;
  width: 100%;
  height: 100%;
  top: 0;
  left: 0;
  background-color: transparent; }

#main-video {
  display: block;
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  background-color: transparent;
  background-position: center center;
  -moz-background-size: contain;
  background-size: contain;
  -o-object-fit: cover;
  object-fit: cover; }

#bgndKenburns,
#bgndKenburnsFull {
  display: block;
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  min-height: 100%;
  background-color: transparent; }

/* ------------------------------------------------*/
/* Animated Backgrounds End */
/* ------------------------------------------------*/
/* ------------------------------------------------*/
/* Main Section Start */
/* ------------------------------------------------*/
.main {
  position: relative;
  background-color: #D8FDFB; }

.main__background {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  background-repeat: no-repeat;
  background-position: center center;
  -moz-background-size: cover;
  background-size: cover;
  z-index: 0;
  overflow: hidden; }

.main__background .main-background-shape {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  max-height: 100%;
  z-index: 0;
  fill: #D8FDFB; }

.main__logo {
  position: relative;
  padding: 2.4rem 0;
  text-align: center;
  z-index: 10; }

.main__logo img {
  width: auto;
  margin: 0 auto; }

@media only screen and (min-width: 1200px) {
  .main__logo {
    position: absolute;
    top: 2.4rem;
    left: 10rem;
    padding: 0; } }
@media only screen and (min-width: 1400px) {
  .main__logo {
    top: 4rem;
    left: 14rem; } }
.main__content {
  position: relative;
  padding: 0;
  z-index: 1; }

.main__content.split, .main__content.fullscreen {
  padding: 0; }

@media only screen and (min-width: 1200px) {
  .main__content {
    padding: 4rem; } }
.main__intro {
  position: relative;
  padding: 3rem 0; }

.main__intro.split, .main__intro.fullscreen {
  padding: 0rem 0; }

@media only screen and (min-width: 1200px) {
  .main__intro {
    padding: 0rem 0; } }
.headline {
  padding: 0 5%; }

@media only screen and (max-width: 576px) {
  .headline {
    padding: 0 1rem; } }
@media (min-width: 576.5px) and (max-width: 1199.5px) {
  .headline {
    padding: 0; } }
@media only screen and (min-width: 1200px) {
  .headline {
    position: relative;
    left: 0;
    top: 50%;
    bottom: auto;
    -webkit-transform: translateY(-50%);
    -moz-transform: translateY(-50%);
    -ms-transform: translateY(-50%);
    transform: translateY(-50%); }

  .headline.fullscreen {
    width: 100%; } }
@media only screen and (min-width: 1400px) {
  .headline {
    padding: 0 14rem; } }
.topbanner {
  padding: 0 10%; }
  .topbanner .fullscreen {
    width: 100%; }
  @media only screen and (max-width: 576px) {
    .topbanner {
      padding: 0 1rem; } }
  @media (min-device-width: 576.5px) and (max-device-width: 767.5px) {
    .topbanner {
      padding: 0 2%; } }
  @media (min-device-width: 768px) and (max-device-width: 1199.5px) {
    .topbanner {
      padding: 0 6rem; } }
  @media (min-device-width: 1200px) and (max-width: 1399.5px) {
    .topbanner {
      padding: 0 10rem; } }
  @media only screen and (min-width: 1400px) {
    .topbanner {
      padding: 0 14rem; } }

.mainlogo {
  width: 80%;
  margin: 0 auto; }
  @media only screen and (max-width: 768px) {
    .mainlogo {
      width: 100%; } }
  @media only screen and (min-width: 768.5px) {
    .mainlogo {
      width: 80%; } }

@media only screen and (max-width: 576px) {
  .submenu1 {
    padding: 3rem 2%; }
    .submenu1 .pcdisplay {
      display: none; }
    .submenu1 .mbdisplay {
      display: block; } }
@media screen and (min-device-width: 576.5px) {
  .submenu1 {
    padding: 3rem 5%; }
    .submenu1 .pcdisplay {
      display: block; }
    .submenu1 .mbdisplay, .submenu1 .spbr {
      display: none; } }
@media only screen and (min-width: 768px) {
  .submenu1 {
    padding: 3rem 10%; } }
@media only screen and (min-width: 1200px) {
  .submenu1 {
    padding: 3rem 20%; } }

.topmenuimg {
  margin: 1rem 0;
  filter: drop-shadow(8px 8px 0px #000000);
  transform: translateZ(0); }
  @media only screen and (max-width: 576px) {
    .topmenuimg {
      margin: 1rem 2rem 0rem; } }

.topmenuimg2 {
  width: 100%;
  margin: 1rem;
  filter: drop-shadow(8px 8px 0px #000000);
  transform: translateZ(0); }
  @media only screen and (min-width: 1200px) {
    .topmenuimg2 {
      width: 80%; } }
  @media only screen and (max-width: 576px) {
    .topmenuimg2 {
      width: 90%;
      margin: 1rem 2rem 0rem; } }

.topmenuimg:hover, .topmenuimg2:hover {
  transform: translateY(8px);
  transition: .3s;
  filter: drop-shadow(0px 0px 0px #000000); }

.submenuimg, a.link1 {
  border: 0;
  margin: 0;
  filter: drop-shadow(8px 8px 0px #000000);
  transform: translateZ(0); }

.submenuimg:hover, a.link1:hover {
  transform: translateY(8px);
  transition: .3s;
  filter: drop-shadow(0px 0px 0px #000000); }

#colorchange, a.link2 {
  border: 0;
  margin: 0;
  filter: drop-shadow(2px 2px 0px #333333);
  transform: translateZ(0); }

#colorchange:hover, a.link2:hover {
  transform: translateY(2px);
  transition: .3s;
  filter: drop-shadow(0px 0px 0px #333333);
  filter: saturate(500%); }

.svgobj {
  display: block;
  margin: auto;
  margin-bottom: 3rem; }

@media only screen and (max-width: 768px) {
  img.svgobj {
    width: 50%; } }
.main__media {
  position: relative; }

.illustration-holder {
  position: relative;
  padding: 0 10%; }

@media only screen and (min-width: 1200px) {
  .illustration-holder {
    padding: 0; } }
.illustration {
  position: relative;
  width: 100%;
  padding: 0;
  padding-bottom: 82.7778%;
  overflow: hidden; }

.illustration svg {
  position: absolute;
  top: 0;
  left: 0;
  z-index: 0;
  width: 100%;
  max-height: 100%; }

@media only screen and (min-width: 1200px) {
  .illustration {
    padding-bottom: 0;
    left: 0;
    top: 50%;
    bottom: auto;
    -webkit-transform: translateY(-50%);
    -moz-transform: translateY(-50%);
    -ms-transform: translateY(-50%);
    transform: translateY(-50%);
    height: -moz-calc(100% - 6rem);
    height: calc(100% - 6rem);
    width: -moz-calc(100% - 3rem);
    width: calc(100% - 3rem); } }
@media only screen and (min-width: 1400px) {
  .illustration {
    height: -moz-calc(100% - 8rem);
    height: calc(100% - 8rem);
    width: -moz-calc(100% - 4rem);
    width: calc(100% - 4rem); } }
.bottom-shape-holder {
  position: absolute;
  bottom: 0;
  left: 0;
  width: 100%;
  height: 300px; }

.bottom-shape-holder svg {
  width: 100%;
  height: 100%; }

.side-shape-holder {
  position: absolute;
  top: 0;
  left: 0;
  z-index: 12;
  width: 100%;
  height: 100px; }

@media only screen and (min-width: 1200px) {
  .side-shape-holder {
    width: 100px;
    height: 100%; } }
.main-side-shape-desktop {
  display: none;
  width: 100px;
  height: 100%; }

@media only screen and (min-width: 1200px) {
  .main-side-shape-desktop {
    display: block; } }
.main-side-shape-mobile {
  display: block;
  width: 100%;
  height: 100px; }

@media only screen and (min-width: 1200px) {
  .main-side-shape-mobile {
    display: none; } }
.main-side-path {
  fill: #272F7C; }

.media-background {
  height: 600px;
  background-repeat: no-repeat;
  background-position: center center;
  -moz-background-size: cover;
  background-size: cover; }

@media only screen and (min-width: 768px) {
  .media-background {
    height: 760px; } }
@media only screen and (min-width: 1200px) {
  .media-background {
    height: 100%; } }
.main__socials {
  position: relative;
  margin-bottom: 1rem;
  padding: 0 10%;
  text-align: center;
  z-index: 10; }

.main__socials.split {
  position: absolute;
  bottom: 4.7rem;
  left: 0;
  width: 100%; }

.main__socials.fullscreen {
  margin-bottom: 0; }

@media only screen and (min-width: 1200px) {
  .main__socials {
    width: auto;
    padding: 0;
    margin-bottom: 0;
    position: absolute;
    top: 2.4rem;
    right: 2.4rem; }

  .main__socials.split {
    position: absolute;
    top: 2.4rem;
    right: 2.4rem;
    bottom: auto;
    left: auto;
    width: auto; }

  .main__socials.fullscreen {
    position: absolute;
    top: 2.4rem;
    right: 2.4rem; } }
@media only screen and (min-width: 1400px) {
  .main__socials {
    position: absolute;
    top: 4rem;
    right: 4rem; }

  .main__socials.split, .main__socials.fullscreen {
    position: absolute;
    top: 4rem;
    right: 4rem; } }
.main__credits {
  position: relative;
  padding: 0 10%;
  text-align: center;
  padding-bottom: 3rem;
  z-index: 10; }

.main__credits.split {
  position: absolute;
  bottom: 0;
  left: 0;
  width: 100%; }

@media only screen and (min-width: 1200px) {
  .main__credits {
    padding: 0;
    position: absolute;
    right: 2.4rem;
    bottom: 2.4rem; }

  .main__credits.split {
    width: auto;
    padding: 0;
    position: absolute;
    right: 2.4rem;
    bottom: 2.4rem;
    left: auto; } }
@media only screen and (min-width: 1400px) {
  .main__credits {
    position: absolute;
    right: 4rem;
    bottom: 4rem; }

  .main__credits.split {
    position: absolute;
    right: 4rem;
    bottom: 4rem;
    left: auto; } }
/* ------------------------------------------------*/
/* Main Section End */
/* ------------------------------------------------*/
/* ------------------------------------------------*/
/* Menu Start */
/* ------------------------------------------------*/
.menu {
  position: fixed;
  top: -200vh;
  left: 0;
  z-index: 101;
  width: 100%;
  height: 200vh; }

.menu.is-visible .menu__logo {
  opacity: 1;
  -webkit-transform: translateY(0);
  -moz-transform: translateY(0);
  -ms-transform: translateY(0);
  transform: translateY(0);
  -webkit-transition: opacity 0.3s 0.1s, -webkit-transform 0.3s 0.1s;
  transition: opacity 0.3s 0.1s, -webkit-transform 0.3s 0.1s;
  -o-transition: transform 0.3s 0.1s, opacity 0.3s 0.1s;
  -moz-transition: transform 0.3s 0.1s, opacity 0.3s 0.1s, -moz-transform 0.3s 0.1s;
  transition: transform 0.3s 0.1s, opacity 0.3s 0.1s;
  transition: transform 0.3s 0.1s, opacity 0.3s 0.1s, -webkit-transform 0.3s 0.1s, -moz-transform 0.3s 0.1s; }

.menu.is-visible .navigation li:nth-of-type(1) {
  opacity: 1;
  -webkit-transform: translateY(0);
  -moz-transform: translateY(0);
  -ms-transform: translateY(0);
  transform: translateY(0);
  -webkit-transition: opacity 0.3s 0.2s, -webkit-transform 0.3s 0.2s;
  transition: opacity 0.3s 0.2s, -webkit-transform 0.3s 0.2s;
  -o-transition: transform 0.3s 0.2s, opacity 0.3s 0.2s;
  -moz-transition: transform 0.3s 0.2s, opacity 0.3s 0.2s, -moz-transform 0.3s 0.2s;
  transition: transform 0.3s 0.2s, opacity 0.3s 0.2s;
  transition: transform 0.3s 0.2s, opacity 0.3s 0.2s, -webkit-transform 0.3s 0.2s, -moz-transform 0.3s 0.2s; }

.menu.is-visible .navigation li:nth-of-type(2) {
  opacity: 1;
  -webkit-transform: translateY(0);
  -moz-transform: translateY(0);
  -ms-transform: translateY(0);
  transform: translateY(0);
  -webkit-transition: opacity 0.3s 0.3s, -webkit-transform 0.3s 0.3s;
  transition: opacity 0.3s 0.3s, -webkit-transform 0.3s 0.3s;
  -o-transition: transform 0.3s 0.3s, opacity 0.3s 0.3s;
  -moz-transition: transform 0.3s 0.3s, opacity 0.3s 0.3s, -moz-transform 0.3s 0.3s;
  transition: transform 0.3s 0.3s, opacity 0.3s 0.3s;
  transition: transform 0.3s 0.3s, opacity 0.3s 0.3s, -webkit-transform 0.3s 0.3s, -moz-transform 0.3s 0.3s; }

.menu.is-visible .navigation li:nth-of-type(3) {
  opacity: 1;
  -webkit-transform: translateY(0);
  -moz-transform: translateY(0);
  -ms-transform: translateY(0);
  transform: translateY(0);
  -webkit-transition: opacity 0.3s 0.4s, -webkit-transform 0.3s 0.4s;
  transition: opacity 0.3s 0.4s, -webkit-transform 0.3s 0.4s;
  -o-transition: transform 0.3s 0.4s, opacity 0.3s 0.4s;
  -moz-transition: transform 0.3s 0.4s, opacity 0.3s 0.4s, -moz-transform 0.3s 0.4s;
  transition: transform 0.3s 0.4s, opacity 0.3s 0.4s;
  transition: transform 0.3s 0.4s, opacity 0.3s 0.4s, -webkit-transform 0.3s 0.4s, -moz-transform 0.3s 0.4s; }

.menu.is-visible .navigation li:nth-of-type(4) {
  opacity: 1;
  -webkit-transform: translateY(0);
  -moz-transform: translateY(0);
  -ms-transform: translateY(0);
  transform: translateY(0);
  -webkit-transition: opacity 0.3s 0.5s, -webkit-transform 0.3s 0.5s;
  transition: opacity 0.3s 0.5s, -webkit-transform 0.3s 0.5s;
  -o-transition: transform 0.3s 0.5s, opacity 0.3s 0.5s;
  -moz-transition: transform 0.3s 0.5s, opacity 0.3s 0.5s, -moz-transform 0.3s 0.5s;
  transition: transform 0.3s 0.5s, opacity 0.3s 0.5s;
  transition: transform 0.3s 0.5s, opacity 0.3s 0.5s, -webkit-transform 0.3s 0.5s, -moz-transform 0.3s 0.5s; }

.menu.is-visible .navigation li:nth-of-type(5) {
  opacity: 1;
  -webkit-transform: translateY(0);
  -moz-transform: translateY(0);
  -ms-transform: translateY(0);
  transform: translateY(0);
  -webkit-transition: opacity 0.3s 0.6s, -webkit-transform 0.3s 0.6s;
  transition: opacity 0.3s 0.6s, -webkit-transform 0.3s 0.6s;
  -o-transition: transform 0.3s 0.6s, opacity 0.3s 0.6s;
  -moz-transition: transform 0.3s 0.6s, opacity 0.3s 0.6s, -moz-transform 0.3s 0.6s;
  transition: transform 0.3s 0.6s, opacity 0.3s 0.6s;
  transition: transform 0.3s 0.6s, opacity 0.3s 0.6s, -webkit-transform 0.3s 0.6s, -moz-transform 0.3s 0.6s; }

.menu.is-visible .navigation li:nth-of-type(6) {
  opacity: 1;
  -webkit-transform: translateY(0);
  -moz-transform: translateY(0);
  -ms-transform: translateY(0);
  transform: translateY(0);
  -webkit-transition: opacity 0.3s 0.7s, -webkit-transform 0.3s 0.7s;
  transition: opacity 0.3s 0.7s, -webkit-transform 0.3s 0.7s;
  -o-transition: transform 0.3s 0.7s, opacity 0.3s 0.7s;
  -moz-transition: transform 0.3s 0.7s, opacity 0.3s 0.7s, -moz-transform 0.3s 0.7s;
  transition: transform 0.3s 0.7s, opacity 0.3s 0.7s;
  transition: transform 0.3s 0.7s, opacity 0.3s 0.7s, -webkit-transform 0.3s 0.7s, -moz-transform 0.3s 0.7s; }

.menu.is-visible .navigation li:nth-of-type(7) {
  opacity: 1;
  -webkit-transform: translateY(0);
  -moz-transform: translateY(0);
  -ms-transform: translateY(0);
  transform: translateY(0);
  -webkit-transition: opacity 0.3s 0.8s, -webkit-transform 0.3s 0.8s;
  transition: opacity 0.3s 0.8s, -webkit-transform 0.3s 0.8s;
  -o-transition: transform 0.3s 0.8s, opacity 0.3s 0.8s;
  -moz-transition: transform 0.3s 0.8s, opacity 0.3s 0.8s, -moz-transform 0.3s 0.8s;
  transition: transform 0.3s 0.8s, opacity 0.3s 0.8s;
  transition: transform 0.3s 0.8s, opacity 0.3s 0.8s, -webkit-transform 0.3s 0.8s, -moz-transform 0.3s 0.8s; }

.menu.is-visible .menu-socials {
  opacity: 1;
  -webkit-transform: translateY(0);
  -moz-transform: translateY(0);
  -ms-transform: translateY(0);
  transform: translateY(0);
  -webkit-transition: opacity 0.3s 0.9s, -webkit-transform 0.3s 0.9s;
  transition: opacity 0.3s 0.9s, -webkit-transform 0.3s 0.9s;
  -o-transition: transform 0.3s 0.9s, opacity 0.3s 0.9s;
  -moz-transition: transform 0.3s 0.9s, opacity 0.3s 0.9s, -moz-transform 0.3s 0.9s;
  transition: transform 0.3s 0.9s, opacity 0.3s 0.9s;
  transition: transform 0.3s 0.9s, opacity 0.3s 0.9s, -webkit-transform 0.3s 0.9s, -moz-transform 0.3s 0.9s; }

.menu__content {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100vh;
  background-color: #DEF3D6;
  padding: 2.4rem 0;
  overflow-y: auto;
  z-index: 2; }

@media only screen and (min-width: 1200px) {
  .menu__content {
    padding: 0; } }
.menu__logo {
  position: relative;
  padding: 1rem 0;
  opacity: 0;
  -webkit-transform: translateY(50px);
  -moz-transform: translateY(50px);
  -ms-transform: translateY(50px);
  transform: translateY(50px);
  -webkit-transition: opacity 0.3s, -webkit-transform 0.3s;
  transition: opacity 0.3s, -webkit-transform 0.3s;
  -o-transition: opacity 0.3s, transform 0.3s;
  -moz-transition: opacity 0.3s, transform 0.3s, -moz-transform 0.3s;
  transition: opacity 0.3s, transform 0.3s;
  transition: opacity 0.3s, transform 0.3s, -webkit-transform 0.3s, -moz-transform 0.3s; }

.menu__logo img {
  width: 100%;
  margin: 0 auto;
  display: block; }
  @media only screen and (max-width: 576px) {
    .menu__logo img {
      width: 100%; } }
  @media only screen and (min-width: 576.5px) {
    .menu__logo img {
      width: 70%; } }
  @media only screen and (min-width: 990px) {
    .menu__logo img {
      width: 60%; } }
  @media only screen and (min-width: 1200px) {
    .menu__logo img {
      width: 50%; } }

@media only screen and (min-width: 1200px) {
  .menu__logo {
    width: 100%;
    padding: 2.4rem 0; } }
@media only screen and (min-width: 1400px) {
  .menu__logo {
    padding: 4rem 0; } }
.menu__navigation {
  position: relative;
  text-align: center;
  padding: 0rem 0; }

@media only screen and (min-width: 1200px) {
  .menu__navigation {
    padding: 2rem 0; } }
@media only screen and (min-width: 1400px) {
  .menu__navigation {
    padding: 2rem 0; } }
.menu-socials {
  opacity: 0;
  -webkit-transform: translateY(50px);
  -moz-transform: translateY(50px);
  -ms-transform: translateY(50px);
  transform: translateY(50px); }

.navigation {
  display: block;
  position: relative; }

ul.navigation {
  text-align: center; }

ul.navigation li:nth-of-type(2) a {
  padding-bottom: 0; }

ul.navigation li:nth-of-type(3) a {
  padding-bottom: 2rem; }

.navigation li {
  display: block;
  position: relative;
  opacity: 0;
  -webkit-transform: translateY(50px);
  -moz-transform: translateY(50px);
  -ms-transform: translateY(50px);
  transform: translateY(50px);
  -webkit-transition: opacity 0.3s, -webkit-transform 0.3s;
  transition: opacity 0.3s, -webkit-transform 0.3s;
  -o-transition: opacity 0.3s, transform 0.3s;
  -moz-transition: opacity 0.3s, transform 0.3s, -moz-transform 0.3s;
  transition: opacity 0.3s, transform 0.3s;
  transition: opacity 0.3s, transform 0.3s, -webkit-transform 0.3s, -moz-transform 0.3s;
  margin: 0 !important; }
  @media only screen and (max-width: 576px) {
    .navigation li {
      margin: 0 !important; } }
  @media only screen and (min-width: 576.5px) {
    .navigation li {
      margin: 0 !important; } }

.navigation li::before {
  content: "";
  position: absolute;
  left: 50%;
  top: 50%;
  bottom: auto;
  right: auto;
  -webkit-transform: translateX(-50%) translateY(-50%);
  -moz-transform: translateX(-50%) translateY(-50%);
  -ms-transform: translateX(-50%) translateY(-50%);
  transform: translateX(-50%) translateY(-50%);
  display: block;
  width: 50px;
  height: 50px;
  background-repeat: no-repeat;
  opacity: 0;
  -webkit-transition: opacity 0.3s ease-in-out;
  -o-transition: opacity 0.3s ease-in-out;
  -moz-transition: opacity 0.3s ease-in-out;
  transition: opacity 0.3s ease-in-out; }

.navigation li a {
  display: block;
  position: relative;
  font: normal 700 2.2rem/1.1 "Zen Kaku Gothic New", sans-serif;
  padding: 1.2rem 0;
  color: rgba(39, 47, 124, 0.8);
  text-decoration: none;
  -webkit-transition: all 0.3s ease-in-out;
  -o-transition: all 0.3s ease-in-out;
  -moz-transition: all 0.3s ease-in-out;
  transition: all 0.3s ease-in-out; }

.navigation li.active::before {
  opacity: 1; }

.navigation li.active a, ul.navigation ul li {
  color: #272F7C; }

.navigation li:hover a, .navigation ul.subnavi p a:hover {
  color: #fc27a2; }

@media only screen and (min-width: 1400px) {
  .navigation li a {
    font-size: 2.6rem; } }
ul.navigation ul {
  text-align: center;
  padding: 0; }

.navigation ul.subnavi {
  opacity: 0; }

.navigation ul.subnavi p {
  font: normal 600 1.8rem/1.1 "Zen Kaku Gothic New", sans-serif;
  line-height: 3rem; }

.navigation ul.subnavi p a {
  color: rgba(39, 47, 124, 0.8); }

.menu.is-visible .navigation ul.subnavi {
  opacity: 1;
  transition: transform 0.3s 0.2s, opacity 0.3s 0.2s, -webkit-transform 0.3s 0.2s, -moz-transform 0.3s 0.2s; }

.menu__background {
  position: relative;
  width: 100%;
  height: 100vh;
  background-color: #DEF3D6;
  z-index: 0; }

.menu__shape {
  position: relative;
  height: 100vh;
  z-index: 1; }

.menu__shape .menu-transition-shape {
  fill: #DEF3D6; }

/* ------------------------------------------------*/
/* Menu End */
/* ------------------------------------------------*/
/* ------------------------------------------------*/
/* Popup Dialogs Start */
/* ------------------------------------------------*/
.popup {
  position: fixed;
  top: -200vh;
  left: 0;
  z-index: 101;
  width: 100%;
  height: 200vh; }

.popup__content {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100vh;
  background-color: #DEF3D6;
  padding: 2.4rem 0;
  overflow-y: auto;
  z-index: 2; }

@media only screen and (min-width: 1200px) {
  .popup__content {
    padding: 0; } }
.popupcontent__wrapper {
  position: relative;
  padding: 2.4rem 10%; }

.popupcontent__wrapper .popup-title__title,
.popupcontent__wrapper .popup-title__divider,
.popupcontent__wrapper .popup-title__subtitle {
  opacity: 0;
  -webkit-transform: translateY(50px);
  -moz-transform: translateY(50px);
  -ms-transform: translateY(50px);
  transform: translateY(50px);
  -webkit-transition: opacity 0.3s, -webkit-transform 0.3s;
  transition: opacity 0.3s, -webkit-transform 0.3s;
  -o-transition: opacity 0.3s, transform 0.3s;
  -moz-transition: opacity 0.3s, transform 0.3s, -moz-transform 0.3s;
  transition: opacity 0.3s, transform 0.3s;
  transition: opacity 0.3s, transform 0.3s, -webkit-transform 0.3s, -moz-transform 0.3s; }

.popupcontent__wrapper .form input,
.popupcontent__wrapper .form textarea,
.popupcontent__wrapper .form button,
.popupcontent__wrapper .form .inputs-description {
  opacity: 0;
  -webkit-transform: translateY(50px);
  -moz-transform: translateY(50px);
  -ms-transform: translateY(50px);
  transform: translateY(50px);
  -webkit-transition: opacity 0.3s, -webkit-transform 0.3s;
  transition: opacity 0.3s, -webkit-transform 0.3s;
  -o-transition: opacity 0.3s, transform 0.3s;
  -moz-transition: opacity 0.3s, transform 0.3s, -moz-transform 0.3s;
  transition: opacity 0.3s, transform 0.3s;
  transition: opacity 0.3s, transform 0.3s, -webkit-transform 0.3s, -moz-transform 0.3s; }

@media only screen and (min-width: 1200px) {
  .popupcontent__wrapper {
    padding: 0;
    width: 100%;
    position: absolute;
    top: 50%;
    bottom: auto;
    -webkit-transform: translateY(-50%);
    -moz-transform: translateY(-50%);
    -ms-transform: translateY(-50%);
    transform: translateY(-50%); } }
.popup__background {
  position: relative;
  width: 100%;
  height: 100vh;
  background-color: #DEF3D6;
  z-index: 0; }

.popup__shape {
  position: relative;
  height: 100vh;
  z-index: 1; }

.popup__shape .popup-transition-shape {
  fill: #DEF3D6; }

.popup-title {
  position: relative;
  padding: 0 0 3rem 0; }

.notify .popupcontent__wrapper.is-visible .popup-title__title {
  opacity: 1;
  -webkit-transform: translateY(0);
  -moz-transform: translateY(0);
  -ms-transform: translateY(0);
  transform: translateY(0);
  -webkit-transition: opacity 0.3s 0.2s, -webkit-transform 0.3s 0.2s;
  transition: opacity 0.3s 0.2s, -webkit-transform 0.3s 0.2s;
  -o-transition: transform 0.3s 0.2s, opacity 0.3s 0.2s;
  -moz-transition: transform 0.3s 0.2s, opacity 0.3s 0.2s, -moz-transform 0.3s 0.2s;
  transition: transform 0.3s 0.2s, opacity 0.3s 0.2s;
  transition: transform 0.3s 0.2s, opacity 0.3s 0.2s, -webkit-transform 0.3s 0.2s, -moz-transform 0.3s 0.2s; }

.notify .popupcontent__wrapper.is-visible .popup-title__divider {
  opacity: 1;
  -webkit-transform: translateY(0);
  -moz-transform: translateY(0);
  -ms-transform: translateY(0);
  transform: translateY(0);
  -webkit-transition: opacity 0.3s 0.2s, -webkit-transform 0.3s 0.2s;
  transition: opacity 0.3s 0.2s, -webkit-transform 0.3s 0.2s;
  -o-transition: transform 0.3s 0.2s, opacity 0.3s 0.2s;
  -moz-transition: transform 0.3s 0.2s, opacity 0.3s 0.2s, -moz-transform 0.3s 0.2s;
  transition: transform 0.3s 0.2s, opacity 0.3s 0.2s;
  transition: transform 0.3s 0.2s, opacity 0.3s 0.2s, -webkit-transform 0.3s 0.2s, -moz-transform 0.3s 0.2s; }

.notify .popupcontent__wrapper.is-visible .popup-title__subtitle {
  opacity: 1;
  -webkit-transform: translateY(0);
  -moz-transform: translateY(0);
  -ms-transform: translateY(0);
  transform: translateY(0);
  -webkit-transition: opacity 0.3s 0.3s, -webkit-transform 0.3s 0.3s;
  transition: opacity 0.3s 0.3s, -webkit-transform 0.3s 0.3s;
  -o-transition: transform 0.3s 0.3s, opacity 0.3s 0.3s;
  -moz-transition: transform 0.3s 0.3s, opacity 0.3s 0.3s, -moz-transform 0.3s 0.3s;
  transition: transform 0.3s 0.3s, opacity 0.3s 0.3s;
  transition: transform 0.3s 0.3s, opacity 0.3s 0.3s, -webkit-transform 0.3s 0.3s, -moz-transform 0.3s 0.3s; }

.notify .popupcontent__wrapper.is-visible .form input {
  opacity: 1;
  -webkit-transform: translateY(0);
  -moz-transform: translateY(0);
  -ms-transform: translateY(0);
  transform: translateY(0);
  -webkit-transition: opacity 0.3s 0.4s, -webkit-transform 0.3s 0.4s;
  transition: opacity 0.3s 0.4s, -webkit-transform 0.3s 0.4s;
  -o-transition: transform 0.3s 0.4s, opacity 0.3s 0.4s;
  -moz-transition: transform 0.3s 0.4s, opacity 0.3s 0.4s, -moz-transform 0.3s 0.4s;
  transition: transform 0.3s 0.4s, opacity 0.3s 0.4s;
  transition: transform 0.3s 0.4s, opacity 0.3s 0.4s, -webkit-transform 0.3s 0.4s, -moz-transform 0.3s 0.4s; }

.notify .popupcontent__wrapper.is-visible .form .inputs-description {
  opacity: 1;
  -webkit-transform: translateY(0);
  -moz-transform: translateY(0);
  -ms-transform: translateY(0);
  transform: translateY(0);
  -webkit-transition: opacity 0.3s 0.5s, -webkit-transform 0.3s 0.5s;
  transition: opacity 0.3s 0.5s, -webkit-transform 0.3s 0.5s;
  -o-transition: transform 0.3s 0.5s, opacity 0.3s 0.5s;
  -moz-transition: transform 0.3s 0.5s, opacity 0.3s 0.5s, -moz-transform 0.3s 0.5s;
  transition: transform 0.3s 0.5s, opacity 0.3s 0.5s;
  transition: transform 0.3s 0.5s, opacity 0.3s 0.5s, -webkit-transform 0.3s 0.5s, -moz-transform 0.3s 0.5s; }

.notify .popupcontent__wrapper.is-visible .form button {
  opacity: 1;
  -webkit-transform: translateY(0);
  -moz-transform: translateY(0);
  -ms-transform: translateY(0);
  transform: translateY(0);
  -webkit-transition: opacity 0.3s 0.6s, background-color 0.5s, border 0.5s, -webkit-transform 0.3s 0.6s;
  transition: opacity 0.3s 0.6s, background-color 0.5s, border 0.5s, -webkit-transform 0.3s 0.6s;
  -o-transition: transform 0.3s 0.6s, opacity 0.3s 0.6s, background-color 0.5s, border 0.5s;
  -moz-transition: transform 0.3s 0.6s, opacity 0.3s 0.6s, background-color 0.5s, border 0.5s, -moz-transform 0.3s 0.6s;
  transition: transform 0.3s 0.6s, opacity 0.3s 0.6s, background-color 0.5s, border 0.5s;
  transition: transform 0.3s 0.6s, opacity 0.3s 0.6s, background-color 0.5s, border 0.5s, -webkit-transform 0.3s 0.6s, -moz-transform 0.3s 0.6s; }

.writealine .popupcontent__wrapper.is-visible .popup-title__title {
  opacity: 1;
  -webkit-transform: translateY(0);
  -moz-transform: translateY(0);
  -ms-transform: translateY(0);
  transform: translateY(0);
  -webkit-transition: opacity 0.3s 0.2s, -webkit-transform 0.3s 0.2s;
  transition: opacity 0.3s 0.2s, -webkit-transform 0.3s 0.2s;
  -o-transition: transform 0.3s 0.2s, opacity 0.3s 0.2s;
  -moz-transition: transform 0.3s 0.2s, opacity 0.3s 0.2s, -moz-transform 0.3s 0.2s;
  transition: transform 0.3s 0.2s, opacity 0.3s 0.2s;
  transition: transform 0.3s 0.2s, opacity 0.3s 0.2s, -webkit-transform 0.3s 0.2s, -moz-transform 0.3s 0.2s; }

.writealine .popupcontent__wrapper.is-visible .popup-title__divider {
  opacity: 1;
  -webkit-transform: translateY(0);
  -moz-transform: translateY(0);
  -ms-transform: translateY(0);
  transform: translateY(0);
  -webkit-transition: opacity 0.3s 0.2s, -webkit-transform 0.3s 0.2s;
  transition: opacity 0.3s 0.2s, -webkit-transform 0.3s 0.2s;
  -o-transition: transform 0.3s 0.2s, opacity 0.3s 0.2s;
  -moz-transition: transform 0.3s 0.2s, opacity 0.3s 0.2s, -moz-transform 0.3s 0.2s;
  transition: transform 0.3s 0.2s, opacity 0.3s 0.2s;
  transition: transform 0.3s 0.2s, opacity 0.3s 0.2s, -webkit-transform 0.3s 0.2s, -moz-transform 0.3s 0.2s; }

.writealine .popupcontent__wrapper.is-visible .popup-title__subtitle {
  opacity: 1;
  -webkit-transform: translateY(0);
  -moz-transform: translateY(0);
  -ms-transform: translateY(0);
  transform: translateY(0);
  -webkit-transition: opacity 0.3s 0.3s, -webkit-transform 0.3s 0.3s;
  transition: opacity 0.3s 0.3s, -webkit-transform 0.3s 0.3s;
  -o-transition: transform 0.3s 0.3s, opacity 0.3s 0.3s;
  -moz-transition: transform 0.3s 0.3s, opacity 0.3s 0.3s, -moz-transform 0.3s 0.3s;
  transition: transform 0.3s 0.3s, opacity 0.3s 0.3s;
  transition: transform 0.3s 0.3s, opacity 0.3s 0.3s, -webkit-transform 0.3s 0.3s, -moz-transform 0.3s 0.3s; }

.writealine .popupcontent__wrapper.is-visible .form input[type=text] {
  opacity: 1;
  -webkit-transform: translateY(0);
  -moz-transform: translateY(0);
  -ms-transform: translateY(0);
  transform: translateY(0);
  -webkit-transition: opacity 0.3s 0.4s, -webkit-transform 0.3s 0.4s;
  transition: opacity 0.3s 0.4s, -webkit-transform 0.3s 0.4s;
  -o-transition: transform 0.3s 0.4s, opacity 0.3s 0.4s;
  -moz-transition: transform 0.3s 0.4s, opacity 0.3s 0.4s, -moz-transform 0.3s 0.4s;
  transition: transform 0.3s 0.4s, opacity 0.3s 0.4s;
  transition: transform 0.3s 0.4s, opacity 0.3s 0.4s, -webkit-transform 0.3s 0.4s, -moz-transform 0.3s 0.4s; }

.writealine .popupcontent__wrapper.is-visible .form input[type=email] {
  opacity: 1;
  -webkit-transform: translateY(0);
  -moz-transform: translateY(0);
  -ms-transform: translateY(0);
  transform: translateY(0);
  -webkit-transition: opacity 0.3s 0.5s, -webkit-transform 0.3s 0.5s;
  transition: opacity 0.3s 0.5s, -webkit-transform 0.3s 0.5s;
  -o-transition: transform 0.3s 0.5s, opacity 0.3s 0.5s;
  -moz-transition: transform 0.3s 0.5s, opacity 0.3s 0.5s, -moz-transform 0.3s 0.5s;
  transition: transform 0.3s 0.5s, opacity 0.3s 0.5s;
  transition: transform 0.3s 0.5s, opacity 0.3s 0.5s, -webkit-transform 0.3s 0.5s, -moz-transform 0.3s 0.5s; }

.writealine .popupcontent__wrapper.is-visible .form textarea {
  opacity: 1;
  -webkit-transform: translateY(0);
  -moz-transform: translateY(0);
  -ms-transform: translateY(0);
  transform: translateY(0);
  -webkit-transition: opacity 0.3s 0.6s, -webkit-transform 0.3s 0.6s;
  transition: opacity 0.3s 0.6s, -webkit-transform 0.3s 0.6s;
  -o-transition: transform 0.3s 0.6s, opacity 0.3s 0.6s;
  -moz-transition: transform 0.3s 0.6s, opacity 0.3s 0.6s, -moz-transform 0.3s 0.6s;
  transition: transform 0.3s 0.6s, opacity 0.3s 0.6s;
  transition: transform 0.3s 0.6s, opacity 0.3s 0.6s, -webkit-transform 0.3s 0.6s, -moz-transform 0.3s 0.6s; }

.writealine .popupcontent__wrapper.is-visible .form .inputs-description {
  opacity: 1;
  -webkit-transform: translateY(0);
  -moz-transform: translateY(0);
  -ms-transform: translateY(0);
  transform: translateY(0);
  -webkit-transition: opacity 0.3s 0.7s, -webkit-transform 0.3s 0.7s;
  transition: opacity 0.3s 0.7s, -webkit-transform 0.3s 0.7s;
  -o-transition: transform 0.3s 0.7s, opacity 0.3s 0.7s;
  -moz-transition: transform 0.3s 0.7s, opacity 0.3s 0.7s, -moz-transform 0.3s 0.7s;
  transition: transform 0.3s 0.7s, opacity 0.3s 0.7s;
  transition: transform 0.3s 0.7s, opacity 0.3s 0.7s, -webkit-transform 0.3s 0.7s, -moz-transform 0.3s 0.7s; }

.writealine .popupcontent__wrapper.is-visible .form button {
  opacity: 1;
  -webkit-transform: translateY(0);
  -moz-transform: translateY(0);
  -ms-transform: translateY(0);
  transform: translateY(0);
  -webkit-transition: opacity 0.3s 0.8s, background-color 0.5s, border 0.5s, -webkit-transform 0.3s 0.8s;
  transition: opacity 0.3s 0.8s, background-color 0.5s, border 0.5s, -webkit-transform 0.3s 0.8s;
  -o-transition: transform 0.3s 0.8s, opacity 0.3s 0.8s, background-color 0.5s, border 0.5s;
  -moz-transition: transform 0.3s 0.8s, opacity 0.3s 0.8s, background-color 0.5s, border 0.5s, -moz-transform 0.3s 0.8s;
  transition: transform 0.3s 0.8s, opacity 0.3s 0.8s, background-color 0.5s, border 0.5s;
  transition: transform 0.3s 0.8s, opacity 0.3s 0.8s, background-color 0.5s, border 0.5s, -webkit-transform 0.3s 0.8s, -moz-transform 0.3s 0.8s; }

/* ------------------------------------------------*/
/* Popup Dialogs End */
/* ------------------------------------------------*/
/* ------------------------------------------------*/
/* Inner Sections Start */
/* ------------------------------------------------*/
.inner {
  position: relative;
  background-color: #ffffff; }
  .inner inner.both {
    padding: 8rem 0; }

.inner-s {
  padding-top: 1rem 0 8rem;
  position: relative;
  background-color: #ffffff; }

.inner__media {
  background-repeat: no-repeat;
  background-position: center center;
  -moz-background-size: cover;
  background-size: cover; }

@media only screen and (min-width: 1200px) {
  .inner__media {
    height: auto; } }
.media__image {
  position: relative;
  background-repeat: no-repeat;
  background-position: center center;
  -moz-background-size: cover;
  background-size: cover; }

.media__image.top-position {
  background-position: top center; }

@media only screen and (min-width: 768px) {
  .media__image {
    height: 760px; } }
@media only screen and (min-width: 1200px) {
  .media__image {
    height: 100%; } }
.inner__content {
  position: relative;
  overflow: hidden; }

.content-block {
  position: relative;
  width: 100%; }
  @media only screen and (max-width: 576px) {
    .content-block {
      padding: 6rem 1rem 6rem; } }
  @media only screen and (min-width: 576.5px) {
    .content-block {
      padding: 10rem 5% 10rem; } }

.content-block-continue1 {
  position: relative;
  width: 100%;
  height: auto; }
  @media only screen and (max-width: 576px) {
    .content-block-continue1 {
      padding: 6rem 1rem 0; } }
  @media only screen and (min-width: 576.5px) {
    .content-block-continue1 {
      padding: 10rem 5% 0; } }

.content-block-continue2 {
  position: relative;
  width: 100%;
  height: auto; }
  @media only screen and (max-width: 576px) {
    .content-block-continue2 {
      padding: 0 1rem 6rem; } }
  @media only screen and (min-width: 576.5px) {
    .content-block-continue2 {
      padding: 0 5% 10rem; } }

.content-block-continue3 {
  position: relative;
  width: 100%;
  height: auto; }
  @media only screen and (max-width: 576px) {
    .content-block-continue3 {
      padding: 0 1rem 0; } }
  @media only screen and (min-width: 576.5px) {
    .content-block-continue3 {
      padding: 0 5% 0rem; } }

.content-block-end {
  position: relative;
  width: 100%;
  margin: 1rem 0 0;
  height: auto; }
  @media only screen and (max-width: 576px) {
    .content-block-end {
      padding: 0 1rem 0; } }
  @media only screen and (min-width: 576.5px) {
    .content-block-end {
      padding: 0 5% 0rem; } }

.content-block-end2 {
  position: relative;
  width: 100%;
  margin-top: -50px;
  height: auto; }
  @media only screen and (max-width: 576px) {
    .content-block-end2 {
      padding: 0 1rem 3rem; } }
  @media only screen and (min-width: 576.5px) {
    .content-block-end2 {
      padding: 0 5% 5rem; } }

.content-block.footer-block {
  padding: 2rem 2%; }

@media only screen and (min-width: 1200px) {
  .content-block, .content-block-continue1, .content-block-continue2, .content-block-continue3 {
    position: relative;
    left: 0;
    top: 50%;
    bottom: auto;
    -webkit-transform: translateY(-50%);
    -moz-transform: translateY(-50%);
    -ms-transform: translateY(-50%);
    transform: translateY(-50%); }

  .content-block {
    padding: 10rem 10%; }

  .content-block-continue1 {
    padding: 10rem 10% 0; }

  .content-block-continue2 {
    padding: 0 10% 10rem; }

  .content-block-continue3 {
    padding: 0 10% 0; }

  .content-block.auto-height {
    position: relative;
    top: auto;
    left: auto;
    -webkit-transform: translateX(0);
    -moz-transform: translateX(0);
    -ms-transform: translateX(0);
    transform: translateX(0);
    padding: 10rem; }

  .content-block.additional-block {
    padding: 10rem; }

  .content-block.footer-block {
    padding: 2rem 2%; } }
@media only screen and (min-width: 1400px) {
  .content-block.comp {
    padding: 4rem 14rem; }

  .content-block.auto-height {
    padding: 12rem 14rem; }

  .content-block.centered {
    padding: 12rem 14rem; }

  .content-block.footer-block {
    padding: 2rem 2%; } }
@media only screen and (min-width: 1600px) {
  .content-block {
    padding: 10rem 15%; }

  .content-block-continue1 {
    padding: 10rem 15% 0; }

  .content-block-continue2 {
    padding: 0 15% 10rem; }

  .content-block-continue3 {
    padding: 0 15% 0; } }
.section-title {
  position: relative; }

.section-title.top {
  margin-top: 4rem; }

.section-title.centered {
  text-align: center; }

.quote-object {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  padding: 3rem 10%; }

@media only screen and (min-width: 1200px) {
  .quote-object {
    padding: 3rem; } }
@media only screen and (min-width: 1400px) {
  .quote-object {
    padding: 4rem; } }
.quote-morphing-object {
  fill: #f7f7f7; }

.footer {
  text-align: center; }

.footer__logo img {
  width: auto;
  margin: 0 auto; }

.footer__slogan {
  margin-top: 1.8rem; }

.footer__socials {
  margin-top: 2.6rem; }

/* ------------------------------------------------*/
/* Inner Sections End */
/* ------------------------------------------------*/
/* ------------------------------------------------*/
/* Features Start */
/* ------------------------------------------------*/
.features {
  position: relative; }

.features__image {
  height: 300px;
  background-repeat: no-repeat;
  background-position: center;
  -moz-background-size: cover;
  background-size: cover; }

@media only screen and (min-width: 768px) {
  .features__image {
    height: 360px; } }
@media only screen and (min-width: 1200px) {
  .features__image {
    height: 50vh; } }
.features__item {
  position: relative;
  height: auto;
  padding: 7.2rem 10%; }

@media only screen and (min-width: 768px) {
  .features__item {
    height: 360px;
    padding: 0; } }
@media only screen and (min-width: 1200px) {
  .features__item {
    height: 50vh; } }
.featuresitem__descr {
  width: 100%; }

@media only screen and (min-width: 768px) {
  .featuresitem__descr {
    position: absolute;
    top: 50%;
    bottom: auto;
    -webkit-transform: translateY(-50%);
    -moz-transform: translateY(-50%);
    -ms-transform: translateY(-50%);
    transform: translateY(-50%);
    padding: 0 8rem; } }
@media only screen and (min-width: 768px) {
  .features-scroll .features__item {
    height: auto;
    padding: 7.2rem 10%; }

  .features-scroll .featuresitem__descr {
    position: relative;
    top: auto;
    -webkit-transform: translateY(0);
    -moz-transform: translateY(0);
    -ms-transform: translateY(0);
    transform: translateY(0);
    padding: 0 8rem; }

  .features-scroll .features__image {
    height: 300px; } }
@media only screen and (min-width: 992px) {
  .features-scroll .features__item {
    height: 360px;
    padding: 0; }

  .features-scroll .featuresitem__descr {
    position: absolute;
    top: 50%;
    bottom: auto;
    -webkit-transform: translateY(-50%);
    -moz-transform: translateY(-50%);
    -ms-transform: translateY(-50%);
    transform: translateY(-50%);
    padding: 0 7.2rem; }

  .features-scroll .features__image {
    height: 360px; } }
@media only screen and (min-width: 1200px) {
  .features-scroll .features__item,
  .features-scroll .features__image {
    height: 50vh; } }
/* ------------------------------------------------*/
/* Features End */
/* ------------------------------------------------*/
/* ------------------------------------------------*/
/* Forum Page */
/* ------------------------------------------------*/
img.frmain {
  width: 85%;
  border-radius: 30px;
  margin-bottom: 10px; }
  @media all and (max-width: 480px) {
    img.frmain {
      width: 100%;
      border-radius: 20px;
      margin-top: 30px;
      margin-bottom: 10px; } }
  @media all and (min-width: 1200px) {
    img.frmain {
      width: 70%;
      border-radius: 50px; } }

a#frlogo {
  position: absolute;
  left: 20px;
  top: 15px;
  display: block; }
  @media all and (max-width: 480px) {
    a#frlogo {
      left: 0px;
      top: 0px; } }
  @media (min-width: 481px) and (max-width: 767px) {
    a#frlogo {
      left: 0px;
      top: 0px; } }
  @media all and (min-width: 1200px) {
    a#frlogo {
      left: 150px;
      top: 0px; } }

img.frlogo {
  width: 100%; }
  @media all and (max-width: 480px) {
    img.frlogo {
      width: 100px; } }
  @media (min-width: 481px) and (max-width: 767px) {
    img.frlogo {
      width: 75%; } }

p.forum {
  font-size: 2rem;
  line-height: 3.6rem;
  color: #333333; }
  @media only screen and (max-width: 576px) {
    p.forum {
      font-size: 1.8rem;
      line-height: 3rem;
      padding: 0rem; } }
  @media only screen and (min-width: 768px) {
    p.forum {
      font-size: 2rem;
      line-height: 3.4rem;
      padding: 1rem 2rem; } }
  @media only screen and (min-width: 1200px) {
    p.forum {
      font-size: 2.2rem;
      line-height: 4rem;
      padding: 1rem 4rem; } }

@media only screen and (max-width: 576px) {
  h3.forum {
    padding: 1rem 0rem; } }
@media only screen and (min-width: 768px) {
  h3.forum {
    padding: 2rem 2rem; } }
@media only screen and (min-width: 1200px) {
  h3.forum {
    padding: 2rem 3rem; } }

@media only screen and (max-width: 576px) {
  h3.forum_t2 {
    padding: 1rem 0rem; } }
@media only screen and (min-width: 768px) {
  h3.forum_t2 {
    padding: 1rem 1rem; } }
@media only screen and (min-width: 1200px) {
  h3.forum_t2 {
    padding: 1rem 2rem; } }

.section1, .section2, .section3 {
  max-width: 1024px;
  margin: 0 auto;
  padding: 1rem; }

/* table1 */
.section1 table {
  width: 100%;
  border-collapse: separate;
  border-spacing: 0;
  font-size: 14px;
  color: black; }

.section1 table th {
  width: 75%;
  background: #AAFAC9;
  border-top-left-radius: 20px;
  border-top-right-radius: 20px;
  box-sizing: border-box;
  padding: 10px;
  vertical-align: middle;
  font-weight: bold;
  text-align: center; }
  .section1 table th h5 {
    margin: 1rem;
    font-size: 1.1rem;
    line-height: 1.5rem;
    font-weight: 700; }

.section1 table td {
  background: #fff;
  border-bottom-left-radius: 20px;
  border-bottom-right-radius: 20px;
  border: 0px;
  box-sizing: border-box;
  padding: 20px;
  vertical-align: top;
  text-align: left; }
  .section1 table td p {
    margin-bottom: 0rem; }

.section1 table thead tr {
  background-color: #fd6767;
  color: #fff; }

@media all and (max-width: 767px) {
  .section1 table th, table td {
    display: block;
    width: 100%;
    border-bottom: none; }

  .section1 table tr:last-child td:last-child {
    border-bottom: 1px solid #ccc; } }
/* table2 */
.section2 table {
  width: 100%;
  border-collapse: collapse;
  border-spacing: 0;
  color: black; }

.section2 table thead th {
  background: #efe6dd;
  vertical-align: middle; }

.section2 table th {
  width: 22%;
  vertical-align: middle;
  font-weight: bold;
  text-align: center; }

.section2 table td {
  padding: 15px;
  vertical-align: middle;
  text-align: left;
  line-height: 2.4rem; }

.section2 table tr {
  background-color: #fff;
  border-bottom: 2px solid #fff; }

.section2 table tr:nth-child(even) {
  background-color: #efe6dd; }

@media all and (max-width: 480px) {
  .section2 table th {
    width: 26%;
    padding: 8px; } }
/* section3 */
.section3 h4 {
  font-size: 1.8rem;
  font-weight: 600;
  padding-bottom: 1rem; }
.section3 h5 {
  font-size: 1.6rem;
  font-weight: 600; }
.section3 p {
  line-height: 1.6rem; }
.section3 p.sm {
  font-size: 1.4rem; }
  .section3 p.sm a:hover {
    opacity: 0.8; }

.section3 table {
  width: 100%;
  border-collapse: collapse;
  border-spacing: 0;
  color: black; }

.section3 table thead th {
  background: #efe6dd;
  vertical-align: middle; }

.section3 table th {
  width: 22%;
  vertical-align: middle;
  font-weight: bold;
  text-align: center; }

.section3 table td {
  padding: 1rem 2rem;
  vertical-align: middle;
  text-align: left;
  line-height: 2.4rem; }

.section3 table tr {
  background-color: #fff;
  border-bottom: 2px solid #fff; }

.section3 table tr:nth-child(odd) {
  background-color: #efe6dd; }

@media all and (max-width: 480px) {
  .section3 table th {
    width: 26%;
    padding: 8px; } }
/* section3 end */
hr {
  margin: 50px 0;
  border-color: #fff; }

@media all and (min-width: 481px) {
  .sp-only {
    display: none; } }
@media all and (max-width: 480px) {
  .sp-only {
    display: block; } }

@media all and (min-width: 768px) {
  .md-only {
    display: none; } }
@media all and (max-width: 767px) {
  .md-only {
    display: block; } }

@media all and (max-width: 767px) {
  .splg-only {
    display: block; } }
@media (min-width: 768px) and (max-width: 1199px) {
  .splg-only {
    display: none; } }
@media all and (min-width: 1200px) {
  .splg-only {
    display: block; } }

.imgsize_forumphoto {
  margin: 0 auto; }
  @media only screen and (max-width: 576px) {
    .imgsize_forumphoto {
      width: 50%; } }
  @media (min-width: 576.5px) and (max-width: 767px) {
    .imgsize_forumphoto {
      width: 100%; } }
  @media (min-width: 767.5px) and (max-width: 992px) {
    .imgsize_forumphoto {
      width: 80%; } }
  @media only screen and (min-width: 992.5px) {
    .imgsize_forumphoto {
      width: 70%; } }

p.descr {
  text-align: center;
  font-weight: 600;
  line-height: 3rem;
  text-decoration: underline solid 8px yellow;
  -webkit-text-decoration-line: underline;
  -webkit-text-decoration-style: solid;
  -webkit-text-decoration-thickness: 8px;
  -webkit-text-decoration-color: yellow; }
  @media all and (min-width: 1200px) {
    p.descr {
      padding: 2rem 5rem; } }
  @media (min-width: 481px) and (max-width: 767px) {
    p.descr {
      padding: 2rem 2rem; } }
  @media all and (max-width: 480px) {
    p.descr {
      padding: 1rem 0.5rem 1rem 0.8rem; } }

a.btn_1, .btn_1, .btn_2 {
  border: none;
  color: #fff;
  background: #1dbe72;
  outline: none;
  cursor: pointer;
  display: inline-block;
  text-decoration: none;
  padding: 2rem;
  color: #fff;
  font-weight: 600;
  text-align: center;
  line-height: 1;
  border-radius: 25px;
  box-shadow: 0px 0px 30px 0px rgba(0, 0, 0, 0.2); }

a.btn_1:hover, .btn_1:hover {
  background-color: #d80075; }

a.btn_2:hover, .btn_2:hover {
  color: #000; }

a.btn_1.yellow, .btn_1.yellow {
  background: #d80075;
  color: #fff; }

a.btn_1.yellow:hover, .btn_1.yellow:hover {
  background: #fff27d;
  color: #000; }

/* ------------------------------------------------*/
/* Forum Page End */
/* ------------------------------------------------*/
/* ------------------------------------------------*/
/* Form Page */
/* ------------------------------------------------*/
.forumbg {
  background-image: url(../youth-forum/img/bg.jpg);
  background-size: contain;
  background-color: #ffe664; }

#wizard_container {
  width: 70%; }
  @media (max-width: 991px) {
    #wizard_container {
      width: 80%; } }
  @media (max-width: 767px) {
    #wizard_container {
      width: 100%; } }

#middle-wizard {
  font-family: 'M PLUS 1p', メイリオ, Meiryo, "ＭＳ Ｐゴシック", "MS PGothic", "ヒラギノ角ゴ Pro W3", "Hiragino Kaku Gothic Pro", Osaka, Helvetica, sans-serif;
  text-align: left;
  font-size: 1.6rem; }

.content-center {
  padding: 40px 30px 0 30px;
  padding: 0px;
  height: 100%;
  min-height: 100%;
  display: flex;
  justify-content: center;
  align-items: center; }

@media (max-width: 991px) {
  .content-center {
    height: auto;
    padding: 30px 15px; } }
.form-group textarea, .form-group input {
  font-size: 12px; }

/*フォームのフォーカスOFF*/
.form-group {
  padding-bottom: 3rem;
  position: relative; }

.form-group.terms {
  background-color: #f9f9f9;
  padding: 12px 0 0 0;
  text-align: left;
  padding: 8px 5px 10px 8px;
  margin-bottom: 3rem; }

.form-group.terms .container_check {
  margin-bottom: 3px; }

.form-group i {
  font-size: 18px;
  font-size: 1.125rem;
  position: absolute;
  right: 5px;
  top: 11px;
  color: #ccc;
  width: 25px;
  height: 25px;
  display: block;
  font-weight: 400 !important; }

span.error {
  -moz-transition: all 0.3s ease-in-out;
  -o-transition: all 0.3s ease-in-out;
  -webkit-transition: all 0.3s ease-in-out;
  -ms-transition: all 0.3s ease-in-out;
  transition: all 0.3s ease-in-out;
  font-size: 12px;
  position: absolute;
  -webkit-border-radius: 3px;
  -moz-border-radius: 3px;
  border-radius: 3px;
  top: -20px;
  right: -15px;
  z-index: 2;
  height: 25px;
  line-height: 1;
  background-color: #e34f4f;
  color: #fff;
  font-weight: normal;
  display: inline-block;
  padding: 6px 8px; }

span.error:after {
  content: '';
  position: absolute;
  border-style: solid;
  border-width: 0 6px 6px 0;
  border-color: transparent #e34f4f;
  display: block;
  width: 0;
  z-index: 1;
  bottom: -6px;
  left: 20%; }

.container_radio.version_2 .error, .container_check.version_2 .error {
  left: -15px;
  top: -30px;
  right: inherit; }

.radio_input .error {
  left: -15px;
  top: -30px;
  right: inherit; }

.styled-select span.error {
  top: -20px; }

.terms span.error {
  top: -30px;
  left: -15px;
  right: inherit; }

.form-control {
  border: 1px solid #ddd;
  -webkit-border-radius: 3px;
  -moz-border-radius: 3px;
  -ms-border-radius: 3px;
  border-radius: 3px;
  font-size: 16px;
  font-size: 1rem;
  height: calc(2.65rem + 2px); }

.form-control:focus {
  box-shadow: none;
  border-color: #1dbe72; }

/* Checkbox style */
.container_check {
  display: block;
  position: relative;
  font-size: 1.6rem;
  padding-left: 30px;
  line-height: 1.3;
  margin-bottom: 10px;
  cursor: pointer;
  -webkit-user-select: none;
  -moz-user-select: none;
  -ms-user-select: none;
  user-select: none;
  font-weight: 400; }

.container_check input {
  position: absolute;
  opacity: 0;
  cursor: pointer; }

.container_check input:checked ~ .checkmark {
  background-color: #1dbe72;
  border: 1px solid transparent; }

.container_check .checkmark {
  position: absolute;
  top: 0;
  left: 0;
  height: 20px;
  width: 20px;
  border: 1px solid #ddd;
  background-color: #fff;
  -webkit-border-radius: 3px;
  -moz-border-radius: 3px;
  -ms-border-radius: 3px;
  border-radius: 3px;
  -moz-transition: all 0.3s ease-in-out;
  -o-transition: all 0.3s ease-in-out;
  -webkit-transition: all 0.3s ease-in-out;
  -ms-transition: all 0.3s ease-in-out;
  transition: all 0.3s ease-in-out; }

.container_check .checkmark:after {
  content: "";
  position: absolute;
  display: none;
  left: 7px;
  top: 3px;
  width: 5px;
  height: 10px;
  border: solid white;
  border-width: 0 2px 2px 0;
  -webkit-transform: rotate(45deg);
  -ms-transform: rotate(45deg);
  transform: rotate(45deg); }

.container_check.version_2 {
  padding: 13px 15px 13px 45px;
  background-color: #fff;
  -webkit-border-radius: 3px;
  -moz-border-radius: 3px;
  -ms-border-radius: 3px;
  border-radius: 3px;
  border: 1px solid #ddd;
  min-height: 30px;
  font-weight: 400; }

.container_check.version_2 .checkmark {
  height: 24px;
  width: 24px;
  top: 10px;
  left: 10px; }

.container_check.version_2 .checkmark:after {
  top: 5px;
  left: 8px;
  width: 5px;
  height: 10px; }

.container_check input:checked ~ .checkmark:after {
  display: block; }

/* Radio buttons */
.container_radio {
  display: block;
  position: relative;
  font-size: 14px;
  font-size: 1.4rem;
  padding-left: 30px;
  line-height: 1.3;
  margin-bottom: 10px;
  cursor: pointer;
  -webkit-user-select: none;
  -moz-user-select: none;
  -ms-user-select: none;
  user-select: none; }

.container_radio input {
  position: absolute;
  opacity: 0; }

.container_radio input:checked ~ .checkmark:after {
  opacity: 1; }

.container_radio .checkmark {
  position: absolute;
  top: 0;
  left: 0;
  height: 20px;
  width: 20px;
  background-color: #fff;
  border: 1px solid #ccc;
  border-radius: 50%; }

.container_radio .checkmark:after {
  display: block;
  content: "";
  position: absolute;
  opacity: 0;
  -moz-transition: all 0.3s ease-in-out;
  -o-transition: all 0.3s ease-in-out;
  -webkit-transition: all 0.3s ease-in-out;
  -ms-transition: all 0.3s ease-in-out;
  transition: all 0.3s ease-in-out;
  top: 3px;
  left: 3px;
  width: 12px;
  height: 12px;
  border-radius: 50%;
  background: #1dbe72;
  -moz-transition: all 0.3s ease-in-out;
  -o-transition: all 0.3s ease-in-out;
  -webkit-transition: all 0.3s ease-in-out;
  -ms-transition: all 0.3s ease-in-out;
  transition: all 0.3s ease-in-out; }

.container_radio.version_2 {
  padding: 13px 15px 13px 45px;
  background-color: #fff;
  -webkit-border-radius: 3px;
  -moz-border-radius: 3px;
  -ms-border-radius: 3px;
  border-radius: 3px;
  border: 1px solid #ddd;
  min-height: 30px;
  font-weight: 400; }

.container_radio.version_2 input:checked ~ .checkmark:before {
  opacity: 1; }

.container_radio.version_2 input:checked ~ .checkmark {
  border: 1px solid transparent; }

.container_radio.version_2 .checkmark {
  position: absolute;
  top: 10px;
  left: 10px;
  height: 24px;
  width: 24px;
  border: 1px solid #ddd;
  border-radius: 50%; }

.container_radio.version_2 .checkmark:after {
  width: 22px;
  height: 22px;
  top: 0;
  left: 0; }

.container_radio.version_2 .checkmark:before {
  display: block;
  content: "";
  position: absolute;
  opacity: 0;
  -moz-transition: all 0.3s ease-in-out;
  -o-transition: all 0.3s ease-in-out;
  -webkit-transition: all 0.3s ease-in-out;
  -ms-transition: all 0.3s ease-in-out;
  transition: all 0.3s ease-in-out;
  left: 9px;
  top: 5px;
  width: 5px;
  height: 10px;
  border: solid white;
  z-index: 999;
  border-width: 0 2px 2px 0;
  -webkit-transform: rotate(45deg);
  -ms-transform: rotate(45deg);
  transform: rotate(45deg); }

.container_radio.version_2.active, .container_radio.version_2:hover, .container_check.version_2.active, .container_check.version_2:hover {
  border: 1px solid #1dbe72; }

.radio_input .container_radio {
  display: inline-block;
  margin: 5px 1.5rem 0 0; }

/* ------------------------------------------------*/
/* Form Page End */
/* ------------------------------------------------*/
/* ------------------------------------------------*/
/* Youth Day Page */
/* ------------------------------------------------*/
.diffont3 {
  font-family: "k-font", sans-serif;
  font-weight: 300; }
  @media only screen and (max-width: 576px) {
    .diffont3 {
      font-size: 1.8rem;
      line-height: 2.7rem; } }
  @media (min-width: 576.5px) and (max-width: 768px) {
    .diffont3 {
      font-size: 2rem;
      line-height: 2.8rem; } }
  @media (min-width: 768.5px) and (max-width: 992px) {
    .diffont3 {
      font-size: 2rem;
      line-height: 2.8rem; } }
  @media (min-width: 992.5px) and (max-width: 1200px) {
    .diffont3 {
      font-size: 2.2rem;
      line-height: 3rem; } }
  @media only screen and (min-width: 1200.5px) {
    .diffont3 {
      font-size: 2.4rem;
      line-height: 3.4rem; } }

.diffont3s {
  font-family: "k-font";
  font-weight: 200; }
  @media only screen and (max-width: 576px) {
    .diffont3s {
      font-size: 1.6rem;
      line-height: 2.2rem; } }
  @media (min-width: 576.5px) and (max-width: 768px) {
    .diffont3s {
      font-size: 1.8rem;
      line-height: 2.6rem; } }
  @media (min-width: 768.5px) and (max-width: 992px) {
    .diffont3s {
      font-size: 1.8rem;
      line-height: 2.6rem; } }
  @media (min-width: 992.5px) and (max-width: 1200px) {
    .diffont3s {
      font-size: 2rem;
      line-height: 2.6rem; } }
  @media only screen and (min-width: 1200.5px) {
    .diffont3s {
      font-size: 2rem;
      line-height: 2.6rem; } }

.diffont4 {
  font-family: "nikumaru", sans-serif; }
  @media only screen and (max-width: 576px) {
    .diffont4 {
      font-size: 2.2rem;
      line-height: 3rem; } }
  @media (min-width: 576.5px) and (max-width: 768px) {
    .diffont4 {
      font-size: 2.2rem;
      line-height: 3.2rem; } }
  @media (min-width: 768.5px) and (max-width: 992px) {
    .diffont4 {
      font-size: 2.2rem;
      line-height: 3.4rem; } }
  @media (min-width: 992.5px) and (max-width: 1200px) {
    .diffont4 {
      font-size: 2.4rem;
      line-height: 3.8rem; } }
  @media only screen and (min-width: 1200.5px) {
    .diffont4 {
      font-size: 2.6rem;
      line-height: 4rem; } }

.border2 {
  border: solid 2px #fff; }

.border4 {
  border: solid 4px #333; }

.border8 {
  border: solid 8px #333; }
  @media only screen and (max-width: 576px) {
    .border8 {
      border: solid 4px #333; } }

.border4dot {
  border: dotted 4px #333; }

.wdvar2 {
  padding: 0; }
  @media only screen and (max-width: 576px) {
    .wdvar2 {
      padding: 0 0 1rem;
      width: 60%; } }
  @media (min-width: 576.5px) and (max-width: 992px) {
    .wdvar2 {
      padding: 0;
      width: 35%; } }
  @media (min-width: 992.5px) and (max-width: 1200px) {
    .wdvar2 {
      width: 30%; } }
  @media only screen and (min-width: 1200.5px) {
    .wdvar2 {
      width: 25%; } }

.btn_shadow {
  padding: 1rem 3rem;
  cursor: pointer;
  border-radius: 10px;
  border: 3px solid #353535;
  background-color: #8bcf67;
  transition: .3s;
  color: black;
  font-weight: bold; }

.btn_shadow:hover {
  box-shadow: 5px 5px #353535;
  background-color: #F6EB7C;
  color: black; }

.btn:active {
  box-shadow: 0 0;
  transform: translate(5px, 5px); }

.daybg {
  background-image: url(../kodomo-fes/img/bg.jpg);
  background-size: contain;
  background-color: #D8C19E; }

.daylogo {
  width: 80%;
  margin: 0 auto; }
  @media only screen and (max-width: 768px) {
    .daylogo {
      width: 100%; } }
  @media (min-width: 768.5px) and (max-width: 992px) {
    .daylogo {
      width: 100%; } }
  @media (min-width: 992.5px) and (max-width: 1200px) {
    .daylogo {
      width: 90%; } }
  @media only screen and (min-width: 1200.5px) {
    .daylogo {
      width: 80%; } }

.content-block-day {
  position: relative;
  width: 100%;
  margin: 1rem 0 0;
  height: auto; }
  @media only screen and (max-width: 576px) {
    .content-block-day {
      padding: 0; } }
  @media only screen and (min-width: 576.5px) {
    .content-block-day {
      padding: 0 5% 0rem; } }

.alignlc {
  text-align: left; }
  @media only screen and (max-width: 768px) {
    .alignlc {
      text-align: center; } }

.alignrc {
  text-align: right; }
  @media only screen and (max-width: 768px) {
    .alignrc {
      text-align: center; } }

.dayeventimg {
  margin: 1rem 0;
  width: 85%; }
  @media only screen and (max-width: 576px) {
    .dayeventimg {
      width: 70%; } }
  @media (min-width: 576.5px) and (max-width: 768px) {
    .dayeventimg {
      width: 70%; } }
  @media only screen and (min-width: 1200px) {
    .dayeventimg {
      width: 70%; } }

.dayeventimg1 {
  margin: 1rem 0;
  width: 85%; }
  @media only screen and (max-width: 576px) {
    .dayeventimg1 {
      width: 90%; } }
  @media (min-width: 576.5px) and (max-width: 768px) {
    .dayeventimg1 {
      width: 80%; } }
  @media only screen and (min-width: 1200px) {
    .dayeventimg1 {
      width: 70%; } }

.dayeventimg2 {
  margin: 1rem 0;
  width: 70%; }
  @media only screen and (max-width: 576px) {
    .dayeventimg2 {
      width: 100%; } }
  @media (min-width: 576.5px) and (max-width: 768px) {
    .dayeventimg2 {
      width: 80%; } }
  @media only screen and (min-width: 1200px) {
    .dayeventimg2 {
      width: 50%; } }

.dayeventimg3 {
  width: 100%; }
  @media (min-width: 420.5px) and (max-width: 575px) {
    .dayeventimg3 {
      width: 80%; } }
  @media only screen and (max-width: 420px) {
    .dayeventimg3 {
      width: 100%; } }

.dayeventimg4 {
  width: 100%; }
  @media (min-width: 420.5px) and (max-width: 575px) {
    .dayeventimg4 {
      margin-top: -50px;
      padding-bottom: 3rem;
      width: 80%; } }
  @media only screen and (max-width: 420px) {
    .dayeventimg4 {
      margin-top: -50px;
      width: 100%;
      padding-bottom: 2rem; } }

.eventinfoimg {
  margin: 1rem auto;
  width: 70%; }
  @media only screen and (max-width: 768px) {
    .eventinfoimg {
      margin: 1rem 0rem;
      width: 90%; } }
  @media (min-width: 768.5px) and (max-width: 992px) {
    .eventinfoimg {
      margin: 1rem 0rem;
      width: 90%; } }
  @media (min-width: 992.5px) and (max-width: 1200px) {
    .eventinfoimg {
      margin: 1rem 2rem 0rem;
      width: 60%; } }
  @media only screen and (min-width: 1400px) {
    .eventinfoimg {
      margin: 1rem 2rem 0rem;
      width: 50%; } }

.eventinfoimg2 {
  margin: 1rem auto;
  width: 80%; }
  @media only screen and (max-width: 576px) {
    .eventinfoimg2 {
      margin: 1rem 0rem;
      width: 90%; } }
  @media (min-width: 576.5px) and (max-width: 992px) {
    .eventinfoimg2 {
      margin: 1rem 0rem;
      width: 100%; } }
  @media (min-width: 992.5px) and (max-width: 1200px) {
    .eventinfoimg2 {
      margin: 1rem 2rem 0rem;
      width: 90%; } }
  @media only screen and (min-width: 1400px) {
    .eventinfoimg2 {
      margin: 1rem 2rem 0rem;
      width: 80%; } }

.eventinfoimg:hover, .eventinfoimg2:hover {
  border-radius: 24px;
  box-shadow: 0px 0px 20px rgba(23, 23, 23, 0.8);
  transition: .3s; }

.dayheadline {
  padding: 0 10%; }

@media only screen and (max-width: 768px) {
  .dayheadline {
    padding: 0 0; } }
/* About kodomo-fes　タイトル */
.fpr2 {
  background-color: #f57e63;
  width: 100%;
  margin: 0 auto;
  border-radius: 12px;
  padding: 2rem; }
  .fpr2 p {
    color: white; }

.yellowbase2 {
  background-color: #FDF081;
  padding: 1rem 2rem;
  border-radius: 12px; }
  .yellowbase2 .box {
    display: flex; }
    .yellowbase2 .box .img {
      flex-shrink: 0; }
    .yellowbase2 .box .desc {
      display: flex;
      flex-direction: column;
      justify-content: center;
      padding-left: 20px;
      width: 100%; }
  @media only screen and (min-width: 1200px) {
    .yellowbase2 {
      padding: 1rem 4rem; } }
  @media only screen and (max-width: 576px) {
    .yellowbase2 {
      padding: 1rem 0; } }

.lightybase {
  border: 0;
  border-radius: 30px;
  background-color: #FFF5E1;
  padding: 4rem; }
  @media only screen and (max-width: 576px) {
    .lightybase {
      padding: 3rem; } }
  @media (min-width: 576.5px) and (max-width: 1399px) {
    .lightybase {
      padding: 4rem; } }

.lightybase2 {
  border: 0;
  border-radius: 30px;
  background-color: #F8F1C6;
  padding: 1rem; }
  @media only screen and (max-width: 576px) {
    .lightybase2 {
      padding: 1rem;
      border-radius: 12px; } }

.whitebase2 {
  border-radius: 30px;
  padding: 2rem 2rem 2rem 0;
  background-color: white; }
  @media only screen and (max-width: 576px) {
    .whitebase2 {
      padding: 1rem 1rem 1rem 0;
      margin: 1rem; } }

.whitebase3 {
  border-radius: 12px;
  background-color: white;
  padding: 4rem 4rem 0; }
  @media only screen and (max-width: 576px) {
    .whitebase3 {
      padding: 2rem; } }

hr.rtinfo {
  margin: 1rem 1rem 1rem 4rem;
  padding: 0 0 0 3rem; }
  @media only screen and (max-width: 576px) {
    hr.rtinfo {
      margin: 1rem 1rem 1rem 2rem; } }

span.underline_w {
  font-weight: 600;
  background: linear-gradient(transparent 0%, #FFF 0%); }

.under_title {
  margin-top: 2rem;
  text-align: center; }
  @media only screen and (max-width: 576px) {
    .under_title {
      margin-top: 0;
      line-height: 2.5rem; } }

.imgsize_l {
  width: 90%; }
  @media only screen and (max-width: 576px) {
    .imgsize_l {
      width: 60%;
      margin: 0 auto; } }

.imgsize_map {
  width: 80%; }
  @media (min-width: 576.5px) and (max-width: 1199px) {
    .imgsize_map {
      width: 70%;
      margin: 0 auto; } }
  @media only screen and (max-width: 576px) {
    .imgsize_map {
      width: 100%;
      margin: 0 auto; } }

p.caption2 {
  font-size: 1.6rem;
  line-height: 2.4rem;
  padding: 0rem 0 0; }
  @media only screen and (max-width: 576px) {
    p.caption2 {
      font-size: 1.4rem;
      line-height: 2rem; } }
  @media only screen and (min-width: 768px) {
    p.caption2 {
      font-size: 1.6rem;
      line-height: 2.4rem; } }
  @media only screen and (min-width: 1200px) {
    p.caption2 {
      font-size: 1.6rem;
      line-height: 2.4rem; } }

@media only screen and (max-width: 576px) {
  p.small2 {
    font-size: 1.6rem;
    line-height: 2.6rem; } }
@media (min-width: 576.5px) and (max-width: 1199px) {
  p.small2 {
    font-size: 1.8rem;
    line-height: 2.8rem; } }
@media only screen and (min-width: 1200px) {
  p.small2 {
    font-size: 2rem;
    line-height: 3rem; } }

hr.limenu {
  margin: 2rem auto;
  border: 1px dashed #999;
  width: 10%;
  text-align: center; }

/* ------------------------------------------------*/
/* Youth Day Page End */
/* ------------------------------------------------*/