@charset "UTF-8";
@import url("https://fonts.googleapis.com/css2?family=Noto+Sans+JP:wght@500;700;900&display=swap");
html {
  background: fff;
  color: 333;
  overflow-y: scroll; }

body {
  font: 13px/1.22 arial,helvetica,clean,sans-serif;
  *font-size: small;
  *font: x-small;
  margin-top: 0px;
  margin-right: 0px;
  margin-bottom: 0px;
  margin-left: 0px; }

table {
  font-size: inherit;
  font: 100%; }

a img, img {
  border: 0; }

figure, blockquote, dd, div, dl, dt,
h1, h2, h3, h4, h5, h6,
li, ol, p, pre, span, td, th, ul {
  margin: 0;
  padding: 0; }

abbr, acronym {
  border: 0; }

address, caption, cite, code, dfn, em, th, strong, var {
  font-style: normal;
  font-weight: normal; }

caption, th {
  text-align: left; }

code, kbd, pre, samp, tt {
  font-family: monospace;
  line-height: 100%; }

* + html code, kbd, pre, samp, tt {
  font-size: 108%; }

h1, h2, h3, h4, h5, h6 {
  font-size: 100%;
  font-weight: normal; }

ol, ul {
  list-style: none; }

q:before, q:after {
  content: ''; }

button, fieldset, form, input, label, legend, select, textarea {
  font-family: inherit;
  font-size: 100%;
  font-style: inherit;
  font-weight: inherit;
  margin: 0;
  padding: 0; }

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

hr {
  border-top-style: none;
  border-right-style: none;
  border-bottom-style: none;
  border-left-style: none;
  background-color: #FFF;
  color: #FFF; }

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

/************************************
** レスポンシブページネーション
************************************/
.pagination {
  list-style-type: none;
  padding-left: 0;
  margin: 30px 0; }

.pagination,
.pagination li a {
  display: flex;
  flex-wrap: wrap;
  justify-content: center;
  align-items: center; }

.pagination a {
  font-weight: 300;
  padding-top: 1px;
  text-decoration: none;
  border: 1px solid #ddd;
  border-left-width: 0;
  min-width: 36px;
  min-height: 36px;
  color: #333; }

.pagination li:not([class*="current"]) a:hover {
  background-color: #eee; }

.pagination li:first-of-type a {
  border-left-width: 1px; }

.pagination li.first span,
.pagination li.last span,
.pagination li.previous span,
.pagination li.next span {
  /* screen readers only */
  position: absolute;
  top: -9999px;
  left: -9999px; }

.pagination li.first a::before,
.pagination li.last a::after,
.pagination li.previous a::before,
.pagination li.next a::after {
  display: inline-block;
  font-family: Fontawesome;
  font-size: inherit;
  text-rendering: auto;
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
  transform: translate(0, 0); }

.pagination li.first a::before {
  content: "\f100"; }

.pagination li.last a::after {
  content: "\f101"; }

.pagination li.previous a::before {
  content: "\f104"; }

.pagination li.next a::after {
  content: "\f105"; }

.pagination li.current a {
  background-color: #ddd;
  cursor: default;
  pointer-events: none; }

.pagination > li:first-child > a {
  border-bottom-left-radius: 4px;
  border-top-left-radius: 4px; }

.pagination > li:last-child > a {
  border-bottom-right-radius: 4px;
  border-top-right-radius: 4px; }

@media only screen and (max-width: 680px) {
  .pagination li.first,
  .pagination li.last {
    /* screen readers only */
    position: absolute;
    top: -9999px;
    left: -9999px; }

  .pagination li.previous a {
    border-left-width: 1px; } }
@media only screen and (max-width: 500px) {
  .pagination li {
    /* screen readers only */
    position: absolute;
    top: -9999px;
    left: -9999px; }

  .pagination li.current,
  .pagination li.first,
  .pagination li.last,
  .pagination li.previous,
  .pagination li.next {
    position: initial;
    top: initial;
    left: initial; }

  .pagination li.previous a {
    border-left-width: 0; } }
@media only screen and (max-width: 400px) {
  .pagination li.first,
  .pagination li.last {
    /* screen readers only */
    position: absolute;
    top: -9999px;
    left: -9999px; }

  .pagination li.previous a {
    border-left-width: 1px; } }
@media only screen and (max-width: 240px) {
  /* For watches? */
  .pagination li {
    width: 50%; }

  .pagination li.current {
    order: 2;
    width: 100%;
    border-left-width: 1px; } }
.only-pc {
  display: none; }
  @media (min-width: 481px) and (max-width: 768px) {
    .only-pc {
      display: none; } }
  @media (min-width: 769px) and (max-width: 1140px) {
    .only-pc {
      display: inline; } }
  @media (min-width: 769px) {
    .only-pc {
      display: inline; } }

.only-tabsp {
  display: block; }
  @media (min-width: 481px) and (max-width: 768px) {
    .only-tabsp {
      display: block; } }
  @media (min-width: 769px) and (max-width: 1140px) {
    .only-tabsp {
      display: none; } }
  @media (min-width: 769px) {
    .only-tabsp {
      display: none; } }

.only-tab {
  display: none; }
  @media (min-width: 481px) and (max-width: 768px) {
    .only-tab {
      display: block; } }
  @media (min-width: 769px) and (max-width: 1140px) {
    .only-tab {
      display: none; } }
  @media (min-width: 769px) {
    .only-tab {
      display: none; } }

.only-pctab {
  display: none; }
  @media (min-width: 481px) and (max-width: 768px) {
    .only-pctab {
      display: inline-block; } }
  @media (min-width: 769px) and (max-width: 1140px) {
    .only-pctab {
      display: inline-block; } }
  @media (min-width: 769px) {
    .only-pctab {
      display: inline-block; } }

.only-sp {
  display: inline-block; }
  @media (min-width: 481px) and (max-width: 768px) {
    .only-sp {
      display: none; } }
  @media (min-width: 769px) and (max-width: 1140px) {
    .only-sp {
      display: none; } }
  @media (min-width: 769px) {
    .only-sp {
      display: none; } }

.wideimg {
  position: relative;
  width: 100%;
  overflow: hidden; }

.wideimg::before {
  content: " ";
  display: block;
  padding-top: 20%; }

.wideimg > img {
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
  -webkit-transform: translate(-50%, -50%);
  -ms-transform: translate(-50%, -50%);
  width: 100%;
  height: auto; }

@media (min-width: 481px) and (max-width: 768px) {
  .pcl-flex {
    display: -webkit-box;
    /*--- Androidブラウザ用 ---*/
    display: -ms-flexbox;
    /*--- IE10 ---*/
    display: -webkit-flex;
    /*--- safari（PC）用 ---*/
    display: flex;
    -webkit-box-pack: justify;
    /*--- Androidブラウザ用 ---*/
    -ms-flex-pack: justify;
    /*--- IE10 ---*/
    -webkit-justify-content: space-between;
    /*--- safari（PC）用 ---*/
    justify-content: space-between; } }
@media (min-width: 769px) {
  .pcl-flex {
    display: -webkit-box;
    /*--- Androidブラウザ用 ---*/
    display: -ms-flexbox;
    /*--- IE10 ---*/
    display: -webkit-flex;
    /*--- safari（PC）用 ---*/
    display: flex;
    -webkit-box-pack: justify;
    /*--- Androidブラウザ用 ---*/
    -ms-flex-pack: justify;
    /*--- IE10 ---*/
    -webkit-justify-content: space-between;
    /*--- safari（PC）用 ---*/
    justify-content: space-between; } }

header {
  width: 100%;
  font-family: "Noto Sans JP", "Hiragino Sans", Meiryo, "Yu Gothic Medium", sans-serif;
  width: 100%;
  margin: 0 auto;
  box-sizing: border-box; }

header .tel {
  display: none; }
  @media (min-width: 769px) {
    header .tel {
      padding: .5rem 1rem;
      display: block;
      background-color: #000;
      color: #fff;
      text-align: right;
      font-size: 18px; } }

@media (min-width: 769px) {
  header .tel span {
    font-size: 13px; } }

header p#logo a {
  vertical-align: middle;
  line-height: 0; }

header .header-wrap {
  width: 100%;
  height: 50px;
  padding: .5rem 0;
  position: fixed;
  top: 0;
  box-sizing: border-box;
  background-color: #fff;
  z-index: 100;
  box-shadow: 0px 2px 8px -4px rgba(30, 30, 30, 0.51); }
  @media (min-width: 769px) {
    header .header-wrap {
      position: relative;
      width: 100%;
      padding: 0rem 1rem;
      display: -webkit-box;
      /*--- Androidブラウザ用 ---*/
      display: -ms-flexbox;
      /*--- IE10 ---*/
      display: -webkit-flex;
      /*--- safari（PC）用 ---*/
      display: flex;
      -webkit-box-pack: justify;
      /*--- Androidブラウザ用 ---*/
      -ms-flex-pack: justify;
      /*--- IE10 ---*/
      -webkit-justify-content: space-between;
      /*--- safari（PC）用 ---*/
      justify-content: space-between;
      align-items: center;
      min-height: 77px;
      height: auto; } }

header #logo {
  width: 35%; }
  @media (min-width: 769px) {
    header #logo {
      width: 250px; } }
  @media (min-width: 769px) and (max-width: 1140px) {
    header #logo {
      width: 200px; } }

header #head-navi {
  display: none; }
  @media (min-width: 769px) {
    header #head-navi {
      display: block;
      width: 800px;
      margin: 0 0 0 auto; } }

header #head-navi ul {
  display: -webkit-box;
  /*--- Androidブラウザ用 ---*/
  display: -ms-flexbox;
  /*--- IE10 ---*/
  display: -webkit-flex;
  /*--- safari（PC）用 ---*/
  display: flex;
  -webkit-box-pack: justify;
  /*--- Androidブラウザ用 ---*/
  -ms-flex-pack: justify;
  /*--- IE10 ---*/
  -webkit-justify-content: space-between;
  /*--- safari（PC）用 ---*/
  justify-content: space-between; }

