@charset "UTF-8";
@import url("https://fonts.googleapis.com/css2?family=Lato&display=swap");
.view-pc {
  display: block; }
  @media screen and (max-width: 768px) {
    .view-pc {
      display: none; } }

      .view-pc-2 {
        display: flex;
        flex-direction: column;
        justify-content: center;
        align-items: center;
        width: 15%; }
        @media screen and (max-width: 768px) {
          .view-pc-2 {
            display: none; } }

.view-sp {
  display: none; }
  @media screen and (max-width: 768px) {
    .view-sp {
      display: block; } }

ul {
  list-style: none;
  margin: 0;
  padding: 0; }

.c-blue {
  color: #00007f; }

.bold {
  font-weight: bold; }

.font-l {
  font-size: 1.42857rem; }

.font-s {
  font-size: 1.14286rem; }
.imgArea{
  width:50%;
}
.imgArea h3{
  font-size:23px;
  margin-bottom:30px;
}
.txtArea{
  width:50%;
}
.imgArea img{
  width:100%;
  border-radius:0px;
}
/*! normalize.css v6.0.0 | MIT License | github.com/necolas/normalize.css */
/* Document
========================================================================== */
/**
* 1. Correct the line height in all browsers.
* 2. Prevent adjustments of font size after orientation changes in
*    IE on Windows Phone and in iOS.
*/
html {
  font-family: "游ゴシック", "Yu Gothic", YuGothic, "ヒラギノゴシック Pro", "Hiragino Gothic Pro", "MS Pゴシック", "MS PGothic", sans-serif;
  font-size: 14px;
  -ms-text-size-adjust: 100%;
  /* 2 */
  -webkit-text-size-adjust: 100%;
  /* 2 */ }

body {
  line-height: 1.5;
  margin: 0;
  word-wrap: break-word;
  position: relative;
  font-size: 1rem; }

/* Sections
========================================================================== */
/**
* Add the correct display in IE 9-.
*/
article,
aside,
footer,
header,
nav,
section {
  display: block; }

/**
* Correct the font size and margin on `h1` elements within `section` and
* `article` contexts in Chrome, Firefox, and Safari.
*/
h1 {
  font-size: 2em;
  margin: 0 0 .67em; }

/* Grouping content
========================================================================== */
/**
* Add the correct display in IE 9-.
* 1. Add the correct display in IE.
*/
figcaption,
figure,
main {
  /* 1 */
  display: block; }

/**
* Add the correct margin in IE 8.
*/
p {
  margin-top: 0; }

figure {
  margin: 0 40px 1em; }

.under {
  background: linear-gradient(transparent 70%, #ff99ab 70%);
}

/**
* 1. Add the correct box sizing in Firefox.
* 2. Show the overflow in Edge and IE.
*/
hr {
  overflow: visible;
  /* 2 */
  -webkit-box-sizing: content-box;
  box-sizing: content-box;
  /* 1 */
  height: 0;
  /* 1 */ }

/**
* 1. Correct the inheritance and scaling of font size in all browsers.
* 2. Correct the odd `em` font sizing in all browsers.
*/
pre {
  font-family: monospace, monospace;
  /* 1 */
  font-size: 1em;
  /* 2 */ }

/* Text-level semantics
========================================================================== */
/**
* 1. Remove the gray background on active links in IE 10.
* 2. Remove gaps in links underline in iOS 8+ and Safari 8+.
*/
a {
  background-color: transparent;
  /* 1 */
  -webkit-text-decoration-skip: objects;
  /* 2 */ }

/**
* 1. Remove the bottom border in Chrome 57- and Firefox 39-.
* 2. Add the correct text decoration in Chrome, Edge, IE, Opera, and Safari.
*/
abbr[title] {
  text-decoration: underline;
  /* 2 */
  -webkit-text-decoration: underline dotted;
  text-decoration: underline dotted;
  /* 2 */
  border-bottom: none;
  /* 1 */ }

/**
* Prevent the duplicate application of `bolder` by the next rule in Safari 6.
*/
b,
strong {
  font-weight: inherit; }

/**
* Add the correct font weight in Chrome, Edge, and Safari.
*/
b,
strong {
  font-weight: bolder; }

/**
* 1. Correct the inheritance and scaling of font size in all browsers.
* 2. Correct the odd `em` font sizing in all browsers.
*/
code,
kbd,
samp {
  font-family: monospace, monospace;
  /* 1 */
  font-size: 1em;
  /* 2 */ }

/**
* Add the correct font style in Android 4.3-.
*/
dfn {
  font-style: italic; }

/**
* Add the correct background and color in IE 9-.
*/
mark {
  color: #000;
  background-color: #ff0; }

/**
* Add the correct font size in all browsers.
*/
small {
  font-size: 80%; }

/**
* Prevent `sub` and `sup` elements from affecting the line height in
* all browsers.
*/
sub,
sup {
  font-size: 75%;
  line-height: 0;
  position: relative;
  vertical-align: baseline; }

sub {
  bottom: -.25em; }

sup {
  top: -.5em; }

/* Embedded content
========================================================================== */
/**
* Add the correct display in IE 9-.
*/
audio,
video {
  display: inline-block; }

/**
* Add the correct display in iOS 4-7.
*/
audio:not([controls]) {
  display: none;
  height: 0; }

/**
* Remove the border on images inside links in IE 10-.
*/
img {
  border-style: none;
  /* border-radius: 15px;  */
}

/**
* Hide the overflow in IE.
*/
svg:not(:root) {
  overflow: hidden; }

/* Forms
========================================================================== */
/**
* Remove the margin in Firefox and Safari.
*/
button,
input,
optgroup,
select,
textarea {
  margin: 0; }

/**
* Show the overflow in IE.
* 1. Show the overflow in Edge.
*/
button,
input {
  /* 1 */
  overflow: visible; }

input:focus,
button:focus,
textarea:focus,
select:focus {
  outline: 0; }

/**
* Remove the inheritance of text transform in Edge, Firefox, and IE.
* 1. Remove the inheritance of text transform in Firefox.
*/
button,
select {
  /* 1 */
  text-transform: none; }

/**
* 1. Prevent a WebKit bug where (2) destroys native `audio` and `video`
*    controls in Android 4.
* 2. Correct the inability to style clickable types in iOS and Safari.
*/
button,
html [type='button'],
[type='reset'],
[type='submit'] {
  -webkit-appearance: button;
  /* 2 */ }

/**
* Remove the inner border and padding in Firefox.
*/
button::-moz-focus-inner,
[type='button']::-moz-focus-inner,
[type='reset']::-moz-focus-inner,
[type='submit']::-moz-focus-inner {
  padding: 0;
  border-style: none; }

/**
* Restore the focus styles unset by the previous rule.
*/
button:-moz-focusring,
[type='button']:-moz-focusring,
[type='reset']:-moz-focusring,
[type='submit']:-moz-focusring {
  outline: 1px dotted ButtonText; }

/**
* 1. Correct the text wrapping in Edge and IE.
* 2. Correct the color inheritance from `fieldset` elements in IE.
* 3. Remove the padding so developers are not caught out when they zero out
*    `fieldset` elements in all browsers.
*/
legend {
  display: table;
  /* 1 */
  -webkit-box-sizing: border-box;
  box-sizing: border-box;
  /* 1 */
  max-width: 100%;
  /* 1 */
  padding: 0;
  /* 3 */
  white-space: normal;
  /* 1 */
  color: inherit;
  /* 2 */ }

/**
* 1. Add the correct display in IE 9-.
* 2. Add the correct vertical alignment in Chrome, Firefox, and Opera.
*/
progress {
  display: inline-block;
  /* 1 */
  vertical-align: baseline;
  /* 2 */ }

/**
* Remove the default vertical scrollbar in IE.
*/
textarea {
  overflow: auto; }

/**
* 1. Add the correct box sizing in IE 10-.
* 2. Remove the padding in IE 10-.
*/
[type='checkbox'],
[type='radio'] {
  -webkit-box-sizing: border-box;
  box-sizing: border-box;
  /* 1 */
  padding: 0;
  /* 2 */ }

/**
* Correct the cursor style of increment and decrement buttons in Chrome.
*/
[type='number']::-webkit-inner-spin-button,
[type='number']::-webkit-outer-spin-button {
  height: auto; }

/**
* 1. Correct the odd appearance in Chrome and Safari.
* 2. Correct the outline style in Safari.
*/
[type='search'] {
  outline-offset: -2px;
  /* 2 */
  -webkit-appearance: textfield;
  /* 1 */ }

/**
* Remove the inner padding and cancel buttons in Chrome and Safari on macOS.
*/
[type='search']::-webkit-search-cancel-button,
[type='search']::-webkit-search-decoration {
  -webkit-appearance: none; }

/**
* 1. Correct the inability to style clickable types in iOS and Safari.
* 2. Change font properties to `inherit` in Safari.
*/
::-webkit-file-upload-button {
  font: inherit;
  /* 2 */
  -webkit-appearance: button;
  /* 1 */ }

/* Interactive
========================================================================== */
/*
* Add the correct display in IE 9-.
* 1. Add the correct display in Edge, IE, and Firefox.
*/
details,
menu {
  display: block; }

/*
* Add the correct display in all browsers.
*/
summary {
  display: list-item; }

/* Scripting
========================================================================== */
/**
* Add the correct display in IE 9-.
*/
canvas {
  display: inline-block; }

/**
* Add the correct display in IE.
*/
template {
  display: none; }

.d-flex{
  display:flex;
}
.li{
  list-style:disc;
  list-style-position: inside;
  font-size:16px;
  padding-bottom:20px;
  margin-bottom:20px;
  margin-top:20px;
  border-bottom:2px dotted #EA5514;
  font-weight:bold;
}
.justify-content-space-between{
  justify-content:space-between;
}

.flow_design03 {
  display: flex;
  justify-content: center;
  align-items: center;
  margin-left: 0px;
}

.flow_design03 ul {
  padding: 0;
}

.flow_design03 li {
  list-style-type: none;
}

.flow_design03 dd {
  margin-left: 0;
}

.flow03 {
  position: relative;
}

.flow03::before {
  content: "";
  width: 15px;
  height: 100%;
  background: #eee;
  margin-left: -129px;
  display: block;
  position: absolute;
  top: 0;
  left: 120px;
  border-radius: 20px;
}

.flow03 > li {
  position: relative;
}

.flow03 > li:not(:last-child) {
  margin-bottom: 60px;
}

.flow03 > li .icon03 {
  font-size: 0.8em;
  width: 2em;
  height: 2em;
  line-height: 2;
  text-align: center;
  font-weight: bold;
  border-radius: 100vh;
  color: #fff;
  background: #7280CB;
  display: inline-block;
  margin-right: 0.3em;
}

.flow03 > li dl {
  padding-left: 25px;
  position: relative;
}

.flow03 > li dl::before,
.flow03 > li dl::after {
  content: "";
  display: block;
  position: absolute;
  top: 15px;
}

.flow03 > li dl::before {
  width: 7px;
  height: 7px;
  margin-top: -3px;
  background: #7280CB;
  border-radius: 50%;
  left: -4px;
}

.flow03 > li dl::after {
  width: 20px;
  border-bottom: 1px dashed #999;
  position: absolute;
  left: 5px;
}
.text-right{
  text-align:right;
}
.flow03 > li dl dt {
  font-size: 1.3em;
  font-weight: 600;
  color: #7280CB;
  margin-bottom: 0.5em;
  display: flex;
  align-items: center;
}
.imgArea h3{
  color:#EA5514;
}
.imgArea dt{
  width:150px;
}
.imgArea dt span{
  font-size:18px;
  font-weight:bold;
}
.main-literal{
  font-size: 1.71429rem;
  font-weight: normal;
  margin-bottom: 25px;
  line-height: 130%;
  color: #ff6600;
  margin-top: 0;
}
.main-literal span{
  font-size:110%;
  font-weight:bold;
}
.border-yellow span{
  background:linear-gradient(transparent 60%, #FFE650 60%);
}
.border-green span{
  background:linear-gradient(transparent 60%, #E0F991 60%);
}
.border-blue span{
  background:linear-gradient(transparent 60%, #B0E1F4 60%);
}
.border-orange span{
  background:linear-gradient(transparent 60%, #FF6E3B 60%);
}
.mb-30{
  margin-bottom:30px !important;
}
.bg-box{
  background:#ffe5d5;
  border-radius:30px;
  padding:30px;
}
.bg-box h5{
  font-size:18px;
  margin-bottom:15px;
}
.bg-yellow{
  background:#FFE67A;
  color:#EA5514;
  width:350px;
  margin:0px auto;
  display:block;
  text-align:center;
  padding:10px;
  font-size:20px;
}
.imgArea dl{
  border-bottom:1px solid #ccc;
  padding-bottom:10px;
  margin-bottom:10px;
}
.imgArea dd{
  width:calc(100% - 150px);
  margin-left:0px;
}
.process{
  margin-bottom:30px;
}
.process li{
  font-size:18px;
  margin-bottom:10px;
}
.yellow_line span{
  font-size: 110%;
  font-weight:bold;
  background:linear-gradient(transparent 60%, #FFE650 60%);
}
.green_line span{
  font-size: 110%;
  font-weight:bold;
  background:linear-gradient(transparent 60%, #E0F991 60%);
}
.blue_line span{
  font-size: 110%;
  font-weight:bold;
  background:linear-gradient(transparent 60%, #B0E1F4 60%);
}
/* Hidden
========================================================================== */
/**
* Add the correct display in IE 10-.
*/
[hidden] {
  display: none; }

@media screen and (max-width: 768px) {
  header {
    top: 10px; 
  } }

@media screen and (max-width: 768px) {
  header.fixed {
    width: 94%;
    top: 0px;
    position: fixed;
    z-index: 999;
    background: rgba(255, 255, 255, 0.9);
    width: 100%; } }

header h1 {
  position: absolute;
  z-index: 999;
}

header .inner_block {
  max-width: 1280px;
  margin: 0 auto;
  /* background-image: url("../img/mv-2.jpg"); */
  /* background-size: cover;  */
  /* background-color: #000; */
  -webkit-box-pack: justify;
  -ms-flex-pack: justify;
  justify-content: space-between;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  flex-direction: row;
  -ms-flex-wrap: wrap;
  flex-wrap: wrap;
  -webkit-box-align: center;
  -ms-flex-align: center;
  justify-content: space-between;
  -ms-flex-line-pack: center;
  align-content: center;
}

header h1 {
  width: auto;
  margin-left: 1%; 
}
  @media screen and (max-width: 768px) {
    header h1 {
      width: 80px;
      margin-left: 2%;
      margin-bottom: 1%;
    }
    
    header h1 img{
    width:100% !important;
    }
    header nav{
      flex-direction: column;
    }
    header nav ul{
      order:1;
      margin-top: 60px;
    }
    .btn-cotanct{
      border-radius:0px !important;
    }
    .side-menu{
      order:2;
    }
    .txtArea{
      width:100% !important;
      order:2;
    }
    .imgArea{
      width:100% !important;
      order:1;
    }
    #point .point_wrap > div .point-literal{
      position:relative !important;
      left:inherit;
      right:inherit;
    }
    #zinnia .d-flex{
      flex-direction: column;
    }
    .imgArea dd{
      width:100%;
    }
  }
  header h1 img {
    margin-top:10px;
  }
header nav {
  width: 85%;
}
@media screen and (min-width: 769px) {
    header nav {
    display:block !important;
    }
}
  @media screen and (max-width: 768px) {
    header nav {
      display: flex;
      z-index: 999;
      position: relative;
      background: rgba(255, 255, 255, 0.9);
      position: fixed;
      top: 0;
      width: 100%;
      left: 0;
      height: 100vh; } }
  header nav ul {
    -webkit-box-pack: justify;
    -ms-flex-pack: justify;
    justify-content: space-between;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -ms-flex-wrap: wrap;
    flex-wrap: wrap;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center; }
    @media screen and (max-width: 768px) {
      header nav ul {
        margin-top: 96px; } }
  header nav li {
    font-size: 1.14286rem;
    width: 16%;
    text-align: center; }
    @media screen and (max-width: 768px) {
      header nav li {
        width: 100%;
        background: #f29239;
        margin: 0;
        padding: 10px 0;
        border-bottom: 1px solid #ffffff; }
        header nav li a {
          display: block;
          color: #ffffff; } }

header .head-btn {
  width: 10%;
  padding: 5px 1%;
  background: #42b303;
  display: inline-block;
  text-align: center;
  color: #ffffff; }
  @media screen and (max-width: 768px) {
    header .head-btn {
      display: none; } }

.switch {
  display: none; }
  @media screen and (max-width: 768px) {
    .switch {
      position: absolute;
      z-index: 999;
      right: 2%;
      top: 15px;
      display: block; } }
  .switch:before {
    content: "";
    background: url(../images/common/icon_nav.png) no-repeat;
    background-size: 100%;
    width: 40px;
    height: 40px;
    display: block; }
    @media screen and (max-width: 768px) {
      .switch:before {
        width: 30px;
        height: 30px; } }
  .switch.show:before {
    background: url(../images/common/icon_nav_close.png) no-repeat;
    background-size: 100%;
    width: 40px;
    height: 40px; }
    @media screen and (max-width: 768px) {
      .switch.show:before {
        width: 30px;
        height: 30px; } }
  .switch span {
    display: none; }

body {
  position: relative;
  color: #333333; }

figure {
  margin: 0;
  padding: 0; }

  .pagetop {
    display: none;
    position: fixed;
    bottom: 150px;
    right: 15px;
  }
  .pagetop a {
    display: block;
    text-align: center;
    color: #222;
    font-size: 12px;
    text-decoration: none;
    padding: 5px 10px;
  }
  .pagetop a:hover {
    display: block;
    font-size: 12px;
    text-decoration: none;
    padding:5px 10px;
  }

footer {
  background: #f29239;
  padding: 52px 0; }
  @media screen and (max-width: 768px) {
    footer {
      padding: 30px 0 15px; } }
  footer .inner_block {
    max-width: 1280px;
    padding-left: 50px;
    margin: 0 auto; }
    @media screen and (max-width: 768px) {
      footer .inner_block {
        padding-left:0px;
        max-width: 94%; } }
    footer .inner_block p {
      color: #ffffff;
      line-height: 180%; }
    footer .inner_block a {
      color: #ffffff; }

.col2-img {
  -webkit-box-pack: justify;
  -ms-flex-pack: justify;
  justify-content: space-between;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -ms-flex-wrap: wrap;
  flex-wrap: wrap; }
  .col2-img figure {
    width: 50%;
    margin: 0;
    padding: 0; }
    @media screen and (max-width: 768px) {
      .col2-img figure {
        width: 100%; } }
    .col2-img figure img {
      width: 100%;
      height: auto; }
  .col2-img > div {
    width: 42%; }
    .col2-img > div h2 {
      font-size: 1.71429rem;
      font-weight: normal;
      margin-bottom: 25px;
      line-height: 200%;
      color: #ff6600;
      margin-top: 0; }
      @media screen and (max-width: 768px) {
        .col2-img > div h2 {
          font-size: 1.35714rem;
          margin-top: 1rem;
          margin-bottom: 1rem;
          text-align: center;
          line-height: 180%;
          font-weight: bold; } }
    .col2-img > div p {
      font-size: 1.14286rem; }
    @media screen and (max-width: 768px) {
      .col2-img > div {
        width: 100%; } }

.menu .col2-img {
  margin-bottom: 50px; }
  .menu .col2-img.col2-img_img2 h3 {
    margin-bottom: 0px; }
  .menu .col2-img div figure {
    width: 100%;
    height: auto; }
  .menu .col2-img div h3 {
    font-size: 1.78571rem;
    font-weight: normal;
    margin-top: 42px;
    margin-bottom: 25px;
    line-height: 220%; }
    @media screen and (max-width: 768px) {
      .menu .col2-img div h3 {
        font-size: 1.35714rem;
        margin-top: 1rem;
        margin-bottom: 1rem;
        text-align: center;
        line-height: 180%;
        font-weight: bold; } }
  .menu .col2-img div .menu-title {
    position: relative;
    font-size: 1.57143rem; }
    .menu .col2-img div .menu-title span {
      position: absolute;
      right: 0; }

.col3-img {
  -webkit-box-pack: justify;
  -ms-flex-pack: justify;
  justify-content: space-between;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -ms-flex-wrap: wrap;
  flex-wrap: wrap; }
  .col3-img figure {
    width: 30.7%; }
    @media screen and (max-width: 768px) {
      .col3-img figure {
        width: 100%;
        margin-bottom: 1rem; } }
    .col3-img figure img {
      max-width: 100%;
      height: auto; }
    .col3-img figure figcaption {
      font-size: 1.28571rem; }
      @media screen and (max-width: 768px) {
        .col3-img figure figcaption {
          font-size: 1.14286rem; } }

.news-list {
  -webkit-box-pack: justify;
  -ms-flex-pack: justify;
  justify-content: space-between;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -ms-flex-wrap: wrap;
  flex-wrap: wrap; }
  .news-list > a {
    width: 30.7%; }
    @media screen and (max-width: 768px) {
      .news-list > a {
        width: 100%;
        margin-bottom: 1rem; } }
    .news-list > a div {
      margin-bottom: 10px; }
      .news-list > a div img {
        width: 100%;
        height: auto;
        vertical-align: top; }
    .news-list > a span {
      font-size: 1rem;
      color: #aeaeae; }
    .news-list > a dl {
      margin: 0;
      padding: 0; }
      .news-list > a dl dt {
        font-size: 1.28571rem;
        margin: 0;
        padding: 0; }
      .news-list > a dl dd {
        font-size: 1rem;
        margin: 0;
        padding: 0; }

.news-index {
  margin-bottom: 150px; }
  @media screen and (max-width: 768px) {
    .news-index {
      margin-bottom: 70px; } }
  .news-index .inner_block {
    -webkit-box-pack: justify;
    -ms-flex-pack: justify;
    justify-content: space-between;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -ms-flex-wrap: wrap;
    flex-wrap: wrap; }
    .news-index .inner_block .main {
      width: 73%; }
      @media screen and (max-width: 768px) {
        .news-index .inner_block .main {
          width: 100%;
          margin-bottom: 15px; } }
      .news-index .inner_block .main .wp-pagenavi {
        text-align: center; }
        .news-index .inner_block .main .wp-pagenavi .current {
          background: #333333;
          color: #ffffff; }
    .news-index .inner_block .side {
      width: 25%; }
      @media screen and (max-width: 768px) {
        .news-index .inner_block .side {
          width: 100%; } }
      .news-index .inner_block .side .categories {
        font-size: 1.35714rem;
        font-weight: bold; }
        .news-index .inner_block .side .categories li {
          font-size: 1.14286rem;
          font-weight: normal; }
      .news-index .inner_block .side #calendar_wrap {
        margin-bottom: 30px; }
      .news-index .inner_block .side #wp-calendar {
        width: 100%;
        font-size: 12px;
        padding-top: 10px; }
        .news-index .inner_block .side #wp-calendar tr {
          display: -webkit-box;
          display: -ms-flexbox;
          display: flex;
          -webkit-box-pack: start;
          -ms-flex-pack: start;
          justify-content: flex-start; }
          .news-index .inner_block .side #wp-calendar tr:first-of-type {
            -webkit-box-pack: end;
            -ms-flex-pack: end;
            justify-content: flex-end; }
        .news-index .inner_block .side #wp-calendar th,
        .news-index .inner_block .side #wp-calendar td {
          display: block;
          width: calc(100% / 7);
          text-align: center;
          margin-bottom: 10px; }
          .news-index .inner_block .side #wp-calendar th:last-of-type, .news-index .inner_block .side #wp-calendar th:last-of-type,
          .news-index .inner_block .side #wp-calendar td:last-of-type,
          .news-index .inner_block .side #wp-calendar td:last-of-type {
            color: red; }
        .news-index .inner_block .side #wp-calendar td a {
          padding: 0; }
        .news-index .inner_block .side #wp-calendar tfoot tr {
          display: -webkit-box;
          display: -ms-flexbox;
          display: flex;
          -webkit-box-pack: center;
          -ms-flex-pack: center;
          justify-content: center; }
          .news-index .inner_block .side #wp-calendar tfoot tr td {
            width: calc(100% / 3); }
        .news-index .inner_block .side #wp-calendar #today a,
        .news-index .inner_block .side #wp-calendar #today {
          color: #333333;
          background-color: #aeaeae;
          font-weight: bold; }
  .news-index .news-list > a {
    width: 48%;
    margin-bottom: 2rem; }
    @media screen and (max-width: 768px) {
      .news-index .news-list > a {
        width: 100%; } }

.menu {
  -webkit-box-pack: justify;
  -ms-flex-pack: justify;
  justify-content: space-between;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -ms-flex-wrap: wrap;
  flex-wrap: wrap; }
  .menu > a {
    width: 31.5%;
    position: relative; }
    @media screen and (max-width: 768px) {
      .menu > a {
        width: 100%;
        margin-bottom: 1rem; } }
    .menu > a h3 {
      background: #00007f;
      color: #fff;
      -webkit-writing-mode: vertical-rl;
      -ms-writing-mode: tb-rl;
      writing-mode: vertical-rl;
      text-orientation: upright;
      position: absolute;
      padding: 30px 7px 35px;
      font-weight: normal;
      text-align: center;
      margin: 0;
      top: 0;
      left: 20px; }
      @media screen and (max-width: 768px) {
        .menu > a h3 {
          left: 10px;
          padding: 15px 7px 20px; } }
      .menu > a h3 span {
        font-size: 1.78571rem; }
        @media screen and (max-width: 768px) {
          .menu > a h3 span {
            font-size: 1.57143rem; } }
        .menu > a h3 span:before {
          content: "";
          display: inline-block;
          width: 20px;
          height: 20px;
          margin: 0 auto;
          background: url(../images/common/icon_menu.png) center no-repeat;
          background-size: 100%;
          margin-bottom: 20px; }
          @media screen and (max-width: 768px) {
            .menu > a h3 span:before {
              margin-bottom: 10px; } }
    .menu > a img {
      max-width: 100%;
      height: auto;
      margin-top: 20px; }

.instagram {
  max-width: 1124px;
  margin: 0 auto;
  -webkit-box-pack: justify;
  -ms-flex-pack: justify;
  justify-content: space-between;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -ms-flex-wrap: wrap;
  flex-wrap: wrap; }
  .instagram a {
    width: 21.7%;
    display: block; }
    @media screen and (max-width: 768px) {
      .instagram a {
        width: 49%; } }
    .instagram a img {
      width: 100%;
      height: auto; }

.h2-heading {
  font-size: 1rem;
  color: #ff6600;
  text-align: center;}
  .h2-heading img {
    display: block;
    margin: 0 auto 14px; }
  .h2-heading span {
    font-family: 'Lato', sans-serif;
    border-bottom: 2px solid #ff6600;
    letter-spacing: 2px;
    display: inline-block;
    padding-bottom: 5px; }

.h3-heading {
  font-size: 2.85714rem;
  color: #000000;
  text-align: center;
  letter-spacing: 5px;
  margin: 0 0 10px 0; }
  @media screen and (max-width: 768px) {
    .h3-heading {
      font-size: 1.57143rem; } }
  .h3-heading span {
    color: #ff6600; }

#form {
  margin: 0 auto;
  width: 90%; 
  padding-bottom: 15px;}
  #form dt, #form dd {
    margin: 0;
    padding: 0; }
  #form .form_table {
    max-width: 100%;
    margin: 0 auto 10px;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -ms-flex-wrap: wrap;
    flex-wrap: wrap;
    padding-top:5px; }
    #form .form_table dt, #form .form_table dd {
      -webkit-box-sizing: border-box;
      box-sizing: border-box;
      padding: 16px 24px; }
      @media only screen and (max-width: 767px) {
        #form .form_table dt, #form .form_table dd {
          -webkit-box-sizing: border-box;
          box-sizing: border-box;
          padding: 8px 5px; }
        }
    #form .form_table dt {
      width: 22%; }
      #form .form_table dt span {
        margin-left: .5rem;
        padding: 4px;
        background-color: #f29239;
        color: #ffffff;
        white-space: nowrap;
        font-size: 1.1rem; }
    #form .form_table dd {
      width: 70%; }
    #form .form_table input[type="text"],
    #form .form_table input[type="tel"],
    #form .form_table input[type="email"],
    #form .form_table textarea {
      box-sizing: border-box;
	    font-size: 18px;
      background: #f9f9f2;
      border: 1px solid #04040433;
      border-radius: 0.45em;
      width: 100%;
      padding: 14px; }
    #form .form_table input[type="text"],
    #form .form_table input[type="tel"] {
      width: 60%; }
    #form .form_table input[type="email"] {
      width: 80%; }
    #form .form_table input[type="text"]#address {
      width: 100%;
    }
    #form .form_table label.demand-radio {
      background-color: #f9f9f2;
      border: 1px solid #04040433;
      border-radius: 0.45em;
      box-sizing: border-box;
      display: table-cell;
      vertical-align: middle;
      padding: 10px 14px;
      /*letter-spacing: 2px;*/
      height: 55px;
    }
    hr.br-sw {
      border: solid 1px transparent;
      margin: 5px;
    }
    @media only screen and (max-width: 767px) {
    #form .form_table label.demand-radio {
      /*font-size: 16px;*/
      width: 100%;
      height: 30px;
      padding: 5px 5px;
      box-sizing: unset;
      display: table-cell;
      vertical-align: middle;
    }
    hr.br-sw {
      border: solid 1px transparent;
      margin: 3px;
    }
  }
    #form .form_table label.demand-radio + label.demand-radio {
      margin-left: 1em;
    }
    #form .form_table label.demand-radio > input[type=radio] {
      margin-right: 0.5em;
    }
    @media screen and (max-width: 768px) {
      #form .form_table {
        width: 100%;
        display: block; }
        #form .form_table dt, #form .form_table dd {
          width: 100%;
          padding: 5px 5px 20px 5px; }
        #form .form_table dt {
          padding-bottom: 0; } }
    @media screen and (max-width: 480px) {
      #form .form_table input[type="text"],
      #form .form_table input[type="tel"],
      #form .form_table input[type="email"] {
        width: 100%; } }