header #head-navi ul li a {
  display: inline-block;
  padding: 30px .5rem 0 .5rem;
  font-weight: bolder;
  box-sizing: border-box;
  height: 77px; }

@media (min-width: 769px) {
  .gnavi li {
    list-style: none;
    position: relative; }

  .gnavi li.small a {
    letter-spacing: 0;
    font-size: 0.85em !important; }

  .gnavi > li {
    /*親階層のみ幅を25%にする*/
    width: 20%;
    text-align: center; }

  .gnavi li a {
    display: block; }

  ul.gnavi li ul.child {
    position: absolute;
    z-index: 1;
    display: block !important;
    background-color: #f7e000;
    width: 100%;
    box-shadow: 0px 2px 8px -4px rgba(30, 30, 30, 0.51); }

  .gnavi li li a {
    width: 100%;
    font-size: 0.9rem !important;
    padding: 1rem 0.5rem !important;
    margin: 0 !important;
    background-color: #f7e000;
    height: auto !important; }

  .gnavi li li a:hover {
    background-color: #fff16a; }

  .gnavi > li:hover {
    background-color: #efefef;
    color: #444; }

  .gnavi li ul {
    position: absolute;
    top: -1000px; }

  .gnavi li:hover ul {
    top: 77px; } }
header #head-navi ul li.icon {
  width: auto; }

header #head-navi ul li.icon a {
  padding: 20px .5rem 0 .5rem;
  width: 88px;
  text-align: center;
  letter-spacing: 0; }

header #head-navi ul li.icon {
  font-size: 12px; }

header #head-navi ul li.contact a {
  background-color: #f7e000; }

header #head-navi ul li i {
  display: block;
  text-align: center;
  font-size: 1.2rem;
  margin: 0 0 .5rem 0; }

footer {
  padding: 0 0 0 0;
  border-top: 7px solid #f7e000; }

footer:before {
  display: block;
  content: '';
  background-color: #fff;
  height: 3px;
  margin: 0px 0 0 0; }

#footer-contact {
  background-color: #000000;
  color: #fff; }

#footer-contact .inner {
  position: relative; }

#footer-contact h3 {
  color: #000;
  display: inline-block;
  background-color: #fff;
  border: 3px solid #000;
  padding: 1rem;
  font-size: 1.1rem;
  font-weight: bolder;
  position: absolute;
  top: -2rem; }
  @media (min-width: 481px) and (max-width: 768px) {
    #footer-contact h3 {
      font-size: 1.3rem; } }
  @media (min-width: 769px) {
    #footer-contact h3 {
      font-size: 1.3rem; } }

#footer-contact h3 span {
  color: #999;
  font-size: 0.8rem;
  padding: 0 0 0 .5rem;
  font-weight: normal; }

#footer-contact .pcl-flex {
  padding: 3rem 0; }
  @media (min-width: 481px) and (max-width: 768px) {
    #footer-contact .pcl-flex {
      padding: 5rem 0;
      align-items: center; } }
  @media (min-width: 769px) {
    #footer-contact .pcl-flex {
      padding: 5rem 0;
      align-items: center; } }

#footer-contact .pcl-flex .txt {
  width: 100%;
  text-align: center; }
  @media (min-width: 481px) and (max-width: 768px) {
    #footer-contact .pcl-flex .txt {
      width: 40%;
      text-align: left; } }
  @media (min-width: 769px) {
    #footer-contact .pcl-flex .txt {
      width: 40%;
      text-align: left; } }

#footer-contact .pcl-flex .tel {
  padding: 1rem 0;
  font-size: 1.6rem;
  text-align: center;
  line-height: 1.3;
  font-weight: bolder; }
  @media (min-width: 481px) and (max-width: 768px) {
    #footer-contact .pcl-flex .tel {
      width: 30%;
      padding: 0; } }
  @media (min-width: 769px) {
    #footer-contact .pcl-flex .tel {
      width: 30%;
      padding: 0; } }

#footer-contact .pcl-flex .tel span {
  font-size: 0.95rem;
  display: block;
  font-weight: normal; }

#footer-contact .pcl-flex p.btn2 {
  padding: 2rem 0 1rem 0;
  text-align: center; }
  @media (min-width: 481px) and (max-width: 768px) {
    #footer-contact .pcl-flex p.btn2 {
      width: 30%;
      padding: 0; } }
  @media (min-width: 769px) {
    #footer-contact .pcl-flex p.btn2 {
      width: 30%;
      padding: 0; } }

#footer01 {
  padding: 2rem 0; }
  @media (min-width: 481px) and (max-width: 768px) {
    #footer01 {
      display: -webkit-box;
      /*--- Androidブラウザ用 ---*/
      display: -ms-flexbox;
      /*--- IE10 ---*/
      display: -webkit-flex;
      /*--- safari（PC）用 ---*/
      display: flex;
      -webkit-box-pack: justify;
      /*--- Androidブラウザ用 ---*/
      -ms-flex-pack: justify;
      /*--- IE10 ---*/
      -webkit-justify-content: space-between;
      /*--- safari（PC）用 ---*/
      justify-content: space-between;
      align-items: center; } }
  @media (min-width: 769px) {
    #footer01 {
      display: -webkit-box;
      /*--- Androidブラウザ用 ---*/
      display: -ms-flexbox;
      /*--- IE10 ---*/
      display: -webkit-flex;
      /*--- safari（PC）用 ---*/
      display: flex;
      -webkit-box-pack: justify;
      /*--- Androidブラウザ用 ---*/
      -ms-flex-pack: justify;
      /*--- IE10 ---*/
      -webkit-justify-content: space-between;
      /*--- safari（PC）用 ---*/
      justify-content: space-between;
      align-items: center; } }

#footer01 .right {
  font-size: 0.95rem;
  text-align: center; }
  @media (min-width: 481px) and (max-width: 768px) {
    #footer01 .right {
      width: 60%;
      display: -webkit-box;
      /*--- Androidブラウザ用 ---*/
      display: -ms-flexbox;
      /*--- IE10 ---*/
      display: -webkit-flex;
      /*--- safari（PC）用 ---*/
      display: flex;
      -webkit-box-pack: justify;
      /*--- Androidブラウザ用 ---*/
      -ms-flex-pack: justify;
      /*--- IE10 ---*/
      -webkit-justify-content: space-between;
      /*--- safari（PC）用 ---*/
      justify-content: space-between;
      align-items: center;
      text-align: left; } }
  @media (min-width: 769px) {
    #footer01 .right {
      width: 60%;
      display: -webkit-box;
      /*--- Androidブラウザ用 ---*/
      display: -ms-flexbox;
      /*--- IE10 ---*/
      display: -webkit-flex;
      /*--- safari（PC）用 ---*/
      display: flex;
      -webkit-box-pack: justify;
      /*--- Androidブラウザ用 ---*/
      -ms-flex-pack: justify;
      /*--- IE10 ---*/
      -webkit-justify-content: space-between;
      /*--- safari（PC）用 ---*/
      justify-content: space-between;
      align-items: center;
      text-align: left; } }

#footer01 .sns {
  text-align: center;
  padding: 1rem 0;
  border-top: 1px solid #ccc;
  margin: 1rem 0 0 0; }
  @media (min-width: 481px) and (max-width: 768px) {
    #footer01 .sns {
      width: 35%;
      text-align: right;
      padding: 0;
      margin: 0;
      border: none; } }
  @media (min-width: 769px) {
    #footer01 .sns {
      width: 35%;
      text-align: right;
      padding: 0;
      margin: 0;
      border: none; } }

footer .logo {
  width: 60%;
  margin: 0 auto .5rem auto; }
  @media (min-width: 481px) and (max-width: 768px) {
    footer .logo {
      width: 40%;
      margin: 0; } }
  @media (min-width: 769px) {
    footer .logo {
      width: 40%;
      margin: 0; } }

footer .logo img {
  max-width: 100%;
  height: auto; }

#footer02 {
  padding: 0rem 0 1rem 0;
  text-align: center; }
  @media (min-width: 481px) and (max-width: 768px) {
    #footer02 {
      display: -webkit-box;
      /*--- Androidブラウザ用 ---*/
      display: -ms-flexbox;
      /*--- IE10 ---*/
      display: -webkit-flex;
      /*--- safari（PC）用 ---*/
      display: flex;
      -webkit-box-pack: justify;
      /*--- Androidブラウザ用 ---*/
      -ms-flex-pack: justify;
      /*--- IE10 ---*/
      -webkit-justify-content: space-between;
      /*--- safari（PC）用 ---*/
      justify-content: space-between;
      align-items: center;
      padding: 1rem 0; } }
  @media (min-width: 769px) {
    #footer02 {
      display: -webkit-box;
      /*--- Androidブラウザ用 ---*/
      display: -ms-flexbox;
      /*--- IE10 ---*/
      display: -webkit-flex;
      /*--- safari（PC）用 ---*/
      display: flex;
      -webkit-box-pack: justify;
      /*--- Androidブラウザ用 ---*/
      -ms-flex-pack: justify;
      /*--- IE10 ---*/
      -webkit-justify-content: space-between;
      /*--- safari（PC）用 ---*/
      justify-content: space-between;
      align-items: center;
      padding: 1rem 0; } }

#footer02 ul li {
  font-size: 0.85rem;
  display: inline-block;
  border-left: 1px solid #ccc; }

#footer02 ul li:last-of-type {
  border-right: 1px solid #ccc; }

#footer02 ul li a {
  padding: 0 1rem; }

#footer02 small {
  display: block;
  padding: 1rem 0 0 0;
  color: #ccc;
  font-size: 0.8rem; }
  @media (min-width: 481px) and (max-width: 768px) {
    #footer02 small {
      padding: 0; } }
  @media (min-width: 769px) {
    #footer02 small {
      padding: 0; } }

.icon.insta {
  /*アイコンの背景*/
  position: relative;
  /*相対配置*/
  display: inline-block;
  text-align: center;
  width: 40px;
  /*幅*/
  height: 40px;
  /*高さ*/
  vertical-align: middle;
  /*垂直中央に*/
  background: -webkit-linear-gradient(135deg, #427eff 0%, #f13f79 70%) no-repeat;
  background: linear-gradient(135deg, #427eff 0%, #f13f79 70%) no-repeat;
  /*グラデーション①*/
  overflow: hidden;
  /*はみ出た部分を隠す*/
  border-radius: 8px;
  /*角丸に*/ }

.icon.insta:before {
  /*グラデーションを重ねるため*/
  content: '';
  position: absolute;
  /*絶対配置*/
  top: 19px;
  /*ずらす*/
  left: -18px;
  /*ずらす*/
  width: 50px;
  /*グラデーションカバーの幅*/
  height: 50px;
  /*グラデーションカバーの高さ*/
  background: -webkit-radial-gradient(#ffdb2c 10%, rgba(255, 105, 34, 0.65) 55%, rgba(255, 88, 96, 0) 70%);
  background: radial-gradient(#ffdb2c 10%, rgba(255, 105, 34, 0.65) 55%, rgba(255, 88, 96, 0) 70%);
  /*グラデーション②*/ }

.icon .fa-instagram {
  /*アイコン*/
  color: #FFF;
  /*白に*/
  position: relative;
  /*z-indexを使うため*/
  z-index: 2;
  /*グラデーションより前に*/
  font-size: 30px;
  /*アイコンサイズ*/
  top: 6px;
  /*上下にずらす*/
  left: 0.5px;
  /*左右にずらす*/ }

.icon.line {
  /*アイコンの背景*/
  position: relative;
  /*相対配置*/
  display: inline-block; }

.icon .fa-line {
  /*アイコン*/
  color: #3c963f;
  position: relative;
  /*z-indexを使うため*/
  z-index: 2;
  /*グラデーションより前に*/
  font-size: 1.1rem;
  /*アイコンサイズ*/
  top: 0px;
  /*上下にずらす*/
  left: 0.5px;
  /*左右にずらす*/ }

/* ------------------------------
   MEDIAQUERIES[SP]LAYOUT
------------------------------ */
#sp-nav {
  display: none; }

@media only screen and (max-width: 768px) {
  #rwdMenuWrap .logo {
    display: none; }

  #menuOverlay {
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background-color: rgba(255, 255, 255, 0);
    display: none;
    position: fixed;
    z-index: 100; }

  #switchBtnArea {
    width: 100%;
    background: #000;
    padding: 0;
    position: relative;
    z-index: 101;
    font-family: "Montserrat","ヒラギノ角ゴ ProN W3","Hiragino Kaku Gothic ProN","Meiryo","メイリオ","ＭＳ Ｐゴシック",sans-serif; }

  #switchBtnArea.hide {
    display: none;
    transform: translateZ(0); }

  #switchBtnArea #switchBtn {
    top: 0rem;
    right: 0rem;
    width: 50px;
    height: 50px;
    display: block;
    position: fixed;
    background-color: #f7e000; }

  #switchBtnArea #switchBtn.opn {
    animation: bubbleover 0.4s;
    animation-fill-mode: both; }

  #switchBtnArea #switchBtn.fxd {
    position: fixed;
    animation: bubbleover 0.4s;
    animation-fill-mode: both; }

  .pages #switchBtnArea #switchBtn {
    position: fixed;
    animation: bubbleover 0.4s;
    animation-fill-mode: both; }

  @keyframes bubbleover {
    0% {
      top: 0;
      transform: translateY(0); }
    50% {
      transform: translateY(-10px); }
    100% {
      transform: translateY(0px); } }
  #switchBtnArea #switchBtn span {
    right: 1rem;
    top: 10px;
    width: 22px;
    height: 2px;
    display: block;
    position: absolute;
    transition: all 0.2s linear; }

  #switchBtnArea #switchBtn span:nth-of-type(1) {
    background-color: #000;
    top: 15px;
    transform: rotate(0); }

  #switchBtnArea #switchBtn span:nth-of-type(2) {
    width: 16px;
    background-color: #000;
    top: 22px;
    transform: scale(1); }

  #switchBtnArea #switchBtn span:nth-of-type(3) {
    background-color: #000;
    top: 30px;
    transform: rotate(0); }

  #switchBtnArea #switchBtn.dflt span:nth-of-type(1) {
    background-color: #000;
    top: 8px;
    transform: rotate(0); }

  #switchBtnArea #switchBtn.dflt span:nth-of-type(2) {
    background-color: #000;
    top: 15px;
    transform: scale(1); }

  #switchBtnArea #switchBtn.dflt span:nth-of-type(3) {
    background-color: #000;
    top: 22px;
    transform: rotate(0); }

  #switchBtnArea #switchBtn.btnClose span:nth-of-type(1)
  #switchBtnArea #switchBtn.btnClose {
    background: transparent; }

  #switchBtnArea #switchBtn.btnClose span:nth-of-type(1) {
    background-color: #000;
    top: 22px;
    transform: rotate(-45deg); }

  #switchBtnArea #switchBtn.btnClose span:nth-of-type(2) {
    background-color: #000;
    transform: scale(0); }

  #switchBtnArea #switchBtn.btnClose span:nth-of-type(3) {
    background-color: #000;
    top: 22px;
    transform: rotate(45deg); }

  #rwdMenuWrap {
    top: -100vh;
    width: 100%;
    height: 100%;
    overflow: auto;
    position: fixed;
    z-index: 100;
    opacity: 0.9;
    font-family: "Noto Sans JP", "Hiragino Sans", Meiryo, "Yu Gothic Medium", sans-serif;
    box-sizing: border-box; }

  #rwdMenuWrap ul {
    width: 100%;
    display: -webkit-box;
    /*--- Androidブラウザ用 ---*/
    display: -ms-flexbox;
    /*--- IE10 ---*/
    display: -webkit-flex;
    /*--- safari（PC）用 ---*/
    display: flex;
    -webkit-box-pack: justify;
    /*--- Androidブラウザ用 ---*/
    -ms-flex-pack: justify;
    /*--- IE10 ---*/
    -webkit-justify-content: space-between;
    /*--- safari（PC）用 ---*/
    justify-content: space-between;
    -webkit-flex-wrap: wrap;
    /*--- safari（PC）用 ---*/
    flex-wrap: wrap;
    margin: 50px 0 0 0;
    padding: 0 0 3rem 0; }

  #rwdMenuWrap ul li {
    width: 100%;
    margin: 0 auto;
    text-align: center;
    display: -webkit-box;
    /*--- Androidブラウザ用 ---*/
    display: -ms-flexbox;
    /*--- IE10 ---*/
    display: -webkit-flex;
    /*--- safari（PC）用 ---*/
    display: flex;
    -webkit-box-pack: justify;
    /*--- Androidブラウザ用 ---*/
    -ms-flex-pack: justify;
    /*--- IE10 ---*/
    -webkit-justify-content: left;
    /*--- safari（PC）用 ---*/
    justify-content: left;
    border-bottom: 1px solid #000;
    background-color: #f7e000;
    font-size: 1.1rem; }

  #rwdMenuWrap ul li a {
    padding: .6rem 15px;
    text-align: center;
    display: block;
    color: #000; }

  #rwdMenuWrap ul.child {
    width: 50%;
    margin: 0;
    padding: 0;
    border: none; }

  #rwdMenuWrap ul.child li {
    font-size: 14px;
    border: none; }

  #rwdMenuWrap ul li > ul li:last-of-type {
    border: none; }

  #rwdMenuWrap ul li > ul li a:before {
    content: "ー";
    font-family: "Noto Sans JP", "Hiragino Sans", Meiryo, "Yu Gothic Medium", sans-serif;
    display: inline-block;
    padding: 0 10px 0 0;
    color: #000; }

  #rwdMenuWrap i {
    padding: 0 1rem 0 0; } }
/* ------------------------------
   CLEARFIX ELEMENTS
------------------------------ */
#mobile-header > ul:before,
#mobile-header > ul:after {
  content: " ";
  display: table; }

#mobile-header > ul:after {
  clear: both; }

#mobile-header > ul {
  *zoom: 1; }

#rwdMenuWrap ul li a {
  display: block;
  font-family: "Noto Sans JP", "Hiragino Sans", Meiryo, "Yu Gothic Medium", sans-serif; }

#rwdMenuWrap ul li.noline {
  border: none;
  padding: 5px 15px 5px 35px; }

#rwdMenuWrap ul li.last {
  border: none;
  padding: 5px 15px 15px 35px; }