.form_button {
  background-color: #16c107;
  color: #ffffff;
  font-size: 2.22857rem;
  width: 45%;
  display: block;
  text-align: center;
  line-height: 50px;
  padding: 15px;
  border-radius: 30px;
  border: none;
  margin: 0 auto; }
  .form_button:hover {
    cursor: pointer;
    opacity: 0.8; }

 @media screen and (max-width: 768px) {
.form_button {
  background-color: #00c816;
  color: #ffffff;
  font-size: 2.02857rem;
  width: 90%;
  display: block;
  text-align: center;
  line-height: 50px;
  padding: 15px;
  border-radius: 30px;
  border: none;
  margin: 0 auto; }
  .form_button:hover {
    cursor: pointer;
    opacity: 0.8; } }

::placeholder {
  color: #9d9d9d;
}

.btn {
  font-size: 2.37143rem;
  background: #9EBF00;
  border: 0.3em double #fff;
  color: #ffffff;
  max-width: 590px;
  padding: 15px 0;
  text-align: center;
  font-weight: bold;
  display: block;
  margin: 0 auto;
  position: relative;
  border-radius: 30px;
  padding: 38px 0;   }
 @media screen and (max-width: 768px) {
.btn {font-size: 1.471rem;}}


a {
  text-decoration: none;
  color: #000000; }
  a:hover {
    opacity: 0.6; }

.t-center {
  text-align: center; }

.t-left {
  text-align: left; }

.t-right {
  text-align: right; }

section {
  padding: 27px 0; }
  @media screen and (max-width: 768px) {
    section {
      padding: 10px 0;
      margin-bottom: 0; } }
  section .inner_block {
    max-width: 1013px;
    margin: 0 auto; }
    @media screen and (max-width: 768px) {
      section .inner_block {
        width: 94%; } }

body p {
  font-size: 1.14286rem; line-height: 180%;}

.error {
    font-size: 1.04286rem;
color: red;
margin-bottom: 0px;
}

#mv {
  padding: 0;
  position: relative;
  margin-bottom: 0; }
  #mv img {
    max-width: 100%;
    margin: 0 auto;
    z-index: 0;
    position: relative;
    vertical-align: bottom; }
  @media screen and (max-width: 768px) {
    #mv {
      background: url(../images/index/kv.png) center center no-repeat;
      background-size: cover;
      height: 50vh; } }
  #mv .mv-text_l,
  #mv .mv-text_r {
    position: absolute;
    z-index: 1; }
    #mv .mv-text_l p,
    #mv .mv-text_r p {
      line-height: 400%; }
      @media screen and (max-width: 768px) {
        #mv .mv-text_l p,
        #mv .mv-text_r p {
          line-height: 180%; } }
      #mv .mv-text_l p span,
      #mv .mv-text_r p span {
        background: rgba(242, 146, 57, 0.84);
        color: #ffffff;
        padding: 15px 0; }
  #mv .mv-text_l {
    left: 0;
    top: 2%; }
    @media screen and (max-width: 768px) {
      #mv .mv-text_l {
        top: 0; } }
    #mv .mv-text_l p span {
      padding-left: 140px;
      padding-right: 30px;
      border-radius: 6px; }
      @media screen and (max-width: 768px) {
        #mv .mv-text_l p span {
          padding: 5px;
          border-radius: 6px; } }
  #mv .mv-text_r {
    right: 0;
    bottom: 2%; }
    @media screen and (max-width: 768px) {
      #mv .mv-text_r {
        bottom: 0; } }
    #mv .mv-text_r p {
      text-align: right; }
      @media screen and (max-width: 768px) {
        #mv .mv-text_r p {
          margin-bottom: 0; } }
      #mv .mv-text_r p span {
        padding-right: 140px;
        padding-left: 30px;
        border-radius: 6px; }
        @media screen and (max-width: 768px) {
          #mv .mv-text_r p span {
            padding: 5px; 
            border-radius: 6px;} }