body {
  font-family: "Noto Sans JP", "Hiragino Sans", Meiryo, "Yu Gothic Medium", sans-serif;
  line-height: 140%;
  letter-spacing: 0.8px;
  width: 100%;
  height: 100%;
  text-align: left;
  margin: 0;
  padding: 0px;
  font-size: 13px;
  background-color: #fff;
  color: #000; }
  @media (min-width: 481px) and (max-width: 768px) {
    body {
      font-size: 14px; } }
  @media (min-width: 769px) and (max-width: 1140px) {
    body {
      font-size: 15px; } }
  @media (min-width: 769px) {
    body {
      font-size: 16px; } }

form {
  margin: 0;
  padding: 0px; }

li {
  line-height: 140%; }

h1 {
  margin: 0;
  padding: 0px;
  font-weight: normal; }

strong {
  font-weight: bolder; }

img {
  border: none; }

a:link {
  color: #333; }

a:visited {
  color: #333; }

a:hover {
  color: #333; }

a:active {
  color: #333; }

a {
  line-height: 140%;
  text-decoration: none; }

p {
  margin: 0;
  padding: 0px; }

.float {
  animation: float 2s linear infinite;
  transform-origin: 50% 50%; }

@keyframes float {
  0% {
    transform: translateY(0); }
  50% {
    transform: translateY(-6px); }
  100% {
    transform: translateY(0); } }
.inner {
  width: 92%;
  margin: 0 auto;
  margin: 0 auto; }
  @media (min-width: 481px) and (max-width: 768px) {
    .inner {
      width: 92%; } }
  @media (min-width: 769px) and (max-width: 1140px) {
    .inner {
      width: 1000px; } }
  @media (min-width: 769px) {
    .inner {
      width: 1000px; } }

section img {
  max-width: 100%;
  height: auto; }

dl.is-empty {
  height: 0;
  width: 0; }

li.is-empty {
  height: 0;
  width: 0; }

a.linkc:link {
  color: #3e89ca;
  font-weight: bolder;
  text-decoration: underline; }

.ttl {
  color: #000;
  /*文字色*/
  padding: 1em;
  /*上下の余白*/
  border-top: solid 3px #f7e000;
  /*上線*/
  border-bottom: solid 3px #f7e000;
  /*下線*/
  background-color: #fff;
  font-size: 1.1rem;
  margin: 1rem 0;
  font-weight: bolder; }
  @media (min-width: 481px) and (max-width: 768px) {
    .ttl {
      font-size: 1.4rem; } }
  @media (min-width: 769px) {
    .ttl {
      font-size: 1.4rem; } }

.midashi2 {
  display: block;
  text-align: left;
  padding: 10px 15px;
  margin: 0 0 15px 0;
  font-size: 1.2em;
  font-weight: bolder;
  letter-spacing: 1px;
  background-color: #666; }
  @media (min-width: 769px) and (max-width: 1140px) {
    .midashi2 {
      padding: 20px 20px;
      margin: 15px 0 30px 0; } }
  @media (min-width: 769px) {
    .midashi2 {
      padding: 20px 20px;
      margin: 15px 0 30px 0; } }

#pagetitle {
  width: 100%;
  padding: 55px 0 40px 0;
  display: block;
  text-align: center;
  background: #999 url(../images/pt-bg.jpg) center center no-repeat;
  background-size: cover;
  margin: 0 auto 0px auto;
  font-size: 2.1em;
  font-family: "Noto Sans JP", "Hiragino Sans", Meiryo, "Yu Gothic Medium", sans-serif;
  font-weight: bolder;
  letter-spacing: 1px;
  color: #fff; }
  @media (min-width: 481px) and (max-width: 768px) {
    #pagetitle {
      padding: 150px 0 40px 0; } }
  @media (min-width: 769px) and (max-width: 1140px) {
    #pagetitle {
      padding: 80px 0 60px 0; } }
  @media (min-width: 769px) {
    #pagetitle {
      padding: 80px 0 60px 0; } }

#pagetitle small {
  display: block;
  color: #ccc;
  font-size: 0.8em;
  font-family: "Noto Sans JP", "Hiragino Sans", Meiryo, "Yu Gothic Medium", sans-serif; }

.blocklink {
  cursor: pointer; }

.blocklink:hover {
  opacity: 0.8; }

.txt p {
  font-weight: 500;
  padding: 10px 0 20px 0; }
  @media (min-width: 481px) and (max-width: 768px) {
    .txt p {
      padding: 10px 0 20px 0; } }
  @media (min-width: 769px) {
    .txt p {
      padding: 20px 0 40px 0; } }
  @media (min-width: 769px) and (max-width: 1140px) {
    .txt p {
      padding: 20px 0 40px 0; } }

.btn a {
  background-color: #fff;
  padding: .8rem 1.5rem;
  position: relative;
  color: #000;
  border: 3px solid #000;
  box-shadow: 6px 6px 0px -1px #000;
  font-weight: bolder;
  transition: all .3s; }

.btn.ar a {
  padding: .8rem 2.5rem .8rem 1.5rem; }

.btn.ar a:after {
  font-family: "Font Awesome 5 Free";
  content: '\f061';
  font-weight: 900;
  font-size: 1.2rem;
  position: absolute;
  right: 0.5rem; }

.btn.mark a {
  background: #fff url(../images/logo.png) 0 0 no-repeat;
  background-size: contain;
  padding: .8rem 2.5rem .8rem 3.5rem; }

.btn.mark a:hover {
  box-shadow: 4px 4px 0px -1px #000;
  color: #000;
  background-color: #ccc; }

.btn2 a {
  background-color: #f7e000;
  padding: .8rem 1.5rem;
  position: relative;
  color: #000;
  border: 3px solid #fff;
  box-shadow: 6px 6px 0px -1px #ffffff;
  font-weight: bolder;
  transition: all .3s; }

.btn2 a:hover {
  box-shadow: 4px 4px 0px -1px #ffffff;
  color: #333; }

.btn2.ar a {
  padding: .8rem 2.5rem .8rem 1.5rem; }

.btn2.ar a:after {
  font-family: "Font Awesome 5 Free";
  content: '\f061';
  font-weight: 900;
  font-size: 1.2rem;
  position: absolute;
  right: 0.5rem; }

.btn input {
  display: inline-block;
  color: #fff;
  background-color: #000;
  text-align: center;
  min-width: 150px;
  padding: 5px 20px;
  font-weight: bolder;
  border: none;
  transition: background-color 0.8s linear; }

.btn input:hover {
  background-color: #333; }

.btn100 a, .btn100 div {
  -webkit-box-sizing: border-box;
  -moz-box-sizing: border-box;
  -o-box-sizing: border-box;
  -ms-box-sizing: border-box;
  box-sizing: border-box;
  width: auto;
  margin: 0 auto;
  width: 100%;
  padding: 12px 20px;
  padding: 12px 20px; }
  @media (min-width: 481px) and (max-width: 768px) {
    .btn100 a, .btn100 div {
      width: 100%;
      padding: 12px 20px; } }
  @media (min-width: 769px) and (max-width: 1140px) {
    .btn100 a, .btn100 div {
      padding: 12px 40px; } }
  @media (min-width: 769px) {
    .btn100 a, .btn100 div {
      padding: 12px 40px; } }

section img {
  max-width: 100%;
  height: auto; }

#contents {
  padding: 50px 0 0 0; }
  @media (min-width: 769px) {
    #contents {
      padding: 0; } }

@media (min-width: 769px) {
  .pcl-flex {
    display: -webkit-box;
    /*--- Androidブラウザ用 ---*/
    display: -ms-flexbox;
    /*--- IE10 ---*/
    display: -webkit-flex;
    /*--- safari（PC）用 ---*/
    display: flex;
    -webkit-box-pack: justify;
    /*--- Androidブラウザ用 ---*/
    -ms-flex-pack: justify;
    /*--- IE10 ---*/
    -webkit-justify-content: space-between;
    /*--- safari（PC）用 ---*/
    justify-content: space-between; } }

#pt {
  background: url(../images/pt.jpg) 0 0 no-repeat;
  height: 130px;
  background-size: cover;
  text-align: center;
  position: relative; }
  @media (min-width: 481px) and (max-width: 768px) {
    #pt {
      height: 200px; } }
  @media (min-width: 769px) {
    #pt {
      height: 300px; } }

#pt div {
  position: absolute;
  top: 50%;
  left: 50%;
  -webkit-transform: translate(-50%, -50%);
  -ms-transform: translate(-50%, -50%);
  transform: translate(-50%, -50%);
  font-size: 1.25rem;
  font-weight: bolder;
  line-height: 1.6; }
  @media (min-width: 481px) and (max-width: 768px) {
    #pt div {
      font-size: 1.6rem; } }
  @media (min-width: 769px) {
    #pt div {
      font-size: 2rem; } }

#pt div span {
  display: block;
  font-size: 0.6rem; }
  @media (min-width: 481px) and (max-width: 768px) {
    #pt div span {
      font-size: 0.9rem; } }
  @media (min-width: 769px) {
    #pt div span {
      font-size: 0.9rem; } }

#mv {
  margin: 0 auto;
  box-sizing: border-box;
  background: url(../images/mv.jpg) 0 0 no-repeat;
  height: 280px;
  background-size: cover;
  position: relative; }
  @media (min-width: 481px) and (max-width: 768px) {
    #mv {
      height: 600px; } }
  @media (min-width: 769px) {
    #mv {
      height: 600px; } }

#mv h1 {
  position: absolute;
  top: 50%;
  left: 50%;
  -webkit-transform: translate(-50%, -50%);
  -ms-transform: translate(-50%, -50%);
  transform: translate(-50%, -50%);
  font-size: 1.2rem;
  color: #fff;
  text-align: center;
  line-height: 1.4;
  width: 100%;
  text-shadow: 0px 1px 4px #000000; }
  @media (min-width: 481px) and (max-width: 768px) {
    #mv h1 {
      font-size: 2rem;
      width: auto; } }
  @media (min-width: 769px) {
    #mv h1 {
      font-size: 1.8rem;
      width: auto; } }

#mv .imgsize {
  position: relative;
  width: 100%;
  overflow: hidden; }

.imgsize::before {
  content: " ";
  display: block;
  padding-top: 60%; }
  @media (min-width: 769px) {
    .imgsize::before {
      padding-top: 40%; } }

.imgsize > img {
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
  -webkit-transform: translate(-50%, -50%);
  -ms-transform: translate(-50%, -50%);
  width: 100%;
  height: auto; }

#reason {
  padding: 2rem 0 5rem 0;
  text-align: center; }
  @media (min-width: 481px) and (max-width: 768px) {
    #reason {
      padding: 3rem 0 5rem 0; } }
  @media (min-width: 769px) {
    #reason {
      padding: 3rem 0 5rem 0; } }

#reason h2 {
  font-size: 1.2rem;
  font-weight: bolder;
  text-align: center;
  padding: 2rem 0 1rem 0;
  border-bottom: 5px solid #f7e000;
  display: inline-block;
  margin: 0 auto 3rem auto; }
  @media (min-width: 481px) and (max-width: 768px) {
    #reason h2 {
      font-size: 1.4rem;
      padding: 3rem 0 2rem 0; } }
  @media (min-width: 769px) {
    #reason h2 {
      font-size: 1.4rem;
      padding: 3rem 0 2rem 0; } }

#reason #mainimage {
  text-align: center;
  padding: 0rem 0 2rem 0; }

#reason #mainimage {
  text-align: center;
  padding: 1rem 0; }
  @media (min-width: 481px) and (max-width: 768px) {
    #reason #mainimage {
      padding: 2rem 0; } }
  @media (min-width: 769px) {
    #reason #mainimage {
      padding: 2rem 0; } }

#reason .bigtxt {
  font-size: 0.95rem;
  font-weight: bolder;
  line-height: 1.3;
  padding: 1rem 0;
  text-align: left; }
  @media (min-width: 481px) and (max-width: 768px) {
    #reason .bigtxt {
      font-size: 1.2rem;
      padding: 1rem 0;
      text-align: center; } }
  @media (min-width: 769px) {
    #reason .bigtxt {
      font-size: 1.2rem;
      padding: 1rem 0;
      text-align: center; } }

#reason .reason-box {
  padding: 2rem 0 5rem 0;
  display: -webkit-box;
  /*--- Androidブラウザ用 ---*/
  display: -ms-flexbox;
  /*--- IE10 ---*/
  display: -webkit-flex;
  /*--- safari（PC）用 ---*/
  display: flex;
  -webkit-box-pack: justify;
  /*--- Androidブラウザ用 ---*/
  -ms-flex-pack: justify;
  /*--- IE10 ---*/
  -webkit-justify-content: space-between;
  /*--- safari（PC）用 ---*/
  justify-content: space-between;
  -webkit-flex-wrap: wrap;
  /*--- safari（PC）用 ---*/
  flex-wrap: wrap; }

#reason .reason-box dl {
  padding: 1rem 0;
  display: -webkit-box;
  /*--- Androidブラウザ用 ---*/
  display: -ms-flexbox;
  /*--- IE10 ---*/
  display: -webkit-flex;
  /*--- safari（PC）用 ---*/
  display: flex;
  -webkit-box-pack: justify;
  /*--- Androidブラウザ用 ---*/
  -ms-flex-pack: justify;
  /*--- IE10 ---*/
  -webkit-justify-content: left;
  /*--- safari（PC）用 ---*/
  justify-content: left;
  width: 100%;
  align-items: center; }
  @media (min-width: 481px) and (max-width: 768px) {
    #reason .reason-box dl {
      width: 48%; } }
  @media (min-width: 769px) {
    #reason .reason-box dl {
      width: 48%; } }

#reason .reason-box dt {
  text-align: center;
  font-size: 1.6rem;
  font-weight: bolder;
  background-color: #f7e000;
  border-radius: 50%;
  min-width: 100px;
  height: 100px;
  line-height: 100px;
  font-size: 1.3rem; }
  @media (min-width: 481px) and (max-width: 768px) {
    #reason .reason-box dt {
      min-width: 150px;
      height: 150px;
      line-height: 150px;
      font-size: 1.6rem; } }
  @media (min-width: 769px) {
    #reason .reason-box dt {
      min-width: 150px;
      height: 150px;
      line-height: 150px;
      font-size: 1.6rem; } }

#reason .reason-box dd {
  text-align: left;
  padding: 0 1rem; }

#reason .photo {
  width: 100%;
  text-align: left; }
  @media (min-width: 481px) and (max-width: 768px) {
    #reason .photo {
      width: 30%; } }
  @media (min-width: 769px) {
    #reason .photo {
      width: 30%; } }

#reason .txt {
  width: 100%;
  text-align: left;
  padding: 1rem 0 0 0; }
  @media (min-width: 481px) and (max-width: 768px) {
    #reason .txt {
      padding: 0;
      width: 65%; } }
  @media (min-width: 769px) {
    #reason .txt {
      padding: 0;
      width: 65%; } }

#reason .txt p {
  padding: 0 0 1rem 0; }

#reason .txt h3 {
  font-size: 1.3rem;
  line-height: 1.6;
  margin: 0 0 1.5rem 0;
  font-weight: bolder; }

#reason .btn {
  padding: 3rem 0; }

#top-company {
  background-color: #f3f3f3; }

#top-company .inner {
  position: relative; }

#top-company h3 {
  color: #000;
  display: inline-block;
  background-color: #fff;
  border: 3px solid #000;
  padding: 1rem;
  font-size: 1.05rem;
  font-weight: bolder;
  position: absolute;
  top: -2rem; }

#top-company h3 small {
  font-size: 0.8rem;
  color: #999;
  padding: 0 0 0 2rem; }

#top-company ul {
  padding: 5rem 0 3rem 0; }

#top-company ul li {
  width: 100%;
  box-shadow: 0px 2px 8px -4px rgba(30, 30, 30, 0.51);
  display: -webkit-box;
  /*--- Androidブラウザ用 ---*/
  display: -ms-flexbox;
  /*--- IE10 ---*/
  display: -webkit-flex;
  /*--- safari（PC）用 ---*/
  display: flex;
  -webkit-box-pack: justify;
  /*--- Androidブラウザ用 ---*/
  -ms-flex-pack: justify;
  /*--- IE10 ---*/
  -webkit-justify-content: space-between;
  /*--- safari（PC）用 ---*/
  justify-content: space-between;
  margin: 0 0 1rem 0; }
  @media (min-width: 481px) and (max-width: 768px) {
    #top-company ul li {
      width: 30%;
      display: block;
      margin: 0; } }
  @media (min-width: 769px) {
    #top-company ul li {
      width: 30%;
      display: block;
      margin: 0; } }

#top-company ul li a {
  vertical-align: middle;
  width: 40%; }
  @media (min-width: 481px) and (max-width: 768px) {
    #top-company ul li a {
      width: 100%; } }
  @media (min-width: 769px) {
    #top-company ul li a {
      width: 100%; } }

#top-company .ar {
  width: 60%;
  line-height: 45px; }
  @media (min-width: 481px) and (max-width: 768px) {
    #top-company .ar {
      width: 100%;
      line-height: 1.5; } }
  @media (min-width: 769px) {
    #top-company .ar {
      width: 100%;
      line-height: 1.5; } }

#top-company ul li img {
  vertical-align: middle; }

#top-company ul li .ar {
  background-color: #000;
  color: #fff;
  text-align: center;
  padding: 1rem .5rem;
  position: relative; }

#top-company ul li .ar:after {
  font-family: "Font Awesome 5 Free";
  content: '\f061';
  font-weight: 900;
  font-size: 1.2rem;
  position: absolute;
  right: 0.5rem; }

#top-works {
  background: #000 url() 0 0 no-repeat;
  padding: 4rem 0;
  text-align: center;
  color: #fff; }

#top-works h3 {
  font-size: 1.3rem;
  font-weight: bolder; }

#top-works h3 span {
  display: block;
  font-size: 0.8rem;
  color: #666;
  padding: 1rem 0; }

#top-works ul {
  padding: 2rem 0; }

#top-works .bx-wrapper {
  background-color: #000;
  border: none;
  box-shadow: none; }

#top-bn {
  padding: 5rem 0; }

#top-bn .flex {
  display: -webkit-box;
  /*--- Androidブラウザ用 ---*/
  display: -ms-flexbox;
  /*--- IE10 ---*/
  display: -webkit-flex;
  /*--- safari（PC）用 ---*/
  display: flex;
  -webkit-box-pack: justify;
  /*--- Androidブラウザ用 ---*/
  -ms-flex-pack: justify;
  /*--- IE10 ---*/
  -webkit-justify-content: space-between;
  /*--- safari（PC）用 ---*/
  justify-content: space-between; }

#top-bn .flex li {
  width: 48%;
  transition: .5s; }

#top-bn .flex li:hover {
  opacity: 0.8; }

.bx-viewport {
  height: auto !important; }

#youkou {
  padding: 2rem 0; }
  @media (min-width: 481px) and (max-width: 768px) {
    #youkou {
      padding: 5rem 0; } }
  @media (min-width: 769px) {
    #youkou {
      padding: 5rem 0; } }

#youkou h2 {
  font-size: 1rem;
  font-weight: bolder;
  text-align: center;
  padding: 3rem 0; }
  @media (min-width: 481px) and (max-width: 768px) {
    #youkou h2 {
      font-size: 1.4rem; } }
  @media (min-width: 769px) {
    #youkou h2 {
      font-size: 1.4rem; } }

#youkou dl {
  display: block;
  border-bottom: 1px dotted #ccc; }
  @media (min-width: 481px) and (max-width: 768px) {
    #youkou dl {
      display: -webkit-box;
      /*--- Androidブラウザ用 ---*/
      display: -ms-flexbox;
      /*--- IE10 ---*/
      display: -webkit-flex;
      /*--- safari（PC）用 ---*/
      display: flex;
      -webkit-box-pack: justify;
      /*--- Androidブラウザ用 ---*/
      -ms-flex-pack: justify;
      /*--- IE10 ---*/
      -webkit-justify-content: space-between;
      /*--- safari（PC）用 ---*/
      justify-content: space-between; } }
  @media (min-width: 769px) {
    #youkou dl {
      display: -webkit-box;
      /*--- Androidブラウザ用 ---*/
      display: -ms-flexbox;
      /*--- IE10 ---*/
      display: -webkit-flex;
      /*--- safari（PC）用 ---*/
      display: flex;
      -webkit-box-pack: justify;
      /*--- Androidブラウザ用 ---*/
      -ms-flex-pack: justify;
      /*--- IE10 ---*/
      -webkit-justify-content: space-between;
      /*--- safari（PC）用 ---*/
      justify-content: space-between; } }

#youkou dl:first-of-type {
  border-top: 1px dotted #ccc; }

#youkou dl dt {
  width: 100%;
  padding: .5rem;
  background-color: #efefef;
  text-align: left;
  font-weight: bolder;
  box-sizing: border-box; }
  @media (min-width: 481px) and (max-width: 768px) {
    #youkou dl dt {
      width: 15%;
      padding: 1rem 0;
      text-align: center;
      font-weight: normal; } }
  @media (min-width: 769px) {
    #youkou dl dt {
      width: 15%;
      padding: 1rem 0;
      text-align: center;
      font-weight: normal; } }