.head-txt {
  padding: 75px 0;
  margin-bottom: 0; }
  @media screen and (max-width: 768px) {
    .head-txt {
      padding: 7px 0; } }
  .head-txt h2 {
    font-size: 2.28571rem;
    color: #ff6600;
    text-align: center;
    line-height: 149%; }
    @media screen and (max-width: 768px) {
      .head-txt h2 {
        font-size: 1.67143rem;
        line-height: 120%; } }
    .head-txt h2 img {
      display: block;
      margin: 0 auto 25px; }
      @media screen and (max-width: 768px) {
        .head-txt h2 img {
          margin: 0 auto 12px; } }

#cocoel {
  background: #f9f9f2; }
  @media screen and (max-width: 768px) {
    #cocoel {
      margin-bottom: 0; } }
  #cocoel h2 {
    font-weight: bold;
    margin-bottom: 32px; }
    #cocoel h2 span {
      padding-bottom: 10px;
      border-bottom: 2px solid #ff6600; }
  #cocoel p {
    line-height: 200%; }
  #cocoel .target {
    background: #f29239;
    color: #ffffff;
    padding: 15px 0;
    text-align: center;
    max-width: 430px;
    border-radius: 15px;
    margin-top: 32px; }
    @media screen and (max-width: 768px) {
      #cocoel .target {
        max-width: 100%;
        padding: 7px 0; } }
    #cocoel .target h3 {
      font-size: 1.14286rem;
      font-weight: normal;
      border-bottom: 2px solid #ffffff;
      margin: 0 40px 10px;
      line-height: 200%; }
    #cocoel .target p {
      margin: 0 40px;
      line-height: 200%; }
      @media screen and (max-width: 768px) {
        #cocoel .target p {
          margin: 0; } }