#youkou dl dd {
  width: 100%;
  padding: 1rem 0;
  color: #333; }
  @media (min-width: 481px) and (max-width: 768px) {
    #youkou dl dd {
      width: 83%; } }
  @media (min-width: 769px) {
    #youkou dl dd {
      width: 83%; } }

#youkou dl strong {
  display: block;
  padding: 0 0 .5rem 0; }

#youkou .toha {
  padding: 1rem;
  line-height: 1.5;
  align-items: center;
  background-color: #f5f5f5;
  margin: 1rem auto;
  border-radius: 8px; }

#youkou .toha strong {
  width: 100%; }
  @media (min-width: 481px) and (max-width: 768px) {
    #youkou .toha strong {
      width: 20%; } }
  @media (min-width: 769px) {
    #youkou .toha strong {
      width: 20%; } }

#youkou .toha .txt {
  width: 100%; }
  @media (min-width: 481px) and (max-width: 768px) {
    #youkou .toha .txt {
      width: 75%; } }
  @media (min-width: 769px) {
    #youkou .toha .txt {
      width: 75%; } }

#oneday {
  padding: 3rem 0 5rem 0;
  background-color: #f3f3f3; }

#oneday dl {
  background-color: #fff;
  display: -webkit-box;
  /*--- Androidブラウザ用 ---*/
  display: -ms-flexbox;
  /*--- IE10 ---*/
  display: -webkit-flex;
  /*--- safari（PC）用 ---*/
  display: flex;
  -webkit-box-pack: justify;
  /*--- Androidブラウザ用 ---*/
  -ms-flex-pack: justify;
  /*--- IE10 ---*/
  -webkit-justify-content: space-between;
  /*--- safari（PC）用 ---*/
  justify-content: space-between;
  margin: 2.5rem 0;
  position: relative;
  box-shadow: 0px 2px 8px -4px rgba(30, 30, 30, 0.51);
  align-items: center; }
  @media (min-width: 481px) and (max-width: 768px) {
    #oneday dl {
      align-items: start; } }
  @media (min-width: 769px) {
    #oneday dl {
      align-items: start; } }

#oneday dl:after {
  font-family: "Font Awesome 5 Free";
  content: '\f078';
  font-weight: 900;
  font-size: 1.2rem;
  padding: 0 .5rem 0 0;
  position: absolute;
  bottom: -2rem;
  z-index: 1;
  display: block;
  text-align: center;
  width: 100%;
  font-size: 2rem;
  color: #ccc; }

#oneday dl:last-of-type:after {
  content: ''; }

#oneday dt {
  width: 40%;
  padding: .5rem; }
  @media (min-width: 481px) and (max-width: 768px) {
    #oneday dt {
      width: 30%; } }
  @media (min-width: 769px) {
    #oneday dt {
      width: 30%; } }

#oneday dt img {
  vertical-align: middle; }

#oneday dd {
  width: 60%;
  font-size: .9rem;
  padding: .5rem .5rem 1rem .5rem; }
  @media (min-width: 481px) and (max-width: 768px) {
    #oneday dd {
      width: 65%;
      font-size: 1.1rem;
      padding: 1.5rem .5rem; } }
  @media (min-width: 769px) {
    #oneday dd {
      width: 65%;
      font-size: 1.1rem;
      padding: 1.5rem .5rem; } }

#oneday dd .time {
  background-color: #f7e000;
  display: inline-block;
  padding: .5rem;
  margin: 0 0 1rem 0;
  font-size: .8rem; }
  @media (min-width: 481px) and (max-width: 768px) {
    #oneday dd .time {
      font-size: 1rem; } }
  @media (min-width: 769px) {
    #oneday dd .time {
      font-size: 1rem; } }

#oneday dd .time:before {
  font-family: "Font Awesome 5 Free";
  content: '\f017';
  font-weight: 900;
  font-size: .9rem;
  padding: 0 .5rem 0 0; }
  @media (min-width: 481px) and (max-width: 768px) {
    #oneday dd .time:before {
      font-size: 1.2rem; } }
  @media (min-width: 769px) {
    #oneday dd .time:before {
      font-size: 1.2rem; } }

#service {
  background-color: #f3f3f3;
  padding: 2rem 0 6rem 0;
  text-align: center;
  margin: 0 0 4rem 0; }

#service .pcl-flex {
  align-items: center; }

#service .txt {
  text-align: left;
  width: 100%;
  line-height: 2;
  font-size: 1rem; }
  @media (min-width: 481px) and (max-width: 768px) {
    #service .txt {
      width: 60%;
      font-size: 1.2rem; } }
  @media (min-width: 769px) {
    #service .txt {
      width: 60%;
      font-size: 1.2rem; } }

#service .photo {
  width: 100%; }
  @media (min-width: 481px) and (max-width: 768px) {
    #service .photo {
      width: 35%; } }
  @media (min-width: 769px) {
    #service .photo {
      width: 35%; } }

.service-box {
  line-height: 1.5;
  border: 3px solid e8e198;
  padding: 1rem;
  background: #e4e4e4;
  margin: 2rem 0 0 0;
  font-size: 0.95rem; }

#service h2 {
  font-size: 1.2rem;
  font-weight: bolder;
  text-align: center;
  display: inline-block;
  padding: 3rem 0px 1rem;
  border-bottom: 5px solid #f7e000;
  margin: 0px auto 3rem; }
  @media (min-width: 481px) and (max-width: 768px) {
    #service h2 {
      font-size: 1.4rem;
      padding: 3rem 0px 2rem; } }
  @media (min-width: 769px) {
    #service h2 {
      font-size: 1.4rem;
      padding: 3rem 0px 2rem; } }

#flow {
  padding: 0 0 3rem 0; }

#flow h3 {
  background-color: #000;
  color: #fff;
  font-size: 1.1rem;
  padding: .5rem .5rem;
  text-align: center;
  margin: 0 0 3rem 0;
  box-shadow: 0px 2px 8px -4px rgba(30, 30, 30, 0.51); }
  @media (min-width: 481px) and (max-width: 768px) {
    #flow h3 {
      font-size: 1.3rem;
      padding: 1.5rem .5rem; } }
  @media (min-width: 769px) {
    #flow h3 {
      font-size: 1.3rem;
      padding: 1.5rem .5rem; } }

#flow dl {
  display: -webkit-box;
  /*--- Androidブラウザ用 ---*/
  display: -ms-flexbox;
  /*--- IE10 ---*/
  display: -webkit-flex;
  /*--- safari（PC）用 ---*/
  display: flex;
  -webkit-box-pack: justify;
  /*--- Androidブラウザ用 ---*/
  -ms-flex-pack: justify;
  /*--- IE10 ---*/
  -webkit-justify-content: space-between;
  /*--- safari（PC）用 ---*/
  justify-content: space-between;
  flex-direction: reverse;
  padding: 0 0 5rem 0; }

#flow dl:after {
  font-family: "Font Awesome 5 Free";
  content: '\f078';
  font-weight: 900;
  font-size: 1.2rem;
  padding: 0 .5rem 0 0;
  position: absolute;
  bottom: 1rem;
  z-index: 1;
  display: block;
  text-align: center;
  width: 100%;
  font-size: 2rem;
  color: #ccc; }

#flow dl:last-of-type:after {
  content: ''; }

#flow dt {
  width: 28%; }

#flow dd {
  width: 70%;
  position: relative;
  background-color: #f7e000;
  box-sizing: border-box;
  padding: 1rem;
  border-radius: 10px;
  color: #333; }
  @media (min-width: 481px) and (max-width: 768px) {
    #flow dd {
      width: 65%;
      padding: 2rem; } }
  @media (min-width: 769px) {
    #flow dd {
      width: 65%;
      padding: 2rem; } }

#flow dd h4 {
  font-weight: bolder;
  font-size: 1.1rem;
  padding: 0 0 1rem 0;
  color: #000;
  z-index: 1;
  position: relative; }

#flow dd p {
  padding: 0 0 1rem 0; }

#flow dd strong {
  background-color: #0000002b;
  color: #000;
  padding: .5rem;
  line-height: 1.5;
  display: inline-block; }

#flow dd:after {
  content: "";
  display: inline-block;
  position: absolute;
  top: 5px;
  left: -19px;
  border: 10px solid transparent;
  border-right: 18px solid #f7e000;
  -webkit-transform: rotate(10deg);
  transform: rotate(10deg); }

#flow dl dd:before {
  font-size: 3.6rem;
  font-weight: bolder;
  font-family: "Noto Sans JP", "Hiragino Sans", Meiryo, "Yu Gothic Medium", sans-serif;
  display: inline-block;
  position: absolute;
  top: 5px;
  right: 5px;
  color: #ffca0099; }

#flow dl:nth-of-type(1) dd:before {
  content: "01"; }

#flow dl:nth-of-type(2) dd:before {
  content: "02"; }

#flow dl:nth-of-type(3) dd:before {
  content: "03"; }

#flow dl:nth-of-type(4) dd:before {
  content: "04"; }

#flow dl:nth-of-type(5) dd:before {
  content: "05"; }

#flow dl:nth-of-type(6) dd:before {
  content: "06"; }

#area {
  padding: 0 0 4rem 0; }

#area .read {
  text-align: left;
  padding: 3rem 0 3rem 0; }
  @media (min-width: 481px) and (max-width: 768px) {
    #area .read {
      text-align: center; } }
  @media (min-width: 769px) {
    #area .read {
      text-align: center; } }

#area .img {
  text-align: center;
  padding: 2rem 0 2rem 0;
  width: 100%;
  margin: 0 auto; }
  @media (min-width: 481px) and (max-width: 768px) {
    #area .img {
      width: 80%;
      padding: 3rem 0 3rem 0; } }
  @media (min-width: 769px) {
    #area .img {
      width: 80%;
      padding: 3rem 0 3rem 0; } }