.request {
  background: url(../images/index/bg_request.jpg) center;
  background-size: cover;
  position: relative; }
  .request::before {
    background: rgba(242, 146, 57, 0.85);
    content: "";
    display: block;
    position: absolute;
    width: 100%;
    height: 100%;
    top: 0;
    z-index: 0; }
  .request .inner_block {
    z-index: 1;
    position: relative;
    padding: 40px 0; }
    @media screen and (max-width: 768px) {
      .request .inner_block {
        padding: 20px 0; } }
  .request p {
    text-align: center;
    color: #ffffff;
    line-height: 200%;
    margin-bottom: 45px; }
    @media screen and (max-width: 768px) {
      .request p {
        line-height: 180%;
        margin-bottom: 20px; } }

#zinnia .inner_block{
  margin-bottom:50px
}
#cheering {
  background: #fffbde; }
  #cheering h2 {
    font-size: 1.78571rem;
    color: #ff6600;
    width: 80%;
    margin: 0 auto 20px;
    text-align: center;
    position: relative; }
    @media screen and (max-width: 768px) {
      #cheering h2 {
        font-size: 1.42857rem;
        width: 92%; } }
    #cheering h2:before, #cheering h2:after {
      content: "";
      width: 26px;
      height: 43px;
      display: inline-block;
      background-size: 100%;
      position: absolute; }
      @media screen and (max-width: 768px) {
        #cheering h2:before, #cheering h2:after {
          bottom: 0; } }
    #cheering h2:before {
      background-image: url(../images/index/icon_title_before.png);
      left: 0; }
      @media screen and (max-width: 768px) {
        #cheering h2:before {
          left: -5%; } }
    #cheering h2:after {
      content: "";
      background-image: url(../images/index/icon_title_after.png);
      right: 0; }
      @media screen and (max-width: 768px) {
        #cheering h2:after {
          right: -5%; } }
  #cheering .cheering_wrap {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -ms-flex-wrap: wrap;
    flex-wrap: wrap; }
    #cheering .cheering_wrap div {
      width: 31%;
      background: #ffffff;
      margin-bottom: 29px;
      margin-right: 3.5%;
      height: 122px; }
      @media screen and (max-width: 768px) {
        #cheering .cheering_wrap div {
          width: 100%;
          margin-bottom: 15px;
          margin-right: 0; } }
      #cheering .cheering_wrap div:nth-of-type(even) {
        background: #f9f9f2; }
      #cheering .cheering_wrap div:nth-of-type(3n) {
        margin-right: 0; }
      #cheering .cheering_wrap div.icon01 {
        border-radius: 15px;
        background-image: url(../images/index/icon_cheering01.png);
        background-repeat: no-repeat;
        background-size: 56px auto;
        background-position: 22px bottom; }
      #cheering .cheering_wrap div.icon02 {
        border-radius: 15px;
        background-image: url(../images/index/icon_cheering02.png);
        background-repeat: no-repeat;
        background-size: 57px auto;
        background-position: 11px center; }
      #cheering .cheering_wrap div.icon03 {
        border-radius: 15px;
        background-image: url(../images/index/icon_cheering03.png);
        background-repeat: no-repeat;
        background-size: 56px auto;
        background-position: 22px bottom; }
      #cheering .cheering_wrap div.icon04 {
        border-radius: 15px;
        background-image: url(../images/index/icon_cheering04.png);
        background-repeat: no-repeat;
        background-size: 55px auto;
        background-position: 24px center; }
      #cheering .cheering_wrap div.icon05 {
        border-radius: 15px;
        background-image: url(../images/index/icon_cheering05.png);
        background-repeat: no-repeat;
        background-size: 58px auto;
        background-position: 21px center; }
      #cheering .cheering_wrap div.icon06 {
        border-radius: 15px;
        background-image: url(../images/index/icon_cheering06.png);
        background-repeat: no-repeat;
        background-size: 56px auto;
        background-position: 22px bottom; }
      #cheering .cheering_wrap div.icon07 {
        border-radius: 15px;
        background-image: url(../images/index/icon_cheering07.png);
        background-repeat: no-repeat;
        background-size: 69px auto;
        background-position: 23px center; }
      #cheering .cheering_wrap div p {
        font-weight: bold;
        width: 75%;
        text-align: center;
        margin-left: 25%;
        padding-top: 40px; }
      #cheering .cheering_wrap div.row3 p {
        padding-top: 28px; }

#point .point_wrap {
  padding-top: 60px; }
  @media screen and (max-width: 768px) {
    #point .point_wrap {
      padding-top: 30px; } }
  #point .point_wrap > div {
    width: 80%;
    background: #f9f9f2;
    margin-left: auto;
    position: relative;
    padding: 60px 0;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -ms-flex-wrap: wrap;
    flex-wrap: wrap;
    padding-top:80px;
    margin-bottom: 120px; }
    @media screen and (max-width: 768px) {
      #point .point_wrap > div {
        margin-bottom: 30px; } }
    @media screen and (max-width: 768px) {
      #point .point_wrap > div {
        width: 100%;
        padding: 0; } }
    #point .point_wrap > div:nth-of-type(even) {
      background: #fffbde;
      margin-right: auto;
      margin-left: 0; }
      #point .point_wrap > div:nth-of-type(even) .point-literal {
        left: auto;
        right: 84px;
        text-align:right;
      }
      #point .point_wrap > div:nth-of-type(even) .point-no {
        left: auto;
        right: -30px; 
      }
        @media screen and (max-width: 768px) {
          #point .point_wrap > div:nth-of-type(even) .point-literal {
            left: auto;
            right: inherit;
            text-align:left;
          }
          #point .point_wrap > div:nth-of-type(even) .point-no {
            left: 0;
            right: auto; } }
      #point .point_wrap > div:nth-of-type(even) h4 {
        -webkit-box-ordinal-group: 2;
        -ms-flex-order: 1;
        order: 1;
        right: 70px;
        left: auto; }
        @media screen and (max-width: 768px) {
          #point .point_wrap > div{
            padding:0px 15px;
            flex-direction:column !important;
            box-sizing: border-box;
          }
          #point .point_wrap > div .point-literal{
            position:relative !important;
            left:inherit !important;
            right:inherit !important;
            top:inherit  !important;
          }
          #point .point_wrap > div:nth-of-type(even) h4 {
            left: 94px;
            font-size: 1.42857rem;
            position: absolute;
            top: inherit;
            right:inherit !important;
            margin-right: 28px;
            margin-top: 0px;
            width: calc(100% - 94px);
   } }
      #point .point_wrap > div:nth-of-type(even) .point-txt {
        -webkit-box-ordinal-group: 1;
        -ms-flex-order: 0;
        order: 0;
        margin-left: auto;
        margin-right: calc(35% - 70px + 180px); }
        @media screen and (max-width: 768px) {
          #point .point_wrap > div:nth-of-type(even) .point-txt {
            margin-right: auto; } }
    #point .point_wrap > div .point-literal {
      position: absolute;
      left: 84px;
      top: -20px;
      color:#000;
      font-size:1.4rem;
      font-weight:bold;
    }
    #point .point_wrap > div .point-no {
      font-size: 2.85714rem;
      font-family: 'Lato', sans-serif;
      background: #f29239;
      width: 94px;
      height: 82px;
      display: block;
      text-align: center;
      color: #ffffff;
      line-height: 80%;
      padding-top: 12px;
      position: absolute;
      left: -30px;
      top: -28px; }
      @media screen and (max-width: 768px) {
        #point .point_wrap > div .point-no {
          width: 70px;
          height: 70px;
          padding-top: 0px;
          position: relative;
          left: 0;
          top: 0;
          margin-bottom: 16px; } }
      #point .point_wrap > div .point-no span {
        font-size: 0.85714rem;
        display: block;
        margin-bottom: 0; }
    #point .point_wrap > div h4 {
      font-size: 1.78571rem;
      color: #ff6600;
      width: calc(40% - 70px);
      margin: 15px 0 0 0;
      position: absolute;
      left: 70px; }
      @media screen and (max-width: 768px) {
        #point .point_wrap > div h4 {
          left: 94px;
          font-size: 1.42857rem;
          position: absolute;
          top: inherit;
          margin-right: 28px;
          margin-top: 0px;
          width: calc(100% - 150px);
        }
      }
    #point .point_wrap > div .point-txt {
      width: 374px;
      line-height: 200%;
      margin-left: calc(35% - 70px + 180px); }
      @media screen and (max-width: 768px) {
        #point .point_wrap > div .point-txt {
          width: 100%;
          margin: 0 auto; } }
  #point .point_wrap .point01:after,
  #point .point_wrap .point02:after,
  #point .point_wrap .point03:after,
  #point .point_wrap .point04:after {
    content: "";
    display: block;
    position: absolute; }
  #point .point_wrap .point01:after {
    background: url(../images/index/img_point01.png) no-repeat;
    background-size: 310px auto;
    bottom: -28px;
    height: 165px;
    left: 20%;
    width: 310px; }
    @media screen and (max-width: 768px) {
      #point .point_wrap .point01:after {
        width: 200px;
        background-size: 200px auto;
        height: 110px;
        bottom: 0;
        left: auto;
        position: relative;
        margin: 0 auto; } }
  #point .point_wrap .point02:after {
    background: url(../images/index/img_point02.png) no-repeat;
    background-size: 255px auto;
    bottom: -13px;
    height: 119px;
    right: -13px;
    width: 255px; }
    @media screen and (max-width: 768px) {
      #point .point_wrap .point02:after {
        width: 200px;
        background-size: 200px auto;
        height: 110px;
        bottom: 0;
        left: auto;
        position: relative;
        margin: 15px auto 0; } }
  #point .point_wrap .point03:after {
    background: url(../images/index/img_point03.png) no-repeat;
    background-size: 157px auto;
    bottom: -13px;
    height: 109px;
    left: 30%;
    width: 157px; }
    @media screen and (max-width: 768px) {
      #point .point_wrap .point03:after {
        width: 130px;
        background-size: 130px auto;
        height: 100px;
        bottom: 0;
        left: auto;
        position: relative;
        margin: 15px auto 0; } }
  #point .point_wrap .point04:after {
    background: url(../images/index/img_point04.png) no-repeat;
    background-size: 277px auto;
    bottom: -21px;
    height: 160px;
    right: -28px;
    width: 277px; }
    @media screen and (max-width: 768px) {
      #point .point_wrap .point04:after {
        width: 200px;
        background-size: 200px auto;
        height: 110px;
        bottom: 0;
        left: auto;
        position: relative;
        margin: 15px auto 0; } }

#about {
  background: #f9f9f2; }
  #about .about_wrap {
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -ms-flex-wrap: wrap;
    flex-wrap: wrap;
    margin-top: 45px; }
    @media screen and (max-width: 768px) {
      #about .about_wrap {
        -webkit-box-pack: justify;
        -ms-flex-pack: justify;
        justify-content: space-between; } }
    #about .about_wrap div {
      width: 22%;
      margin-bottom: 60px; }
      @media screen and (max-width: 768px) {
        #about .about_wrap div {
          width: 48%;
          margin-bottom: 10px; } }
      #about .about_wrap div figure {
        background: #ffffff;
        display: block;
        width: 130px;
        height: 130px;
        border-radius: 130px;
        text-align: center;
        margin: 0 auto 10px;
        display: -webkit-box;
        display: -ms-flexbox;
        display: flex;
        -ms-flex-wrap: wrap;
        flex-wrap: wrap;
        -ms-flex-line-pack: center;
        align-content: center; }
        @media screen and (max-width: 768px) {
          #about .about_wrap div figure {
            -webkit-box-align: center;
            -ms-flex-align: center;
            align-items: center; } }
        #about .about_wrap div figure img {
          display: block;
          margin: 0 auto; }
          @media screen and (max-width: 768px) {
            #about .about_wrap div figure img {
              max-width: 50%;
              height: auto; } }
      #about .about_wrap div p {
        text-align: center;
        font-weight: bold; }
  #about .about-box {
    text-align: center;
    border: 2px solid #ff6600;
    border-radius: 15px;
    padding: 30px 0 0; }
    @media screen and (max-width: 768px) {
      #about .about-box {
        padding: 15px 0 0; } }
    #about .about-box > p {
      line-height: 200%; }
      @media screen and (max-width: 768px) {
        #about .about-box > p {
          width: 94%;
          margin: 0 auto; } }
    @media screen and (max-width: 768px) {
      #about .about-box > div {
        margin-top: 15px; } }
    #about .about-box > div p {
      font-size: 1.78571rem;
      color: #ff6600;
      font-weight: bold; }
      @media screen and (max-width: 768px) {
        #about .about-box > div p {
          font-size: 1.42857rem; } }

#ranking {
  background: url(../images/index/bg_ranking.jpg) center;
  background-size: cover;
  position: relative;
  min-height: 500px;
  padding-bottom: 0; }
  @media screen and (max-width: 768px) {
    #ranking {
      padding: 15px 0; } }
  #ranking::before {
    background: rgba(242, 146, 57, 0.85);
    content: "";
    display: block;
    position: absolute;
    width: 100%;
    height: 100%;
    top: 0;
    z-index: 0; }
  #ranking h2 {
    font-size: 1.78571rem;
    color: #ffffff;
    width: 50%;
    margin: 0 auto 32px;
    text-align: center;
    position: relative;
    font-size: 1.78571rem; }
    @media screen and (max-width: 768px) {
      #ranking h2 {
        font-size: 1.42857rem;
        width: 100%; } }
    #ranking h2 span {
      font-size: 3.21429rem;
      display: block; }
      @media screen and (max-width: 768px) {
        #ranking h2 span {
          font-size: 2.14286rem; } }
    #ranking h2:before, #ranking h2:after {
      content: "";
      width: 26px;
      height: 43px;
      display: inline-block;
      background-size: 100%;
      position: absolute; }
    #ranking h2:before {
      background-image: url(../images/index/icon_title_before_w.png);
      left: 0;
      bottom: 10px; }
    #ranking h2:after {
      content: "";
      background-image: url(../images/index/icon_title_after_w.png);
      right: 0;
      bottom: 10px; }
  #ranking .ranking_wrap {
    z-index: 1;
    position: relative; }
    #ranking .ranking_wrap .inner_block {
      position: relative; }
    #ranking .ranking_wrap > div {
      width: 45%;
      height: 166px;
      -webkit-box-pack: justify;
      -ms-flex-pack: justify;
      justify-content: space-between;
      display: -webkit-box;
      display: -ms-flexbox;
      display: flex;
      -ms-flex-wrap: wrap;
      flex-wrap: wrap;
      padding: 30px 25px 0;
      position: absolute; }
      @media screen and (max-width: 768px) {
        #ranking .ranking_wrap > div {
          position: relative;
          width: 100%;
          padding: 10px 0;
          background: #ffffff;
          height: auto;
          border-radius: 15px;
          margin-bottom: 15px; } }
      #ranking .ranking_wrap > div.rank01 {
        background: url(../images/index/bg_ranking_block01.png) no-repeat;
        background-size: 100%; }
        @media screen and (max-width: 768px) {
          #ranking .ranking_wrap > div.rank01 {
            background: #ffffff; } }
      #ranking .ranking_wrap > div.rank02 {
        background: url(../images/index/bg_ranking_block02.png) no-repeat;
        background-size: 100%;
        right: 0;
        top: 73px; }
        @media screen and (max-width: 768px) {
          #ranking .ranking_wrap > div.rank02 {
            background: #ffffff;
            border-radius: 15px;
            top: 0;
            right: auto; } }
      #ranking .ranking_wrap > div.rank03 {
        background: url(../images/index/bg_ranking_block03.png) no-repeat;
        background-size: 100%;
        top: 160px; }
        @media screen and (max-width: 768px) {
          #ranking .ranking_wrap > div.rank03 {
            background: #ffffff;
            border-radius: 15px;
            top: 0; } }
      #ranking .ranking_wrap > div.rank04 {
        background: url(../images/index/bg_ranking_block04.png) no-repeat;
        background-size: 100%;
        right: 0;
        top: 230px; }
        @media screen and (max-width: 768px) {
          #ranking .ranking_wrap > div.rank04 {
            background: #ffffff;
            border-radius: 15px;
            top: 0;
            right: auto; } }
      #ranking .ranking_wrap > div.rank05 {
        background: url(../images/index/bg_ranking_block05.png) no-repeat;
        background-size: 100%;
        left: 0;
        top: 320px; }
        @media screen and (max-width: 768px) {
          #ranking .ranking_wrap > div.rank05 {
            background: #ffffff;
            border-radius: 15px;
            top: 0;
            right: auto; } }
      #ranking .ranking_wrap > div figure {
        width: 20%; }
        #ranking .ranking_wrap > div figure img {
          margin-left: 10px; }
          @media screen and (max-width: 768px) {
            #ranking .ranking_wrap > div figure img {
              width: 100%;
              height: auto; } }
      #ranking .ranking_wrap > div p {
        width: 75%;
        margin: 0;
        padding: 15px 0 0 0;
        font-weight: bold;
        line-height: 180%; }
        #ranking .ranking_wrap > div p span {
          padding-bottom: 4px;
          border-bottom: 2px solid #ff6600; }

#curriculum {
  background: #f9f9f2; }
  #curriculum .curriculum_wrap {
    -webkit-box-pack: justify;
    -ms-flex-pack: justify;
    justify-content: space-between;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -ms-flex-wrap: wrap;
    flex-wrap: wrap;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    margin-top: 200px; }
    @media screen and (max-width: 768px) {
      #curriculum .curriculum_wrap {
        margin-top: 0; } }
    #curriculum .curriculum_wrap > div {
      position: relative;
      width: 48%;
      overflow: hidden;
      height: 716px;
      margin-top: -130px; }
      @media screen and (max-width: 768px) {
        #curriculum .curriculum_wrap > div {
          width: 100%;
          height: auto;
          margin-top: 0;
          margin-bottom: 15px; } }
      #curriculum .curriculum_wrap > div:nth-of-type(even) {
        margin-left: auto;
        margin-right: 0; }
        #curriculum .curriculum_wrap > div:nth-of-type(even) .item_inner {
          top: auto;
          right: auto;
          left: 0;
          bottom: 0; }
        #curriculum .curriculum_wrap > div:nth-of-type(even) .item_bg {
          top: 180px;
          bottom: auto; }
          @media screen and (max-width: 768px) {
            #curriculum .curriculum_wrap > div:nth-of-type(even) .item_bg {
              top: 0; } }
      #curriculum .curriculum_wrap > div .item_inner {
        background: #f29239;
        max-width: 469px;
        min-height: 275px;
        border-radius: 15px;
        position: absolute;
        top: 0px;
        right: 0;
        padding: 0px 24px;
        z-index: 1; }
        @media screen and (max-width: 768px) {
          #curriculum .curriculum_wrap > div .item_inner {
            position: relative;
            min-height: auto;
            padding: 5px 4%;
            margin: 0 auto;
            -webkit-box-ordinal-group: 2;
            -ms-flex-order: 1;
            order: 1; } }
        #curriculum .curriculum_wrap > div .item_inner h4 {
          font-size: 1.42857rem;
          margin-bottom: 15px; }
          @media screen and (max-width: 768px) {
            #curriculum .curriculum_wrap > div .item_inner h4 {
              margin-bottom: 0; } }
          #curriculum .curriculum_wrap > div .item_inner h4 span {
            background: #ffffff;
            display: inline-block;
            border-radius: 15px;
            padding: 7px 17px;
            margin-bottom: 8px; }
        #curriculum .curriculum_wrap > div .item_inner p {
          color: #ffffff;
          line-height: 200%; }
      #curriculum .curriculum_wrap > div .item_bg {
        background-position: top center;
        background-size: cover;
        background-repeat: no-repeat;
        height: 415px;
        position: absolute;
        top: 113px;
        width: 100%;
        z-index: 0; }
        @media screen and (max-width: 768px) {
          #curriculum .curriculum_wrap > div .item_bg {
            position: relative;
            top: 0;
            -webkit-box-ordinal-group: 1;
            -ms-flex-order: 0;
            order: 0; } }