#area h3 {
  background-color: #f7e000;
  padding: 1rem;
  font-size: 1.2rem;
  box-shadow: 0px 2px 8px -4px rgba(30, 30, 30, 0.51);
  margin: 0 0 3rem 0; }

#area #area-box {
  display: -webkit-box;
  /*--- Androidブラウザ用 ---*/
  display: -ms-flexbox;
  /*--- IE10 ---*/
  display: -webkit-flex;
  /*--- safari（PC）用 ---*/
  display: flex;
  -webkit-box-pack: justify;
  /*--- Androidブラウザ用 ---*/
  -ms-flex-pack: justify;
  /*--- IE10 ---*/
  -webkit-justify-content: space-between;
  /*--- safari（PC）用 ---*/
  justify-content: space-between;
  -webkit-flex-wrap: wrap;
  /*--- safari（PC）用 ---*/
  flex-wrap: wrap; }

#area #area-box div {
  width: 48%;
  padding: 2rem 0; }
  @media (min-width: 481px) and (max-width: 768px) {
    #area #area-box div {
      width: 30%; } }
  @media (min-width: 769px) {
    #area #area-box div {
      width: 30%; } }

#area #area-box div h4 {
  font-weight: bolder;
  font-size: 1rem;
  margin: 0 0 .5rem 0;
  background-color: #eee;
  padding: .5rem; }
  @media (min-width: 481px) and (max-width: 768px) {
    #area #area-box div h4 {
      font-size: 1.1rem;
      margin: 0 0 1rem 0; } }
  @media (min-width: 769px) {
    #area #area-box div h4 {
      font-size: 1.1rem;
      margin: 0 0 1rem 0; } }

#area #area-box div ul {
  padding: .5rem; }

#works {
  background-color: #f3f3f3;
  padding: 0 0 3rem 0; }

#works .inner {
  padding: 2rem 0 0 0; }

.works-box {
  margin: 0 0 4rem 0; }

.works-box h2 {
  color: #fff;
  padding: 1em;
  border-top: solid 4px #f7e000;
  border-bottom: solid 4px #f7e000;
  background-color: #000;
  font-size: 1.4rem;
  margin: 1rem 0;
  font-weight: bolder; }

.works-box h3 {
  border-left: 4px solid #000;
  font-weight: bolder;
  padding: .2rem 0 .2rem 1rem;
  margin: 2rem 0 2rem 0; }

.works-box h2 span {
  font-size: 1rem; }

.works-box ul {
  display: -webkit-box;
  /*--- Androidブラウザ用 ---*/
  display: -ms-flexbox;
  /*--- IE10 ---*/
  display: -webkit-flex;
  /*--- safari（PC）用 ---*/
  display: flex;
  -webkit-box-pack: justify;
  /*--- Androidブラウザ用 ---*/
  -ms-flex-pack: justify;
  /*--- IE10 ---*/
  -webkit-justify-content: space-between;
  /*--- safari（PC）用 ---*/
  justify-content: space-between;
  -webkit-flex-wrap: wrap;
  /*--- safari（PC）用 ---*/
  flex-wrap: wrap; }

.works-box ul li {
  background-color: #fff;
  box-shadow: 0px 2px 8px -4px rgba(30, 30, 30, 0.51);
  padding: .5rem;
  width: 48%;
  box-sizing: border-box;
  margin: 0 0 2rem 0; }
  @media (min-width: 481px) and (max-width: 768px) {
    .works-box ul li {
      padding: 1rem;
      width: 30%; } }
  @media (min-width: 769px) {
    .works-box ul li {
      padding: 1rem;
      width: 30%; } }

.works-box ul li.is-empty {
  padding: 0;
  margin: 0;
  box-shadow: none; }

.works-box ul li.hide {
  display: none; }

#greeting {
  padding: 5rem 0; }

@media (min-width: 481px) and (max-width: 768px) {
  #greeting .inner {
    flex-direction: row-reverse; } }
@media (min-width: 769px) {
  #greeting .inner {
    flex-direction: row-reverse; } }

#greeting .photo {
  width: 100%; }
  @media (min-width: 481px) and (max-width: 768px) {
    #greeting .photo {
      width: 30%; } }
  @media (min-width: 769px) {
    #greeting .photo {
      width: 30%; } }

#greeting .prof {
  font-size: 0.95rem;
  border-top: 3px solid #ccc;
  border-bottom: 3px solid #ccc;
  padding: 1rem 0;
  margin: 1rem 0 0 0; }

#greeting .prof strong {
  display: block;
  padding: .5rem 0 .5rem 0; }

#greeting .txt {
  width: 100%;
  padding: 2rem 0;
  font-size: .9rem;
  position: relative; }
  @media (min-width: 481px) and (max-width: 768px) {
    #greeting .txt {
      width: 60%;
      padding: 0; } }
  @media (min-width: 769px) {
    #greeting .txt {
      width: 60%;
      padding: 0; } }

#greeting .txt:before {
  content: 'MESSAGE';
  font-size: 3.6rem;
  font-weight: bolder;
  font-family: "Noto Sans JP", "Hiragino Sans", Meiryo, "Yu Gothic Medium", sans-serif;
  display: inline-block;
  position: absolute;
  top: 5px;
  right: 5px;
  color: #ffe70026; }

#greeting .txt p {
  padding: 0 0 1rem 0; }

#policy {
  background-color: #f7e000;
  text-align: left;
  padding: 4rem 0; }
  @media (min-width: 481px) and (max-width: 768px) {
    #policy {
      text-align: center;
      padding: 6rem 0; } }
  @media (min-width: 769px) {
    #policy {
      text-align: center;
      padding: 6rem 0; } }

#policy h2 {
  font-size: 1.2rem;
  font-weight: bolder;
  padding: 0 0 2rem 0;
  line-height: 1.5; }
  @media (min-width: 481px) and (max-width: 768px) {
    #policy h2 {
      font-size: 1.5rem; } }
  @media (min-width: 769px) {
    #policy h2 {
      font-size: 1.5rem; } }

#company {
  background-color: #f3f3f3;
  padding: 2rem 0 5rem 0;
  text-align: center; }

#company .inner {
  box-shadow: 0px 2px 8px -4px rgba(30, 30, 30, 0.51);
  text-align: left; }

#company h3 {
  font-size: 1.2rem;
  font-weight: bolder;
  text-align: center;
  padding: 3rem 0 1rem 0;
  border-bottom: 5px solid #f7e000;
  display: inline-block;
  margin: 0 auto 3rem auto; }
  @media (min-width: 481px) and (max-width: 768px) {
    #company h3 {
      font-size: 1.4rem;
      padding: 3rem 0 2rem 0; } }
  @media (min-width: 769px) {
    #company h3 {
      font-size: 1.4rem;
      padding: 3rem 0 2rem 0; } }

#company dl {
  display: -webkit-box;
  /*--- Androidブラウザ用 ---*/
  display: -ms-flexbox;
  /*--- IE10 ---*/
  display: -webkit-flex;
  /*--- safari（PC）用 ---*/
  display: flex;
  -webkit-box-pack: justify;
  /*--- Androidブラウザ用 ---*/
  -ms-flex-pack: justify;
  /*--- IE10 ---*/
  -webkit-justify-content: space-between;
  /*--- safari（PC）用 ---*/
  justify-content: space-between;
  border-bottom: 1px solid #ccc;
  background-color: #fff; }

#company dl dt {
  width: 25%;
  background-color: #eee;
  padding: 1rem 0;
  text-align: center; }
  @media (min-width: 481px) and (max-width: 768px) {
    #company dl dt {
      width: 20%; } }
  @media (min-width: 481px) and (max-width: 768px) {
    #company dl dt {
      width: 20%; } }

#company dl dd {
  width: 75%;
  padding: 1rem;
  box-sizing: border-box; }
  @media (min-width: 481px) and (max-width: 768px) {
    #company dl dd {
      width: 80%; } }
  @media (min-width: 481px) and (max-width: 768px) {
    #company dl dd {
      width: 80%; } }

#accessmap {
  padding: 5rem 0 8rem 0;
  text-align: center; }

#accessmap h3 {
  font-size: 1.2rem;
  font-weight: bolder;
  text-align: center;
  padding: 3rem 0 1rem 0;
  border-bottom: 5px solid #f7e000;
  display: inline-block;
  margin: 0 auto 3rem auto; }
  @media (min-width: 481px) and (max-width: 768px) {
    #accessmap h3 {
      font-size: 1.4rem;
      padding: 3rem 0 2rem 0; } }
  @media (min-width: 769px) {
    #accessmap h3 {
      font-size: 1.4rem;
      padding: 3rem 0 2rem 0; } }

#accessmap #gmap {
  height: 400px;
  margin: 0rem auto 3rem auto;
  border: 10px solid #eee; }
  @media (min-width: 481px) and (max-width: 768px) {
    #accessmap #gmap {
      height: 500px; } }
  @media (min-width: 769px) {
    #accessmap #gmap {
      height: 500px; } }

#accessmap #gmap iframe {
  width: 100%;
  max-width: 100%;
  height: 400px; }
  @media (min-width: 481px) and (max-width: 768px) {
    #accessmap #gmap iframe {
      height: 500px; } }
  @media (min-width: 769px) {
    #accessmap #gmap iframe {
      height: 500px; } }

#accessmap .btn {
  text-align: center; }

#contact {
  padding: 0 0 6rem 0; }

#contact .read {
  padding: 50px 0 30px 0;
  width: 80%;
  margin: 0 auto; }

#contact #form {
  width: 100%;
  margin: 0 auto;
  border-top: 3px solid #ddd;
  padding: 0 0 3% 0; }
  @media (min-width: 481px) and (max-width: 768px) {
    #contact #form {
      width: 80%; } }
  @media (min-width: 769px) {
    #contact #form {
      width: 80%; } }