#work {
  background: #fffbde; }
  #work h3 {
    margin-bottom: 15px; }
  #work .col2-img {
    margin-bottom: 60px; }
    @media screen and (max-width: 768px) {
      #work .col2-img {
        margin-bottom: 15px; } }
    #work .col2-img h4 {
      font-size: 1.71429rem;
      font-weight: bold;
      margin-bottom: 32px;
      margin-top: 70px;
      line-height: 200%;
      color: #ff6600; }
      @media screen and (max-width: 768px) {
        #work .col2-img h4 {
          font-size: 1.35714rem;
          margin-top: 1rem;
          margin-bottom: 1rem;
          text-align: center;
          line-height: 180%;
          font-weight: bold; } }
      #work .col2-img h4 span {
        padding-bottom: 10px;
        border-bottom: 2px solid #ff6600; }
    #work .col2-img p {
      line-height: 200%; }
  #work .work-business {
    background: #f29239;
    border-radius: 15px;
    padding: 25px 0;
    margin-bottom: 76px; }
    @media screen and (max-width: 768px) {
      #work .work-business {
          border-radius: 15px;
        padding: 15px 0;
        margin-bottom: 0px; } }
    #work .work-business h4 {
      font-size: 1.78571rem;
      color: #ffffff;
      text-align: center;
      letter-spacing: 5px;
      margin: 0;
      padding: 0;
      border-bottom: 2px solid #ffffff;
      max-width: 580px;
      margin: 0 auto 20px;
      padding: 0 0 15px 0; }
      @media screen and (max-width: 768px) {
        #work .work-business h4 {
          font-size: 1.71429rem; } }
    #work .work-business p {
      text-align: center;
      color: #ffffff;
      line-height: 200%;
      max-width: 580px;
      margin: 0 auto; }
      @media screen and (max-width: 768px) {
        #work .work-business p {
          max-width: 94%; } }
  #work .work-content {
    background: #ffffff;
    background-image: url(../images/index/img_work02.png);
    background-repeat: no-repeat;
    background-size: 40%;
    background-position: 90% 80%;
    padding: 45px 0; }
    @media screen and (max-width: 768px) {
      #work .work-content {
        padding-bottom: 150px;
        background-position: 90% bottom; } }
    #work .work-content h4 {
      font-size: 1.78571rem;
      color: #ff6600;
      text-align: center;
      margin: 0 0 40px 0;
      padding: 0; }
    #work .work-content ul {
      width: 40%;
      margin-left: 80px; }
      @media screen and (max-width: 768px) {
        #work .work-content ul {
          width: 94%;
          margin: 0 auto; } }
      #work .work-content ul li {
        font-size: 1.14286rem;
        background: #f9f9f2;
        padding: 20px 0 20px 70px;
        margin-bottom: 10px;
        font-weight: bold;
        background-repeat: no-repeat; }
        @media screen and (max-width: 768px) {
          #work .work-content ul li {
            padding: 10px 0 10px 40px; } }
        #work .work-content ul li:nth-of-type(1) {
          background-image: url(../images/index/icon_work01.png);
          background-size: 28px 22px;
          background-position: 23px center; 
          border-radius: 15px;}
          @media screen and (max-width: 768px) {
            #work .work-content ul li:nth-of-type(1) {
              background-position: 5px center; } }
        #work .work-content ul li:nth-of-type(2), #work .work-content ul li:nth-of-type(4) {
          background-image: url(../images/index/icon_work02.png);
          background-size: 32px 26px;
          background-position: 22px center;
          border-radius: 15px; }
          @media screen and (max-width: 768px) {
            #work .work-content ul li:nth-of-type(2), #work .work-content ul li:nth-of-type(4) {
              background-position: 4px center; } }
        #work .work-content ul li:nth-of-type(3), #work .work-content ul li:nth-of-type(5) {
          background-image: url(../images/index/icon_work03.png);
          background-size: 26px 34px;
          background-position: 26px center;
          border-radius: 15px; }
          @media screen and (max-width: 768px) {
            #work .work-content ul li:nth-of-type(3), #work .work-content ul li:nth-of-type(5) {
              background-position: 6px center; } }
        #work .work-content ul li:nth-of-type(6) {
          background-image: url(../images/index/icon_work04.png);
          background-size: 27px 30px;
          background-position: 25px center; 
          border-radius: 15px;}
          @media screen and (max-width: 768px) {
            #work .work-content ul li:nth-of-type(6) {
              background-position: 5px center;
              border-radius: 15px; } }

#recruit {
  background: url(../images/index/bg_recruit.jpg) center;
  background-size: cover;
  position: relative;
  min-height: 1240px;
  padding-bottom: 0; }
  @media screen and (max-width: 768px) {
    #recruit {
      padding-bottom: 15px;
      min-height: auto; } }
  #recruit::before {
    background: rgba(242, 146, 57, 0.85);
    content: "";
    display: block;
    position: absolute;
    width: 100%;
    height: 100%;
    top: 0;
    z-index: 0; }
  #recruit h2 {
    font-size: 2.85714rem;
    color: #ffffff;
    width: 70%;
    margin: 0 auto 32px;
    text-align: center;
    position: relative; }
    @media screen and (max-width: 768px) {
      #recruit h2 {
        font-size: 1.71429rem;
        line-height: 100%;
        width: 80%; } }
    #recruit h2 span {
      font-size: 3.21429rem;
      display: block; }
    #recruit h2:before, #recruit h2:after {
      content: "";
      width: 26px;
      height: 43px;
      display: inline-block;
      background-size: 100%;
      position: absolute; }
    #recruit h2:before {
      background-image: url(../images/index/icon_title_before_w.png);
      left: 0;
      bottom: 10px; }
      @media screen and (max-width: 768px) {
        #recruit h2:before {
          bottom: 0; } }
    #recruit h2:after {
      content: "";
      background-image: url(../images/index/icon_title_after_w.png);
      right: 0;
      bottom: 10px; }
      @media screen and (max-width: 768px) {
        #recruit h2:after {
          bottom: 0; } }
  #recruit .recruit_wrap {
    position: relative;
    z-index: 1; }
    #recruit .recruit_wrap > div {
      border-radius: 15px;
      background: #ffffff;
      -webkit-box-pack: start;
      -ms-flex-pack: start;
      justify-content: flex-start;
      display: -webkit-box;
      display: -ms-flexbox;
      display: flex;
      -ms-flex-wrap: wrap;
      flex-wrap: wrap;
      padding: 10px 60px;
      -webkit-box-align: center;
      -ms-flex-align: center;
      align-items: center;
      margin-bottom: 50px; }
      @media screen and (max-width: 768px) {
        #recruit .recruit_wrap > div {
          border-radius: 15px;
          padding: 10px 0;
          -webkit-box-align: start;
          -ms-flex-align: start;
          align-items: flex-start;
          -webkit-box-pack: justify;
          -ms-flex-pack: justify;
          justify-content: space-between;
          margin-bottom: 15px; } }
      #recruit .recruit_wrap > div .item-no {
        width: 15%;
        margin-right: 5%; }
        @media screen and (max-width: 768px) {
          #recruit .recruit_wrap > div .item-no {
            margin-left: 2%; } }
        #recruit .recruit_wrap > div .item-no span {
          background: #f9ba38;
          color: #ffffff;
          font-size: 4.28571rem;
          font-family: 'Lato', sans-serif;
          display: block;
          width: 112px;
          height: 102px;
          border-radius: 112px;
          text-align: center;
          padding-top: 10px; }
          @media screen and (max-width: 768px) {
            #recruit .recruit_wrap > div .item-no span {
              width: 70px;
              height: 67px;
              border-radius: 70px;
              padding-top: 5px;
              font-size: 2.85714rem; } }
      #recruit .recruit_wrap > div .item-content {
        width: 80%; }
        @media screen and (max-width: 768px) {
          #recruit .recruit_wrap > div .item-content {
            width: 75%; } }
        #recruit .recruit_wrap > div .item-content h3 {
          font-size: 1.78571rem;
          color: #ff6600;
          margin-bottom: 20px; }
          @media screen and (max-width: 768px) {
            #recruit .recruit_wrap > div .item-content h3 {
              font-size: 1.64286rem;
              margin: 0 0 10px 0; } }

#service .service_wrap {
  -webkit-box-pack: center;
  -ms-flex-pack: center;
  justify-content: center;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -ms-flex-wrap: wrap;
  flex-wrap: wrap;
  margin-top: 34px; }
  @media screen and (max-width: 768px) {
    #service .service_wrap {
      margin-top: 15px; } }
  #service .service_wrap > div {
    width: 40%;
    background: #fffbde;
    border-radius: 15px;
    margin-right: 2%;
    margin-bottom: 30px; }
    @media screen and (max-width: 768px) {
      #service .service_wrap > div {
        width: 100%;
        margin-right: 0;
        margin-bottom: 15px; } }
    #service .service_wrap > div:nth-of-type(2n) {
      margin-right: 0; }
    #service .service_wrap > div h4 {
      background: #f29239;
      color: #ffffff;
      font-size: 1.78571rem;
      text-align: center;
      margin: 0;
      border-radius: 15px 15px 0 0;
      padding: 24px 0 14px;
      height: 47px; }
      @media screen and (max-width: 768px) {
        #service .service_wrap > div h4 {
          font-size: 1.64286rem;
          padding: 19px 0 9px;
          height: 42px; } }
      #service .service_wrap > div h4.row2 {
        padding: 18px 0 8px;
        height: 58px;
        line-height: 120%; }
        @media screen and (max-width: 768px) {
          #service .service_wrap > div h4.row2 {
            padding: 13px 0 3px;
            height: 53px; } }
      #service .service_wrap > div h4 span {
        font-size: 1rem;
        display: block; }
    #service .service_wrap > div .item-content {
      padding: 18px 0 5px; }
      #service .service_wrap > div .item-content p {
        text-align: center; }

#step {
  background: #f9f9f2; }
  #step h3 {
    margin-bottom: 60px; }
    @media screen and (max-width: 768px) {
      #step h3 {
        margin-bottom: 15px; } }
  #step .item {
    border-radius: 15px;
    border: 2px solid #ff6600;
    background: #ffffff;
    -webkit-box-pack: justify;
    -ms-flex-pack: justify;
    justify-content: space-between;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -ms-flex-wrap: wrap;
    flex-wrap: wrap;
    padding: 30px 60px;
    margin-bottom: 50px;
    -ms-flex-line-pack: center;
    align-content: center;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    position: relative; }
    @media screen and (max-width: 768px) {
      #step .item {
        border-radius: 15px;
        padding: 10px 0;
        -webkit-box-align: start;
        -ms-flex-align: start;
        align-items: flex-start;
        -webkit-box-pack: justify;
        -ms-flex-pack: justify;
        justify-content: space-between; } }
    #step .item:after {
      content: "";
      display: block;
      background: url(../images/index/icon_arrow_step.png) no-repeat;
      width: 82px;
      height: 25px;
      margin: 0 auto;
      position: absolute;
      left: 0;
      right: 0;
      background-size: 100%;
      bottom: -40px; }
    #step .item:last-child:after {
      display: none; }
    #step .item .item-no {
      width: 15%;
      margin-right: 5%; }
      @media screen and (max-width: 768px) {
        #step .item .item-no {
          margin-left: 2%; } }
      #step .item .item-no div {
        font-size: 1.21429rem;
        background: #ff6600;
        color: #ffffff;
        font-family: 'Lato', sans-serif;
        display: block;
        width: 112px;
        height: 92px;
        border-radius: 112px;
        text-align: center;
        padding-top: 20px;
        line-height: 100%; }
        @media screen and (max-width: 768px) {
          #step .item .item-no div {
            width: 70px;
            height: 67px;
            border-radius: 70px;
            padding-top: 5px; } }
      #step .item .item-no span {
        font-size: 4.28571rem;
        display: block;
        margin-top: 20px; }
        @media screen and (max-width: 768px) {
          #step .item .item-no span {
            font-size: 2.85714rem;
            margin-top: 10px; } }
    #step .item .item-content {
      width: 80%; }
      @media screen and (max-width: 768px) {
        #step .item .item-content {
          width: 75%; } }
      #step .item .item-content h4 {
        font-size: 1.78571rem;
        color: #ff6600;
        margin: 0;
        padding: 0;
        margin-bottom: 20px; }
        @media screen and (max-width: 768px) {
          #step .item .item-content h4 {
            font-size: 1.64286rem;
            margin: 0 0 10px 0; } }

#access .access-wrap {
  -webkit-box-pack: justify;
  -ms-flex-pack: justify;
  justify-content: space-between;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -ms-flex-wrap: wrap;
  flex-wrap: wrap;
  margin-top: 55px;
  -webkit-box-align: start;
  -ms-flex-align: start;
  align-items: flex-start;
  -ms-flex-line-pack: center;
  align-content: center; }
  @media screen and (max-width: 768px) {
    #access .access-wrap {
      margin-top: 30px; } }
  #access .access-wrap div {
    width: 60%; }
    @media screen and (max-width: 768px) {
      #access .access-wrap div {
        width: 100%; }
        #access .access-wrap div iframe {
          width: 100%; } }
  #access .access-wrap dl {
    -webkit-box-pack: justify;
    -ms-flex-pack: justify;
    justify-content: space-between;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -ms-flex-wrap: wrap;
    flex-wrap: wrap;
    width: 30%;
    margin: 0;
    padding: 0;
    font-size: 1.14286rem; }
    @media screen and (max-width: 768px) {
      #access .access-wrap dl {
        width: 100%; } }
    #access .access-wrap dl dt {
      width: 30%;
      margin: 0;
      padding: 10px 0;
      border-bottom: 2px solid #d2d2d2;
      color: #949494; }
    #access .access-wrap dl dd {
      width: 70%;
      margin: 0;
      padding: 10px 0;
      border-bottom: 2px solid #d2d2d2; }

#qa {
  background: #fffbde; }
  #qa .items > div {
    background: #ffffff; }
    #qa .items > div h4 {
      background: #f29239;
      color: #ffffff;
      font-size: 1.78571rem;
      padding: 20px 55px;
      border-radius: 15px 15px 0 0;
      margin-bottom: 0; }
      @media screen and (max-width: 768px) {
        #qa .items > div h4 {
          font-size: 1.64286rem;
          border-radius: 15px 15px 0 0;
          padding: 10px 25px; } }
    #qa .items > div div {
      padding: 30px 55px; }
      @media screen and (max-width: 768px) {
        #qa .items > div div {
          padding: 15px 25px; } }

.request2 {
  background: #e3e3e3;; }
  .request2 a {
    font-size: 2.371rem;
    color: #ffffff;
    text-align: center;
    display: block;
    background: #9EBF00;
    padding: 45px 0;
    width: 60%;
    border-radius: 35px;
    margin: 18px auto;
    font-weight: bold;
    border: 0.3em double #fff;
    
    position: relative; }
    @media screen and (max-width: 768px) {
      .request2 a {
        font-size: 1.471rem;
        width: 100%;
        padding: 20px 0; } }
    .request2 a:hover {
      opacity: 0.8; }
      @media screen and (max-width: 768px) {
        .request2 a span:after {
          display: none; } }

#concept .inner_block div {
  background: #fffbde;
  width: 80%;
  margin: 50px auto 62px;
  position: relative;
  padding: 25px 0 60px; }
  @media screen and (max-width: 768px) {
    #concept .inner_block div {
      width: 100%;
      margin: 25px auto 30px;
      padding: 12px 0 30px; } }
  #concept .inner_block .owner:before {
    content: "";
    display: block;
    position: absolute;
    bottom: 0;
    left: -33px;
    width: 213px;
    height: 111px;
    background: url(../images/index/img_concept01.png) no-repeat;
    background-size: 100%; }
    @media screen and (max-width: 768px) {
      #concept .inner_block .owner:before {
        width: 106px;
        height: 55px;
        left: 0; } }
  #concept .inner_block .owner:after {
    content: "";
    display: block;
    position: absolute;
    bottom: 0;
    right: -33px;
    width: 213px;
    height: 111px;
    background: url(../images/index/img_concept02.png) no-repeat;
    background-size: 100%; }
    @media screen and (max-width: 768px) {
      #concept .inner_block .owner:after {
        width: 106px;
        height: 55px;
        right: 0; } }
  #concept .inner_block div h4 {
    font-size: 1.28571rem;
    color: #ff6600;
    text-align: center;
    margin-bottom: 30px; }
    @media screen and (max-width: 768px) {
      #concept .inner_block div h4 {
        margin-bottom: 15px; } }
  #concept .inner_block div p {
    font-size: 1.78571rem;
    line-height: 200%;
    text-align: center;
    font-weight: bold; }
    @media screen and (max-width: 768px) {
      #concept .inner_block div p {
        font-size: 1.64286rem;
        line-height: 180%; } }
  #concept .inner_block div + p {
    text-align: center;
    line-height: 180%; }

.page .tbox-center80 {
  width: 80%;
  margin: 0 auto; }
  @media screen and (max-width: 768px) {
    .page .tbox-center80 {
      width: 100%; } }

.page .slick-next:before, .page .slick-prev:before {
  color: #00007f; }

@media screen and (max-width: 768px) {
  .page .slick-slider {
    width: 80%;
    margin: 0 auto; } }

.page .slick-list {
  margin-right: -12px; }

.page .slick-slide {
  margin-right: 12px; }
  .page .slick-slide img {
    width: 100%;
    height: auto; }

#request {
  background: #fffbde; }
  #request .col2-img {
    margin-bottom: 60px; }
    @media screen and (max-width: 768px) {
      #request .col2-img {
        margin-bottom: 15px; } }
    #request .col2-img h4 {
      font-size: 1.71429rem;
      font-weight: bold;
      margin-bottom: 32px;
      margin-top: 70px;
      line-height: 200%;
      color: #ff6600; }
      @media screen and (max-width: 768px) {
        #request .col2-img h4 {
          font-size: 1.35714rem;
          margin-top: 1rem;
          margin-bottom: 1rem;
          text-align: center;
          line-height: 180%;
          font-weight: bold; } }
      #request .col2-img h4 span {
        padding-bottom: 10px;
        border-bottom: 2px solid #ff6600; }
    #request .col2-img p {
      line-height: 200%; }
  #request .request-content {
    background: #ffffff;
    margin: 20px auto;
    padding: 15px 0;
    font-size: 1.22857rem;
    width: 95%;
    max-width: 1000px; }
    #request .request-content .form__btnwrapper {
      display: -webkit-box;
      display: -ms-flexbox;
      display: flex;
      -webkit-box-pack: center;
      -ms-flex-pack: center;
      justify-content: center;
      -ms-flex-wrap: wrap;
      flex-wrap: wrap; }
      #request .request-content .form__btnwrapper .form_button {
        margin: 0;
        width: 160px; }
        @media screen and (max-width: 480px) {
          #request .request-content .form__btnwrapper .form_button {
            width: 240px; } }
      #request .request-content .form__btnwrapper input[type="submit"] {
        background-color: #9ebd2e; }
      #request .request-content .form__btnwrapper input[type="button"] {
        background-color: #f9ba38;
        margin-right: 2rem; }
        @media screen and (max-width: 480px) {
          #request .request-content .form__btnwrapper input[type="button"] {
            margin-right: 0;
            margin-bottom: 2rem; } }
      #request .request-content .form__btnwrapper .back {
        width: 280px;
        margin-top: 40px; }



/*=== addendum 2021-03-17 ===*/

/* 堺市JR〜徒歩1分！ */
.nearest-station {
  color: #ff6600;
  font-weight: bold;
  padding: 0.25em 0.5em;
  border-radius: 6px;
}
@media screen and (max-width: 768px) {
  .nearest-station {
    font-size: 14px;
    margin-right: 64px;
    position: static;
  }
}
@media screen and (max-width: 480px) {
  .nearest-station {
    font-size: 12px;
    letter-spacing: normal;
    margin-right: 56px;
    padding: 0.20em 0.375em;
  }
}
@media screen and (max-width: 413px) {
  .nearest-station {
    font-size: 11px;
    letter-spacing: -0.05em;
    margin-right: 56px;
    padding: 0.15em 0.25em;
  }
}
@media screen and (max-width: 374px) {
  .nearest-station {
    font-size: 11px;
    letter-spacing: -0.075em;
    margin-right: 42px;
    padding: 0.15em 0.25em;
  }
}
.nearest-station strong {
  color: #f00;
}



#last-p p {
  text-align: left;
  width: 870px;  
  margin-right: auto;
  margin-left: auto;
  background-color: #f4f4f4;
  padding: 15px;
  text-align: center;
}
@media screen and (max-width: 768px) {
  #last-p p {
    width: 95%;
    margin-right: auto;
    margin-left: auto;
    text-align: left;
  }
}

/*=== addendum 2022-03-12 ===*/

#voices { background-color: #f9f9f2; }

#voices h2 {
  color: #f60;
  display: flex;
  font-size: 2.85714rem;
  justify-content: center;
  margin: 0 auto 32px;
  text-align: center;
}
@media screen and (max-width: 768px) {
  #voices h2 {
    align-items: flex-end;
    font-size: 1.71429rem;
  }
}