#contact #form dl {
  display: block;
  border-bottom: 1px dotted #999; }
  @media (min-width: 481px) and (max-width: 768px) {
    #contact #form dl {
      display: -webkit-box;
      /*--- Androidブラウザ用 ---*/
      display: -ms-flexbox;
      /*--- IE10 ---*/
      display: -webkit-flex;
      /*--- safari（PC）用 ---*/
      display: flex;
      -webkit-box-pack: justify;
      /*--- Androidブラウザ用 ---*/
      -ms-flex-pack: justify;
      /*--- IE10 ---*/
      -webkit-justify-content: space-between;
      /*--- safari（PC）用 ---*/
      justify-content: space-between; } }
  @media (min-width: 769px) {
    #contact #form dl {
      display: -webkit-box;
      /*--- Androidブラウザ用 ---*/
      display: -ms-flexbox;
      /*--- IE10 ---*/
      display: -webkit-flex;
      /*--- safari（PC）用 ---*/
      display: flex;
      -webkit-box-pack: justify;
      /*--- Androidブラウザ用 ---*/
      -ms-flex-pack: justify;
      /*--- IE10 ---*/
      -webkit-justify-content: space-between;
      /*--- safari（PC）用 ---*/
      justify-content: space-between; } }

#contact #form dl dt {
  width: 100%;
  font-weight: bolder;
  padding: 2% 0;
  text-align: center;
  color: #fff;
  background-color: #000; }
  @media (min-width: 481px) and (max-width: 768px) {
    #contact #form dl dt {
      width: 25%;
      padding: 3% 0;
      color: #333;
      background-color: #fff; } }
  @media (min-width: 769px) {
    #contact #form dl dt {
      width: 25%;
      padding: 3% 0;
      color: #333;
      background-color: #fff; } }

#contact #form dl dd {
  width: 100%;
  padding: 3% 0; }
  @media (min-width: 481px) and (max-width: 768px) {
    #contact #form dl dd {
      width: 73%; } }
  @media (min-width: 769px) {
    #contact #form dl dd {
      width: 73%; } }

#contact #form input[type=text] {
  width: 100%;
  box-sizing: border-box;
  padding: 10px 5px;
  border: 1px solid #fff;
  border-bottom: 1px solid #eee;
  background-color: #f3f3f3; }

#contact #form input[type=email] {
  width: 100%;
  box-sizing: border-box;
  padding: 10px 5px;
  border: 1px solid #fff;
  border-bottom: 1px solid #eee;
  background-color: #f3f3f3; }

#contact #form select {
  width: 100%;
  box-sizing: border-box;
  border: 1px solid #fff;
  border-bottom: 1px solid #eee;
  background-color: #f3f3f3; }

#contact #form span.biko {
  color: #666;
  font-size: 0.85em;
  display: block; }

#contact #form input[type=file] {
  color: #666;
  font-size: 0.85em; }

#contact #form input[name=email] {
  margin: 8px 0 8px 0; }

#contact #form input[type=radio] {
  margin: 5px 5px 5px 0; }

#contact #form textarea {
  width: 100%;
  box-sizing: border-box;
  padding: 10px 5px;
  border: 1px solid #fff;
  border-bottom: 1px solid #eee;
  background-color: #f3f3f3; }

#contact .privacy {
  text-align: center;
  padding: 8% 0;
  font-size: 0.9em; }

#contact .privacy a {
  text-decoration: underline; }

#contact .btn {
  text-align: center; }

#contact .btn input {
  background-color: #f7e000;
  color: #000;
  font-size: 1.1rem;
  padding: 1rem 1.5rem;
  width: auto;
  display: inline-block;
  text-align: center;
  font-weight: bolder;
  transition: all 0.2s ease-out;
  width: 20%;
  border-radius: 50px; }

#contact .btn input:hover {
  /*ボタンを押したとき*/
  background-color: #000;
  color: #fff; }

#contact .btn input:active {
  /*ボタンを押したとき*/ }

#privacy {
  margin: 0 auto;
  padding: 0 0 3rem 0; }

#privacy .read {
  padding: 50px 0 10px 0; }

.privacy-box {
  padding: 5% 0;
  border-bottom: 2px dotted #f7e000; }

.privacy-box h3 {
  font-size: 1.2em;
  font-weight: bolder;
  margin: 0 0 15px 0;
  color: #000000; }

.privacy-box p {
  padding: 0 0 15px 0; }

.privacy-box a:link {
  text-decoration: underline; }

#sitemap .inner {
  display: -webkit-box;
  /*--- Androidブラウザ用 ---*/
  display: -ms-flexbox;
  /*--- IE10 ---*/
  display: -webkit-flex;
  /*--- safari（PC）用 ---*/
  display: flex;
  -webkit-box-pack: justify;
  /*--- Androidブラウザ用 ---*/
  -ms-flex-pack: justify;
  /*--- IE10 ---*/
  -webkit-justify-content: space-between;
  /*--- safari（PC）用 ---*/
  justify-content: space-between;
  -webkit-flex-wrap: wrap;
  /*--- safari（PC）用 ---*/
  flex-wrap: wrap;
  padding: 5rem 0 8rem 0; }

#sitemap ul li ul {
  margin-top: .5em;
  margin-bottom: .75em;
  margin-left: 48px;
  box-sizing: border-box; }

#sitemap ul li ul li {
  margin-bottom: .5em;
  position: relative;
  box-sizing: border-box; }

#sitemap ul li ul li::before {
  content: "";
  position: absolute;
  top: -0.5em;
  left: -16px;
  width: 10px;
  height: calc(100% + .75em);
  border-left: 2px solid #f7e000; }

#sitemap ul li ul li:last-child::before {
  height: calc(1em + .25em); }

#sitemap ul li ul li::after {
  content: "";
  position: absolute;
  top: .75em;
  left: -16px;
  width: 10px;
  border-bottom: 2px solid #f7e000; }

#sitemap ul {
  max-width: 48%;
  box-sizing: border-box; }
  @media (min-width: 481px) and (max-width: 768px) {
    #sitemap ul {
      width: 30%; } }
  @media (min-width: 769px) {
    #sitemap ul {
      width: 30%; } }

#sitemap ul li {
  font-size: 1.1em;
  font-weight: bolder;
  padding: 4% 0;
  box-sizing: border-box; }

#sitemap li > ul {
  width: 100%;
  box-sizing: border-box; }

#sitemap li > ul li {
  font-size: 0.9em;
  font-weight: 400;
  padding: 0; }

#sitemap li a:link {
  color: #000; }

#sitemap li a:hover {
  text-decoration: underline; }
/*============================
# blog-list
============================*/
#blog-list {
  padding: 0 0 5rem 0;
}

#blog-list .feeds dl {
  display: -webkit-box; /*--- Androidブラウザ用 ---*/
  display: -ms-flexbox; /*--- IE10 ---*/
  display: -webkit-flex; /*--- safari（PC）用 ---*/
  display: flex;
  -webkit-box-pack: justify; /*--- Androidブラウザ用 ---*/
  -ms-flex-pack: justify; /*--- IE10 ---*/
  -webkit-justify-content: space-between; /*--- safari（PC）用 ---*/
  justify-content: space-between;
  border-bottom: 2px dotted #eee;
  padding: 1rem 0;
}

#blog-list .feeds dt {
  width: 30%;
}

#blog-list .feeds dt img {
  border-radius: 0.5rem;
}

#blog-list .feeds dd {
  width: 65%;
}

#blog-list .feeds dd .date {
  color: #FFDC0B;
  padding: 0.2rem 0;
}
@media (min-width: 766px) and (max-width: 1000px) {
  #blog-list .feeds dd .date {
    padding: 0.5rem 0;
  }
}
@media (min-width: 1001px) {
  #blog-list .feeds dd .date {
    padding: 0.5rem 0;
  }
}

#blog-list .feeds dd .title {
  font-size: 1rem;
  padding: 0rem 0 0.5rem 0;
}
@media (min-width: 766px) and (max-width: 1000px) {
  #blog-list .feeds dd .title {
    font-size: 1.3rem;
    padding: 0rem 0 1rem 0;
  }
}
@media (min-width: 1001px) {
  #blog-list .feeds dd .title {
    font-size: 1.3rem;
    padding: 0rem 0 1rem 0;
  }
}

#blog-list .feeds dd .bassui {
  font-size: 0.95em;
  color: #666;
}

/*============================
# blog-post
============================*/
.post-box {
  background-color: #fff;
  padding: 1.5rem 0 2.5rem 0;
  -webkit-box-shadow: 0px 0px 2px 2px rgba(255, 255, 255, 0.12);
  -moz-box-shadow: 0px 0px 3px 2px rgba(255, 255, 255, 0.12);
  box-shadow: 0px 0px 3px 2px rgba(255, 255, 255, 0.12);
}
@media (min-width: 1001px) {
  .post-box {
    width: 900px;
    margin: 0 auto 3rem auto;
    box-sizing: border-box;
    padding: 2.5rem;
  }
}

.post-box .date {
  font-size: 0.9rem;
  color: #FFDC0B;
}

.post-box h3 {
  font-size: 1.2rem;
  padding: 0 0 1rem 0;
  border-bottom: 2px dotted #ccc;
  margin: 0 0 1rem 0;
  font-weight: bolder;
}

.post-box .honbun {
  color: #333;
  padding: 1rem 0 2rem 0;
}

.post-box .honbun p {
  line-height: 1.6;
  padding: 0.5rem 0;
}

.post-box .eyecatch {
  padding: 0 0 1rem 0;
}

#blog-post .return {
  margin: 2rem auto 2rem auto;
text-align:center;
}
@media (min-width: 1001px) {
  #blog-post .btn {
    width: 300px;
    margin: 2rem auto 4rem auto;
  }
}

#blog-post .btn a {
  background-color: #FFDC0B;
  color: #fff;
}

#blog-post .btn a:after {
  color: #fff;
}

#complete {
  padding: 3rem 0;
  text-align: center; }

#complete h3 {
  font-size: 1.2rem;
  font-weight: bolder;
  padding: 0 0 2rem 0; }

/*# sourceMappingURL=style.css.map */
.works-box .hide{
	display:none!important;
}
.grecaptcha-badge { visibility: hidden; }