#voices h2::before,
#voices h2::after {
  font-weight: normal;
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
  text-rendering: optimizeLegibility;
}
#voices h2::before {
  content: '＼';
  margin-right: 0.25em;
}
#voices h2::after {
  content: '／';
  margin-left: 0.25em;
}

#voices article {
  align-items: center;
  background-color: #fff;
  border: 2px solid #f60;
  display: flex;
  justify-content: space-between;
  margin-bottom: 50px;
  padding: 30px 60px;
  border-radius: 15px;
}
@media screen and (max-width: 768px) {
  #voices article {
    align-items: flex-start;
    margin-bottom: 15px;
    padding: 15px;
    border-radius: 15px;
  }
}

#voices article img {
  flex: 0 0 10%;
  height: auto;
  margin: 0 5% 0 0;
  order: 0;
  width: 10%;
}
@media screen and (max-width: 768px) {
  #voices article img { width: 15%; flex: 0 0 15%; }
}

#voices article:nth-of-type(even) img {
  margin: 0 0 0 5%;
  order: 1;
}

#voices article .article-body { order: 1; }
#voices article:nth-of-type(even) .article-body { order: 0; }

#voices .article-body h3 {
  color: #f60;
  font-size: 1.78571rem;
  line-height: 1;
  margin: 0 0 20px;
}
@media screen and (max-width: 768px) {
  #voices .article-body h3 {
    font-size: 1.64286rem;
    margin: 0 0 10px;
  }
}

#voices .article-body p { margin: 0; }

#voices .article-body em {
  font-style: normal;
  background: linear-gradient(transparent 60%, #ffff66 60%);
}

/*=== addendum 2022-03-14 ===*/

#carfare {
  background-color: #fffbde;
  padding-bottom: 2.714rem;
  padding-top: 3.5rem;
}

.carfare__lead {
  background-color: #f29239;
  color: #fff;
  font-size: 2.45rem;
  font-weight: 500;
  padding: 1rem 1.5rem;
}
@media screen and (max-width: 768px) {
  .carfare__lead { font-size: 1.45rem; }
}

.carfare__grid {
  display: grid;
  gap: 20px;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  margin-top: 8rem;
}
@media screen and (max-width: 768px) {
  .carfare__grid {
    grid-template-columns: repeat(1, minmax(0, 1fr));
    margin-top: 7rem;
    padding: 0 7%;
    row-gap: 100px;
  }
}

.carfare__grid li {
  background-color: #fff;
  padding: 0 1.5rem 1.5rem;
  position: relative;
  border-radius: 15px;
}
@media screen and (max-width: 768px) {
    /* border-radius: 15px; */
  .carfare__grid li { padding: 0 8% 1.5rem; }
}

.carfare__grid li .tag {
  color: #fff;
  font-size: 1.5rem;
  font-weight: 700;
  line-height: 1;
  margin: 0;
  position: relative;
  text-align: center;
  transform: translate(0, -50%);
}
@media screen and (max-width: 768px) {
  .carfare__grid li .tag {
    font-size: 1.65rem;
    transform: translate(0, -45%);
  }
}

.carfare__grid li .tag::before {
  background: url(../images/index/feature_tag.png) center center / contain no-repeat;
  content: "";
  height: 9rem;
  left: 50%;
  position: absolute;
  top: 50%;
  transform: translate(-50%, -50%);
  width: 11rem;
}
@media screen and (max-width: 768px) {
  .carfare__grid li .tag::before {
    height: 9rem;
    width: 12rem;
  }
}

.carfare__grid li .tag span { position: relative; }

.carfare__grid li .desc {
  font-size: 1.25rem;
  line-height: 1.75;
  margin: 3.0em 0 0;
}
@media screen and (max-width: 768px) {
  .carfare__grid li .desc {
    font-size: 1.125rem;
    line-height: 1.65;
    margin: 3em 0 0;
  }
}


要素 {

}
.yellow {
    font-style: normal;
    background: linear-gradient(transparent 60%, #ffff66 60%);
}
.yellow2 {
    font-style: normal;
    background: linear-gradient(transparent 90%, #ffff66 90%);
}

 #traffic-h3 {
  color: #ff6c00;
  background-image: url(../images/index/train.png);
  background-repeat: no-repeat;
  background-size: 5%;
  background-position-x: center;
  padding-top: 58px;
  font-size: 2.85rem;
  text-align: center;
  margin-top: 0;
}

@media screen and (max-width: 768px) {
 #traffic-h3 {
  color: #ff6c00;
  background-image: url(../images/index/train.png);
  background-repeat: no-repeat;
  background-size: 10%;
  background-position-x: center;
  padding-top: 45px;
  font-size: 1.9em;
text-align: center;
margin-top: -25px;
margin-bottom: 14px;
}
}

 #traffic-p{
  background-color: white;
  padding: 15px;
  line-height: 173%;
  font-size: 1.3rem;
  border-radius: 15px;
}

@media screen and (max-width: 768px) {
 #traffic-p{
  background-color: white;
  padding: 15px;
  line-height: 173%;
  font-size: 1.1rem;
  border-radius: 15px;
  margin-bottom: -15px;
}}

.voice-p {
font-size: 1.3em;
}

@media screen and (max-width: 768px) {
.voice-p {
font-size: 1.1em;
}}

 
.loader {
  position: fixed;
  width: 100%;
  height: 100vh;
  background-color: rgba(255, 255, 255, 0.9);
  z-index: 555;
  top: 0;
  left: 0;
  display: flex;
  justify-content: center;
  align-items: center;
  z-index: 99999;
}

.loader .txt {
  font-size: 30px;
  font-weight: bold;
  color: rgb(30, 50, 93);
  text-align: center;
}

@media screen and (max-width: 768px) {
  .loader .txt {
    font-size: 15px;
  }}

.loader img {
  width: 100%;
  max-width: 20%;
}

.head-txt .inner_block img {
    width: 100%;
  max-width: 20%;
}

#concept .inner_block .owner-vision {
  background: #fff;
  position: absolute;
  padding: 25px 20px;
  border: 1px solid #ff6600;
  top: 15%;
  left: 12%;
  border-radius: 15px;
  width: 370px;
}

#concept .inner_block .owner-philosophy {
  background: #ff6600;
  position: absolute;
  padding: 25px 20px;
  border: 1px solid #ff6600;
  top: 25%;
  right: 10%;
  border-radius: 15px;
  width: 370px;
  z-index: -1;
}

#concept .inner_block .owner-philosophy h3 {
  color: #fff;
  font-size: 30px;
  text-align: center;
}

#concept .inner_block .owner-vision h3 {
  color: #ff6600;
  font-size: 30px;
  text-align: center;
}

#concept .inner_block .owner-vision p {
  color: #ff6600;
}

#concept .inner_block .owner-philosophy p {
  color: #fff;
}

@media screen and (max-width: 768px) {
  #concept .inner_block .owner-vision {
    background: #fff;
    position: absolute;
    padding: 1px 17px;
    border: 1px solid #ff6600;
    top: 15%;
    left: 1%;
    border-radius: 15px;
    width: 210px;
  }

  #concept .inner_block .owner-vision h3 {
    color: #ff6600;
    font-size: 20px;
    text-align: center;
 }
 #concept .inner_block .owner-vision p {
  color: #ff6600;
  font-size: 15px;
}

#concept .inner_block .owner-philosophy {
  background: #ff6600;
  position: absolute;
  padding: 25px 5px;
  border: 1px solid #ff6600;
  top: 30%;
  right: 7%;
  border-radius: 15px;
  width: 210px;
  z-index: -1;
}

#concept .inner_block .owner-philosophy h3 {
  color: #fff;
  font-size: 20px;
  text-align: center;
}

#concept .inner_block .owner-philosophy p {
  font-size: 20px;
  color: #fff;
}

#concept article {
height: 320px!important;
}

}

#message {
  max-width: 80%;
  margin: auto;
}

#message .message-box  {
  background: #fff;
  padding: 25px 20px;
  border: 1px solid #ff6600;
  border-radius: 15px;
  text-align: center;
  margin-bottom: 45px;
}

#message .message-box2 {
  background: #fff;
  padding: 25px 20px;
  border: 1px solid #ff6600;
  border-radius: 15px;
  text-align: center;
  margin-bottom: 45px;
}

#message .message-box h3 {
  color: #ff6600;
  font-size: 30px;
}

#message .message-box p {
  text-align: left;
  font-size: 19px;
  font-weight: 600;
}

  .sp-none {
    display: block;
   }

  @media screen and (max-width: 768px) {
    #message {
      max-width: 100%;
      margin: auto;
      padding: 15px;
    }
    .sp-none {
      display: none;
     }

     #message .message-box h3 {
      color: #ff6600;
      font-size: 20px;
    }

     #message .message-box p {
      font-size: 15px;
  }
  }

  .css-carousel-slider {
    width: 100%;
    /* max-width: 800px */ /* サイズ設定をする場合はここ(*1) */
    overflow: hidden;
    position: relative;
    height: 280px;
  }
  @media screen and (max-width: 500px) {
    .css-carousel-slider {
      width: 100%;
      /* max-width: 800px */ /* サイズ設定をする場合はここ(*1) */
      overflow: hidden;
      position: relative;
      height: 150px;
    }
  }
  .css-carousel-slider img {
    width: 100%;
    height: auto;
    vertical-align: top;
  }
  
  /* スライド設定 */
  .css-carousel-slider .slide-wrap {
    width: 400%; /* 画像の合計数*100%を設定(*2) */
    position: absolute;
    display: flex;
    top: 0;
    left: 0;
    z-index: 0;
    animation: css-carousel-slider 20s infinite; /* スライダーアニメーション全体の時間(*3) */
    animation-delay: 2s; /* スライダーが始まるまでの時間(*4) */
  }
  .css-carousel-slider .slide-wrap-main {
    width: 100%;
    z-index: 1;
    animation: css-carousel-slider-main 20s infinite; /* (*3)と同じ内容を設定 */
    animation-delay: 2s; /* (*4)と同じ内容を設定 */
  }
  .css-carousel-slider .slide {
    width: 100%;
  }
  
  /* スライダーアニメーションの設定(*5) */
  @keyframes css-carousel-slider {
    0% { transform: translateX(0); }
  
    20% { transform: translateX(calc(1 / 4 * -100%)); }
    25% { transform: translateX(calc(1 / 4 * -100%)); }
  
    45% { transform: translateX(calc(2 / 4 * -100%)); }
    50% { transform: translateX(calc(2 / 4 * -100%)); }
  
    70% { transform: translateX(calc(3 / 4 * -100%)); }
    75% { transform: translateX(calc(3 / 4 * -100%)); }
  
    95% { transform: translateX(calc(4 / 4 * -100%)); }
    100% { transform: translateX(calc(4 / 4 * -100%)); }
  }
  
  @keyframes css-carousel-slider-main {
    0% { transform: translateX(100%); }
    75% { transform: translateX(100%); }
    95% { transform: translateX(0%);}
  }