@charset "UTF-8";
.font_ja {
  font-family: "YakuHanJP", Lato, "游ゴシック Medium", "游ゴシック体", "Yu Gothic Medium", YuGothic, "ヒラギノ角ゴ ProN", "Hiragino Kaku Gothic ProN", "メイリオ", Meiryo, "ＭＳ Ｐゴシック", "MS PGothic", sans-serif;
  font-weight: 500 !important;
}

.mincho {
  font-family: "Noto Serif JP", "YakuHanMP", "Noto Serif JP", "游明朝 Medium", "Yu Mincho", YuMincho, "Hiragino Mincho ProN", HGS明朝E, serif;
  font-weight: 500 !important;
}

.font_josefin {
  font-family: "Josefin Sans", sans-serif;
  font-weight: 500;
}

.font_Orbitron {
  font-family: "Oswald", sans-serif;
}

.font_anton {
  font-family: "Anton", sans-serif;
  font-weight: 500;
}

.font_parisienne {
  font-family: "Cinzel Decorative";
}
.font_parisienne:first-letter {
  text-transform: uppercase !important;
}

.font_parisienne {
  font-family: "Frank Ruhl Libre", serif;
}
.font_parisienne:first-letter {
  text-transform: uppercase !important;
}

.font_parisienne {
  font-family: "Parisienne", cursive;
}
.font_parisienne:first-letter {
  text-transform: uppercase !important;
}

.font_Amatic {
  font-family: "Amatic SC", cursive;
  font-weight: 500;
}

.font_kaisei {
  font-family: "Kaisei Opti", serif;
  font-weight: 500;
}

.font_maru {
  font-family: "Kosugi Maru", sans-serif;
  font-weight: 500;
}

/* CSS Document */
/*
html5doctor.com Reset Stylesheet
v1.6.1
Last Updated: 2010-09-17
Author: Richard Clark - http://richclarkdesign.com
Twitter: @rich_clark
*/
html,
body,
div,
span,
object,
iframe,
h1,
h2,
h3,
h4,
h5,
h6,
p,
blockquote,
pre,
abbr,
address,
cite,
code,
del,
dfn,
em,
img,
ins,
kbd,
q,
samp,
small,
strong,
sub,
sup,
var,
b,
i,
dl,
dt,
dd,
ol,
ul,
li,
fieldset,
form,
label,
legend,
table,
caption,
tbody,
tfoot,
thead,
tr,
th,
td,
article,
aside,
canvas,
details,
figcaption,
figure,
footer,
header,
hgroup,
menu,
nav,
section,
summary,
time,
mark,
audio,
video {
  margin: 0;
  padding: 0;
  border: 0;
  outline: 0;
  font-size: 100%;
  vertical-align: baseline;
  background: transparent;
  -webkit-text-size-adjust: 100%;
  /*smartphone*/
}

html {
  font-size: 62.5%;
}

body {
  line-height: 1;
}

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

blockquote,
q {
  quotes: none;
}

ul {
  list-style: none;
}

address,
dl,
dt,
dd {
  font-style: normal;
}

blockquote:before,
blockquote:after,
q:before,
q:after {
  content: "";
  content: none;
}

a {
  margin: 0;
  padding: 0;
  font-size: 100%;
  vertical-align: baseline;
  background: transparent;
}

/* change colours to suit your needs */
ins {
  background-color: #ff9;
  color: #000;
  text-decoration: none;
}

/* change colours to suit your needs */
mark {
  background-color: #ff9;
  color: #000;
  font-style: italic;
  font-weight: bold;
}

del {
  text-decoration: line-through;
}

abbr[title],
dfn[title] {
  border-bottom: 1px dotted;
  cursor: help;
}

table {
  border-collapse: collapse;
  border-spacing: 0;
}

/* change border colour to suit your needs */
hr {
  display: block;
  height: 1px;
  border: 0;
  border-top: 1px solid #cccccc;
  margin: 1em 0;
  padding: 0;
}

input,
select {
  vertical-align: middle;
}

a img {
  border: none;
}

img {
  vertical-align: bottom;
  max-width: 100%;
  height: auto;
}

ol {
  padding-left: 2em;
}

#main section,
#main aside {
  margin-bottom: 20px;
}

article,
aside,
footer,
header,
nav,
section,
main {
  display: block;
}

* {
  box-sizing: border-box;
}

*:before,
*:after {
  box-sizing: inherit;
}

.font_ja {
  font-family: "YakuHanJP", Lato, "游ゴシック Medium", "游ゴシック体", "Yu Gothic Medium", YuGothic, "ヒラギノ角ゴ ProN", "Hiragino Kaku Gothic ProN", "メイリオ", Meiryo, "ＭＳ Ｐゴシック", "MS PGothic", sans-serif;
  font-weight: 500 !important;
}

.mincho {
  font-family: "Noto Serif JP", "YakuHanMP", "Noto Serif JP", "游明朝 Medium", "Yu Mincho", YuMincho, "Hiragino Mincho ProN", HGS明朝E, serif;
  font-weight: 500 !important;
}

.font_josefin {
  font-family: "Josefin Sans", sans-serif;
  font-weight: 500;
}

.font_Orbitron {
  font-family: "Oswald", sans-serif;
}

.font_anton {
  font-family: "Anton", sans-serif;
  font-weight: 500;
}

.font_parisienne {
  font-family: "Cinzel Decorative";
}
.font_parisienne:first-letter {
  text-transform: uppercase !important;
}

.font_parisienne {
  font-family: "Frank Ruhl Libre", serif;
}
.font_parisienne:first-letter {
  text-transform: uppercase !important;
}

.font_parisienne {
  font-family: "Parisienne", cursive;
}
.font_parisienne:first-letter {
  text-transform: uppercase !important;
}

.font_Amatic {
  font-family: "Amatic SC", cursive;
  font-weight: 500;
}

.font_kaisei {
  font-family: "Kaisei Opti", serif;
  font-weight: 500;
}

.font_maru {
  font-family: "Kosugi Maru", sans-serif;
  font-weight: 500;
}

body {
  color: #555;
  background-color: #fff;
  background-image: none;
  min-height: 100vh;
  position: relative;
  font-family: "Noto Serif JP", "YakuHanMP", "Noto Serif JP", "游明朝 Medium", "Yu Mincho", YuMincho, "Hiragino Mincho ProN", HGS明朝E, serif;
  font-weight: 500;
  font-size: 1.5rem;
  line-height: 1.8;
  letter-spacing: 0.1em;
  -webkit-font-smoothing: antialiased;
}

a {
  color: #0a4f3a;
  text-decoration: none;
  transition: all 0.3s ease;
  cursor: pointer;
}

p a {
  text-decoration: underline;
}
p a:hover {
  text-decoration: inherit;
}

#main_area {
  overflow: hidden;
  position: relative;
}

.base_width {
  width: 100%;
  max-width: 1180px;
  margin: 0 auto;
}

.single {
  max-width: 1180px;
  margin: 0 auto;
  padding: 120px 0;
  position: relative;
  z-index: 2;
}

.single02 {
  margin: 120px auto;
  padding: 0;
  position: relative;
  z-index: 1;
}
@media all and (max-width: 639px) {
  .single02 {
    margin: 20px auto;
    padding-top: 0px;
  }
}

.single03 {
  max-width: 1500px;
  margin: 0 auto;
  padding: 80px 0;
}

.small-box {
  max-width: 800px;
  margin: 20px auto;
  position: relative;
}
@media all and (max-width: 639px) {
  .small-box {
    padding: 10px 0;
  }
}

.mbox {
  padding: 35px 30px;
  position: relative;
  z-index: 3;
  width: 100%;
  max-width: 1200px;
  margin-right: auto;
  margin-left: auto;
  background-color: #fff;
}
.mbox.max {
  max-width: 100%;
}
.mbox.glass {
  background-color: rgba(255, 255, 255, 0.9);
}
.mbox.shadow {
  box-shadow: rgba(17, 17, 17, 0.1) 3px 3px 3px 3px;
}
.mbox.bg_base {
  background: #dbf1fc !important;
}
.mbox.transparent {
  background: transparent !important;
}
.mbox.border {
  border: 2px solid #073829;
  padding: 35px 30px 30px;
}
@media all and (max-width: 639px) {
  .mbox.border {
    padding: 20px 10px;
  }
}
.mbox.sub.border {
  border: 2px solid #68482A;
}
.mbox.border_double {
  border: 3px double #073829;
  padding: 35px 30px 30px;
}
@media all and (max-width: 639px) {
  .mbox.border_double {
    padding: 20px 10px;
  }
}
@media all and (max-width: 639px) {
  .mbox {
    padding: 30px 10px;
  }
}

.white_txt .mtitle .eng,
.white_txt .mtitle .ja {
  color: #fff !important;
}
.white_txt .mtitle .eng:first-letter,
.white_txt .mtitle .ja:first-letter {
  color: #fff !important;
}
.white_txt p {
  color: #fff !important;
}
.white_txt .mtext1 {
  color: #fff !important;
}

.radius {
  border-radius: 20px;
}
.radius > a {
  border-radius: 20px;
}
.radius > img {
  border-radius: 20px;
}

.img_white img {
  filter: brightness(0) invert(1);
}

@media all and (max-width: 639px) {
  .pconly {
    display: none;
  }
}

@media all and (max-width: 896px) {
  .tabletonly {
    display: none;
  }
}

.sponly {
  display: none;
}
@media all and (max-width: 639px) {
  .sponly {
    display: block;
  }
}

.tr {
  -ms-writing-mode: tb-rl;
  writing-mode: vertical-rl;
}
@media all and (max-width: 639px) {
  .tr {
    -ms-writing-mode: horizontal-tb;
    writing-mode: horizontal-tb;
  }
}

.tcenter {
  text-align: center !important;
}
@media all and (max-width: 896px) {
  .tcenter.tablet {
    text-align: left !important;
  }
}
@media all and (max-width: 639px) {
  .tcenter.sp {
    text-align: left !important;
  }
}

.tright {
  text-align: right !important;
}
@media all and (max-width: 896px) {
  .tright.sp {
    text-align: center !important;
  }
}

.tleft {
  text-align: left !important;
}
@media all and (max-width: 896px) {
  .tleft.sp {
    text-align: center !important;
  }
}

.tinline {
  display: inline-block;
}

.underline {
  text-decoration: underline;
}
.underline:hover {
  text-decoration: inherit;
}

.edge_w {
  text-shadow: 0px 0px 5px rgba(255, 255, 255, 0.8), 0px 0px 5px rgba(255, 255, 255, 0.8), 0px 0px 10px rgba(255, 255, 255, 0.8), 0px 0px 10px rgba(255, 255, 255, 0.8), 0px 0px 15px rgba(255, 255, 255, 0.8), 0px 0px 15px;
}

.edge_b {
  text-shadow: 0px 0px 5px rgba(17, 17, 17, 0.8), 0px 0px 5px rgba(17, 17, 17, 0.8), 0px 0px 10px rgba(17, 17, 17, 0.8), 0px 0px 10px rgba(17, 17, 17, 0.8), 0px 0px 15px rgba(17, 17, 17, 0.8), 0px 0px 15px;
}

.bold {
  font-weight: bold !important;
}

.bigger {
  font-size: 2rem;
}
@media all and (max-width: 639px) {
  .bigger {
    font-size: inherit;
  }
}

.fsmall {
  font-size: 80%;
}
@media all and (max-width: 639px) {
  .fsmall {
    font-size: 80%;
  }
}

h2,
h3,
h4 {
  line-height: 1.4;
  font-weight: 600;
}

.none {
  display: none;
}

.block {
  display: block;
}

.clear {
  clear: both;
}

.clearfix {
  _display: inline-block;
}
.clearfix:after {
  content: ".";
  display: block;
  height: 0px;
  clear: both;
  visibility: hidden;
}

.fleft0 {
  float: left;
  display: inline;
  text-align: center;
}

.fleft1 {
  float: left;
  display: inline;
  margin-right: 10px;
  margin-bottom: 10px;
  text-align: center;
}

.fleft2 {
  float: left;
  display: inline;
  margin-right: 30px;
  text-align: center;
}

.fright0 {
  float: right;
  display: inline;
  text-align: center;
}

.fright1 {
  float: right;
  display: inline;
  margin-left: 10px;
  margin-bottom: 10px;
  text-align: center;
}

.fright2 {
  float: right;
  display: inline;
  margin-left: 30px;
  text-align: center;
}

.m0 {
  margin: 0px !important;
}

.t-m0 {
  margin-top: 0px !important;
}

.r-m0 {
  margin-right: 0px !important;
}

.b-m0 {
  margin-bottom: 0px !important;
}

.l-m0 {
  margin-left: 0px !important;
}

.h-m0 {
  margin-top: 0px !important;
  margin-bottom: 0px !important;
}

.w-m0 {
  margin-left: 0px !important;
  margin-right: 0px !important;
}

.p0 {
  padding: 0px !important;
}

.t-p0 {
  padding-top: 0px !important;
}

.r-p0 {
  padding-right: 0px !important;
}

.b-p0 {
  padding-bottom: 0px !important;
}

.l-p0 {
  padding-left: 0px !important;
}

.h-p0 {
  padding-top: 0px !important;
  padding-bottom: 0px !important;
}

.w-p0 {
  padding-left: 0px !important;
  padding-right: 0px !important;
}

.m0 {
  margin: 0px !important;
}

.t-m0 {
  margin-top: 0px !important;
}

.r-m0 {
  margin-right: 0px !important;
}

.b-m0 {
  margin-bottom: 0px !important;
}

.l-m0 {
  margin-left: 0px !important;
}

.m5 {
  margin: 8px !important;
}

.t-m5 {
  margin-top: 8px !important;
}

.r-m5 {
  margin-right: 8px !important;
}

.b-m5 {
  margin-bottom: 8px !important;
}

.l-m5 {
  margin-left: 8px !important;
}

.h-m5 {
  margin-top: 8px !important;
  margin-bottom: 8px !important;
}

.w-m5 {
  margin-left: 8px !important;
  margin-right: 8px !important;
}

.p5 {
  padding: 8px !important;
}

.t-p5 {
  padding-top: 8px !important;
}

.r-p5 {
  padding-right: 8px !important;
}

.b-p5 {
  padding-bottom: 8px !important;
}

.l-p5 {
  padding-left: 8px !important;
}

.h-p5 {
  padding-top: 8px !important;
  padding-bottom: 8px !important;
}

.w-p5 {
  padding-left: 8px !important;
  padding-right: 8px !important;
}

.m-5 {
  margin: -8px !important;
}

.t-m-5 {
  margin-top: -8px !important;
}

.r-m-5 {
  margin-right: -8px !important;
}

.b-m-5 {
  margin-bottom: -8px !important;
}

.l-m-5 {
  margin-left: -8px !important;
}

.m10 {
  margin: 16px !important;
}

.t-m10 {
  margin-top: 16px !important;
}

.r-m10 {
  margin-right: 16px !important;
}

.b-m10 {
  margin-bottom: 16px !important;
}

.l-m10 {
  margin-left: 16px !important;
}

.h-m10 {
  margin-top: 16px !important;
  margin-bottom: 16px !important;
}

.w-m10 {
  margin-left: 16px !important;
  margin-right: 16px !important;
}

.p10 {
  padding: 16px !important;
}

.t-p10 {
  padding-top: 16px !important;
}

.r-p10 {
  padding-right: 16px !important;
}

.b-p10 {
  padding-bottom: 16px !important;
}

.l-p10 {
  padding-left: 16px !important;
}

.h-p10 {
  padding-top: 16px !important;
  padding-bottom: 16px !important;
}

.w-p10 {
  padding-left: 16px !important;
  padding-right: 16px !important;
}

.m-10 {
  margin: -16px !important;
}

.t-m-10 {
  margin-top: -16px !important;
}

.r-m-10 {
  margin-right: -16px !important;
}

.b-m-10 {
  margin-bottom: -16px !important;
}

.l-m-10 {
  margin-left: -16px !important;
}

.m15 {
  margin: 24px !important;
}

.t-m15 {
  margin-top: 24px !important;
}

.r-m15 {
  margin-right: 24px !important;
}

.b-m15 {
  margin-bottom: 24px !important;
}

.l-m15 {
  margin-left: 24px !important;
}

.h-m15 {
  margin-top: 24px !important;
  margin-bottom: 24px !important;
}

.w-m15 {
  margin-left: 24px !important;
  margin-right: 24px !important;
}

.p15 {
  padding: 24px !important;
}

.t-p15 {
  padding-top: 24px !important;
}

.r-p15 {
  padding-right: 24px !important;
}

.b-p15 {
  padding-bottom: 24px !important;
}

.l-p15 {
  padding-left: 24px !important;
}

.h-p15 {
  padding-top: 24px !important;
  padding-bottom: 24px !important;
}

.w-p15 {
  padding-left: 24px !important;
  padding-right: 24px !important;
}

.m-15 {
  margin: -24px !important;
}

.t-m-15 {
  margin-top: -24px !important;
}

.r-m-15 {
  margin-right: -24px !important;
}

.b-m-15 {
  margin-bottom: -24px !important;
}

.l-m-15 {
  margin-left: -24px !important;
}

.m20 {
  margin: 32px !important;
}

.t-m20 {
  margin-top: 32px !important;
}

.r-m20 {
  margin-right: 32px !important;
}

.b-m20 {
  margin-bottom: 32px !important;
}

.l-m20 {
  margin-left: 32px !important;
}

.h-m20 {
  margin-top: 32px !important;
  margin-bottom: 32px !important;
}

.w-m20 {
  margin-left: 32px !important;
  margin-right: 32px !important;
}

.p20 {
  padding: 32px !important;
}

.t-p20 {
  padding-top: 32px !important;
}

.r-p20 {
  padding-right: 32px !important;
}

.b-p20 {
  padding-bottom: 32px !important;
}

.l-p20 {
  padding-left: 32px !important;
}

.h-p20 {
  padding-top: 32px !important;
  padding-bottom: 32px !important;
}

.w-p20 {
  padding-left: 32px !important;
  padding-right: 32px !important;
}

.m-20 {
  margin: -32px !important;
}

.t-m-20 {
  margin-top: -32px !important;
}

.r-m-20 {
  margin-right: -32px !important;
}

.b-m-20 {
  margin-bottom: -32px !important;
}

.l-m-20 {
  margin-left: -32px !important;
}

.m25 {
  margin: 40px !important;
}

.t-m25 {
  margin-top: 40px !important;
}

.r-m25 {
  margin-right: 40px !important;
}

.b-m25 {
  margin-bottom: 40px !important;
}

.l-m25 {
  margin-left: 40px !important;
}

.h-m25 {
  margin-top: 40px !important;
  margin-bottom: 40px !important;
}

.w-m25 {
  margin-left: 40px !important;
  margin-right: 40px !important;
}

.p25 {
  padding: 40px !important;
}

.t-p25 {
  padding-top: 40px !important;
}

.r-p25 {
  padding-right: 40px !important;
}

.b-p25 {
  padding-bottom: 40px !important;
}

.l-p25 {
  padding-left: 40px !important;
}

.h-p25 {
  padding-top: 40px !important;
  padding-bottom: 40px !important;
}

.w-p25 {
  padding-left: 40px !important;
  padding-right: 40px !important;
}

.m-25 {
  margin: -40px !important;
}

.t-m-25 {
  margin-top: -40px !important;
}

.r-m-25 {
  margin-right: -40px !important;
}

.b-m-25 {
  margin-bottom: -40px !important;
}

.l-m-25 {
  margin-left: -40px !important;
}

.m30 {
  margin: 48px !important;
}

.t-m30 {
  margin-top: 48px !important;
}

.r-m30 {
  margin-right: 48px !important;
}

.b-m30 {
  margin-bottom: 48px !important;
}

.l-m30 {
  margin-left: 48px !important;
}

.h-m30 {
  margin-top: 48px !important;
  margin-bottom: 48px !important;
}

.w-m30 {
  margin-left: 48px !important;
  margin-right: 48px !important;
}

.p30 {
  padding: 48px !important;
}

.t-p30 {
  padding-top: 48px !important;
}

.r-p30 {
  padding-right: 48px !important;
}

.b-p30 {
  padding-bottom: 48px !important;
}

.l-p30 {
  padding-left: 48px !important;
}

.h-p30 {
  padding-top: 48px !important;
  padding-bottom: 48px !important;
}

.w-p30 {
  padding-left: 48px !important;
  padding-right: 48px !important;
}

.m-30 {
  margin: -48px !important;
}

.t-m-30 {
  margin-top: -48px !important;
}

.r-m-30 {
  margin-right: -48px !important;
}

.b-m-30 {
  margin-bottom: -48px !important;
}

.l-m-30 {
  margin-left: -48px !important;
}

.m35 {
  margin: 56px !important;
}

.t-m35 {
  margin-top: 56px !important;
}

.r-m35 {
  margin-right: 56px !important;
}

.b-m35 {
  margin-bottom: 56px !important;
}

.l-m35 {
  margin-left: 56px !important;
}

.h-m35 {
  margin-top: 56px !important;
  margin-bottom: 56px !important;
}

.w-m35 {
  margin-left: 56px !important;
  margin-right: 56px !important;
}

.p35 {
  padding: 56px !important;
}

.t-p35 {
  padding-top: 56px !important;
}

.r-p35 {
  padding-right: 56px !important;
}

.b-p35 {
  padding-bottom: 56px !important;
}

.l-p35 {
  padding-left: 56px !important;
}

.h-p35 {
  padding-top: 56px !important;
  padding-bottom: 56px !important;
}

.w-p35 {
  padding-left: 56px !important;
  padding-right: 56px !important;
}

.m-35 {
  margin: -56px !important;
}

.t-m-35 {
  margin-top: -56px !important;
}

.r-m-35 {
  margin-right: -56px !important;
}

.b-m-35 {
  margin-bottom: -56px !important;
}

.l-m-35 {
  margin-left: -56px !important;
}

.m40 {
  margin: 64px !important;
}

.t-m40 {
  margin-top: 64px !important;
}

.r-m40 {
  margin-right: 64px !important;
}

.b-m40 {
  margin-bottom: 64px !important;
}

.l-m40 {
  margin-left: 64px !important;
}

.h-m40 {
  margin-top: 64px !important;
  margin-bottom: 64px !important;
}

.w-m40 {
  margin-left: 64px !important;
  margin-right: 64px !important;
}

.p40 {
  padding: 64px !important;
}

.t-p40 {
  padding-top: 64px !important;
}

.r-p40 {
  padding-right: 64px !important;
}

.b-p40 {
  padding-bottom: 64px !important;
}

.l-p40 {
  padding-left: 64px !important;
}

.h-p40 {
  padding-top: 64px !important;
  padding-bottom: 64px !important;
}

.w-p40 {
  padding-left: 64px !important;
  padding-right: 64px !important;
}

.m-40 {
  margin: -64px !important;
}

.t-m-40 {
  margin-top: -64px !important;
}

.r-m-40 {
  margin-right: -64px !important;
}

.b-m-40 {
  margin-bottom: -64px !important;
}

.l-m-40 {
  margin-left: -64px !important;
}

.m45 {
  margin: 72px !important;
}

.t-m45 {
  margin-top: 72px !important;
}

.r-m45 {
  margin-right: 72px !important;
}

.b-m45 {
  margin-bottom: 72px !important;
}

.l-m45 {
  margin-left: 72px !important;
}

.h-m45 {
  margin-top: 72px !important;
  margin-bottom: 72px !important;
}

.w-m45 {
  margin-left: 72px !important;
  margin-right: 72px !important;
}

.p45 {
  padding: 72px !important;
}

.t-p45 {
  padding-top: 72px !important;
}

.r-p45 {
  padding-right: 72px !important;
}

.b-p45 {
  padding-bottom: 72px !important;
}

.l-p45 {
  padding-left: 72px !important;
}

.h-p45 {
  padding-top: 72px !important;
  padding-bottom: 72px !important;
}

.w-p45 {
  padding-left: 72px !important;
  padding-right: 72px !important;
}

.m-45 {
  margin: -72px !important;
}

.t-m-45 {
  margin-top: -72px !important;
}

.r-m-45 {
  margin-right: -72px !important;
}

.b-m-45 {
  margin-bottom: -72px !important;
}

.l-m-45 {
  margin-left: -72px !important;
}

.m50 {
  margin: 80px !important;
}

.t-m50 {
  margin-top: 80px !important;
}

.r-m50 {
  margin-right: 80px !important;
}

.b-m50 {
  margin-bottom: 80px !important;
}

.l-m50 {
  margin-left: 80px !important;
}

.h-m50 {
  margin-top: 80px !important;
  margin-bottom: 80px !important;
}

.w-m50 {
  margin-left: 80px !important;
  margin-right: 80px !important;
}

.p50 {
  padding: 80px !important;
}

.t-p50 {
  padding-top: 80px !important;
}

.r-p50 {
  padding-right: 80px !important;
}

.b-p50 {
  padding-bottom: 80px !important;
}

.l-p50 {
  padding-left: 80px !important;
}

.h-p50 {
  padding-top: 80px !important;
  padding-bottom: 80px !important;
}

.w-p50 {
  padding-left: 80px !important;
  padding-right: 80px !important;
}

.m-50 {
  margin: -80px !important;
}

.t-m-50 {
  margin-top: -80px !important;
}

.r-m-50 {
  margin-right: -80px !important;
}

.b-m-50 {
  margin-bottom: -80px !important;
}

.l-m-50 {
  margin-left: -80px !important;
}

.m55 {
  margin: 88px !important;
}

.t-m55 {
  margin-top: 88px !important;
}

.r-m55 {
  margin-right: 88px !important;
}

.b-m55 {
  margin-bottom: 88px !important;
}

.l-m55 {
  margin-left: 88px !important;
}

.h-m55 {
  margin-top: 88px !important;
  margin-bottom: 88px !important;
}

.w-m55 {
  margin-left: 88px !important;
  margin-right: 88px !important;
}

.p55 {
  padding: 88px !important;
}

.t-p55 {
  padding-top: 88px !important;
}

.r-p55 {
  padding-right: 88px !important;
}

.b-p55 {
  padding-bottom: 88px !important;
}

.l-p55 {
  padding-left: 88px !important;
}

.h-p55 {
  padding-top: 88px !important;
  padding-bottom: 88px !important;
}

.w-p55 {
  padding-left: 88px !important;
  padding-right: 88px !important;
}

.m-55 {
  margin: -88px !important;
}

.t-m-55 {
  margin-top: -88px !important;
}

.r-m-55 {
  margin-right: -88px !important;
}

.b-m-55 {
  margin-bottom: -88px !important;
}

.l-m-55 {
  margin-left: -88px !important;
}

.m60 {
  margin: 96px !important;
}

.t-m60 {
  margin-top: 96px !important;
}

.r-m60 {
  margin-right: 96px !important;
}

.b-m60 {
  margin-bottom: 96px !important;
}

.l-m60 {
  margin-left: 96px !important;
}

.h-m60 {
  margin-top: 96px !important;
  margin-bottom: 96px !important;
}

.w-m60 {
  margin-left: 96px !important;
  margin-right: 96px !important;
}

.p60 {
  padding: 96px !important;
}

.t-p60 {
  padding-top: 96px !important;
}

.r-p60 {
  padding-right: 96px !important;
}

.b-p60 {
  padding-bottom: 96px !important;
}

.l-p60 {
  padding-left: 96px !important;
}

.h-p60 {
  padding-top: 96px !important;
  padding-bottom: 96px !important;
}

.w-p60 {
  padding-left: 96px !important;
  padding-right: 96px !important;
}

.m-60 {
  margin: -96px !important;
}

.t-m-60 {
  margin-top: -96px !important;
}

.r-m-60 {
  margin-right: -96px !important;
}

.b-m-60 {
  margin-bottom: -96px !important;
}

.l-m-60 {
  margin-left: -96px !important;
}

.m65 {
  margin: 104px !important;
}

.t-m65 {
  margin-top: 104px !important;
}

.r-m65 {
  margin-right: 104px !important;
}

.b-m65 {
  margin-bottom: 104px !important;
}

.l-m65 {
  margin-left: 104px !important;
}

.h-m65 {
  margin-top: 104px !important;
  margin-bottom: 104px !important;
}

.w-m65 {
  margin-left: 104px !important;
  margin-right: 104px !important;
}

.p65 {
  padding: 104px !important;
}

.t-p65 {
  padding-top: 104px !important;
}

.r-p65 {
  padding-right: 104px !important;
}

.b-p65 {
  padding-bottom: 104px !important;
}

.l-p65 {
  padding-left: 104px !important;
}

.h-p65 {
  padding-top: 104px !important;
  padding-bottom: 104px !important;
}

.w-p65 {
  padding-left: 104px !important;
  padding-right: 104px !important;
}

.m-65 {
  margin: -104px !important;
}

.t-m-65 {
  margin-top: -104px !important;
}

.r-m-65 {
  margin-right: -104px !important;
}

.b-m-65 {
  margin-bottom: -104px !important;
}

.l-m-65 {
  margin-left: -104px !important;
}

.m70 {
  margin: 112px !important;
}

.t-m70 {
  margin-top: 112px !important;
}

.r-m70 {
  margin-right: 112px !important;
}

.b-m70 {
  margin-bottom: 112px !important;
}

.l-m70 {
  margin-left: 112px !important;
}

.h-m70 {
  margin-top: 112px !important;
  margin-bottom: 112px !important;
}

.w-m70 {
  margin-left: 112px !important;
  margin-right: 112px !important;
}

.p70 {
  padding: 112px !important;
}

.t-p70 {
  padding-top: 112px !important;
}

.r-p70 {
  padding-right: 112px !important;
}

.b-p70 {
  padding-bottom: 112px !important;
}

.l-p70 {
  padding-left: 112px !important;
}

.h-p70 {
  padding-top: 112px !important;
  padding-bottom: 112px !important;
}

.w-p70 {
  padding-left: 112px !important;
  padding-right: 112px !important;
}

.m-70 {
  margin: -112px !important;
}

.t-m-70 {
  margin-top: -112px !important;
}

.r-m-70 {
  margin-right: -112px !important;
}

.b-m-70 {
  margin-bottom: -112px !important;
}

.l-m-70 {
  margin-left: -112px !important;
}

.m75 {
  margin: 120px !important;
}

.t-m75 {
  margin-top: 120px !important;
}

.r-m75 {
  margin-right: 120px !important;
}

.b-m75 {
  margin-bottom: 120px !important;
}

.l-m75 {
  margin-left: 120px !important;
}

.h-m75 {
  margin-top: 120px !important;
  margin-bottom: 120px !important;
}

.w-m75 {
  margin-left: 120px !important;
  margin-right: 120px !important;
}

.p75 {
  padding: 120px !important;
}

.t-p75 {
  padding-top: 120px !important;
}

.r-p75 {
  padding-right: 120px !important;
}

.b-p75 {
  padding-bottom: 120px !important;
}

.l-p75 {
  padding-left: 120px !important;
}

.h-p75 {
  padding-top: 120px !important;
  padding-bottom: 120px !important;
}

.w-p75 {
  padding-left: 120px !important;
  padding-right: 120px !important;
}

.m-75 {
  margin: -120px !important;
}

.t-m-75 {
  margin-top: -120px !important;
}

.r-m-75 {
  margin-right: -120px !important;
}

.b-m-75 {
  margin-bottom: -120px !important;
}

.l-m-75 {
  margin-left: -120px !important;
}

.m80 {
  margin: 128px !important;
}

.t-m80 {
  margin-top: 128px !important;
}

.r-m80 {
  margin-right: 128px !important;
}

.b-m80 {
  margin-bottom: 128px !important;
}

.l-m80 {
  margin-left: 128px !important;
}

.h-m80 {
  margin-top: 128px !important;
  margin-bottom: 128px !important;
}

.w-m80 {
  margin-left: 128px !important;
  margin-right: 128px !important;
}

.p80 {
  padding: 128px !important;
}

.t-p80 {
  padding-top: 128px !important;
}

.r-p80 {
  padding-right: 128px !important;
}

.b-p80 {
  padding-bottom: 128px !important;
}

.l-p80 {
  padding-left: 128px !important;
}

.h-p80 {
  padding-top: 128px !important;
  padding-bottom: 128px !important;
}

.w-p80 {
  padding-left: 128px !important;
  padding-right: 128px !important;
}

.m-80 {
  margin: -128px !important;
}

.t-m-80 {
  margin-top: -128px !important;
}

.r-m-80 {
  margin-right: -128px !important;
}

.b-m-80 {
  margin-bottom: -128px !important;
}

.l-m-80 {
  margin-left: -128px !important;
}

.m85 {
  margin: 136px !important;
}

.t-m85 {
  margin-top: 136px !important;
}

.r-m85 {
  margin-right: 136px !important;
}

.b-m85 {
  margin-bottom: 136px !important;
}

.l-m85 {
  margin-left: 136px !important;
}

.h-m85 {
  margin-top: 136px !important;
  margin-bottom: 136px !important;
}

.w-m85 {
  margin-left: 136px !important;
  margin-right: 136px !important;
}

.p85 {
  padding: 136px !important;
}

.t-p85 {
  padding-top: 136px !important;
}

.r-p85 {
  padding-right: 136px !important;
}

.b-p85 {
  padding-bottom: 136px !important;
}

.l-p85 {
  padding-left: 136px !important;
}

.h-p85 {
  padding-top: 136px !important;
  padding-bottom: 136px !important;
}

.w-p85 {
  padding-left: 136px !important;
  padding-right: 136px !important;
}

.m-85 {
  margin: -136px !important;
}

.t-m-85 {
  margin-top: -136px !important;
}

.r-m-85 {
  margin-right: -136px !important;
}

.b-m-85 {
  margin-bottom: -136px !important;
}

.l-m-85 {
  margin-left: -136px !important;
}

.m90 {
  margin: 144px !important;
}

.t-m90 {
  margin-top: 144px !important;
}

.r-m90 {
  margin-right: 144px !important;
}

.b-m90 {
  margin-bottom: 144px !important;
}

.l-m90 {
  margin-left: 144px !important;
}

.h-m90 {
  margin-top: 144px !important;
  margin-bottom: 144px !important;
}

.w-m90 {
  margin-left: 144px !important;
  margin-right: 144px !important;
}

.p90 {
  padding: 144px !important;
}

.t-p90 {
  padding-top: 144px !important;
}

.r-p90 {
  padding-right: 144px !important;
}

.b-p90 {
  padding-bottom: 144px !important;
}

.l-p90 {
  padding-left: 144px !important;
}

.h-p90 {
  padding-top: 144px !important;
  padding-bottom: 144px !important;
}

.w-p90 {
  padding-left: 144px !important;
  padding-right: 144px !important;
}

.m-90 {
  margin: -144px !important;
}

.t-m-90 {
  margin-top: -144px !important;
}

.r-m-90 {
  margin-right: -144px !important;
}

.b-m-90 {
  margin-bottom: -144px !important;
}

.l-m-90 {
  margin-left: -144px !important;
}

.m95 {
  margin: 152px !important;
}

.t-m95 {
  margin-top: 152px !important;
}

.r-m95 {
  margin-right: 152px !important;
}

.b-m95 {
  margin-bottom: 152px !important;
}

.l-m95 {
  margin-left: 152px !important;
}

.h-m95 {
  margin-top: 152px !important;
  margin-bottom: 152px !important;
}

.w-m95 {
  margin-left: 152px !important;
  margin-right: 152px !important;
}

.p95 {
  padding: 152px !important;
}

.t-p95 {
  padding-top: 152px !important;
}

.r-p95 {
  padding-right: 152px !important;
}

.b-p95 {
  padding-bottom: 152px !important;
}

.l-p95 {
  padding-left: 152px !important;
}

.h-p95 {
  padding-top: 152px !important;
  padding-bottom: 152px !important;
}

.w-p95 {
  padding-left: 152px !important;
  padding-right: 152px !important;
}

.m-95 {
  margin: -152px !important;
}

.t-m-95 {
  margin-top: -152px !important;
}

.r-m-95 {
  margin-right: -152px !important;
}

.b-m-95 {
  margin-bottom: -152px !important;
}

.l-m-95 {
  margin-left: -152px !important;
}

.m100 {
  margin: 160px !important;
}

.t-m100 {
  margin-top: 160px !important;
}

.r-m100 {
  margin-right: 160px !important;
}

.b-m100 {
  margin-bottom: 160px !important;
}

.l-m100 {
  margin-left: 160px !important;
}

.h-m100 {
  margin-top: 160px !important;
  margin-bottom: 160px !important;
}

.w-m100 {
  margin-left: 160px !important;
  margin-right: 160px !important;
}

.p100 {
  padding: 160px !important;
}

.t-p100 {
  padding-top: 160px !important;
}

.r-p100 {
  padding-right: 160px !important;
}

.b-p100 {
  padding-bottom: 160px !important;
}

.l-p100 {
  padding-left: 160px !important;
}

.h-p100 {
  padding-top: 160px !important;
  padding-bottom: 160px !important;
}

.w-p100 {
  padding-left: 160px !important;
  padding-right: 160px !important;
}

.m-100 {
  margin: -160px !important;
}

.t-m-100 {
  margin-top: -160px !important;
}

.r-m-100 {
  margin-right: -160px !important;
}

.b-m-100 {
  margin-bottom: -160px !important;
}

.l-m-100 {
  margin-left: -160px !important;
}

.m105 {
  margin: 168px !important;
}

.t-m105 {
  margin-top: 168px !important;
}

.r-m105 {
  margin-right: 168px !important;
}

.b-m105 {
  margin-bottom: 168px !important;
}

.l-m105 {
  margin-left: 168px !important;
}

.h-m105 {
  margin-top: 168px !important;
  margin-bottom: 168px !important;
}

.w-m105 {
  margin-left: 168px !important;
  margin-right: 168px !important;
}

.p105 {
  padding: 168px !important;
}

.t-p105 {
  padding-top: 168px !important;
}

.r-p105 {
  padding-right: 168px !important;
}

.b-p105 {
  padding-bottom: 168px !important;
}

.l-p105 {
  padding-left: 168px !important;
}

.h-p105 {
  padding-top: 168px !important;
  padding-bottom: 168px !important;
}

.w-p105 {
  padding-left: 168px !important;
  padding-right: 168px !important;
}

.m-105 {
  margin: -168px !important;
}

.t-m-105 {
  margin-top: -168px !important;
}

.r-m-105 {
  margin-right: -168px !important;
}

.b-m-105 {
  margin-bottom: -168px !important;
}

.l-m-105 {
  margin-left: -168px !important;
}

.m110 {
  margin: 176px !important;
}

.t-m110 {
  margin-top: 176px !important;
}

.r-m110 {
  margin-right: 176px !important;
}

.b-m110 {
  margin-bottom: 176px !important;
}

.l-m110 {
  margin-left: 176px !important;
}

.h-m110 {
  margin-top: 176px !important;
  margin-bottom: 176px !important;
}

.w-m110 {
  margin-left: 176px !important;
  margin-right: 176px !important;
}

.p110 {
  padding: 176px !important;
}

.t-p110 {
  padding-top: 176px !important;
}

.r-p110 {
  padding-right: 176px !important;
}

.b-p110 {
  padding-bottom: 176px !important;
}

.l-p110 {
  padding-left: 176px !important;
}

.h-p110 {
  padding-top: 176px !important;
  padding-bottom: 176px !important;
}

.w-p110 {
  padding-left: 176px !important;
  padding-right: 176px !important;
}

.m-110 {
  margin: -176px !important;
}

.t-m-110 {
  margin-top: -176px !important;
}

.r-m-110 {
  margin-right: -176px !important;
}

.b-m-110 {
  margin-bottom: -176px !important;
}

.l-m-110 {
  margin-left: -176px !important;
}

.m115 {
  margin: 184px !important;
}

.t-m115 {
  margin-top: 184px !important;
}

.r-m115 {
  margin-right: 184px !important;
}

.b-m115 {
  margin-bottom: 184px !important;
}

.l-m115 {
  margin-left: 184px !important;
}

.h-m115 {
  margin-top: 184px !important;
  margin-bottom: 184px !important;
}

.w-m115 {
  margin-left: 184px !important;
  margin-right: 184px !important;
}

.p115 {
  padding: 184px !important;
}

.t-p115 {
  padding-top: 184px !important;
}

.r-p115 {
  padding-right: 184px !important;
}

.b-p115 {
  padding-bottom: 184px !important;
}

.l-p115 {
  padding-left: 184px !important;
}

.h-p115 {
  padding-top: 184px !important;
  padding-bottom: 184px !important;
}

.w-p115 {
  padding-left: 184px !important;
  padding-right: 184px !important;
}

.m-115 {
  margin: -184px !important;
}

.t-m-115 {
  margin-top: -184px !important;
}

.r-m-115 {
  margin-right: -184px !important;
}

.b-m-115 {
  margin-bottom: -184px !important;
}

.l-m-115 {
  margin-left: -184px !important;
}

.m120 {
  margin: 192px !important;
}

.t-m120 {
  margin-top: 192px !important;
}

.r-m120 {
  margin-right: 192px !important;
}

.b-m120 {
  margin-bottom: 192px !important;
}

.l-m120 {
  margin-left: 192px !important;
}

.h-m120 {
  margin-top: 192px !important;
  margin-bottom: 192px !important;
}

.w-m120 {
  margin-left: 192px !important;
  margin-right: 192px !important;
}

.p120 {
  padding: 192px !important;
}

.t-p120 {
  padding-top: 192px !important;
}

.r-p120 {
  padding-right: 192px !important;
}

.b-p120 {
  padding-bottom: 192px !important;
}

.l-p120 {
  padding-left: 192px !important;
}

.h-p120 {
  padding-top: 192px !important;
  padding-bottom: 192px !important;
}

.w-p120 {
  padding-left: 192px !important;
  padding-right: 192px !important;
}

.m-120 {
  margin: -192px !important;
}

.t-m-120 {
  margin-top: -192px !important;
}

.r-m-120 {
  margin-right: -192px !important;
}

.b-m-120 {
  margin-bottom: -192px !important;
}

.l-m-120 {
  margin-left: -192px !important;
}

.m125 {
  margin: 200px !important;
}

.t-m125 {
  margin-top: 200px !important;
}

.r-m125 {
  margin-right: 200px !important;
}

.b-m125 {
  margin-bottom: 200px !important;
}

.l-m125 {
  margin-left: 200px !important;
}

.h-m125 {
  margin-top: 200px !important;
  margin-bottom: 200px !important;
}

.w-m125 {
  margin-left: 200px !important;
  margin-right: 200px !important;
}

.p125 {
  padding: 200px !important;
}

.t-p125 {
  padding-top: 200px !important;
}

.r-p125 {
  padding-right: 200px !important;
}

.b-p125 {
  padding-bottom: 200px !important;
}

.l-p125 {
  padding-left: 200px !important;
}

.h-p125 {
  padding-top: 200px !important;
  padding-bottom: 200px !important;
}

.w-p125 {
  padding-left: 200px !important;
  padding-right: 200px !important;
}

.m-125 {
  margin: -200px !important;
}

.t-m-125 {
  margin-top: -200px !important;
}

.r-m-125 {
  margin-right: -200px !important;
}

.b-m-125 {
  margin-bottom: -200px !important;
}

.l-m-125 {
  margin-left: -200px !important;
}

.m130 {
  margin: 208px !important;
}

.t-m130 {
  margin-top: 208px !important;
}

.r-m130 {
  margin-right: 208px !important;
}

.b-m130 {
  margin-bottom: 208px !important;
}

.l-m130 {
  margin-left: 208px !important;
}

.h-m130 {
  margin-top: 208px !important;
  margin-bottom: 208px !important;
}

.w-m130 {
  margin-left: 208px !important;
  margin-right: 208px !important;
}

.p130 {
  padding: 208px !important;
}

.t-p130 {
  padding-top: 208px !important;
}

.r-p130 {
  padding-right: 208px !important;
}

.b-p130 {
  padding-bottom: 208px !important;
}

.l-p130 {
  padding-left: 208px !important;
}

.h-p130 {
  padding-top: 208px !important;
  padding-bottom: 208px !important;
}

.w-p130 {
  padding-left: 208px !important;
  padding-right: 208px !important;
}

.m-130 {
  margin: -208px !important;
}

.t-m-130 {
  margin-top: -208px !important;
}

.r-m-130 {
  margin-right: -208px !important;
}

.b-m-130 {
  margin-bottom: -208px !important;
}

.l-m-130 {
  margin-left: -208px !important;
}

.m135 {
  margin: 216px !important;
}

.t-m135 {
  margin-top: 216px !important;
}

.r-m135 {
  margin-right: 216px !important;
}

.b-m135 {
  margin-bottom: 216px !important;
}

.l-m135 {
  margin-left: 216px !important;
}

.h-m135 {
  margin-top: 216px !important;
  margin-bottom: 216px !important;
}

.w-m135 {
  margin-left: 216px !important;
  margin-right: 216px !important;
}

.p135 {
  padding: 216px !important;
}

.t-p135 {
  padding-top: 216px !important;
}

.r-p135 {
  padding-right: 216px !important;
}

.b-p135 {
  padding-bottom: 216px !important;
}

.l-p135 {
  padding-left: 216px !important;
}

.h-p135 {
  padding-top: 216px !important;
  padding-bottom: 216px !important;
}

.w-p135 {
  padding-left: 216px !important;
  padding-right: 216px !important;
}

.m-135 {
  margin: -216px !important;
}

.t-m-135 {
  margin-top: -216px !important;
}

.r-m-135 {
  margin-right: -216px !important;
}

.b-m-135 {
  margin-bottom: -216px !important;
}

.l-m-135 {
  margin-left: -216px !important;
}

.m140 {
  margin: 224px !important;
}

.t-m140 {
  margin-top: 224px !important;
}

.r-m140 {
  margin-right: 224px !important;
}

.b-m140 {
  margin-bottom: 224px !important;
}

.l-m140 {
  margin-left: 224px !important;
}

.h-m140 {
  margin-top: 224px !important;
  margin-bottom: 224px !important;
}

.w-m140 {
  margin-left: 224px !important;
  margin-right: 224px !important;
}

.p140 {
  padding: 224px !important;
}

.t-p140 {
  padding-top: 224px !important;
}

.r-p140 {
  padding-right: 224px !important;
}

.b-p140 {
  padding-bottom: 224px !important;
}

.l-p140 {
  padding-left: 224px !important;
}

.h-p140 {
  padding-top: 224px !important;
  padding-bottom: 224px !important;
}

.w-p140 {
  padding-left: 224px !important;
  padding-right: 224px !important;
}

.m-140 {
  margin: -224px !important;
}

.t-m-140 {
  margin-top: -224px !important;
}

.r-m-140 {
  margin-right: -224px !important;
}

.b-m-140 {
  margin-bottom: -224px !important;
}

.l-m-140 {
  margin-left: -224px !important;
}

.m145 {
  margin: 232px !important;
}

.t-m145 {
  margin-top: 232px !important;
}

.r-m145 {
  margin-right: 232px !important;
}

.b-m145 {
  margin-bottom: 232px !important;
}

.l-m145 {
  margin-left: 232px !important;
}

.h-m145 {
  margin-top: 232px !important;
  margin-bottom: 232px !important;
}

.w-m145 {
  margin-left: 232px !important;
  margin-right: 232px !important;
}

.p145 {
  padding: 232px !important;
}

.t-p145 {
  padding-top: 232px !important;
}

.r-p145 {
  padding-right: 232px !important;
}

.b-p145 {
  padding-bottom: 232px !important;
}

.l-p145 {
  padding-left: 232px !important;
}

.h-p145 {
  padding-top: 232px !important;
  padding-bottom: 232px !important;
}

.w-p145 {
  padding-left: 232px !important;
  padding-right: 232px !important;
}

.m-145 {
  margin: -232px !important;
}

.t-m-145 {
  margin-top: -232px !important;
}

.r-m-145 {
  margin-right: -232px !important;
}

.b-m-145 {
  margin-bottom: -232px !important;
}

.l-m-145 {
  margin-left: -232px !important;
}

.m150 {
  margin: 240px !important;
}

.t-m150 {
  margin-top: 240px !important;
}

.r-m150 {
  margin-right: 240px !important;
}

.b-m150 {
  margin-bottom: 240px !important;
}

.l-m150 {
  margin-left: 240px !important;
}

.h-m150 {
  margin-top: 240px !important;
  margin-bottom: 240px !important;
}

.w-m150 {
  margin-left: 240px !important;
  margin-right: 240px !important;
}

.p150 {
  padding: 240px !important;
}

.t-p150 {
  padding-top: 240px !important;
}

.r-p150 {
  padding-right: 240px !important;
}

.b-p150 {
  padding-bottom: 240px !important;
}

.l-p150 {
  padding-left: 240px !important;
}

.h-p150 {
  padding-top: 240px !important;
  padding-bottom: 240px !important;
}

.w-p150 {
  padding-left: 240px !important;
  padding-right: 240px !important;
}

.m-150 {
  margin: -240px !important;
}

.t-m-150 {
  margin-top: -240px !important;
}

.r-m-150 {
  margin-right: -240px !important;
}

.b-m-150 {
  margin-bottom: -240px !important;
}

.l-m-150 {
  margin-left: -240px !important;
}

.m155 {
  margin: 248px !important;
}

.t-m155 {
  margin-top: 248px !important;
}

.r-m155 {
  margin-right: 248px !important;
}

.b-m155 {
  margin-bottom: 248px !important;
}

.l-m155 {
  margin-left: 248px !important;
}

.h-m155 {
  margin-top: 248px !important;
  margin-bottom: 248px !important;
}

.w-m155 {
  margin-left: 248px !important;
  margin-right: 248px !important;
}

.p155 {
  padding: 248px !important;
}

.t-p155 {
  padding-top: 248px !important;
}

.r-p155 {
  padding-right: 248px !important;
}

.b-p155 {
  padding-bottom: 248px !important;
}

.l-p155 {
  padding-left: 248px !important;
}

.h-p155 {
  padding-top: 248px !important;
  padding-bottom: 248px !important;
}

.w-p155 {
  padding-left: 248px !important;
  padding-right: 248px !important;
}

.m-155 {
  margin: -248px !important;
}

.t-m-155 {
  margin-top: -248px !important;
}

.r-m-155 {
  margin-right: -248px !important;
}

.b-m-155 {
  margin-bottom: -248px !important;
}

.l-m-155 {
  margin-left: -248px !important;
}

.m160 {
  margin: 256px !important;
}

.t-m160 {
  margin-top: 256px !important;
}

.r-m160 {
  margin-right: 256px !important;
}

.b-m160 {
  margin-bottom: 256px !important;
}

.l-m160 {
  margin-left: 256px !important;
}

.h-m160 {
  margin-top: 256px !important;
  margin-bottom: 256px !important;
}

.w-m160 {
  margin-left: 256px !important;
  margin-right: 256px !important;
}

.p160 {
  padding: 256px !important;
}

.t-p160 {
  padding-top: 256px !important;
}

.r-p160 {
  padding-right: 256px !important;
}

.b-p160 {
  padding-bottom: 256px !important;
}

.l-p160 {
  padding-left: 256px !important;
}

.h-p160 {
  padding-top: 256px !important;
  padding-bottom: 256px !important;
}

.w-p160 {
  padding-left: 256px !important;
  padding-right: 256px !important;
}

.m-160 {
  margin: -256px !important;
}

.t-m-160 {
  margin-top: -256px !important;
}

.r-m-160 {
  margin-right: -256px !important;
}

.b-m-160 {
  margin-bottom: -256px !important;
}

.l-m-160 {
  margin-left: -256px !important;
}

.m165 {
  margin: 264px !important;
}

.t-m165 {
  margin-top: 264px !important;
}

.r-m165 {
  margin-right: 264px !important;
}

.b-m165 {
  margin-bottom: 264px !important;
}

.l-m165 {
  margin-left: 264px !important;
}

.h-m165 {
  margin-top: 264px !important;
  margin-bottom: 264px !important;
}

.w-m165 {
  margin-left: 264px !important;
  margin-right: 264px !important;
}

.p165 {
  padding: 264px !important;
}

.t-p165 {
  padding-top: 264px !important;
}

.r-p165 {
  padding-right: 264px !important;
}

.b-p165 {
  padding-bottom: 264px !important;
}

.l-p165 {
  padding-left: 264px !important;
}

.h-p165 {
  padding-top: 264px !important;
  padding-bottom: 264px !important;
}

.w-p165 {
  padding-left: 264px !important;
  padding-right: 264px !important;
}

.m-165 {
  margin: -264px !important;
}

.t-m-165 {
  margin-top: -264px !important;
}

.r-m-165 {
  margin-right: -264px !important;
}

.b-m-165 {
  margin-bottom: -264px !important;
}

.l-m-165 {
  margin-left: -264px !important;
}

.m170 {
  margin: 272px !important;
}

.t-m170 {
  margin-top: 272px !important;
}

.r-m170 {
  margin-right: 272px !important;
}

.b-m170 {
  margin-bottom: 272px !important;
}

.l-m170 {
  margin-left: 272px !important;
}

.h-m170 {
  margin-top: 272px !important;
  margin-bottom: 272px !important;
}

.w-m170 {
  margin-left: 272px !important;
  margin-right: 272px !important;
}

.p170 {
  padding: 272px !important;
}

.t-p170 {
  padding-top: 272px !important;
}

.r-p170 {
  padding-right: 272px !important;
}

.b-p170 {
  padding-bottom: 272px !important;
}

.l-p170 {
  padding-left: 272px !important;
}

.h-p170 {
  padding-top: 272px !important;
  padding-bottom: 272px !important;
}

.w-p170 {
  padding-left: 272px !important;
  padding-right: 272px !important;
}

.m-170 {
  margin: -272px !important;
}

.t-m-170 {
  margin-top: -272px !important;
}

.r-m-170 {
  margin-right: -272px !important;
}

.b-m-170 {
  margin-bottom: -272px !important;
}

.l-m-170 {
  margin-left: -272px !important;
}

.m175 {
  margin: 280px !important;
}

.t-m175 {
  margin-top: 280px !important;
}

.r-m175 {
  margin-right: 280px !important;
}

.b-m175 {
  margin-bottom: 280px !important;
}

.l-m175 {
  margin-left: 280px !important;
}

.h-m175 {
  margin-top: 280px !important;
  margin-bottom: 280px !important;
}

.w-m175 {
  margin-left: 280px !important;
  margin-right: 280px !important;
}

.p175 {
  padding: 280px !important;
}

.t-p175 {
  padding-top: 280px !important;
}

.r-p175 {
  padding-right: 280px !important;
}

.b-p175 {
  padding-bottom: 280px !important;
}

.l-p175 {
  padding-left: 280px !important;
}

.h-p175 {
  padding-top: 280px !important;
  padding-bottom: 280px !important;
}

.w-p175 {
  padding-left: 280px !important;
  padding-right: 280px !important;
}

.m-175 {
  margin: -280px !important;
}

.t-m-175 {
  margin-top: -280px !important;
}

.r-m-175 {
  margin-right: -280px !important;
}

.b-m-175 {
  margin-bottom: -280px !important;
}

.l-m-175 {
  margin-left: -280px !important;
}

.m180 {
  margin: 288px !important;
}

.t-m180 {
  margin-top: 288px !important;
}

.r-m180 {
  margin-right: 288px !important;
}

.b-m180 {
  margin-bottom: 288px !important;
}

.l-m180 {
  margin-left: 288px !important;
}

.h-m180 {
  margin-top: 288px !important;
  margin-bottom: 288px !important;
}

.w-m180 {
  margin-left: 288px !important;
  margin-right: 288px !important;
}

.p180 {
  padding: 288px !important;
}

.t-p180 {
  padding-top: 288px !important;
}

.r-p180 {
  padding-right: 288px !important;
}

.b-p180 {
  padding-bottom: 288px !important;
}

.l-p180 {
  padding-left: 288px !important;
}

.h-p180 {
  padding-top: 288px !important;
  padding-bottom: 288px !important;
}

.w-p180 {
  padding-left: 288px !important;
  padding-right: 288px !important;
}

.m-180 {
  margin: -288px !important;
}

.t-m-180 {
  margin-top: -288px !important;
}

.r-m-180 {
  margin-right: -288px !important;
}

.b-m-180 {
  margin-bottom: -288px !important;
}

.l-m-180 {
  margin-left: -288px !important;
}

.m185 {
  margin: 296px !important;
}

.t-m185 {
  margin-top: 296px !important;
}

.r-m185 {
  margin-right: 296px !important;
}

.b-m185 {
  margin-bottom: 296px !important;
}

.l-m185 {
  margin-left: 296px !important;
}

.h-m185 {
  margin-top: 296px !important;
  margin-bottom: 296px !important;
}

.w-m185 {
  margin-left: 296px !important;
  margin-right: 296px !important;
}

.p185 {
  padding: 296px !important;
}

.t-p185 {
  padding-top: 296px !important;
}

.r-p185 {
  padding-right: 296px !important;
}

.b-p185 {
  padding-bottom: 296px !important;
}

.l-p185 {
  padding-left: 296px !important;
}

.h-p185 {
  padding-top: 296px !important;
  padding-bottom: 296px !important;
}

.w-p185 {
  padding-left: 296px !important;
  padding-right: 296px !important;
}

.m-185 {
  margin: -296px !important;
}

.t-m-185 {
  margin-top: -296px !important;
}

.r-m-185 {
  margin-right: -296px !important;
}

.b-m-185 {
  margin-bottom: -296px !important;
}

.l-m-185 {
  margin-left: -296px !important;
}

.m190 {
  margin: 304px !important;
}

.t-m190 {
  margin-top: 304px !important;
}

.r-m190 {
  margin-right: 304px !important;
}

.b-m190 {
  margin-bottom: 304px !important;
}

.l-m190 {
  margin-left: 304px !important;
}

.h-m190 {
  margin-top: 304px !important;
  margin-bottom: 304px !important;
}

.w-m190 {
  margin-left: 304px !important;
  margin-right: 304px !important;
}

.p190 {
  padding: 304px !important;
}

.t-p190 {
  padding-top: 304px !important;
}

.r-p190 {
  padding-right: 304px !important;
}

.b-p190 {
  padding-bottom: 304px !important;
}

.l-p190 {
  padding-left: 304px !important;
}

.h-p190 {
  padding-top: 304px !important;
  padding-bottom: 304px !important;
}

.w-p190 {
  padding-left: 304px !important;
  padding-right: 304px !important;
}

.m-190 {
  margin: -304px !important;
}

.t-m-190 {
  margin-top: -304px !important;
}

.r-m-190 {
  margin-right: -304px !important;
}

.b-m-190 {
  margin-bottom: -304px !important;
}

.l-m-190 {
  margin-left: -304px !important;
}

.m195 {
  margin: 312px !important;
}

.t-m195 {
  margin-top: 312px !important;
}

.r-m195 {
  margin-right: 312px !important;
}

.b-m195 {
  margin-bottom: 312px !important;
}

.l-m195 {
  margin-left: 312px !important;
}

.h-m195 {
  margin-top: 312px !important;
  margin-bottom: 312px !important;
}

.w-m195 {
  margin-left: 312px !important;
  margin-right: 312px !important;
}

.p195 {
  padding: 312px !important;
}

.t-p195 {
  padding-top: 312px !important;
}

.r-p195 {
  padding-right: 312px !important;
}

.b-p195 {
  padding-bottom: 312px !important;
}

.l-p195 {
  padding-left: 312px !important;
}

.h-p195 {
  padding-top: 312px !important;
  padding-bottom: 312px !important;
}

.w-p195 {
  padding-left: 312px !important;
  padding-right: 312px !important;
}

.m-195 {
  margin: -312px !important;
}

.t-m-195 {
  margin-top: -312px !important;
}

.r-m-195 {
  margin-right: -312px !important;
}

.b-m-195 {
  margin-bottom: -312px !important;
}

.l-m-195 {
  margin-left: -312px !important;
}

.m200 {
  margin: 320px !important;
}

.t-m200 {
  margin-top: 320px !important;
}

.r-m200 {
  margin-right: 320px !important;
}

.b-m200 {
  margin-bottom: 320px !important;
}

.l-m200 {
  margin-left: 320px !important;
}

.h-m200 {
  margin-top: 320px !important;
  margin-bottom: 320px !important;
}

.w-m200 {
  margin-left: 320px !important;
  margin-right: 320px !important;
}

.p200 {
  padding: 320px !important;
}

.t-p200 {
  padding-top: 320px !important;
}

.r-p200 {
  padding-right: 320px !important;
}

.b-p200 {
  padding-bottom: 320px !important;
}

.l-p200 {
  padding-left: 320px !important;
}

.h-p200 {
  padding-top: 320px !important;
  padding-bottom: 320px !important;
}

.w-p200 {
  padding-left: 320px !important;
  padding-right: 320px !important;
}

.m-200 {
  margin: -320px !important;
}

.t-m-200 {
  margin-top: -320px !important;
}

.r-m-200 {
  margin-right: -320px !important;
}

.b-m-200 {
  margin-bottom: -320px !important;
}

.l-m-200 {
  margin-left: -320px !important;
}

.base_color {
  color: #073829 !important;
}
.base_color.bar {
  border-bottom: 1px solid #aaa;
  margin-bottom: 10px;
}

.sub_color {
  color: #68482A !important;
}
.sub_color.bar {
  border-bottom: 1px solid #aaa;
  margin-bottom: 10px;
}

.colorbase {
  color: #073829 !important;
}

.orange {
  color: #ff6a49 !important;
}

.gray {
  color: #dddddd !important;
}

.red {
  color: #d81e1e !important;
}

.blue {
  color: #0083de !important;
}

.brown {
  color: #3a200c !important;
}

.green {
  color: #1fa33a !important;
}

.white {
  color: #fff !important;
}
.white a {
  color: #fff;
  border-color: #fff;
}
.white a:hover {
  opacity: 0.6;
}

.pink {
  color: #ff9da4 !important;
}

.black {
  color: #363636 !important;
}

.yellow {
  color: #ffff59 !important;
}

.gold {
  color: #c3a349 !important;
}

.f-s10 {
  font-size: 1rem !important;
}

.f-s11 {
  font-size: 1.1rem !important;
}

.f-s12 {
  font-size: 1.2rem !important;
}

.f-s13 {
  font-size: 1.3rem !important;
}

.f-s14 {
  font-size: 1.4rem !important;
}

.f-s15 {
  font-size: 1.5rem !important;
}

.f-s16 {
  font-size: 1.6rem !important;
}

.f-s17 {
  font-size: 1.7rem !important;
}

.f-s18 {
  font-size: 1.8rem !important;
}

.f-s19 {
  font-size: 1.9rem !important;
}

.f-s20 {
  font-size: 2rem !important;
}

.f-s22 {
  font-size: 2.2rem !important;
}

.f-s24 {
  font-size: 2.4rem !important;
}

.marker_c {
  background: linear-gradient(transparent 70%, #a8d8fa 0%);
  z-index: 0;
}

.marker_m {
  background: linear-gradient(transparent 70%, #ff7c81 0%);
  z-index: 0;
}

.marker_y {
  background: linear-gradient(transparent 70%, #fef36c 0%);
  z-index: 0;
}

.marker_k {
  background: linear-gradient(transparent 70%, #cccccc 0%);
  z-index: 0;
}

.marker_p {
  background: linear-gradient(transparent 70%, #ffd0e1 0%);
  z-index: 0;
}

.marker_w {
  background: linear-gradient(transparent 5%, #fff 0%);
  z-index: 0;
}

.frame_wrap {
  position: relative;
}
.frame_wrap:before {
  border: 2px solid #073829;
  content: "";
  position: absolute;
  width: 95%;
  height: 94%;
  margin: auto;
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
  z-index: 1;
}
.frame_wrap.sub:before {
  border: 2px solid #073829;
}
@media all and (max-width: 1100px) {
  .frame_wrap:before {
    border: 0px solid #073829;
  }
}

hr {
  clear: both;
  border: 0;
  height: 0;
  border-top: 1px solid rgba(0, 0, 0, 0.1);
  border-bottom: 1px solid rgba(255, 255, 255, 0.3);
}

.scrollbar {
  min-height: 100px;
  max-height: 376px;
  overflow-y: scroll;
  overflow-x: hidden;
}
@media all and (max-width: 639px) {
  .scrollbar {
    max-height: 340px;
  }
}
.scrollbar.policy-box {
  max-height: 300px;
}
.scrollbar::-webkit-scrollbar {
  overflow: hidden;
  width: 1px;
  background: #fafafa;
}
.scrollbar::-webkit-scrollbar:horizontal {
  height: 1px;
}
.scrollbar::-webkit-scrollbar-button {
  display: none;
}
.scrollbar::-webkit-scrollbar-piece {
  background: #eee;
}
.scrollbar::-webkit-scrollbar-piece:start {
  background: #eee;
}
.scrollbar::-webkit-scrollbar-thumb, .scrollbar::-webkit-scrollbar-corner {
  background: #333;
}

.gmapbox {
  padding: 40px;
  background-color: rgba(7, 56, 41, 0.2);
}
.gmapbox.type_r {
  border-radius: 10px;
}
.gmapbox.sub {
  background-color: rgba(104, 72, 42, 0.2);
}
@media all and (max-width: 639px) {
  .gmapbox {
    padding: 20px;
  }
}

.ggmap {
  position: relative;
  padding-bottom: 40%;
  height: 0;
  overflow: hidden;
}
@media all and (max-width: 639px) {
  .ggmap {
    padding-bottom: 50%;
    height: 0;
  }
}
.ggmap iframe,
.ggmap object,
.ggmap embed {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
}

.g-ttl {
  background-color: #073829;
  color: #fff;
  padding: 5px 10px;
  font-size: 1.8rem;
}
@media all and (max-width: 639px) {
  .g-ttl {
    font-size: 1.3rem;
  }
}

.g-txt {
  margin-bottom: 20px;
}
@media all and (max-width: 639px) {
  .g-txt {
    font-size: 1rem;
    margin-top: 10px;
    margin-bottom: 15px;
  }
}

.point_box01 {
  padding-bottom: 60px;
}
.point_box01.contain li figure {
  height: 300px;
}
.point_box01.contain li figure img {
  -o-object-fit: contain;
     object-fit: contain;
}
@media all and (max-width: 639px) {
  .point_box01.contain li figure {
    height: 300px;
  }
}
.point_box01.contain li .txtbox {
  margin: 0px auto 0;
}
.point_box01.radius li {
  border-radius: 20px;
}
.point_box01.radius li figure {
  border-radius: 20px 20px 0 0;
}
.point_box01.radius li .txtbox {
  background: none;
}
.point_box01.rhombus {
  margin: 200px 0 0;
}
.point_box01.rhombus li {
  background-color: rgba(255, 255, 255, 0) !important;
}
.point_box01.rhombus li figure {
  width: 100%;
  height: 300px;
  margin: 0 auto;
  right: 0;
  left: 0;
  transform: skewY(20.25deg);
  transform-origin: top right;
  -webkit-transform: skewY(20.25deg);
  -webkit-transform-origin: top right;
}
.point_box01.rhombus li figure img {
  position: absolute;
  top: -60%;
  height: 160%;
  transform: skewY(-20.25deg);
  transform-origin: top right;
  -webkit-transform: skewY(-20.25deg);
  -webkit-transform-origin: top right;
}
.point_box01.rhombus li .txtbox {
  background: none;
}
.point_box01.rhombus li:nth-child(2n) figure {
  top: -133px;
  transform: skewY(-20.25deg);
  transform-origin: bottom right;
  -webkit-transform: skewY(-20.25deg);
  -webkit-transform-origin: bottom right;
}
@media screen and (max-width: 1189px) {
  .point_box01.rhombus li:nth-child(2n) figure {
    top: -11vw;
  }
}
.point_box01.rhombus li:nth-child(2n) figure img {
  position: absolute;
  top: 0%;
  height: 156%;
  transform: skewY(20.25deg);
  transform-origin: bottom right;
  -webkit-transform: skewY(20.25deg);
  -webkit-transform-origin: bottom right;
}
@media all and (max-width: 639px) {
  .point_box01.rhombus {
    margin: 140px 0 0;
  }
  .point_box01.rhombus li figure {
    width: 100%;
    height: 200px;
  }
  .point_box01.rhombus li figure img {
    top: -62%;
    height: 162%;
  }
  .point_box01.rhombus li:nth-child(2n) figure img {
    height: 162%;
  }
  .point_box01.rhombus li:nth-child(2n) .txtbox {
    margin: 25px auto 49px;
  }
}
.point_box01.type1 li figure {
  height: 500px;
}
@media all and (max-width: 639px) {
  .point_box01.type1 li figure {
    height: 300px;
  }
}
.point_box01.type1 li .txtbox {
  position: relative;
  margin: -180px auto 0;
  padding: 40px 80px 80px;
  width: 95%;
  max-width: 1180px;
  background-color: white;
}
@media all and (max-width: 1100px) {
  .point_box01.type1 li .txtbox {
    width: 90%;
  }
}
@media all and (max-width: 639px) {
  .point_box01.type1 li .txtbox {
    width: 90%;
    padding: 20px 10px 0px;
  }
}
.point_box01 li {
  position: relative;
  width: 100%;
  background-color: white;
}
.point_box01 li > a {
  position: absolute;
  width: 100%;
  height: 100%;
  top: 0;
  left: 0;
  z-index: 1;
}
.point_box01 li > a:hover {
  background-color: rgba(255, 255, 255, 0.4);
}
.point_box01 li figure {
  width: 100%;
  height: 16vw;
  overflow: hidden;
  position: relative;
}
@media all and (max-width: 639px) {
  .point_box01 li figure {
    height: 50vw;
  }
}
.point_box01 li figure img {
  width: 100%;
  height: 100%;
  -o-object-fit: cover;
     object-fit: cover;
}
.point_box01 li .txtbox {
  position: relative;
  margin: -60px auto 0;
  width: 90%;
  background-color: #fff;
  padding: 20px 30px 30px;
}
@media all and (max-width: 639px) {
  .point_box01 li .txtbox {
    padding: 20px 10px 30px;
  }
}
.point_box01 li .txtbox > .num {
  font-size: 2.8rem;
  line-height: 1;
  font-family: "Josefin Sans", sans-serif;
  border-radius: 50%;
  border: 1px solid #073829;
  color: #073829;
  width: 70px;
  height: 70px;
  display: flex;
  align-items: center;
  justify-content: center;
  flex-direction: column;
  background-color: #fff;
  margin: 0 auto 15px;
}
.point_box01 li .txtbox > .num span {
  font-size: 50%;
}
.point_box01 li .txtbox .ttl {
  font-size: 1.8rem;
  font-weight: bold;
  text-align: center;
  margin: 15px auto 35px;
  position: relative;
  color: #073829;
}
.point_box01 li .txtbox .ttl:before {
  content: "";
  position: absolute;
  width: 50px;
  height: 3px;
  background-color: #073829;
  bottom: -20px;
  left: 0;
  right: 0;
  margin: 0 auto;
}
.point_box01 li .txtbox .more {
  position: relative;
  bottom: 120px;
  right: 0;
  left: 0;
  width: auto;
  margin: 0 auto;
}

#caption {
  width: 100%;
  height: 100vh;
  display: block;
  z-index: 999;
}

.caption {
  position: relative;
  margin: 0 auto 10% auto;
  padding: 0 30px;
  max-width: 1600px;
  width: 100%;
}
.caption figure {
  position: relative;
  left: 0;
  top: 0;
  width: 80%;
  height: 500px;
  line-height: 0;
}
.caption figure img {
  width: 100%;
  height: 100%;
  -o-object-fit: cover;
     object-fit: cover;
}
@media all and (max-width: 896px) {
  .caption figure {
    height: 300px;
  }
}
@media all and (max-width: 639px) {
  .caption figure {
    height: 250px;
  }
}
.caption:nth-child(2n) figure {
  left: auto;
  right: 0%;
  margin-left: auto;
}
.caption .box {
  position: absolute;
  top: 30%;
  right: 30px;
  width: 600px;
  background: rgba(255, 255, 255, 0.9);
  padding: 50px;
  margin-left: auto;
}
.caption .box.type1 {
  top: 10%;
  width: 400px;
}
.caption .box.type2 {
  top: 10%;
  width: 100%;
  max-width: 800px;
}
.caption.reverse {
  right: inherit;
  margin-right: auto;
}
.caption.reverse figure {
  left: auto;
  right: 0%;
  margin-left: auto;
}
.caption:nth-child(2n) .box {
  right: inherit;
  margin-right: auto;
}
@media all and (max-width: 896px) {
  .caption {
    padding: 0;
  }
  .caption:nth-child(2n) figure {
    left: 0;
  }
  .caption figure {
    width: 100%;
  }
  .caption .box, .caption:nth-child(2n) .box {
    position: relative;
    top: 0;
    left: 0;
    right: inherit;
    padding: 20px;
    margin-right: 0;
  }
  .caption .box {
    margin-top: -100px;
    width: 90%;
    margin-right: 0;
  }
}

.caption02 {
  position: relative;
  margin: 0 auto 10% auto;
  padding: 0 30px;
  max-width: 1600px;
  width: 100%;
}
.caption02 figure {
  position: relative;
  left: 0;
  top: 0;
  width: 80%;
  height: 600px;
  line-height: 0;
  left: auto;
  right: 0%;
  margin-left: auto;
}
.caption02 figure img {
  width: 100%;
  height: 100%;
  -o-object-fit: cover;
     object-fit: cover;
}
@media all and (max-width: 896px) {
  .caption02 figure {
    height: 300px;
  }
}
@media all and (max-width: 639px) {
  .caption02 figure {
    height: 250px;
  }
}
.caption02:nth-child(2n) figure {
  right: auto;
  left: 0%;
  margin-right: auto;
  margin-left: 0;
}
.caption02 .box {
  position: absolute;
  top: -13%;
  width: 700px;
  background: #0a4f3a;
  padding: 120px 50px;
  right: inherit;
  margin-right: auto;
  z-index: 1;
  color: #fff;
}
.caption02 .box.type1 {
  top: 10%;
  width: 400px;
}
@media all and (max-width: 1100px) {
  .caption02 .box {
    padding: 60px 20px;
    width: 600px;
  }
}
.caption02:nth-child(2n) .box {
  right: 30px;
  margin-left: auto;
}
@media all and (max-width: 896px) {
  .caption02 {
    padding: 0;
  }
  .caption02:nth-child(2n) figure {
    left: 0;
  }
  .caption02 figure {
    width: 100%;
  }
  .caption02 .box, .caption02:nth-child(2n) .box {
    position: relative;
    top: 0;
    left: 0;
    right: inherit;
    padding: 20px 10px;
    margin-right: 0;
  }
  .caption02 .box {
    margin-top: -100px;
    width: 95%;
    margin-right: 0;
  }
}

.concept-list2 {
  width: 100%;
  margin: 0 auto;
  position: relative;
}
@media all and (max-width: 639px) {
  .concept-list2 {
    margin: 40px auto;
  }
}
.concept-list2 li {
  padding: 0 20px;
}
.concept-list2 li figure img {
  width: 100%;
  height: 450px;
  -o-object-fit: cover;
     object-fit: cover;
}
@media all and (max-width: 639px) {
  .concept-list2 li figure img {
    width: 90%;
    height: auto;
    margin: 0 auto;
    display: block;
    -o-object-fit: contain;
       object-fit: contain;
  }
}
@media all and (max-width: 639px) {
  .concept-list2 li {
    padding: 0 0px 0px;
  }
}
@media all and (max-width: 639px) {
  .concept-list2 li:last-child {
    padding: 60px 0px 0px;
  }
}
.concept-list2 li:nth-child(even) .mtext_top::first-letter {
  color: #333;
}
.concept-list2.type1 li {
  padding: 0 20px;
}
@media all and (max-width: 639px) {
  .concept-list2.type1 li {
    padding: 0 0px 0px;
  }
}
@media all and (max-width: 639px) {
  .concept-list2.type1 li:last-child {
    padding: 60px 0px 0px;
  }
}
.concept-list2.type1 li:nth-child(even) .mtext_top::first-letter {
  color: #333;
}
.concept-list2.type1 li:nth-child(even) .mtext_top,
.concept-list2.type1 li:nth-child(even) .list-txt {
  color: #333;
}
.concept-list2.type1:before {
  content: "";
  position: absolute;
  background-color: rgba(7, 56, 41, 0);
  background-position: center center;
  background-size: cover;
  top: 30%;
  bottom: 0;
  right: 0;
  width: 50%;
  height: 80%;
  z-index: -1;
}
.concept-list2.type1:after {
  content: "";
  position: absolute;
  background-color: rgba(7, 56, 41, 0);
  background-position: center center;
  background-size: cover;
  top: 30%;
  bottom: 0;
  left: 0;
  width: 50%;
  height: 80%;
  z-index: -1;
}
.concept-list2:before {
  content: "";
  position: absolute;
  background-color: rgba(104, 72, 42, 0.2);
  background-position: center center;
  background-size: cover;
  top: 30%;
  bottom: 0;
  right: 0;
  width: 50%;
  height: 80%;
  z-index: -1;
}
.concept-list2:after {
  content: "";
  position: absolute;
  background-color: #eee;
  background-position: center center;
  background-size: cover;
  top: 30%;
  bottom: 0;
  left: 0;
  width: 50%;
  height: 80%;
  z-index: -1;
}
@media all and (max-width: 639px) {
  .concept-list2:before {
    content: "";
    position: absolute;
    background-position: center center;
    background-size: cover;
    top: 50%;
    bottom: 0;
    right: 0;
    width: 100%;
    height: 50%;
    z-index: -1;
  }
  .concept-list2:after {
    content: "";
    position: absolute;
    background-position: center center;
    background-size: cover;
    top: 0;
    bottom: 50%;
    left: 0;
    width: 100%;
    height: 50%;
    z-index: -1;
  }
}
@media all and (max-width: 639px) {
  .concept-list2 {
    width: 90%;
    margin: 50px auto;
  }
}
.concept-list2 li {
  position: relative;
}
.concept-list2 li .list-ttlbox .mtitle_circle {
  position: absolute;
  top: -80px;
  left: 0;
  right: 0;
}
@media all and (max-width: 639px) {
  .concept-list2 li .list-ttlbox .mtitle_circle {
    position: relative;
    top: 10px;
    margin: 0px auto 30px;
    left: 0;
    right: 0;
  }
}
.concept-list2 .list-ttlbox {
  position: relative;
}
.concept-list2 .list-numbox {
  position: absolute;
  top: -20px;
  left: 20px;
}
.concept-list2 .list-num {
  font-size: 5rem;
  line-height: 5rem;
  font-weight: 300;
  position: relative;
  z-index: 1;
  color: #fff;
  padding: 15px 20px;
  background-color: #68482A;
}
@media all and (max-width: 639px) {
  .concept-list2 .list-num {
    font-size: 3rem;
    line-height: 3rem;
  }
}
.concept-list2 .list-ttlbox {
  text-align: center;
  padding: 20px;
  position: relative;
}
.concept-list2 .list-ttl {
  font-size: 2.4rem;
  color: #333;
  margin-bottom: 20px;
  text-shadow: 0px 0px 5px rgba(255, 255, 247, 0.6), 0px 0px 5px rgba(255, 255, 247, 0.6), 0px 0px 10px rgba(255, 255, 247, 0.6), 0px 0px 10px rgba(255, 255, 247, 0.6), 0px 0px 15px rgba(255, 255, 247, 0.6), 0px 0px 15px rgba(255, 255, 247, 0.6);
  position: relative;
}
.concept-list2 .list-ttl.num1:before {
  position: absolute;
  content: "";
  width: 80%;
  height: 15px;
  background-color: rgba(255, 255, 89, 0.5);
  left: 0;
  right: 0;
  margin: 0 auto;
  bottom: 2px;
  z-index: -1;
}
.concept-list2 .list-ttl.num2:before {
  position: absolute;
  content: "";
  width: 80%;
  height: 15px;
  background-color: rgba(255, 106, 73, 0.5);
  left: 0;
  right: 0;
  margin: 0 auto;
  bottom: 2px;
  z-index: -1;
}
.concept-list2 .list-ttl.num3:before {
  position: absolute;
  content: "";
  width: 80%;
  height: 15px;
  background-color: rgba(31, 163, 58, 0.5);
  left: 0;
  right: 0;
  margin: 0 auto;
  bottom: 2px;
  z-index: -1;
}
@media all and (max-width: 639px) {
  .concept-list2 .list-ttl {
    font-size: 1.6rem;
  }
}
.concept-list2 .list-txt {
  text-align: left;
}

.article01 {
  display: flex;
  position: relative;
  gap: 5% 5%;
  align-items: flex-start;
}
@media all and (max-width: 639px) {
  .article01.res_none {
    display: flex !important;
  }
  .article01.res_none figure {
    max-width: 30%;
  }
}
.article01.reverse {
  flex-direction: row-reverse;
}
.article01.j-center {
  justify-content: center;
}
.article01.a-start {
  align-items: flex-start;
}
.article01.a-center {
  align-items: center;
}
.article01 .figure {
  max-width: 45%;
  position: relative;
}
.article01 .figure.type1 {
  height: 50vw;
}
@media all and (max-width: 639px) {
  .article01 .figure.type1 {
    width: 100%;
    height: 400px;
    margin-top: 30px;
  }
}
.article01 .figure.type1 img {
  height: 100%;
  -o-object-fit: cover;
     object-fit: cover;
}
@media all and (max-width: 639px) {
  .article01 .figure.type2 {
    width: 100%;
    height: 400px;
    margin-top: 30px;
  }
}
.article01 .figure.type2 img {
  width: 100%;
  height: 100%;
  -o-object-fit: contain;
     object-fit: contain;
}
.article01 .figure.icon-list.type2 {
  width: 80%;
  height: 30vw;
}
@media all and (max-width: 639px) {
  .article01 .figure.icon-list.type2 {
    width: 100%;
    height: 400px;
    margin-top: 30px;
  }
}
.article01 .figure.icon-list.type2 img {
  height: 100%;
  -o-object-fit: cover;
     object-fit: cover;
}
.article01 .figure .photo01 {
  position: absolute;
  bottom: 12%;
  right: -10%;
  max-width: 35%;
  max-height: 16%;
  box-shadow: rgba(17, 17, 17, 0.1) 0 0 3px 3px;
  z-index: 2;
}
.article01 .figure .photo01 a {
  height: 220%;
}
.article01 .figure .photo01 img {
  width: 100%;
  height: 100%;
  -o-object-fit: cover;
     object-fit: cover;
}
.article01 .figure .photo02 {
  position: absolute;
  bottom: 12%;
  right: 30%;
  max-width: 35%;
  max-height: 16%;
  box-shadow: rgba(17, 17, 17, 0.1) 0 0 3px 3px;
  z-index: 3;
}
.article01 .figure .photo02 a {
  height: 220%;
}
.article01 .figure .photo02 img {
  width: 100%;
  height: 100%;
  -o-object-fit: cover;
     object-fit: cover;
}
.article01 figure {
  max-width: 45%;
  max-height: 25vw;
  position: relative;
  overflow: hidden;
}
.article01 figure img {
  width: 100%;
  height: 100%;
  -o-object-fit: cover;
     object-fit: cover;
}
.article01 figure figcaption {
  position: absolute;
  bottom: 0;
  left: 0;
  padding: 5px 10px;
  font-size: 1.2rem;
  text-align: left;
  background-color: rgba(7, 56, 41, 0.8);
  color: #fff;
  font-weight: bold;
  padding: 6px;
  max-width: 400px;
}
.article01 .txtarea {
  flex: 1;
}
.article01 .txtarea.type_s {
  max-width: 500px;
  margin: 0 auto;
}
@media all and (max-width: 639px) {
  .article01 .txtarea.type_s {
    padding: 40px 20px;
  }
}
@media all and (max-width: 639px) {
  .article01 {
    display: block;
  }
  .article01 .figure {
    max-width: 100%;
    margin: 0 auto 20px;
  }
  .article01 figure {
    margin: 0 auto;
    text-align: center;
    margin-bottom: 20px;
    max-width: 100%;
    max-height: 70vw;
  }
}
.article01.half {
  gap: 0% 0%;
}
.article01.half .figure,
.article01.half figure {
  max-width: 50%;
  width: 50%;
  height: 100%;
  max-height: 50vw;
}
.article01.half .txtarea {
  width: 50%;
  padding: 0px 100px;
}
@media all and (max-width: 1100px) {
  .article01.half .txtarea {
    padding: 0px 50px;
  }
}
@media all and (max-width: 896px) {
  .article01.half {
    display: block;
  }
  .article01.half .figure,
.article01.half figure {
    max-width: 100%;
    width: 100%;
    height: 100%;
    max-height: 60vw;
  }
  .article01.half .txtarea {
    width: 100%;
    padding: 30px 10px;
  }
}

.article02 {
  display: flex;
  position: relative;
  gap: 5% 10%;
  align-items: flex-start;
}
@media all and (max-width: 896px) {
  .article02.res_none {
    display: flex !important;
  }
  .article02.res_none figure {
    max-width: 100%;
  }
}
.article02 a {
  position: absolute;
  width: 100%;
  height: 100%;
  top: 0;
  left: 0;
  z-index: 1;
}
.article02 a:hover {
  background-color: rgba(255, 255, 255, 0.4);
}
.article02.reverse {
  flex-direction: row-reverse;
}
.article02.j-center {
  justify-content: center;
}
.article02.a-start {
  align-items: flex-start;
}
.article02.a-center {
  align-items: center;
}
.article02 .figure {
  max-width: 55%;
  position: relative;
}
.article02 .figure.type1 {
  height: 50vw;
}
@media all and (max-width: 896px) {
  .article02 .figure.type1 {
    width: 100%;
    height: 400px;
    margin-top: 30px;
  }
}
.article02 .figure.type1 img {
  height: 100%;
  -o-object-fit: cover;
     object-fit: cover;
}
.article02 .figure .photo01 {
  position: absolute;
  bottom: 12%;
  right: -10%;
  max-width: 35%;
  max-height: 16%;
  box-shadow: rgba(17, 17, 17, 0.1) 0 0 3px 3px;
  z-index: 2;
}
.article02 .figure .photo01 a {
  height: 220%;
}
.article02 .figure .photo01 img {
  width: 100%;
  height: 100%;
  -o-object-fit: cover;
     object-fit: cover;
}
.article02 .figure .photo02 {
  position: absolute;
  bottom: 12%;
  right: 30%;
  max-width: 35%;
  max-height: 16%;
  box-shadow: rgba(17, 17, 17, 0.1) 0 0 3px 3px;
  z-index: 3;
}
.article02 .figure .photo02 a {
  height: 220%;
}
.article02 .figure .photo02 img {
  width: 100%;
  height: 100%;
  -o-object-fit: cover;
     object-fit: cover;
}
.article02 figure {
  max-width: 55%;
  max-height: 30vw;
  position: relative;
  overflow: hidden;
}
@media all and (max-width: 896px) {
  .article02 figure {
    max-width: 80%;
  }
}
.article02 figure img {
  width: 100%;
  -o-object-fit: cover;
     object-fit: cover;
}
.article02 figure figcaption {
  position: absolute;
  bottom: 0;
  left: 0;
  padding: 5px 10px;
  font-size: 1.2rem;
  text-align: left;
  background-color: rgba(242, 242, 242, 0.8);
  color: #073829;
  padding: 6px;
  max-width: 400px;
}
.article02 .txtarea {
  position: absolute;
  width: 70%;
  right: 0;
  margin: 0 0 0 auto;
}
@media all and (max-width: 896px) {
  .article02 {
    display: block;
    margin-bottom: 40px;
  }
  .article02 .figure {
    max-width: 80%;
    margin: 0 auto 20px;
  }
  .article02 figure {
    margin: 0 auto;
    text-align: center;
    margin: 20px 0;
    width: 100%;
    max-width: 100%;
    max-height: 50vw;
  }
  .article02 .txtarea {
    position: absolute;
    width: 100%;
    max-width: 100%;
    right: 0;
    margin: 20px 0;
    padding: 20px 20px;
  }
}

.article_tbrl {
  display: flex;
  position: relative;
  gap: 5% 10%;
  align-items: flex-start;
}
.article_tbrl.type1 {
  position: relative;
}
.article_tbrl.type1:before {
  content: "";
  position: absolute;
  top: -200px;
  right: -600px;
  background-color: #e6e6e6;
  width: 800px;
  height: 800px;
  transform: rotate(45deg);
  z-index: -2;
}
@media all and (max-width: 639px) {
  .article_tbrl.type1:before {
    top: 15%;
    right: -120px;
    width: 200px;
    height: 200px;
  }
}
.article_tbrl.type1:after {
  content: "";
  position: absolute;
  top: 22%;
  left: -600px;
  background-color: #e6e6e6;
  width: 800px;
  height: 800px;
  transform: rotate(45deg);
  z-index: -2;
}
@media all and (max-width: 639px) {
  .article_tbrl.type1:after {
    top: inherit;
    bottom: -20%;
    left: -120px;
    width: 200px;
    height: 200px;
  }
}
.article_tbrl .figure {
  width: 68%;
  height: 43vw;
  position: relative;
}
.article_tbrl .figure img {
  width: 100%;
  height: 100%;
  -o-object-fit: cover;
     object-fit: cover;
}
.article_tbrl .txtbox {
  height: 42vw;
  width: 18%;
  -ms-writing-mode: tb-rl;
  writing-mode: vertical-rl;
}
@media all and (max-width: 1100px) {
  .article_tbrl .txtbox {
    width: 25%;
  }
}
@media all and (max-width: 639px) {
  .article_tbrl .txtbox {
    height: auto;
    width: 100%;
    -ms-writing-mode: horizontal-tb;
    writing-mode: horizontal-tb;
  }
}
.article_tbrl .txtbox .ttl {
  font-size: 4vw;
  color: #073829;
  position: relative;
  margin-top: -50px;
  z-index: 1;
  letter-spacing: 0;
}
.article_tbrl .txtbox .mtxt {
  font-size: 1.6vw;
  margin: 0;
  padding: 0 30px;
  font-weight: bold;
}
@media all and (max-width: 639px) {
  .article_tbrl {
    display: block;
  }
  .article_tbrl .figure,
.article_tbrl figure {
    max-width: 100%;
    width: 100%;
    height: 65vw;
    position: relative;
    margin: 0 auto 20px;
  }
  .article_tbrl .txtbox .ttl {
    font-size: 9vw;
    margin-top: 10px;
  }
  .article_tbrl .txtbox .mtxt {
    font-size: 1.8rem;
    padding: 0 0px 10px;
    font-weight: bold;
  }
}

.grid2,
.grid3,
.grid4,
.grid5,
.grid6 {
  display: grid;
  gap: 60px 60px;
}
.grid2.gap_none,
.grid3.gap_none,
.grid4.gap_none,
.grid5.gap_none,
.grid6.gap_none {
  gap: 0px 0px;
}
@media all and (max-width: 639px) {
  .grid2.gap_none,
.grid3.gap_none,
.grid4.gap_none,
.grid5.gap_none,
.grid6.gap_none {
    gap: 0px 0px;
  }
  .grid2.gap_none > li,
.grid2.gap_none .child,
.grid3.gap_none > li,
.grid3.gap_none .child,
.grid4.gap_none > li,
.grid4.gap_none .child,
.grid5.gap_none > li,
.grid5.gap_none .child,
.grid6.gap_none > li,
.grid6.gap_none .child {
    margin-bottom: 0px;
  }
}
.grid2.gap_small,
.grid3.gap_small,
.grid4.gap_small,
.grid5.gap_small,
.grid6.gap_small {
  gap: 10px 10px;
}
@media all and (max-width: 639px) {
  .grid2.gap_small,
.grid3.gap_small,
.grid4.gap_small,
.grid5.gap_small,
.grid6.gap_small {
    gap: 10px 10px;
  }
  .grid2.gap_small > li,
.grid2.gap_small .child,
.grid3.gap_small > li,
.grid3.gap_small .child,
.grid4.gap_small > li,
.grid4.gap_small .child,
.grid5.gap_small > li,
.grid5.gap_small .child,
.grid6.gap_small > li,
.grid6.gap_small .child {
    margin-bottom: 10px;
  }
}
.grid2.gap_middle,
.grid3.gap_middle,
.grid4.gap_middle,
.grid5.gap_middle,
.grid6.gap_middle {
  gap: 30px 30px;
}
@media all and (max-width: 639px) {
  .grid2.gap_middle,
.grid3.gap_middle,
.grid4.gap_middle,
.grid5.gap_middle,
.grid6.gap_middle {
    gap: 10px 10px;
  }
  .grid2.gap_middle > li,
.grid2.gap_middle .child,
.grid3.gap_middle > li,
.grid3.gap_middle .child,
.grid4.gap_middle > li,
.grid4.gap_middle .child,
.grid5.gap_middle > li,
.grid5.gap_middle .child,
.grid6.gap_middle > li,
.grid6.gap_middle .child {
    margin-bottom: 10px;
  }
}
.grid2.p-center,
.grid3.p-center,
.grid4.p-center,
.grid5.p-center,
.grid6.p-center {
  place-items: center;
}
.grid2.reverse,
.grid3.reverse,
.grid4.reverse,
.grid5.reverse,
.grid6.reverse {
  flex-direction: row-reverse;
}
.grid2.a-center,
.grid3.a-center,
.grid4.a-center,
.grid5.a-center,
.grid6.a-center {
  align-items: center;
}
.grid2.j-center,
.grid3.j-center,
.grid4.j-center,
.grid5.j-center,
.grid6.j-center {
  justify-content: center;
}
.grid2 > li,
.grid2 > .child,
.grid3 > li,
.grid3 > .child,
.grid4 > li,
.grid4 > .child,
.grid5 > li,
.grid5 > .child,
.grid6 > li,
.grid6 > .child {
  position: relative;
}
.grid2 > li .mtitle_circle,
.grid2 > .child .mtitle_circle,
.grid3 > li .mtitle_circle,
.grid3 > .child .mtitle_circle,
.grid4 > li .mtitle_circle,
.grid4 > .child .mtitle_circle,
.grid5 > li .mtitle_circle,
.grid5 > .child .mtitle_circle,
.grid6 > li .mtitle_circle,
.grid6 > .child .mtitle_circle {
  position: absolute;
  top: -20px;
  left: -20px;
}
@media all and (max-width: 896px) {
  .grid2 .res_none,
.grid3 .res_none,
.grid4 .res_none,
.grid5 .res_none,
.grid6 .res_none {
    display: grid !important;
  }
}
@media all and (max-width: 639px) {
  .grid2 .res_none,
.grid3 .res_none,
.grid4 .res_none,
.grid5 .res_none,
.grid6 .res_none {
    display: grid !important;
  }
}
@media all and (max-width: 896px) {
  .grid2,
.grid3,
.grid4,
.grid5,
.grid6 {
    gap: 30px 30px;
  }
}
@media all and (max-width: 639px) {
  .grid2,
.grid3,
.grid4,
.grid5,
.grid6 {
    gap: 10px 10px;
  }
  .grid2 > li,
.grid2 .child,
.grid3 > li,
.grid3 .child,
.grid4 > li,
.grid4 .child,
.grid5 > li,
.grid5 .child,
.grid6 > li,
.grid6 .child {
    margin-bottom: 20px;
  }
}

.grid2 {
  grid-template-columns: repeat(2, 1fr);
}
@media all and (max-width: 639px) {
  .grid2 {
    display: block;
  }
}
@media all and (max-width: 639px) {
  .grid2.sp2 {
    display: grid !important;
    grid-template-columns: repeat(2, 1fr);
  }
  .grid2.sp2 > li,
.grid2.sp2 .child {
    margin-bottom: 0px;
  }
}
@media all and (max-width: 639px) {
  .grid2.sp3 {
    display: grid !important;
    grid-template-columns: repeat(3, 1fr);
  }
}

.grid3 {
  grid-template-columns: repeat(3, 1fr);
}
@media all and (max-width: 896px) {
  .grid3 {
    display: block;
  }
  .grid3 > li,
.grid3 .child {
    margin-bottom: 20px;
  }
}
@media all and (max-width: 639px) {
  .grid3.sp2 {
    display: grid !important;
    grid-template-columns: repeat(2, 1fr);
  }
  .grid3.sp2 > li,
.grid3.sp2 .child {
    margin-bottom: 0px;
  }
}
@media all and (max-width: 639px) {
  .grid3.sp3 {
    display: grid !important;
    grid-template-columns: repeat(3, 1fr);
  }
}

.grid4 {
  grid-template-columns: repeat(4, 1fr);
}
@media all and (max-width: 896px) {
  .grid4 {
    grid-template-columns: repeat(2, 1fr);
  }
}
@media all and (max-width: 639px) {
  .grid4 {
    display: block;
  }
  .grid4 > li,
.grid4 .child {
    margin-bottom: 20px;
  }
}
@media all and (max-width: 639px) {
  .grid4.sp2 {
    display: grid !important;
    grid-template-columns: repeat(2, 1fr);
  }
  .grid4.sp2 > li,
.grid4.sp2 .child {
    margin-bottom: 0px;
  }
}
@media all and (max-width: 639px) {
  .grid4.sp3 {
    display: grid !important;
    grid-template-columns: repeat(3, 1fr);
  }
}

.grid5 {
  grid-template-columns: repeat(5, 1fr);
}
@media all and (max-width: 896px) {
  .grid5 {
    grid-template-columns: repeat(3, 1fr);
  }
}
@media all and (max-width: 639px) {
  .grid5 {
    display: block;
  }
}
@media all and (max-width: 639px) {
  .grid5.sp2 {
    display: grid !important;
    grid-template-columns: repeat(2, 1fr);
  }
  .grid5.sp2 > li,
.grid5.sp2 .child {
    margin-bottom: 0px;
  }
}
@media all and (max-width: 639px) {
  .grid5.sp3 {
    display: grid !important;
    grid-template-columns: repeat(3, 1fr);
  }
}

.grid6 {
  grid-template-columns: repeat(6, 1fr);
}
@media all and (max-width: 896px) {
  .grid6 {
    grid-template-columns: repeat(3, 1fr);
  }
}
@media all and (max-width: 639px) {
  .grid6 {
    display: block;
  }
}
@media all and (max-width: 639px) {
  .grid6.sp2 {
    display: grid !important;
    grid-template-columns: repeat(2, 1fr);
  }
}
@media all and (max-width: 639px) {
  .grid6.sp3 {
    display: grid !important;
    grid-template-columns: repeat(3, 1fr);
  }
}

.flex {
  display: flex;
  flex-wrap: wrap;
}
.flex.reverse {
  flex-direction: row-reverse;
}
.flex.gap {
  gap: 0px 30px;
}
@media all and (max-width: 639px) {
  .flex {
    display: block;
  }
}
.flex.w-100 {
  width: 100%;
}
.flex.j-center {
  justify-content: center;
}
.flex.a-center {
  align-items: center;
}
.flex.a-first {
  flex-wrap: inherit;
  align-items: flex-start;
}
@media all and (max-width: 1100px) {
  .flex.flex-pro {
    display: block;
  }
}
.flex.flex-pro .flex-30 {
  width: 30%;
}
@media all and (max-width: 1100px) {
  .flex.flex-pro .flex-30 {
    width: 100%;
    margin: 0 auto;
  }
}
.flex.flex-pro .flex-60 {
  width: 60%;
}
@media all and (max-width: 1100px) {
  .flex.flex-pro .flex-60 {
    width: 100%;
    margin: 0 auto;
  }
}
@media all and (max-width: 896px) {
  .flex.flex-tablet {
    display: block;
  }
}
@media all and (max-width: 896px) {
  .flex.flex-tablet .flex-36 {
    width: 35%;
    margin: 0 auto;
  }
}
@media all and (max-width: 896px) {
  .flex.flex-tablet .flex-56 {
    width: 90%;
    margin: 20px auto 0;
    margin-left: auto;
  }
}
.flex.flex-tablet .flex-50 {
  width: 50%;
}
@media all and (max-width: 896px) {
  .flex.flex-tablet .flex-50 {
    width: 100%;
  }
}
.flex.flex-tablet .flex-70 {
  width: 70%;
}
@media all and (max-width: 896px) {
  .flex.flex-tablet .flex-70 {
    width: 100%;
  }
}
.flex .flex-15 {
  width: 15%;
}
@media all and (max-width: 639px) {
  .flex .flex-15 {
    width: 50%;
    margin: 0 auto;
  }
}
.flex .flex-18 {
  width: 18%;
  margin-left: 2%;
}
@media all and (max-width: 639px) {
  .flex .flex-18 {
    width: 90%;
    margin-left: auto;
    margin: 0 auto;
  }
}
.flex .flex-20 {
  width: 20%;
}
@media all and (max-width: 639px) {
  .flex .flex-20 {
    width: 90%;
    margin: 0 auto;
  }
}
.flex .flex-25 {
  width: 25%;
}
@media all and (max-width: 639px) {
  .flex .flex-25 {
    width: 90%;
    margin: 0 auto;
  }
}
.flex .flex-30 {
  width: 30%;
}
@media all and (max-width: 639px) {
  .flex .flex-30 {
    width: 100%;
    margin: 0 auto;
  }
}
.flex .flex-36 {
  width: 36%;
}
@media all and (max-width: 639px) {
  .flex .flex-36 {
    width: 100%;
    margin: 0 auto;
  }
}
.flex .flex-38 {
  width: 38%;
}
@media all and (max-width: 639px) {
  .flex .flex-38 {
    width: 100%;
    margin: 0 auto;
  }
}
.flex .flex-40 {
  width: 40%;
}
@media all and (max-width: 639px) {
  .flex .flex-40 {
    width: 100%;
    margin-left: auto;
    margin-right: auto;
  }
}
.flex .flex-48 {
  width: 48%;
}
@media all and (max-width: 639px) {
  .flex .flex-48 {
    width: 100%;
    margin-left: auto;
    margin-right: auto;
  }
}
.flex .flex-48.l-m2 {
  margin-left: 2%;
}
@media all and (max-width: 639px) {
  .flex .flex-48.l-m2 {
    width: 96%;
    margin-top: 20px;
    margin-left: auto;
    margin-right: auto;
  }
}
.flex .flex-50 {
  width: 50%;
}
@media all and (max-width: 896px) {
  .flex .flex-50 {
    width: 100%;
  }
}
.flex .flex-56 {
  width: 56%;
}
@media all and (max-width: 639px) {
  .flex .flex-56 {
    width: 100%;
  }
}
.flex .flex-56.l-m6 {
  margin-left: 6%;
}
@media all and (max-width: 896px) {
  .flex .flex-56.l-m6 {
    width: 90%;
    margin-left: auto;
    margin-right: auto;
    align-items: center;
  }
}
@media all and (max-width: 639px) {
  .flex .flex-56.l-m6 {
    width: 90%;
    margin-left: auto;
    margin-right: auto;
  }
}
.flex .flex-60 {
  width: 60%;
}
@media all and (max-width: 639px) {
  .flex .flex-60 {
    width: 100%;
  }
}
.flex .flex-62 {
  width: 62%;
  margin-left: 4%;
}
@media all and (max-width: 639px) {
  .flex .flex-62 {
    width: 100%;
    margin-left: auto;
  }
}
.flex .flex-68 {
  width: 68%;
  margin-left: 2%;
}
@media all and (max-width: 639px) {
  .flex .flex-68 {
    margin-left: auto;
    width: 100%;
  }
}
.flex .flex-70 {
  width: 70%;
}
@media all and (max-width: 639px) {
  .flex .flex-70 {
    width: 100%;
  }
}
.flex .flex-78 {
  width: 78%;
  margin-left: 2%;
}
@media all and (max-width: 639px) {
  .flex .flex-78 {
    margin-left: auto;
    width: 100%;
  }
}
.flex .flex-80 {
  width: 80%;
  margin-left: 3%;
}
@media all and (max-width: 639px) {
  .flex .flex-80 {
    margin-left: auto;
    width: 100%;
  }
}

.masonry {
  margin: 0 auto;
  width: 100%;
  background-color: #fff;
  -moz-column-count: 3;
       column-count: 3;
  -moz-column-gap: 10px;
       column-gap: 10px;
  row-gap: 10px;
  transition: 0.3s;
}
@media all and (max-width: 896px) {
  .masonry {
    -moz-column-count: 3;
         column-count: 3;
  }
}
@media all and (max-width: 639px) {
  .masonry {
    -moz-column-count: 2;
         column-count: 2;
  }
}
.masonry > li,
.masonry .child {
  background-color: #ccc;
  padding: 10px;
  display: grid;
  place-items: center;
  margin-bottom: 10px;
  page-break-inside: avoid;
  -moz-column-break-inside: avoid;
       break-inside: avoid;
}
.masonry > li:nth-child(2n),
.masonry .child:nth-child(2n) {
  background-color: #f2f2f2;
}
.masonry > li:nth-child(3n),
.masonry .child:nth-child(3n) {
  background-color: #eee;
}

#i01,
#i02,
#i03,
#i04,
#i05,
#i06,
#i07,
#i08,
#i09,
#i10,
#price,
#faq,
#mail {
  display: block;
  padding-top: 100px;
  margin-top: -100px;
}

.font_ja {
  font-family: "YakuHanJP", Lato, "游ゴシック Medium", "游ゴシック体", "Yu Gothic Medium", YuGothic, "ヒラギノ角ゴ ProN", "Hiragino Kaku Gothic ProN", "メイリオ", Meiryo, "ＭＳ Ｐゴシック", "MS PGothic", sans-serif;
  font-weight: 500 !important;
}

.mincho {
  font-family: "Noto Serif JP", "YakuHanMP", "Noto Serif JP", "游明朝 Medium", "Yu Mincho", YuMincho, "Hiragino Mincho ProN", HGS明朝E, serif;
  font-weight: 500 !important;
}

.font_josefin {
  font-family: "Josefin Sans", sans-serif;
  font-weight: 500;
}

.font_Orbitron {
  font-family: "Oswald", sans-serif;
}

.font_anton {
  font-family: "Anton", sans-serif;
  font-weight: 500;
}

.font_parisienne {
  font-family: "Cinzel Decorative";
}
.font_parisienne:first-letter {
  text-transform: uppercase !important;
}

.font_parisienne {
  font-family: "Frank Ruhl Libre", serif;
}
.font_parisienne:first-letter {
  text-transform: uppercase !important;
}

.font_parisienne {
  font-family: "Parisienne", cursive;
}
.font_parisienne:first-letter {
  text-transform: uppercase !important;
}

.font_Amatic {
  font-family: "Amatic SC", cursive;
  font-weight: 500;
}

.font_kaisei {
  font-family: "Kaisei Opti", serif;
  font-weight: 500;
}

.font_maru {
  font-family: "Kosugi Maru", sans-serif;
  font-weight: 500;
}

#sp-nav,
.sp_nav,
#sp_btn {
  display: none;
}

#nav-toggle {
  display: none;
}
@media all and (max-width: 896px) {
  #nav-toggle {
    display: block;
  }
}

#nav-toggle {
  position: fixed;
  top: 6px;
  right: 6px;
  height: 53px;
  cursor: pointer;
  background: rgba(7, 56, 41, 0.8);
  -webkit-backdrop-filter: saturate(180%) blur(2px);
          backdrop-filter: saturate(180%) blur(2px);
  padding: 10px;
  border-radius: 5px;
  -webkit-backdrop-filter: blur(6px);
          backdrop-filter: blur(6px);
  border: 1px solid #fff;
}
#nav-toggle > div {
  position: relative;
  width: 30px;
}
#nav-toggle > div > p {
  position: absolute;
  display: block;
  left: 50%;
  transform: translateX(-50%);
  top: 21px;
  font-size: 1rem;
  letter-spacing: 0;
  text-align: center;
  color: #fff;
  font-weight: normal;
  text-transform: uppercase;
}
#nav-toggle span {
  width: 100%;
  height: 1px;
  left: 0;
  display: block;
  background: #fff;
  position: absolute;
  transition: transform 0.6s ease-in-out, top 0.5s ease;
}
#nav-toggle span:nth-child(1) {
  top: 0;
}
#nav-toggle span:nth-child(2) {
  top: 9px;
}
#nav-toggle span:nth-child(3) {
  top: 18px;
}
#nav-toggle:hover span:nth-child(1) {
  top: 0px;
}
#nav-toggle:hover span:nth-child(3) {
  top: 18px;
}

.open #nav-toggle {
  background: rgba(7, 56, 41, 0);
  border: 1px solid #aaa;
}
.open #nav-toggle p {
  display: none;
}
.open #nav-toggle span {
  background: #aaa;
}
.open #nav-toggle span:nth-child(1) {
  top: 15px;
  transform: rotate(45deg);
}
.open #nav-toggle span:nth-child(2) {
  top: 15px;
  width: 0;
  left: 50%;
}
.open #nav-toggle span:nth-child(3) {
  top: 15px;
  transform: rotate(-45deg);
}

#nav-toggle {
  z-index: 1000;
}

#sp-nav {
  background-color: rgba(255, 255, 255, 0.9);
  -webkit-backdrop-filter: blur(4px);
          backdrop-filter: blur(4px);
  height: auto;
  overflow-x: hidden;
  overflow-y: scroll;
  position: fixed;
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
  z-index: 990;
  text-align: center;
  display: block;
  flex-direction: column;
  opacity: 0;
  visibility: hidden;
  transform: translateY(-20px);
  transition: opacity 0.4s ease, visibility 0.4s ease, transform 0.4s ease;
}
#sp-nav ul.globalNav {
  width: 90%;
  margin: 0 auto;
}
#sp-nav ul.globalNav > li {
  opacity: 1;
  transform: translateX(0);
  transition: transform 1s ease, opacity 0.9s ease;
  margin-bottom: 3px;
  width: 100%;
  height: auto;
  text-align: left;
}
#sp-nav ul.globalNav > li a {
  display: block;
  color: #555;
  background-color: #fcfcfc;
  text-align: left;
  line-height: 1.2;
  padding: 10px;
  transition: color 0.4s ease;
  font-weight: 600;
  border-bottom: 0px solid #ccc;
  font-size: 1.1rem;
  position: relative;
}
#sp-nav ul.globalNav > li a:after {
  font-family: "Font Awesome 5 Free";
  content: "\f105";
  font-weight: 900;
  position: absolute;
  right: 8px;
  top: 0;
  bottom: 0;
  display: grid;
  place-items: center;
  transition: all 0.1s ease-in;
}
#sp-nav ul.globalNav > li a span {
  display: block;
  color: #073829;
  font-size: 1.3rem;
  font-family: "Noto Serif JP", "YakuHanMP", "Noto Serif JP", "游明朝 Medium", "Yu Mincho", YuMincho, "Hiragino Mincho ProN", HGS明朝E, serif;
  font-weight: 400;
  letter-spacing: 0;
  text-transform: lowercase !important;
}
#sp-nav ul.globalNav > li a span:first-letter {
  text-transform: uppercase;
}
#sp-nav ul.globalNav > li a:hover {
  color: #666;
}
#sp-nav ul.globalNav > li .dropdown {
  display: none;
  margin-bottom: 20px;
  /* content: "+";
  position: absolute;
  width: 50px;
  height: 100%;
  top:0;
  right: 0;
  background-color: $base_color;
  color: #fff;
  font-size: 1.8rem;
  z-index: 1000;
  cursor: pointer; */
  /* 			display: grid;
           place-items: center;
  */
}
#sp-nav ul.globalNav > li .dropdown .dropdown-li {
  display: block;
  border-right: 0;
  margin-bottom: 3px;
  border-bottom: 1px solid #eee;
  color: #888;
}
#sp-nav ul.globalNav > li .dropdown .dropdown-li.active {
  display: block;
}
#sp-nav ul.globalNav > li .dropdown .dropdown-li a {
  display: block;
  padding: 12px 10px;
  text-align: left;
  color: #888;
  font-size: 1rem;
  border-bottom: 0px solid #aaa;
  background: rgba(255, 255, 255, 0.8);
}
#sp-nav ul.globalNav > li .dropdown .dropdown-li a:hover {
  background: rgba(170, 170, 170, 0.4);
}
#sp-nav ul.globalNav > li .dropdown .dropdown-li.foot_only {
  display: none;
}
#sp-nav .sp-nav_wrap {
  padding: 50px 0;
}
#sp-nav .head_tel {
  margin: 10px auto;
  width: 90%;
  border: 1px solid #ddd;
  padding: 5px 0 0;
}
#sp-nav .head_mail {
  width: 90%;
  margin: 0 auto;
}
#sp-nav #menu_btn_close {
  opacity: 1;
  visibility: visible;
  text-align: center;
  font-weight: bold;
  color: #888;
  font-size: 1.1rem;
  text-align: center;
  margin: 20px auto 0;
  border: 1px solid #ccc;
  background-color: #fff;
  border-radius: 50px;
  padding: 4px 30px;
  display: none;
}
#sp-nav #menu_btn_close i {
  font-family: "Font Awesome 5 Free";
  display: block;
  font-size: 900;
}
#sp-nav .logo_sp {
  text-align: center;
  margin-bottom: 30px;
}
#sp-nav .logo_sp img {
  width: 180px;
  height: auto;
}

/* open */
.open {
  overflow-x: hidden;
  overflow-y: scroll;
}
.open #sp-nav {
  visibility: visible;
  opacity: 1;
  display: block;
  transform: translateY(0);
  transition: display 0.4s ease, opacity 0.4s ease, visibility 0.4s ease, transform 0.4s ease;
}
.open #menu_btn_close {
  opacity: 1;
  display: inline-block !important;
  transform: translateX(0);
  transition: transform 1s ease, opacity 0.9s ease;
}

@media all and (max-width: 896px) {
  body {
    font-size: 1.4rem;
  }
  #sp_btn {
    display: block;
    position: fixed;
    bottom: 0;
    left: 50%;
    z-index: 980;
    width: 100%;
    transform: translateX(-50%);
  }
  #sp_btn ul {
    display: flex;
    justify-content: center;
    max-width: 480px;
    padding-bottom: 0;
    margin: 0 auto;
    position: relative;
  }
  #sp_btn ul:before {
    content: "";
    position: absolute;
    width: 100%;
    height: 100%;
    z-index: -1;
    background: rgba(254, 254, 254, 0.7);
    -webkit-backdrop-filter: saturate(180%) blur(2px);
            backdrop-filter: saturate(180%) blur(2px);
  }
  #sp_btn ul li {
    width: 20%;
    margin: 0;
    padding: 10px 0 6px;
    text-align: center;
    line-height: 1.2;
    position: relative;
  }
  #sp_btn ul li span {
    display: block;
    font-size: 0.9rem;
    color: #333;
  }
  #sp_btn ul li i {
    font-size: 1.6rem;
    display: block;
    color: #073829;
    font-weight: 600;
    margin-bottom: 3px;
  }
  #sp_btn ul li a {
    display: block;
    position: absolute;
    width: 100%;
    height: 100%;
    top: 0;
    left: 0;
    z-index: 1;
  }
  #sp_btn.type1 ul:before {
    background: rgba(7, 56, 41, 0.7);
  }
  #sp_btn.type1 ul li span,
#sp_btn.type1 ul li i {
    color: #fff;
  }
  #sp_btn.grid2 ul li {
    width: 50%;
    background: rgba(7, 56, 41, 0.7);
  }
  #sp_btn.grid2 ul li span,
#sp_btn.grid2 ul li i {
    color: #fff;
    display: inline-block;
    margin-right: 5px;
  }
  #sp_btn.grid2 ul li:nth-child(2n) {
    background: rgba(104, 72, 42, 0.7);
  }
  .bnr li {
    width: 100%;
    float: none;
  }
  .fleft0,
.fleft1,
.fleft2,
.fright0,
.fright1,
.fright2 {
    display: block;
    float: none;
    margin-left: auto;
    margin-right: auto;
    margin-bottom: 15px;
  }
  /* navi */
  #header_nav {
    display: none;
  }
  #flash {
    width: 100%;
    height: auto;
  }
  /* footer_navi */
  .footer_navi {
    display: none;
  }
  /* footer */
  /* contents */
  .single,
.single03 {
    max-width: initial;
    width: 95%;
    padding: 40px 10px;
  }
  .single02 {
    padding: 0px 0;
    width: calc(100% - 20px);
  }
  /* concept-wrap */
  .concept-wrap {
    margin: 30px 0;
    padding: 30px 0;
  }
  .concept-wrap .bg-back,
.concept-wrap .figure {
    width: 100%;
  }
  .concept-wrap .concept-inner {
    margin: 0 auto !important;
  }
  .concept-wrap .concept-inner .in-wrap {
    float: none;
    width: 95%;
    margin: 0 auto;
  }
  .concept-wrap .concept-inner .in-wrap .concept-box {
    width: 100%;
    padding: 5%;
    margin: auto;
    box-sizing: border-box;
  }
  .concept-wrap .concept-inner .in-wrap .concept-box .conts-ttl {
    font-size: 2rem;
  }
  /* bg */
  .bg_top_bnr .inner,
.bg_contact .inner {
    padding: 30px 0;
  }
  /* page_title_box */
  .page_title_box {
    padding: 90px 0 0;
  }
  .breadcrumb_box .breadcrumb {
    width: 95%;
  }
  /* sp_nav */
  #container {
    z-index: 900;
  }
  .blogBox {
    width: 48%;
    margin: 0 2.5% 15px 0;
  }
  .blogBox:nth-child(2n) {
    margin-right: 0;
  }
  .blogBox figure {
    height: 140px;
  }
  .flex-child2 {
    width: 100%;
    margin: 0 auto 10px;
  }
  .flex-child2.column1 {
    width: 100%;
  }
  .rsingle,
.lsingle {
    float: none;
    width: 100%;
  }
  /* single */
  .lsingle,
.rsingle {
    float: none;
    width: 100%;
  }
}
@media screen and (max-width: 480px) {
  .vd_frame {
    margin-top: 20%;
    position: relative;
    width: 100%;
    padding-top: 56.25%;
    display: block;
    margin-left: auto;
    margin-right: auto;
    text-align: center;
  }
  .vd_frame iframe {
    position: absolute;
    top: 0;
    right: 0;
    max-width: 100%;
    width: 100%;
    height: 100%;
    max-height: 100%;
    margin: 0 auto;
    display: block;
  }
  html {
    font-size: 2.825vw;
  }
  body {
    font-size: 1.2rem;
  }
  .tbl_scroll {
    padding-bottom: 10px;
    overflow: auto;
    white-space: nowrap;
  }
  .tbl_scroll::-webkit-scrollbar {
    height: 5px;
  }
  .tbl_scroll::-webkit-scrollbar-track {
    background: #f1f1f1;
  }
  .tbl_scroll::-webkit-scrollbar-thumb {
    background: #bcbcbc;
  }
  .tbl_scroll::-webkit-scrollbar-piece {
    background: #eee;
  }
  .spbr {
    display: block;
  }
  .pcbr {
    display: none;
  }
  /* visual */
  .visual .inner .ballon_parent {
    width: 100%;
  }
  .visual .inner .ballon_parent li img {
    width: 45%;
  }
  /* footer */
  #l-footer {
    text-align: center;
  }
  #l-footer .inner .copyright {
    text-align: center;
    font-size: 0.8rem;
    font-weight: normal;
  }
  .lsingle {
    margin-bottom: 20px;
  }
  /* mtitle */
  /* snip */
  .snip_parent {
    padding: 40px 0;
  }
  .snip_parent .snip figcaption > div.two h3 {
    font-size: 1.6rem;
  }
  .snip_parent .snip figcaption > div.two h3 span {
    font-size: 1.2rem;
  }
  /* ggmap */
  .ggmap {
    position: relative;
    padding-bottom: 46.25%;
    height: 0;
    overflow: hidden;
  }
  /* pickup */
  .pickup .detail_box {
    padding: 10px;
  }
  .pickup .detail_box .bnr_tel {
    width: 95%;
    box-sizing: border-box;
  }
  /* page_title_box */
  .page_title_box .page_title {
    font-size: 2.4rem;
    letter-spacing: 0.1rem;
  }
  /* sp_menu */
  .btn__box {
    width: 100%;
    perspective: 200px;
  }
  .btn__box a {
    width: 100%;
  }
  .btn__box:after {
    width: 100%;
    width: 100%;
  }
  #wrapper {
    overflow-y: hidden;
  }
}
.loader {
  background-color: #073829;
  align-items: center;
  bottom: 0;
  display: flex;
  justify-content: center;
  left: 0;
  position: fixed;
  right: 0;
  top: 0;
  z-index: 9999;
}
.loader.type_grd {
  background: rgb(2, 133, 135);
  background: linear-gradient(90deg, rgb(2, 133, 135) 0%, rgb(97, 169, 210) 63%);
}
.loader.bg_white {
  background-color: #fff;
}
.loader .loader_item {
  display: grid;
  place-items: center;
}
.loader.off {
  display: none;
}

.lorder_rotate {
  display: grid;
  place-items: center;
  margin: auto;
  -webkit-animation: lorder_rotate 0.5s linear infinite;
          animation: lorder_rotate 0.5s linear infinite;
  border: 1px solid #fff;
  border-radius: 50%;
  border-right: 1px solid rgba(7, 56, 41, 0.8);
  border-top: 1px solid rgba(7, 56, 41, 0.8);
  content: "";
  height: 70px;
  width: 70px;
}

@-webkit-keyframes lorder_rotate {
  0% {
    transform: rotate(0);
  }
  100% {
    transform: rotate(360deg);
  }
}

@keyframes lorder_rotate {
  0% {
    transform: rotate(0);
  }
  100% {
    transform: rotate(360deg);
  }
}
.lorder_ball > div {
  background-color: #fff;
  width: 15px;
  height: 15px;
  border-radius: 100%;
  margin: 2px;
  -webkit-animation-fill-mode: both;
  animation-fill-mode: both;
  display: inline-block;
}
.lorder_ball > div:nth-child(1) {
  -webkit-animation: scale 0.75s -0.24s infinite cubic-bezier(0.2, 0.68, 0.18, 1.08);
  animation: scale 0.75s -0.24s infinite cubic-bezier(0.2, 0.68, 0.18, 1.08);
}
.lorder_ball > div:nth-child(2) {
  -webkit-animation: scale 0.75s -0.12s infinite cubic-bezier(0.2, 0.68, 0.18, 1.08);
  animation: scale 0.75s -0.12s infinite cubic-bezier(0.2, 0.68, 0.18, 1.08);
}
.lorder_ball > div:nth-child(3) {
  -webkit-animation: scale 0.75s 0s infinite cubic-bezier(0.2, 0.68, 0.18, 1.08);
  animation: scale 0.75s 0s infinite cubic-bezier(0.2, 0.68, 0.18, 1.08);
}

@-webkit-keyframes ball-pulse-sync {
  33% {
    transform: translateY(10px);
  }
  66% {
    transform: translateY(-10px);
  }
  100% {
    transform: translateY(0);
  }
}
@keyframes ball-pulse-sync {
  33% {
    transform: translateY(10px);
  }
  66% {
    transform: translateY(-10px);
  }
  100% {
    transform: translateY(0);
  }
}
.ball-pulse-sync > div {
  background-color: #fff;
  width: 15px;
  height: 15px;
  border-radius: 100%;
  margin: 2px;
  -webkit-animation-fill-mode: both;
  animation-fill-mode: both;
  display: inline-block;
}
.ball-pulse-sync > div:nth-child(1) {
  -webkit-animation: ball-pulse-sync 0.6s -0.14s infinite ease-in-out;
  animation: ball-pulse-sync 0.6s -0.14s infinite ease-in-out;
}
.ball-pulse-sync > div:nth-child(2) {
  -webkit-animation: ball-pulse-sync 0.6s -0.07s infinite ease-in-out;
  animation: ball-pulse-sync 0.6s -0.07s infinite ease-in-out;
}
.ball-pulse-sync > div:nth-child(3) {
  -webkit-animation: ball-pulse-sync 0.6s 0s infinite ease-in-out;
  animation: ball-pulse-sync 0.6s 0s infinite ease-in-out;
}

.loader2 {
  align-items: center;
  bottom: 0;
  display: flex;
  justify-content: center;
  left: 0;
  position: fixed;
  right: 0;
  top: 0;
  z-index: 9999;
}
.loader2.off {
  display: none;
}

/* Loading背景画面設定　*/
#splash {
  /*fixedで全面に固定*/
  position: fixed;
  width: 100%;
  height: 100%;
  z-index: 99999;
  background: #073829;
  text-align: center;
  color: #fff;
}
#splash.bg_white {
  background: #fff;
}

/* Loading画像中央配置　*/
#splash_logo {
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
}
#splash_logo.white img {
  width: 100%;
  filter: brightness(0) invert(1);
}
#splash_logo .splash-logo1 {
  width: 150px;
}
#splash_logo .splash-logo1-in {
  -webkit-animation: anime-logo3 0.2s ease-in 0s forwards;
          animation: anime-logo3 0.2s ease-in 0s forwards;
}
#splash_logo .splash-logo2 {
  width: 80px;
  opacity: 0;
  -webkit-animation: anime-logo3 0.2s ease-in 0.4s forwards;
          animation: anime-logo3 0.2s ease-in 0.4s forwards;
}
#splash_logo .splash-logo3 {
  width: 80px;
  opacity: 0;
  -webkit-animation: anime-logo3 0.2s ease-in 0.8s forwards;
          animation: anime-logo3 0.2s ease-in 0.8s forwards;
}
#splash_logo .splash-logo4 {
  width: 80px;
  opacity: 0;
  -webkit-animation: anime-logo3 0.2s ease-in 1.2s forwards;
          animation: anime-logo3 0.2s ease-in 1.2s forwards;
}
@media all and (max-width: 639px) {
  #splash_logo .splash-logo2 {
    width: 40px;
    opacity: 0;
    -webkit-animation: anime-logo3 0.2s ease-in 0.4s forwards;
            animation: anime-logo3 0.2s ease-in 0.4s forwards;
  }
  #splash_logo .splash-logo3 {
    width: 40px;
    opacity: 0;
    -webkit-animation: anime-logo3 0.2s ease-in 0.8s forwards;
            animation: anime-logo3 0.2s ease-in 0.8s forwards;
  }
  #splash_logo .splash-logo4 {
    width: 40px;
    opacity: 0;
    -webkit-animation: anime-logo3 0.2s ease-in 1.2s forwards;
            animation: anime-logo3 0.2s ease-in 1.2s forwards;
  }
}
#splash_logo .logo3 {
  width: 280px;
}

/*画面遷移アニメーション*/
.splashbg1,
.splashbg2 {
  display: none;
}

body.appear {
  background: transparent;
}

/*bodyにappearクラスがついたら出現*/
body.appear .splashbg1,
body.appear .splashbg2 {
  display: block;
}

/*右に消えるエリア*/
body.appear .splashbg1 {
  -webkit-animation-name: PageAnime1;
          animation-name: PageAnime1;
  -webkit-animation-duration: 0.6s;
          animation-duration: 0.6s;
  -webkit-animation-timing-function: ease-in-out;
          animation-timing-function: ease-in-out;
  -webkit-animation-fill-mode: forwards;
          animation-fill-mode: forwards;
  content: "";
  position: fixed;
  z-index: 999;
  width: 100%;
  height: 100vh;
  top: 0;
  left: 50%;
  transform: scaleX(1);
  background-color: #073829;
  /*伸びる背景色の設定*/
}
body.appear .splashbg1.bg_white {
  background-color: #fff;
}

@-webkit-keyframes PageAnime1 {
  0% {
    transform-origin: left;
    transform: scaleX(1);
  }
  50% {
    transform-origin: right;
  }
  100% {
    transform-origin: right;
    transform: scaleX(0);
  }
}

@keyframes PageAnime1 {
  0% {
    transform-origin: left;
    transform: scaleX(1);
  }
  50% {
    transform-origin: right;
  }
  100% {
    transform-origin: right;
    transform: scaleX(0);
  }
}
/*左に消えるエリア*/
body.appear .splashbg2 {
  -webkit-animation-name: PageAnime2;
          animation-name: PageAnime2;
  -webkit-animation-duration: 0.6s;
          animation-duration: 0.6s;
  -webkit-animation-timing-function: ease-in-out;
          animation-timing-function: ease-in-out;
  -webkit-animation-fill-mode: forwards;
          animation-fill-mode: forwards;
  content: "";
  position: fixed;
  z-index: 999;
  width: 100%;
  height: 100vh;
  top: 0;
  right: 50%;
  transform: scaleX(1);
  background-color: #073829;
  /*伸びる背景色の設定*/
}
body.appear .splashbg2.bg_white {
  background-color: #fff;
}

@-webkit-keyframes PageAnime2 {
  0% {
    transform-origin: right;
    transform: scaleX(1);
  }
  50% {
    transform-origin: left;
  }
  100% {
    transform-origin: left;
    transform: scaleX(0);
  }
}

@keyframes PageAnime2 {
  0% {
    transform-origin: right;
    transform: scaleX(1);
  }
  50% {
    transform-origin: left;
  }
  100% {
    transform-origin: left;
    transform: scaleX(0);
  }
}
/*画面遷移の後現れるコンテンツ設定*/
#container {
  opacity: 0;
  /*はじめは透過0に*/
}

/*bodyにappearクラスがついたら出現*/
body.appear #container {
  -webkit-animation-name: PageAnimeAppear;
          animation-name: PageAnimeAppear;
  -webkit-animation-duration: 1s;
          animation-duration: 1s;
  -webkit-animation-delay: 0.2s;
          animation-delay: 0.2s;
  -webkit-animation-fill-mode: forwards;
          animation-fill-mode: forwards;
  opacity: 0;
}

@-webkit-keyframes PageAnimeAppear {
  0% {
    opacity: 0;
  }
  100% {
    opacity: 1;
  }
}

@keyframes PageAnimeAppear {
  0% {
    opacity: 0;
  }
  100% {
    opacity: 1;
  }
}
#container,
#footer {
  position: relative;
  /*#header-imgよりも配置を上にするためにrelativeをつける*/
  z-index: 3;
  /*#header-imgよりもz-indexの値を大きな数値にして上に表示*/
}

/* Loading アイコンの大きさ設定　*/
#splash_logo svg {
  width: 300px;
}
@media all and (max-width: 639px) {
  #splash_logo svg {
    width: 200px;
  }
}
@-webkit-keyframes spinner-loader {
  0% {
    transform: rotate(0deg);
  }
  100% {
    transform: rotate(360deg);
  }
}
@keyframes spinner-loader {
  0% {
    transform: rotate(0deg);
  }
  100% {
    transform: rotate(360deg);
  }
}
#splash {
  position: fixed;
  width: 100%;
  height: 100%;
  background: #333;
  z-index: 9999999;
  text-align: center;
  color: #fff;
}

#splash-logo {
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
}

/*========= 画面遷移のためのCSS ===============*/
/*画面遷移アニメーション*/
.splashbg {
  display: none;
}

/*bodyにappearクラスがついたら出現*/
body.appear .splashbg {
  display: block;
  content: "";
  position: fixed;
  z-index: 999;
  width: 100%;
  height: 100vh;
  top: 0;
  left: 0;
  transform: scaleY(0);
  background-color: #333;
  /*伸びる背景色の設定*/
  -webkit-animation-name: PageAnime0;
          animation-name: PageAnime0;
  -webkit-animation-duration: 1.2s;
          animation-duration: 1.2s;
  -webkit-animation-timing-function: ease-in-out;
          animation-timing-function: ease-in-out;
  -webkit-animation-fill-mode: forwards;
          animation-fill-mode: forwards;
}

@-webkit-keyframes PageAnime0 {
  0% {
    transform-origin: bottom;
    transform: scaleY(0);
  }
  50% {
    transform-origin: bottom;
    transform: scaleY(1);
  }
  50.001% {
    transform-origin: top;
  }
  100% {
    transform-origin: top;
    transform: scaleY(0);
  }
}

@keyframes PageAnime0 {
  0% {
    transform-origin: bottom;
    transform: scaleY(0);
  }
  50% {
    transform-origin: bottom;
    transform: scaleY(1);
  }
  50.001% {
    transform-origin: top;
  }
  100% {
    transform-origin: top;
    transform: scaleY(0);
  }
}
/* :not(:required) hides this rule from IE9 and below */
.spinner-loader:not(:required) {
  -webkit-animation: spinner-loader 1500ms infinite linear;
  animation: spinner-loader 1500ms infinite linear;
  border-radius: 0.5em;
  box-shadow: rgba(0, 0, 51, 0.3) 1.5em 0 0 0, rgba(0, 0, 51, 0.3) 1.1em 1.1em 0 0, rgba(0, 0, 51, 0.3) 0 1.5em 0 0, rgba(0, 0, 51, 0.3) -1.1em 1.1em 0 0, rgba(0, 0, 51, 0.3) -1.5em 0 0 0, rgba(0, 0, 51, 0.3) -1.1em -1.1em 0 0, rgba(0, 0, 51, 0.3) 0 -1.5em 0 0, rgba(0, 0, 51, 0.3) 1.1em -1.1em 0 0;
  display: inline-block;
  font-size: 10px;
  width: 1em;
  height: 1em;
  margin: 1.5em;
  overflow: hidden;
  text-indent: 100%;
}
@-webkit-keyframes refreshing-loader {
  0% {
    transform: rotate(0deg);
  }
  100% {
    transform: rotate(360deg);
  }
}
@keyframes refreshing-loader {
  0% {
    transform: rotate(0deg);
  }
  100% {
    transform: rotate(360deg);
  }
}
#splash_open {
  position: fixed;
  width: 100%;
  height: 100%;
  background: #073829;
  z-index: 9999999;
  text-align: center;
  color: #fff;
}

#splash-logo_open {
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
}

.splashbg_open {
  display: none;
}

body.appear .splashbg_open {
  display: block;
  content: "";
  position: fixed;
  z-index: 999;
  width: 100%;
  height: 100vh;
  top: 0;
  left: 0;
  transform: scaleY(0);
  background-color: #073829;
  /*伸びる背景色の設定*/
  -webkit-animation-name: PageAnime_open;
          animation-name: PageAnime_open;
  -webkit-animation-duration: 1.2s;
          animation-duration: 1.2s;
  -webkit-animation-timing-function: ease-in-out;
          animation-timing-function: ease-in-out;
  -webkit-animation-fill-mode: forwards;
          animation-fill-mode: forwards;
}

@-webkit-keyframes PageAnime_open {
  0% {
    transform-origin: bottom;
    transform: scaleY(0);
  }
  50% {
    transform-origin: bottom;
    transform: scaleY(1);
  }
  50.001% {
    transform-origin: top;
  }
  100% {
    transform-origin: top;
    transform: scaleY(0);
  }
}

@keyframes PageAnime_open {
  0% {
    transform-origin: bottom;
    transform: scaleY(0);
  }
  50% {
    transform-origin: bottom;
    transform: scaleY(1);
  }
  50.001% {
    transform-origin: top;
  }
  100% {
    transform-origin: top;
    transform: scaleY(0);
  }
}
.refreshing-loader:not(:required) {
  -webkit-animation: refreshing-loader 1000ms infinite linear;
  animation: refreshing-loader 1000ms infinite linear;
  border-radius: 2.4em;
  border: 0.4em solid #9ac;
  border-left-color: transparent;
  color: transparent;
  display: inline-block;
  font-size: 10px;
  line-height: 1.2;
  width: 3em;
  height: 3em;
  text-indent: 100%;
}
.refreshing-loader:not(:required):after {
  display: block;
  border: 0.5em solid transparent;
  border-top-color: #9ac;
  border-left-color: #9ac;
  content: "";
  width: 0;
  height: 0;
  overflow: hidden;
  margin-left: -0.2em;
  margin-top: 1em;
}
@-webkit-keyframes throbber-loader {
  0% {
    background: #e9e9e9;
  }
  10% {
    background: #073829;
  }
  40% {
    background: #e9e9e9;
  }
}
@keyframes throbber-loader {
  0% {
    background: #e9e9e9;
  }
  10% {
    background: #073829;
  }
  40% {
    background: #e9e9e9;
  }
}
/* :not(:required) hides these rules from IE9 and below */
.throbber-loader:not(:required) {
  -webkit-animation: throbber-loader 2000ms 300ms infinite ease-out;
  animation: throbber-loader 2000ms 300ms infinite ease-out;
  background: #e9e9e9;
  display: inline-block;
  position: relative;
  text-indent: -9999px;
  width: 0.9em;
  height: 1.5em;
  margin: 0 1.6em;
}
.throbber-loader:not(:required):before, .throbber-loader:not(:required):after {
  background: #e9e9e9;
  content: "x200B";
  display: inline-block;
  width: 0.9em;
  height: 1.5em;
  position: absolute;
  top: 0;
}
.throbber-loader:not(:required):before {
  -webkit-animation: throbber-loader 2000ms 150ms infinite ease-out;
  animation: throbber-loader 2000ms 150ms infinite ease-out;
  left: -1.6em;
}
.throbber-loader:not(:required):after {
  -webkit-animation: throbber-loader 2000ms 450ms infinite ease-out;
  animation: throbber-loader 2000ms 450ms infinite ease-out;
  right: -1.6em;
}
@-webkit-keyframes marumaru-loader {
  0% {
    background: #e9e9e9;
  }
  10% {
    background: #073829;
  }
  40% {
    background: #e9e9e9;
  }
}
@keyframes marumaru-loader {
  0% {
    background: #e9e9e9;
  }
  10% {
    background: #073829;
  }
  40% {
    background: #e9e9e9;
  }
}
/* :not(:required) hides these rules from IE9 and below */
.marumaru-loader:not(:required) {
  -webkit-animation: marumaru-loader 2000ms 300ms infinite ease-out;
  animation: marumaru-loader 2000ms 300ms infinite ease-out;
  background: #e9e9e9;
  display: inline-block;
  position: relative;
  text-indent: -9999px;
  width: 0.9em;
  height: 0.9em;
  border-radius: 50%;
  margin: 0 1.6em;
}
.marumaru-loader:not(:required):before, .marumaru-loader:not(:required):after {
  background: #e9e9e9;
  content: "x200B";
  display: inline-block;
  width: 0.9em;
  height: 0.9em;
  border-radius: 50%;
  position: absolute;
  top: 0;
}
.marumaru-loader:not(:required):before {
  -webkit-animation: marumaru-loader 2000ms 150ms infinite ease-out;
  animation: marumaru-loader 2000ms 150ms infinite ease-out;
  left: -1.6em;
}
.marumaru-loader:not(:required):after {
  -webkit-animation: marumaru-loader 2000ms 450ms infinite ease-out;
  animation: marumaru-loader 2000ms 450ms infinite ease-out;
  right: -1.6em;
}
@-webkit-keyframes heartbeat-loader {
  0% {
    transform: rotate(45deg) scale(1);
  }
  14% {
    transform: rotate(45deg) scale(1.3);
  }
  28% {
    transform: rotate(45deg) scale(1);
  }
  42% {
    transform: rotate(45deg) scale(1.3);
  }
  70% {
    transform: rotate(45deg) scale(1);
  }
}
@keyframes heartbeat-loader {
  0% {
    transform: rotate(45deg) scale(1);
  }
  14% {
    transform: rotate(45deg) scale(1.3);
  }
  28% {
    transform: rotate(45deg) scale(1);
  }
  42% {
    transform: rotate(45deg) scale(1.3);
  }
  70% {
    transform: rotate(45deg) scale(1);
  }
}
/* :not(:required) hides this rule from IE9 and below */
.heartbeat-loader:not(:required) {
  -webkit-animation: heartbeat-loader 1300ms ease 0s infinite normal;
  animation: heartbeat-loader 1300ms ease 0s infinite normal;
  display: inline-block;
  position: relative;
  overflow: hidden;
  text-indent: -9999px;
  width: 36px;
  height: 36px;
  transform: rotate(45deg) scale(1);
  transform-origin: 50% 50%;
}
.heartbeat-loader:not(:required):after {
  position: absolute;
  content: "";
  background: #e87;
}
.heartbeat-loader:not(:required):before {
  position: absolute;
  content: "";
  background: #e87;
  border-top-left-radius: 12px;
  border-bottom-left-radius: 12px;
  top: 12px;
  left: 0;
  width: 36px;
  height: 24px;
}
.heartbeat-loader:not(:required):after {
  border-top-left-radius: 12px;
  border-top-right-radius: 12px;
  top: 0;
  left: 12px;
  width: 24px;
  height: 13px;
}
@-webkit-keyframes gauge-loader {
  0% {
    transform: rotate(-50deg);
  }
  10% {
    transform: rotate(20deg);
  }
  20% {
    transform: rotate(60deg);
  }
  24% {
    transform: rotate(60deg);
  }
  40% {
    transform: rotate(-20deg);
  }
  54% {
    transform: rotate(70deg);
  }
  56% {
    transform: rotate(78deg);
  }
  58% {
    transform: rotate(73deg);
  }
  60% {
    transform: rotate(75deg);
  }
  62% {
    transform: rotate(70deg);
  }
  70% {
    transform: rotate(-20deg);
  }
  80% {
    transform: rotate(20deg);
  }
  83% {
    transform: rotate(25deg);
  }
  86% {
    transform: rotate(20deg);
  }
  89% {
    transform: rotate(25deg);
  }
  100% {
    transform: rotate(-50deg);
  }
}
@keyframes gauge-loader {
  0% {
    transform: rotate(-50deg);
  }
  10% {
    transform: rotate(20deg);
  }
  20% {
    transform: rotate(60deg);
  }
  24% {
    transform: rotate(60deg);
  }
  40% {
    transform: rotate(-20deg);
  }
  54% {
    transform: rotate(70deg);
  }
  56% {
    transform: rotate(78deg);
  }
  58% {
    transform: rotate(73deg);
  }
  60% {
    transform: rotate(75deg);
  }
  62% {
    transform: rotate(70deg);
  }
  70% {
    transform: rotate(-20deg);
  }
  80% {
    transform: rotate(20deg);
  }
  83% {
    transform: rotate(25deg);
  }
  86% {
    transform: rotate(20deg);
  }
  89% {
    transform: rotate(25deg);
  }
  100% {
    transform: rotate(-50deg);
  }
}
/* :not(:required) hides this rule from IE9 and below */
.gauge-loader:not(:required) {
  background: #6ca;
  border-top-left-radius: 32px;
  border-top-right-radius: 32px;
  display: inline-block;
  width: 64px;
  height: 32px;
  overflow: hidden;
  position: relative;
  text-indent: -9999px;
}
.gauge-loader:not(:required)::before {
  -webkit-animation: gauge-loader 4000ms infinite ease;
  animation: gauge-loader 4000ms infinite ease;
  background: white;
  border-radius: 2px;
  content: "";
  position: absolute;
  left: 30px;
  top: 5.33333px;
  width: 4px;
  height: 26.66667px;
  transform-origin: 50% 100%;
}
.gauge-loader:not(:required)::after {
  content: "";
  background: white;
  border-radius: 8px;
  position: absolute;
  left: 25.6px;
  top: 25.6px;
  width: 12.8px;
  height: 12.8px;
}
@-webkit-keyframes timer-loader {
  0% {
    transform: rotate(0deg);
  }
  100% {
    transform: rotate(360deg);
  }
}
@keyframes timer-loader {
  0% {
    transform: rotate(0deg);
  }
  100% {
    transform: rotate(360deg);
  }
}
/* :not(:required) hides this rule from IE9 and below */
.timer-loader:not(:required) {
  border: 6px solid #c8d;
  border-radius: 24px;
  box-sizing: border-box;
  display: inline-block;
  overflow: hidden;
  position: relative;
  text-indent: -9999px;
  width: 48px;
  height: 48px;
}
.timer-loader:not(:required)::before {
  -webkit-animation: timer-loader 1250ms infinite linear;
  animation: timer-loader 1250ms infinite linear;
  transform-origin: 3px 3px;
  background: #c8d;
  border-radius: 3px;
  content: "";
  display: block;
  position: absolute;
  width: 6px;
  height: 19.2px;
  left: 15px;
  top: 15px;
}
.timer-loader:not(:required)::after {
  -webkit-animation: timer-loader 15000ms infinite linear;
  animation: timer-loader 15000ms infinite linear;
  transform-origin: 3px 3px;
  background: #c8d;
  border-radius: 3px;
  content: "";
  display: block;
  position: absolute;
  width: 6px;
  height: 16px;
  left: 15px;
  top: 15px;
}
@-webkit-keyframes three-quarters-loader {
  0% {
    transform: rotate(0deg);
  }
  100% {
    transform: rotate(360deg);
  }
}
@keyframes three-quarters-loader {
  0% {
    transform: rotate(0deg);
  }
  100% {
    transform: rotate(360deg);
  }
}
/* :not(:required) hides this rule from IE9 and below */
.three-quarters-loader:not(:required) {
  -webkit-animation: three-quarters-loader 1250ms infinite linear;
  animation: three-quarters-loader 1250ms infinite linear;
  border: 8px solid #38e;
  border-right-color: transparent;
  border-radius: 16px;
  box-sizing: border-box;
  display: inline-block;
  position: relative;
  overflow: hidden;
  text-indent: -9999px;
  width: 32px;
  height: 32px;
}
@-webkit-keyframes wobblebar-loader {
  0% {
    left: 4px;
  }
  3% {
    left: 104px;
  }
  6% {
    left: 4px;
  }
  9% {
    left: 104px;
  }
  12% {
    left: 4px;
  }
  15% {
    left: 104px;
  }
  18% {
    left: 32px;
  }
  27% {
    left: 32px;
  }
  30% {
    left: 104px;
  }
  33% {
    left: 4px;
  }
  36% {
    left: 104px;
  }
  39% {
    left: 4px;
  }
  42% {
    left: 104px;
  }
  45% {
    left: 4px;
  }
  48% {
    left: 104px;
  }
  51% {
    left: 52px;
  }
  63% {
    left: 52px;
  }
  66% {
    left: 4px;
  }
  69% {
    left: 104px;
  }
  72% {
    left: 4px;
  }
  75% {
    left: 104px;
  }
  78% {
    left: 4px;
  }
  81% {
    left: 104px;
  }
  84% {
    left: 72px;
  }
  94% {
    left: 72px;
  }
  97% {
    left: 104px;
  }
}
@keyframes wobblebar-loader {
  0% {
    left: 4px;
  }
  3% {
    left: 104px;
  }
  6% {
    left: 4px;
  }
  9% {
    left: 104px;
  }
  12% {
    left: 4px;
  }
  15% {
    left: 104px;
  }
  18% {
    left: 32px;
  }
  27% {
    left: 32px;
  }
  30% {
    left: 104px;
  }
  33% {
    left: 4px;
  }
  36% {
    left: 104px;
  }
  39% {
    left: 4px;
  }
  42% {
    left: 104px;
  }
  45% {
    left: 4px;
  }
  48% {
    left: 104px;
  }
  51% {
    left: 52px;
  }
  63% {
    left: 52px;
  }
  66% {
    left: 4px;
  }
  69% {
    left: 104px;
  }
  72% {
    left: 4px;
  }
  75% {
    left: 104px;
  }
  78% {
    left: 4px;
  }
  81% {
    left: 104px;
  }
  84% {
    left: 72px;
  }
  94% {
    left: 72px;
  }
  97% {
    left: 104px;
  }
}
/* :not(:required) hides this rule from IE9 and below */
.wobblebar-loader:not(:required) {
  background: #a9d;
  border-radius: 10.66667px;
  display: inline-block;
  overflow: hidden;
  text-indent: -9999px;
  width: 128px;
  height: 21.33333px;
  position: relative;
}
.wobblebar-loader:not(:required)::after {
  -webkit-animation: wobblebar-loader 15000ms infinite ease;
  animation: wobblebar-loader 15000ms infinite ease;
  background: white;
  display: block;
  border-radius: 7.11111px;
  content: "";
  position: absolute;
  top: 3.55556px;
  left: 4px;
  width: 21.33333px;
  height: 14.22222px;
}
@-webkit-keyframes atebits-loader {
  0% {
    transform: rotate(0deg);
  }
  3% {
    transform: rotate(90deg);
  }
  10% {
    transform: rotate(90deg);
  }
  13% {
    transform: rotate(180deg);
  }
  20% {
    transform: rotate(180deg);
  }
  23% {
    transform: rotate(90deg);
  }
  30% {
    transform: rotate(90deg);
  }
  33% {
    transform: rotate(180deg);
  }
  40% {
    transform: rotate(180deg);
  }
  43% {
    transform: rotate(270deg);
  }
  50% {
    transform: rotate(270deg);
  }
  53% {
    transform: rotate(180deg);
  }
  60% {
    transform: rotate(180deg);
  }
  63% {
    transform: rotate(90deg);
  }
  70% {
    transform: rotate(90deg);
  }
  73% {
    transform: rotate(0deg);
  }
  80% {
    transform: rotate(0deg);
  }
  83% {
    transform: rotate(-90deg);
  }
  90% {
    transform: rotate(-90deg);
  }
  93% {
    transform: rotate(0deg);
  }
}
@keyframes atebits-loader {
  0% {
    transform: rotate(0deg);
  }
  3% {
    transform: rotate(90deg);
  }
  10% {
    transform: rotate(90deg);
  }
  13% {
    transform: rotate(180deg);
  }
  20% {
    transform: rotate(180deg);
  }
  23% {
    transform: rotate(90deg);
  }
  30% {
    transform: rotate(90deg);
  }
  33% {
    transform: rotate(180deg);
  }
  40% {
    transform: rotate(180deg);
  }
  43% {
    transform: rotate(270deg);
  }
  50% {
    transform: rotate(270deg);
  }
  53% {
    transform: rotate(180deg);
  }
  60% {
    transform: rotate(180deg);
  }
  63% {
    transform: rotate(90deg);
  }
  70% {
    transform: rotate(90deg);
  }
  73% {
    transform: rotate(0deg);
  }
  80% {
    transform: rotate(0deg);
  }
  83% {
    transform: rotate(-90deg);
  }
  90% {
    transform: rotate(-90deg);
  }
  93% {
    transform: rotate(0deg);
  }
}
/* :not(:required) hides this rule from IE9 and below */
.atebits-loader:not(:required) {
  background: rgba(0, 0, 0, 0.5);
  display: inline-block;
  width: 9px;
  height: 9px;
  overflow: hidden;
  position: relative;
  text-indent: -9999px;
  box-shadow: rgba(0, 0, 0, 0.5) -12px -12px 0 0, rgba(0, 0, 0, 0.5) 12px -12px 0 0, rgba(0, 0, 0, 0.5) -12px 0 0 0, rgba(0, 0, 0, 0.5) 12px 0 0 0, rgba(0, 0, 0, 0.5) -12px 12px 0 0, rgba(0, 0, 0, 0.5) 0 12px 0 0, rgba(0, 0, 0, 0.5) 12px 12px 0 0;
  -webkit-animation: atebits-loader 8s infinite ease-in-out;
  animation: atebits-loader 8s infinite ease-in-out;
  transform-origin: 50% 50%;
}
@-webkit-keyframes whirly-loader {
  0% {
    transform: rotate(0deg);
  }
  100% {
    transform: rotate(360deg);
  }
}
@keyframes whirly-loader {
  0% {
    transform: rotate(0deg);
  }
  100% {
    transform: rotate(360deg);
  }
}
/* :not(:required) hides this rule from IE9 and below */
.whirly-loader:not(:required) {
  overflow: hidden;
  position: relative;
  text-indent: -9999px;
  display: inline-block;
  width: 8px;
  height: 8px;
  background: transparent;
  border-radius: 100%;
  box-shadow: #e66 0px 26px 0 6px, #e66 0.90971px 26.05079px 0 5.93333px, #e66 1.82297px 26.06967px 0 5.86667px, #e66 2.73865px 26.05647px 0 5.8px, #e66 3.65561px 26.01104px 0 5.73333px, #e66 4.57274px 25.93327px 0 5.66667px, #e66 5.48887px 25.8231px 0 5.6px, #e66 6.40287px 25.68049px 0 5.53333px, #e66 7.31358px 25.50548px 0 5.46667px, #e66 8.21985px 25.2981px 0 5.4px, #e66 9.12054px 25.05847px 0 5.33333px, #e66 10.01448px 24.78672px 0 5.26667px, #e66 10.90054px 24.48302px 0 5.2px, #e66 11.77757px 24.1476px 0 5.13333px, #e66 12.64443px 23.78072px 0 5.06667px, #e66 13.5px 23.38269px 0 5px, #e66 14.34315px 22.95384px 0 4.93333px, #e66 15.17277px 22.49455px 0 4.86667px, #e66 15.98776px 22.00526px 0 4.8px, #e66 16.78704px 21.48643px 0 4.73333px, #e66 17.56953px 20.93855px 0 4.66667px, #e66 18.33418px 20.36217px 0 4.6px, #e66 19.07995px 19.75787px 0 4.53333px, #e66 19.80582px 19.12626px 0 4.46667px, #e66 20.5108px 18.468px 0 4.4px, #e66 21.1939px 17.78379px 0 4.33333px, #e66 21.85416px 17.07434px 0 4.26667px, #e66 22.49067px 16.34043px 0 4.2px, #e66 23.10251px 15.58284px 0 4.13333px, #e66 23.68881px 14.80241px 0 4.06667px, #e66 24.24871px 14px 0 4px, #e66 24.7814px 13.1765px 0 3.93333px, #e66 25.28607px 12.33284px 0 3.86667px, #e66 25.76198px 11.46997px 0 3.8px, #e66 26.2084px 10.58888px 0 3.73333px, #e66 26.62462px 9.69057px 0 3.66667px, #e66 27.01001px 8.77608px 0 3.6px, #e66 27.36392px 7.84648px 0 3.53333px, #e66 27.68577px 6.90284px 0 3.46667px, #e66 27.97502px 5.94627px 0 3.4px, #e66 28.23116px 4.97791px 0 3.33333px, #e66 28.4537px 3.99891px 0 3.26667px, #e66 28.64223px 3.01042px 0 3.2px, #e66 28.79635px 2.01364px 0 3.13333px, #e66 28.91571px 1.00976px 0 3.06667px, #e66 29px 0px 0 3px, #e66 29.04896px -1.01441px 0 2.93333px, #e66 29.06237px -2.03224px 0 2.86667px, #e66 29.04004px -3.05223px 0 2.8px, #e66 28.98185px -4.07313px 0 2.73333px, #e66 28.88769px -5.09368px 0 2.66667px, #e66 28.75754px -6.1126px 0 2.6px, #e66 28.59138px -7.12863px 0 2.53333px, #e66 28.38926px -8.14049px 0 2.46667px, #e66 28.15127px -9.1469px 0 2.4px, #e66 27.87755px -10.1466px 0 2.33333px, #e66 27.56827px -11.1383px 0 2.26667px, #e66 27.22365px -12.12075px 0 2.2px, #e66 26.84398px -13.09268px 0 2.13333px, #e66 26.42956px -14.05285px 0 2.06667px, #e66 25.98076px -15px 0 2px, #e66 25.49798px -15.93291px 0 1.93333px, #e66 24.98167px -16.85035px 0 1.86667px, #e66 24.43231px -17.75111px 0 1.8px, #e66 23.85046px -18.63402px 0 1.73333px, #e66 23.23668px -19.49789px 0 1.66667px, #e66 22.5916px -20.34157px 0 1.6px, #e66 21.91589px -21.16393px 0 1.53333px, #e66 21.21024px -21.96384px 0 1.46667px, #e66 20.4754px -22.74023px 0 1.4px, #e66 19.71215px -23.49203px 0 1.33333px, #e66 18.92133px -24.2182px 0 1.26667px, #e66 18.10379px -24.91772px 0 1.2px, #e66 17.26042px -25.58963px 0 1.13333px, #e66 16.39217px -26.23295px 0 1.06667px, #e66 15.5px -26.84679px 0 1px, #e66 14.58492px -27.43024px 0 0.93333px, #e66 13.64796px -27.98245px 0 0.86667px, #e66 12.69018px -28.50262px 0 0.8px, #e66 11.7127px -28.98995px 0 0.73333px, #e66 10.71663px -29.4437px 0 0.66667px, #e66 9.70313px -29.86317px 0 0.6px, #e66 8.67339px -30.2477px 0 0.53333px, #e66 7.6286px -30.59666px 0 0.46667px, #e66 6.57001px -30.90946px 0 0.4px, #e66 5.49886px -31.18558px 0 0.33333px, #e66 4.41643px -31.42451px 0 0.26667px, #e66 3.32401px -31.6258px 0 0.2px, #e66 2.22291px -31.78904px 0 0.13333px, #e66 1.11446px -31.91388px 0 0.06667px, #e66 0px -32px 0 0px, #e66 -1.11911px -32.04713px 0 -0.06667px, #e66 -2.24151px -32.05506px 0 -0.13333px, #e66 -3.36582px -32.02361px 0 -0.2px, #e66 -4.49065px -31.95265px 0 -0.26667px, #e66 -5.61462px -31.84212px 0 -0.33333px, #e66 -6.73634px -31.69198px 0 -0.4px, #e66 -7.8544px -31.50227px 0 -0.46667px, #e66 -8.9674px -31.27305px 0 -0.53333px, #e66 -10.07395px -31.00444px 0 -0.6px, #e66 -11.17266px -30.69663px 0 -0.66667px, #e66 -12.26212px -30.34982px 0 -0.73333px, #e66 -13.34096px -29.96429px 0 -0.8px, #e66 -14.4078px -29.54036px 0 -0.86667px, #e66 -15.46126px -29.07841px 0 -0.93333px, #e66 -16.5px -28.57884px 0 -1px, #e66 -17.52266px -28.04212px 0 -1.06667px, #e66 -18.52792px -27.46878px 0 -1.13333px, #e66 -19.51447px -26.85936px 0 -1.2px, #e66 -20.48101px -26.21449px 0 -1.26667px, #e66 -21.42625px -25.53481px 0 -1.33333px, #e66 -22.34896px -24.82104px 0 -1.4px, #e66 -23.2479px -24.07391px 0 -1.46667px, #e66 -24.12186px -23.29421px 0 -1.53333px, #e66 -24.96967px -22.48279px 0 -1.6px, #e66 -25.79016px -21.64052px 0 -1.66667px, #e66 -26.58223px -20.76831px 0 -1.73333px, #e66 -27.34477px -19.86714px 0 -1.8px, #e66 -28.07674px -18.938px 0 -1.86667px, #e66 -28.7771px -17.98193px 0 -1.93333px, #e66 -29.44486px -17px 0 -2px, #e66 -30.07908px -15.99333px 0 -2.06667px, #e66 -30.67884px -14.96307px 0 -2.13333px, #e66 -31.24325px -13.91039px 0 -2.2px, #e66 -31.7715px -12.83652px 0 -2.26667px, #e66 -32.26278px -11.74269px 0 -2.33333px, #e66 -32.71634px -10.63018px 0 -2.4px, #e66 -33.13149px -9.5003px 0 -2.46667px, #e66 -33.50755px -8.35437px 0 -2.53333px, #e66 -33.84391px -7.19374px 0 -2.6px, #e66 -34.14px -6.0198px 0 -2.66667px, #e66 -34.39531px -4.83395px 0 -2.73333px, #e66 -34.60936px -3.63759px 0 -2.8px, #e66 -34.78173px -2.43218px 0 -2.86667px, #e66 -34.91205px -1.21916px 0 -2.93333px, #e66 -35px 0px 0 -3px, #e66 -35.04531px 1.22381px 0 -3.06667px, #e66 -35.04775px 2.45078px 0 -3.13333px, #e66 -35.00717px 3.6794px 0 -3.2px, #e66 -34.92345px 4.90817px 0 -3.26667px, #e66 -34.79654px 6.13557px 0 -3.33333px, #e66 -34.62643px 7.36007px 0 -3.4px, #e66 -34.41316px 8.58016px 0 -3.46667px, #e66 -34.15683px 9.79431px 0 -3.53333px, #e66 -33.85761px 11.001px 0 -3.6px, #e66 -33.5157px 12.19872px 0 -3.66667px, #e66 -33.13137px 13.38594px 0 -3.73333px, #e66 -32.70493px 14.56117px 0 -3.8px, #e66 -32.23675px 15.72291px 0 -3.86667px, #e66 -31.72725px 16.86968px 0 -3.93333px, #e66 -31.17691px 18px 0 -4px, #e66 -30.58627px 19.11242px 0 -4.06667px, #e66 -29.95589px 20.2055px 0 -4.13333px, #e66 -29.28642px 21.27783px 0 -4.2px, #e66 -28.57852px 22.32799px 0 -4.26667px, #e66 -27.83295px 23.35462px 0 -4.33333px, #e66 -27.05047px 24.35635px 0 -4.4px, #e66 -26.23192px 25.33188px 0 -4.46667px, #e66 -25.37819px 26.27988px 0 -4.53333px, #e66 -24.49018px 27.1991px 0 -4.6px, #e66 -23.56888px 28.0883px 0 -4.66667px, #e66 -22.6153px 28.94626px 0 -4.73333px, #e66 -21.6305px 29.77183px 0 -4.8px, #e66 -20.61558px 30.56385px 0 -4.86667px, #e66 -19.57168px 31.32124px 0 -4.93333px, #e66 -18.5px 32.04294px 0 -5px, #e66 -17.40175px 32.72792px 0 -5.06667px, #e66 -16.27818px 33.37522px 0 -5.13333px, #e66 -15.1306px 33.98389px 0 -5.2px, #e66 -13.96034px 34.55305px 0 -5.26667px, #e66 -12.76875px 35.08186px 0 -5.33333px, #e66 -11.55724px 35.56951px 0 -5.4px, #e66 -10.32721px 36.01527px 0 -5.46667px, #e66 -9.08014px 36.41843px 0 -5.53333px, #e66 -7.81748px 36.77835px 0 -5.6px, #e66 -6.54075px 37.09443px 0 -5.66667px, #e66 -5.25147px 37.36612px 0 -5.73333px, #e66 -3.95118px 37.59293px 0 -5.8px, #e66 -2.64145px 37.77443px 0 -5.86667px, #e66 -1.32385px 37.91023px 0 -5.93333px;
  -webkit-animation: whirly-loader 1.25s infinite linear;
  animation: whirly-loader 1.25s infinite linear;
  transform-origin: 50% 50%;
}
@-webkit-keyframes flower-loader {
  0% {
    transform: rotate(0deg);
    box-shadow: white 0 0 15px 0, #fd8 -12px -12px 0 4px, #fd8 12px -12px 0 4px, #fd8 12px 12px 0 4px, #fd8 -12px 12px 0 4px;
  }
  50% {
    transform: rotate(1080deg);
    box-shadow: white 0 0 15px 0, #fd8 12px 12px 0 4px, #fd8 -12px 12px 0 4px, #fd8 -12px -12px 0 4px, #fd8 12px -12px 0 4px;
  }
}
@keyframes flower-loader {
  0% {
    transform: rotate(0deg);
    box-shadow: white 0 0 15px 0, #fd8 -12px -12px 0 4px, #fd8 12px -12px 0 4px, #fd8 12px 12px 0 4px, #fd8 -12px 12px 0 4px;
  }
  50% {
    transform: rotate(1080deg);
    box-shadow: white 0 0 15px 0, #fd8 12px 12px 0 4px, #fd8 -12px 12px 0 4px, #fd8 -12px -12px 0 4px, #fd8 12px -12px 0 4px;
  }
}
/* :not(:required) hides this rule from IE9 and below */
.flower-loader:not(:required) {
  overflow: hidden;
  position: relative;
  text-indent: -9999px;
  display: inline-block;
  width: 16px;
  height: 16px;
  background: #e96;
  border-radius: 100%;
  box-shadow: white 0 0 15px 0, #fd8 -12px -12px 0 4px, #fd8 12px -12px 0 4px, #fd8 12px 12px 0 4px, #fd8 -12px 12px 0 4px;
  -webkit-animation: flower-loader 5s infinite ease-in-out;
  animation: flower-loader 5s infinite ease-in-out;
  transform-origin: 50% 50%;
}
@-webkit-keyframes dots-loader {
  0% {
    box-shadow: #f86 -14px -14px 0 7px, #fc6 14px -14px 0 7px, #6d7 14px 14px 0 7px, #4ae -14px 14px 0 7px;
  }
  8.33% {
    box-shadow: #f86 14px -14px 0 7px, #fc6 14px -14px 0 7px, #6d7 14px 14px 0 7px, #4ae -14px 14px 0 7px;
  }
  16.67% {
    box-shadow: #f86 14px 14px 0 7px, #fc6 14px 14px 0 7px, #6d7 14px 14px 0 7px, #4ae -14px 14px 0 7px;
  }
  25% {
    box-shadow: #f86 -14px 14px 0 7px, #fc6 -14px 14px 0 7px, #6d7 -14px 14px 0 7px, #4ae -14px 14px 0 7px;
  }
  33.33% {
    box-shadow: #f86 -14px -14px 0 7px, #fc6 -14px 14px 0 7px, #6d7 -14px -14px 0 7px, #4ae -14px -14px 0 7px;
  }
  41.67% {
    box-shadow: #f86 14px -14px 0 7px, #fc6 -14px 14px 0 7px, #6d7 -14px -14px 0 7px, #4ae 14px -14px 0 7px;
  }
  50% {
    box-shadow: #f86 14px 14px 0 7px, #fc6 -14px 14px 0 7px, #6d7 -14px -14px 0 7px, #4ae 14px -14px 0 7px;
  }
  58.33% {
    box-shadow: #f86 -14px 14px 0 7px, #fc6 -14px 14px 0 7px, #6d7 -14px -14px 0 7px, #4ae 14px -14px 0 7px;
  }
  66.67% {
    box-shadow: #f86 -14px -14px 0 7px, #fc6 -14px -14px 0 7px, #6d7 -14px -14px 0 7px, #4ae 14px -14px 0 7px;
  }
  75% {
    box-shadow: #f86 14px -14px 0 7px, #fc6 14px -14px 0 7px, #6d7 14px -14px 0 7px, #4ae 14px -14px 0 7px;
  }
  83.33% {
    box-shadow: #f86 14px 14px 0 7px, #fc6 14px -14px 0 7px, #6d7 14px 14px 0 7px, #4ae 14px 14px 0 7px;
  }
  91.67% {
    box-shadow: #f86 -14px 14px 0 7px, #fc6 14px -14px 0 7px, #6d7 14px 14px 0 7px, #4ae -14px 14px 0 7px;
  }
  100% {
    box-shadow: #f86 -14px -14px 0 7px, #fc6 14px -14px 0 7px, #6d7 14px 14px 0 7px, #4ae -14px 14px 0 7px;
  }
}
@keyframes dots-loader {
  0% {
    box-shadow: #f86 -14px -14px 0 7px, #fc6 14px -14px 0 7px, #6d7 14px 14px 0 7px, #4ae -14px 14px 0 7px;
  }
  8.33% {
    box-shadow: #f86 14px -14px 0 7px, #fc6 14px -14px 0 7px, #6d7 14px 14px 0 7px, #4ae -14px 14px 0 7px;
  }
  16.67% {
    box-shadow: #f86 14px 14px 0 7px, #fc6 14px 14px 0 7px, #6d7 14px 14px 0 7px, #4ae -14px 14px 0 7px;
  }
  25% {
    box-shadow: #f86 -14px 14px 0 7px, #fc6 -14px 14px 0 7px, #6d7 -14px 14px 0 7px, #4ae -14px 14px 0 7px;
  }
  33.33% {
    box-shadow: #f86 -14px -14px 0 7px, #fc6 -14px 14px 0 7px, #6d7 -14px -14px 0 7px, #4ae -14px -14px 0 7px;
  }
  41.67% {
    box-shadow: #f86 14px -14px 0 7px, #fc6 -14px 14px 0 7px, #6d7 -14px -14px 0 7px, #4ae 14px -14px 0 7px;
  }
  50% {
    box-shadow: #f86 14px 14px 0 7px, #fc6 -14px 14px 0 7px, #6d7 -14px -14px 0 7px, #4ae 14px -14px 0 7px;
  }
  58.33% {
    box-shadow: #f86 -14px 14px 0 7px, #fc6 -14px 14px 0 7px, #6d7 -14px -14px 0 7px, #4ae 14px -14px 0 7px;
  }
  66.67% {
    box-shadow: #f86 -14px -14px 0 7px, #fc6 -14px -14px 0 7px, #6d7 -14px -14px 0 7px, #4ae 14px -14px 0 7px;
  }
  75% {
    box-shadow: #f86 14px -14px 0 7px, #fc6 14px -14px 0 7px, #6d7 14px -14px 0 7px, #4ae 14px -14px 0 7px;
  }
  83.33% {
    box-shadow: #f86 14px 14px 0 7px, #fc6 14px -14px 0 7px, #6d7 14px 14px 0 7px, #4ae 14px 14px 0 7px;
  }
  91.67% {
    box-shadow: #f86 -14px 14px 0 7px, #fc6 14px -14px 0 7px, #6d7 14px 14px 0 7px, #4ae -14px 14px 0 7px;
  }
  100% {
    box-shadow: #f86 -14px -14px 0 7px, #fc6 14px -14px 0 7px, #6d7 14px 14px 0 7px, #4ae -14px 14px 0 7px;
  }
}
/* :not(:required) hides this rule from IE9 and below */
.dots-loader:not(:required) {
  overflow: hidden;
  position: relative;
  text-indent: -9999px;
  display: inline-block;
  width: 7px;
  height: 7px;
  background: transparent;
  border-radius: 100%;
  box-shadow: #f86 -14px -14px 0 7px, #fc6 14px -14px 0 7px, #6d7 14px 14px 0 7px, #4ae -14px 14px 0 7px;
  -webkit-animation: dots-loader 5s infinite ease-in-out;
  animation: dots-loader 5s infinite ease-in-out;
  transform-origin: 50% 50%;
}
@-webkit-keyframes circles-loader {
  0% {
    transform: rotate(-720deg);
  }
  50% {
    transform: rotate(720deg);
  }
}
@keyframes circles-loader {
  0% {
    transform: rotate(-720deg);
  }
  50% {
    transform: rotate(720deg);
  }
}
/* :not(:required) hides this rule from IE9 and below */
.circles-loader:not(:required) {
  position: relative;
  text-indent: -9999px;
  display: inline-block;
  width: 25px;
  height: 25px;
  background: rgba(255, 204, 51, 0.9);
  border-radius: 100%;
  -webkit-animation: circles-loader 3s infinite ease-in-out;
  animation: circles-loader 3s infinite ease-in-out;
  transform-origin: 50% 100%;
}
.circles-loader:not(:required)::before {
  background: rgba(255, 102, 0, 0.6);
  border-radius: 100%;
  content: "";
  position: absolute;
  width: 25px;
  height: 25px;
  top: 18.75px;
  left: -10.82532px;
}
.circles-loader:not(:required)::after {
  background: rgba(255, 51, 0, 0.4);
  border-radius: 100%;
  content: "";
  position: absolute;
  width: 25px;
  height: 25px;
  top: 18.75px;
  left: 10.82532px;
}
@-webkit-keyframes plus-loader-top {
  2.5% {
    background: #f86;
    transform: rotateY(0deg);
    -webkit-animation-timing-function: ease-in;
    animation-timing-function: ease-in;
  }
  13.75% {
    background: #ff430d;
    transform: rotateY(90deg);
    -webkit-animation-timing-function: step-start;
    animation-timing-function: step-start;
  }
  13.76% {
    background: #ffae0d;
    transform: rotateY(90deg);
    -webkit-animation-timing-function: ease-out;
    animation-timing-function: ease-out;
  }
  25% {
    background: #fc6;
    transform: rotateY(180deg);
  }
  27.5% {
    background: #fc6;
    transform: rotateY(180deg);
    -webkit-animation-timing-function: ease-in;
    animation-timing-function: ease-in;
  }
  41.25% {
    background: #ffae0d;
    transform: rotateY(90deg);
    -webkit-animation-timing-function: step-start;
    animation-timing-function: step-start;
  }
  41.26% {
    background: #2cc642;
    transform: rotateY(90deg);
    -webkit-animation-timing-function: ease-out;
    animation-timing-function: ease-out;
  }
  50% {
    background: #6d7;
    transform: rotateY(0deg);
  }
  52.5% {
    background: #6d7;
    transform: rotateY(0deg);
    -webkit-animation-timing-function: ease-in;
    animation-timing-function: ease-in;
  }
  63.75% {
    background: #2cc642;
    transform: rotateY(90deg);
    -webkit-animation-timing-function: step-start;
    animation-timing-function: step-start;
  }
  63.76% {
    background: #1386d2;
    transform: rotateY(90deg);
    -webkit-animation-timing-function: ease-out;
    animation-timing-function: ease-out;
  }
  75% {
    background: #4ae;
    transform: rotateY(180deg);
  }
  77.5% {
    background: #4ae;
    transform: rotateY(180deg);
    -webkit-animation-timing-function: ease-in;
    animation-timing-function: ease-in;
  }
  91.25% {
    background: #1386d2;
    transform: rotateY(90deg);
    -webkit-animation-timing-function: step-start;
    animation-timing-function: step-start;
  }
  91.26% {
    background: #ff430d;
    transform: rotateY(90deg);
    -webkit-animation-timing-function: ease-in;
    animation-timing-function: ease-in;
  }
  100% {
    background: #f86;
    transform: rotateY(0deg);
    -webkit-animation-timing-function: step-start;
    animation-timing-function: step-start;
  }
}
@keyframes plus-loader-top {
  2.5% {
    background: #f86;
    transform: rotateY(0deg);
    -webkit-animation-timing-function: ease-in;
    animation-timing-function: ease-in;
  }
  13.75% {
    background: #ff430d;
    transform: rotateY(90deg);
    -webkit-animation-timing-function: step-start;
    animation-timing-function: step-start;
  }
  13.76% {
    background: #ffae0d;
    transform: rotateY(90deg);
    -webkit-animation-timing-function: ease-out;
    animation-timing-function: ease-out;
  }
  25% {
    background: #fc6;
    transform: rotateY(180deg);
  }
  27.5% {
    background: #fc6;
    transform: rotateY(180deg);
    -webkit-animation-timing-function: ease-in;
    animation-timing-function: ease-in;
  }
  41.25% {
    background: #ffae0d;
    transform: rotateY(90deg);
    -webkit-animation-timing-function: step-start;
    animation-timing-function: step-start;
  }
  41.26% {
    background: #2cc642;
    transform: rotateY(90deg);
    -webkit-animation-timing-function: ease-out;
    animation-timing-function: ease-out;
  }
  50% {
    background: #6d7;
    transform: rotateY(0deg);
  }
  52.5% {
    background: #6d7;
    transform: rotateY(0deg);
    -webkit-animation-timing-function: ease-in;
    animation-timing-function: ease-in;
  }
  63.75% {
    background: #2cc642;
    transform: rotateY(90deg);
    -webkit-animation-timing-function: step-start;
    animation-timing-function: step-start;
  }
  63.76% {
    background: #1386d2;
    transform: rotateY(90deg);
    -webkit-animation-timing-function: ease-out;
    animation-timing-function: ease-out;
  }
  75% {
    background: #4ae;
    transform: rotateY(180deg);
  }
  77.5% {
    background: #4ae;
    transform: rotateY(180deg);
    -webkit-animation-timing-function: ease-in;
    animation-timing-function: ease-in;
  }
  91.25% {
    background: #1386d2;
    transform: rotateY(90deg);
    -webkit-animation-timing-function: step-start;
    animation-timing-function: step-start;
  }
  91.26% {
    background: #ff430d;
    transform: rotateY(90deg);
    -webkit-animation-timing-function: ease-in;
    animation-timing-function: ease-in;
  }
  100% {
    background: #f86;
    transform: rotateY(0deg);
    -webkit-animation-timing-function: step-start;
    animation-timing-function: step-start;
  }
}
@-webkit-keyframes plus-loader-bottom {
  0% {
    background: #fc6;
    -webkit-animation-timing-function: step-start;
    animation-timing-function: step-start;
  }
  50% {
    background: #fc6;
    -webkit-animation-timing-function: step-start;
    animation-timing-function: step-start;
  }
  75% {
    background: #4ae;
    -webkit-animation-timing-function: step-start;
    animation-timing-function: step-start;
  }
  100% {
    background: #4ae;
    -webkit-animation-timing-function: step-start;
    animation-timing-function: step-start;
  }
}
@keyframes plus-loader-bottom {
  0% {
    background: #fc6;
    -webkit-animation-timing-function: step-start;
    animation-timing-function: step-start;
  }
  50% {
    background: #fc6;
    -webkit-animation-timing-function: step-start;
    animation-timing-function: step-start;
  }
  75% {
    background: #4ae;
    -webkit-animation-timing-function: step-start;
    animation-timing-function: step-start;
  }
  100% {
    background: #4ae;
    -webkit-animation-timing-function: step-start;
    animation-timing-function: step-start;
  }
}
@-webkit-keyframes plus-loader-background {
  0% {
    background: #f86;
    transform: rotateZ(180deg);
  }
  25% {
    background: #f86;
    transform: rotateZ(180deg);
    -webkit-animation-timing-function: step-start;
    animation-timing-function: step-start;
  }
  27.5% {
    background: #6d7;
    transform: rotateZ(90deg);
  }
  50% {
    background: #6d7;
    transform: rotateZ(90deg);
    -webkit-animation-timing-function: step-start;
    animation-timing-function: step-start;
  }
  52.5% {
    background: #6d7;
    transform: rotateZ(0deg);
  }
  75% {
    background: #6d7;
    transform: rotateZ(0deg);
    -webkit-animation-timing-function: step-start;
    animation-timing-function: step-start;
  }
  77.5% {
    background: #f86;
    transform: rotateZ(270deg);
  }
  100% {
    background: #f86;
    transform: rotateZ(270deg);
    -webkit-animation-timing-function: step-start;
    animation-timing-function: step-start;
  }
}
@keyframes plus-loader-background {
  0% {
    background: #f86;
    transform: rotateZ(180deg);
  }
  25% {
    background: #f86;
    transform: rotateZ(180deg);
    -webkit-animation-timing-function: step-start;
    animation-timing-function: step-start;
  }
  27.5% {
    background: #6d7;
    transform: rotateZ(90deg);
  }
  50% {
    background: #6d7;
    transform: rotateZ(90deg);
    -webkit-animation-timing-function: step-start;
    animation-timing-function: step-start;
  }
  52.5% {
    background: #6d7;
    transform: rotateZ(0deg);
  }
  75% {
    background: #6d7;
    transform: rotateZ(0deg);
    -webkit-animation-timing-function: step-start;
    animation-timing-function: step-start;
  }
  77.5% {
    background: #f86;
    transform: rotateZ(270deg);
  }
  100% {
    background: #f86;
    transform: rotateZ(270deg);
    -webkit-animation-timing-function: step-start;
    animation-timing-function: step-start;
  }
}
/* :not(:required) hides this rule from IE9 and below */
.plus-loader:not(:required) {
  overflow: hidden;
  position: relative;
  text-indent: -9999px;
  display: inline-block;
  width: 48px;
  height: 48px;
  background: #f86;
  border-radius: 24px;
  transform: rotateZ(90deg);
  transform-origin: 50% 50%;
  -webkit-animation: plus-loader-background 3s infinite ease-in-out;
  animation: plus-loader-background 3s infinite ease-in-out;
}
.plus-loader:not(:required)::after {
  background: #f86;
  border-radius: 24px 0 0 24px;
  content: "";
  position: absolute;
  right: 50%;
  top: 0;
  width: 50%;
  height: 100%;
  transform-origin: 100% 50%;
  -webkit-animation: plus-loader-top 3s infinite linear;
  animation: plus-loader-top 3s infinite linear;
}
.plus-loader:not(:required)::before {
  background: #fc6;
  border-radius: 24px 0 0 24px;
  content: "";
  position: absolute;
  right: 50%;
  top: 0;
  width: 50%;
  height: 100%;
  transform-origin: 100% 50%;
  -webkit-animation: plus-loader-bottom 3s infinite linear;
  animation: plus-loader-bottom 3s infinite linear;
}
@-webkit-keyframes hexdots-loader {
  0% {
    box-shadow: #073829 0 -30px 0 7px, #999 0 -30px 0 7px, #999 26px -15px 0 7px, #999 26px 15px 0 7px, #999 0 30px 0 7px, #999 -26px 15px 0 7px, #999 -26px -15px 0 7px;
  }
  8.33% {
    box-shadow: #073829 26px -15px 0 7px, #999 26px -15px 0 7px, #999 26px -15px 0 7px, #999 26px 15px 0 7px, #999 0 30px 0 7px, #999 -26px 15px 0 7px, #999 -26px -15px 0 7px;
  }
  16.67% {
    box-shadow: #073829 26px 15px 0 7px, #999 26px 15px 0 7px, #999 26px 15px 0 7px, #999 26px 15px 0 7px, #999 0 30px 0 7px, #999 -26px 15px 0 7px, #999 -26px -15px 0 7px;
  }
  25% {
    box-shadow: #073829 0 30px 0 7px, #999 0 30px 0 7px, #999 0 30px 0 7px, #999 0 30px 0 7px, #999 0 30px 0 7px, #999 -26px 15px 0 7px, #999 -26px -15px 0 7px;
  }
  33.33% {
    box-shadow: #073829 -26px 15px 0 7px, #999 -26px 15px 0 7px, #999 -26px 15px 0 7px, #999 -26px 15px 0 7px, #999 -26px 15px 0 7px, #999 -26px 15px 0 7px, #999 -26px -15px 0 7px;
  }
  41.67% {
    box-shadow: #073829 -26px -15px 0 7px, #999 -26px -15px 0 7px, #999 -26px -15px 0 7px, #999 -26px -15px 0 7px, #999 -26px -15px 0 7px, #999 -26px -15px 0 7px, #999 -26px -15px 0 7px;
  }
  50% {
    box-shadow: #073829 0 -30px 0 7px, #999 0 -30px 0 7px, #999 0 -30px 0 7px, #999 0 -30px 0 7px, #999 0 -30px 0 7px, #999 0 -30px 0 7px, #999 0 -30px 0 7px;
  }
  58.33% {
    box-shadow: #073829 26px -15px 0 7px, #999 0 -30px 0 7px, #999 26px -15px 0 7px, #999 26px -15px 0 7px, #999 26px -15px 0 7px, #999 26px -15px 0 7px, #999 26px -15px 0 7px;
  }
  66.67% {
    box-shadow: #073829 26px 15px 0 7px, #999 0 -30px 0 7px, #999 26px -15px 0 7px, #999 26px 15px 0 7px, #999 26px 15px 0 7px, #999 26px 15px 0 7px, #999 26px 15px 0 7px;
  }
  75% {
    box-shadow: #073829 0 30px 0 7px, #999 0 -30px 0 7px, #999 26px -15px 0 7px, #999 26px 15px 0 7px, #999 0 30px 0 7px, #999 0 30px 0 7px, #999 0 30px 0 7px;
  }
  83.33% {
    box-shadow: #073829 -26px 15px 0 7px, #999 0 -30px 0 7px, #999 26px -15px 0 7px, #999 26px 15px 0 7px, #999 0 30px 0 7px, #999 -26px 15px 0 7px, #999 -26px 15px 0 7px;
  }
  91.67% {
    box-shadow: #073829 -26px -15px 0 7px, #999 0 -30px 0 7px, #999 26px -15px 0 7px, #999 26px 15px 0 7px, #999 0 30px 0 7px, #999 -26px 15px 0 7px, #999 -26px -15px 0 7px;
  }
  100% {
    box-shadow: #073829 0 -30px 0 7px, #999 0 -30px 0 7px, #999 26px -15px 0 7px, #999 26px 15px 0 7px, #999 0 30px 0 7px, #999 -26px 15px 0 7px, #999 -26px -15px 0 7px;
  }
}
@keyframes hexdots-loader {
  0% {
    box-shadow: #073829 0 -30px 0 7px, #999 0 -30px 0 7px, #999 26px -15px 0 7px, #999 26px 15px 0 7px, #999 0 30px 0 7px, #999 -26px 15px 0 7px, #999 -26px -15px 0 7px;
  }
  8.33% {
    box-shadow: #073829 26px -15px 0 7px, #999 26px -15px 0 7px, #999 26px -15px 0 7px, #999 26px 15px 0 7px, #999 0 30px 0 7px, #999 -26px 15px 0 7px, #999 -26px -15px 0 7px;
  }
  16.67% {
    box-shadow: #073829 26px 15px 0 7px, #999 26px 15px 0 7px, #999 26px 15px 0 7px, #999 26px 15px 0 7px, #999 0 30px 0 7px, #999 -26px 15px 0 7px, #999 -26px -15px 0 7px;
  }
  25% {
    box-shadow: #073829 0 30px 0 7px, #999 0 30px 0 7px, #999 0 30px 0 7px, #999 0 30px 0 7px, #999 0 30px 0 7px, #999 -26px 15px 0 7px, #999 -26px -15px 0 7px;
  }
  33.33% {
    box-shadow: #073829 -26px 15px 0 7px, #999 -26px 15px 0 7px, #999 -26px 15px 0 7px, #999 -26px 15px 0 7px, #999 -26px 15px 0 7px, #999 -26px 15px 0 7px, #999 -26px -15px 0 7px;
  }
  41.67% {
    box-shadow: #073829 -26px -15px 0 7px, #999 -26px -15px 0 7px, #999 -26px -15px 0 7px, #999 -26px -15px 0 7px, #999 -26px -15px 0 7px, #999 -26px -15px 0 7px, #999 -26px -15px 0 7px;
  }
  50% {
    box-shadow: #073829 0 -30px 0 7px, #999 0 -30px 0 7px, #999 0 -30px 0 7px, #999 0 -30px 0 7px, #999 0 -30px 0 7px, #999 0 -30px 0 7px, #999 0 -30px 0 7px;
  }
  58.33% {
    box-shadow: #073829 26px -15px 0 7px, #999 0 -30px 0 7px, #999 26px -15px 0 7px, #999 26px -15px 0 7px, #999 26px -15px 0 7px, #999 26px -15px 0 7px, #999 26px -15px 0 7px;
  }
  66.67% {
    box-shadow: #073829 26px 15px 0 7px, #999 0 -30px 0 7px, #999 26px -15px 0 7px, #999 26px 15px 0 7px, #999 26px 15px 0 7px, #999 26px 15px 0 7px, #999 26px 15px 0 7px;
  }
  75% {
    box-shadow: #073829 0 30px 0 7px, #999 0 -30px 0 7px, #999 26px -15px 0 7px, #999 26px 15px 0 7px, #999 0 30px 0 7px, #999 0 30px 0 7px, #999 0 30px 0 7px;
  }
  83.33% {
    box-shadow: #073829 -26px 15px 0 7px, #999 0 -30px 0 7px, #999 26px -15px 0 7px, #999 26px 15px 0 7px, #999 0 30px 0 7px, #999 -26px 15px 0 7px, #999 -26px 15px 0 7px;
  }
  91.67% {
    box-shadow: #073829 -26px -15px 0 7px, #999 0 -30px 0 7px, #999 26px -15px 0 7px, #999 26px 15px 0 7px, #999 0 30px 0 7px, #999 -26px 15px 0 7px, #999 -26px -15px 0 7px;
  }
  100% {
    box-shadow: #073829 0 -30px 0 7px, #999 0 -30px 0 7px, #999 26px -15px 0 7px, #999 26px 15px 0 7px, #999 0 30px 0 7px, #999 -26px 15px 0 7px, #999 -26px -15px 0 7px;
  }
}
/* :not(:required) hides this rule from IE9 and below */
.hexdots-loader:not(:required) {
  overflow: hidden;
  position: relative;
  text-indent: -9999px;
  display: inline-block;
  width: 7px;
  height: 7px;
  background: transparent;
  border-radius: 100%;
  box-shadow: #073829 0 -30px 0 7px, #999 26px -15px 0 7px, #999 26px 15px 0 7px, #999 0 30px 0 7px, #999 0 30px 0 7px, #999 0 30px 0 7px;
  -webkit-animation: hexdots-loader 5s infinite ease-in-out;
  animation: hexdots-loader 5s infinite ease-in-out;
  transform-origin: 50% 50%;
}

/* :not(:required) hides this rule from IE9 and below */
.inner-circles-loader:not(:required) {
  transform: translate3d(0, 0, 0);
  position: relative;
  display: inline-block;
  width: 50px;
  height: 50px;
  background: rgba(25, 165, 152, 0.5);
  border-radius: 50%;
  overflow: hidden;
  text-indent: -9999px;
  /* Hides inner circles outside base circle at safari */
  -webkit-mask-image: url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAEAAAABCAIAAACQd1PeAAAAGXRFWHRTb2Z0d2FyZQBBZG9iZSBJbWFnZVJlYWR5ccllPAAAAA5JREFUeNpiYGBgAAgwAAAEAAGbA+oJAAAAAElFTkSuQmCC);
}
.inner-circles-loader:not(:required):before, .inner-circles-loader:not(:required):after {
  content: "";
  position: absolute;
  top: 0;
  display: inline-block;
  width: 50px;
  height: 50px;
  border-radius: 50%;
}
.inner-circles-loader:not(:required):before {
  -webkit-animation: inner-circles-loader 3s infinite;
  animation: inner-circles-loader 3s infinite;
  transform-origin: 0 50%;
  left: 0;
  background: #c7efcf;
}
.inner-circles-loader:not(:required):after {
  -webkit-animation: inner-circles-loader 3s 0.2s reverse infinite;
  animation: inner-circles-loader 3s 0.2s reverse infinite;
  transform-origin: 100% 50%;
  right: 0;
  background: #eef5db;
}
@-webkit-keyframes inner-circles-loader {
  0% {
    transform: rotate(0deg);
  }
  50% {
    transform: rotate(360deg);
  }
  100% {
    transform: rotate(0deg);
  }
}
@keyframes inner-circles-loader {
  0% {
    transform: rotate(0deg);
  }
  50% {
    transform: rotate(360deg);
  }
  100% {
    transform: rotate(0deg);
  }
}
.pulse-loader:not(:required) {
  display: inline-block;
  width: 50px;
  height: 50px;
  -webkit-animation: pulse-loader 0.7s linear infinite alternate;
  animation: pulse-loader 0.7s linear infinite alternate;
  border: 0px solid #073829;
  border-radius: 50%;
  overflow: hidden;
  text-indent: 50px;
}
@-webkit-keyframes pulse-loader {
  0% {
    box-shadow: #073829 0 0 0px 20px;
  }
  40% {
    box-shadow: none;
  }
  100% {
    box-shadow: #073829 0 0 0px 25px inset;
  }
}
@keyframes pulse-loader {
  0% {
    box-shadow: #073829 0 0 0px 20px;
  }
  40% {
    box-shadow: none;
  }
  100% {
    box-shadow: #073829 0 0 0px 25px inset;
  }
}
.row {
  margin-top: 50px;
}

.col-sm-2 {
  height: 100px;
}

#loading {
  position: fixed;
  overflow: hidden;
  width: 100vw;
  height: 100vh;
  top: 0;
  left: 0;
  z-index: 1000;
}
#loading.bg_grd:after {
  content: "";
  position: fixed;
  width: 100vw;
  height: 100vh;
  top: 0;
  left: 0;
  z-index: -1;
  background: rgb(2, 133, 135);
  background: linear-gradient(90deg, rgb(2, 133, 135) 0%, rgb(97, 169, 210) 63%);
}
#loading.bg_grd .wrap img {
  filter: brightness(0) invert(0);
}
#loading.bg_white:after {
  content: "";
  position: fixed;
  width: 100vw;
  height: 100vh;
  top: 0;
  left: 0;
  z-index: -1;
  background-color: #fff;
}
#loading.bg_white .wrap img {
  filter: brightness(0) invert(0);
}
#loading:before {
  content: "";
  position: fixed;
  width: 100vw;
  height: 100vh;
  top: 0;
  left: 0;
  background-color: #fff;
  z-index: -2;
}
#loading .wrap {
  display: flex;
  justify-content: center;
  flex-direction: column;
  align-items: center;
  width: 100vw;
  height: 100vh;
}
#loading .wrap img {
  filter: brightness(0) invert(1);
}
#loading .opening {
  position: fixed;
  background-color: #073829;
  top: 0;
  left: 0;
  right: 0;
  width: 100vw;
  height: 100vh;
  z-index: -1;
}
#loading .splash_l,
#loading .splash_r {
  position: fixed;
  background-color: #073829;
  top: 0;
  width: 50vw;
  height: 100vh;
  z-index: -1;
}
#loading .splash_l {
  left: 0;
  margin-right: auto;
  right: inherit;
  z-index: -1;
}
#loading .splash_r {
  margin-left: auto;
  right: 0;
  left: inherit;
  z-index: -2;
}
#loading.loaded {
  visibility: hidden;
  transition: all 0.2s;
}
#loading.loaded:before {
  opacity: 0;
  visibility: hidden;
  transition: all 0.8s;
  transition-delay: 0.4s;
}
#loading.loaded .wrap {
  opacity: 0;
  visibility: hidden;
  display: none;
  transition: all 0.2s;
}
#loading.loaded .opening {
  transition: all 0.8s;
  transform: translateY(-100%);
}
#loading.loaded .splash_l,
#loading.loaded .splash_r {
  transition: all 0.4s;
}
#loading.loaded .splash_l {
  left: 0;
  transform: translateX(-100%);
}
#loading.loaded .splash_r {
  right: 0;
  transform: translateX(100%);
}

.oops_zoomout {
  z-index: 1;
  opacity: 0;
}
.oops_zoomout.on {
  -webkit-animation: oops_zoomout 2.3s ease-out 1.2s forwards;
  animation: oops_zoomout 2.3s ease-out 1.2s forwards;
  transition: 2.3s;
}

@-webkit-keyframes oops_zoomout {
  0% {
    transform: scale(1.3, 1.3);
    opacity: 0;
  }
  100% {
    transform: scale(1);
    opacity: 1;
  }
}
@keyframes oops_zoomout {
  0% {
    transform: scale(1.3, 1.3);
    opacity: 0;
  }
  100% {
    transform: scale(1);
    opacity: 1;
  }
}
.oops_standup {
  z-index: 1;
  opacity: 0;
}
.oops_standup.on {
  -webkit-animation: oops_standup 1.3s ease-out 1.2s forwards;
  animation: oops_standup 1.3s ease-out 1.2s forwards;
  transition: 1.3s;
}

@-webkit-keyframes oops_standup {
  0% {
    transform: scaleY(0.3);
    opacity: 0;
  }
  100% {
    transform: scaleY(1);
    opacity: 1;
  }
}
@keyframes oops_standup {
  0% {
    transform: scaleY(0.3);
    opacity: 0;
  }
  100% {
    transform: scaleY(1);
    opacity: 1;
  }
}
.oops_fade,
.oops_fade2,
.oops_fade3 {
  z-index: 1;
  opacity: 0;
}
.oops_fade.on,
.oops_fade2.on,
.oops_fade3.on {
  transition: 2.3s;
  -webkit-animation: oops_fade 2.3s ease-out 1.2s forwards;
  animation: oops_fade 2.3s ease-out 1.2s forwards;
}

@-webkit-keyframes oops_fade {
  0% {
    opacity: 0;
  }
  100% {
    opacity: 1;
  }
}
@keyframes oops_fade {
  0% {
    opacity: 0;
  }
  100% {
    opacity: 1;
  }
}
.oops_fadeup,
.oops_fadeup2,
.oops_fadeup3,
.oops_fadeup4 {
  z-index: 1;
  opacity: 0;
}
.oops_fadeup.on,
.oops_fadeup2.on,
.oops_fadeup3.on,
.oops_fadeup4.on {
  transition: 2.3s;
  -webkit-animation: oops_fadeup 2.3s ease-out 1.2s forwards;
  animation: oops_fadeup 2.3s ease-out 1.2s forwards;
}

@-webkit-keyframes oops_fadeup {
  0% {
    transform: translateY(50px);
    opacity: 0;
  }
  100% {
    transform: translateY(0px);
    opacity: 1;
  }
}
@keyframes oops_fadeup {
  0% {
    transform: translateY(50px);
    opacity: 0;
  }
  100% {
    transform: translateY(0px);
    opacity: 1;
  }
}
.oops_fadedown {
  z-index: 1;
  opacity: 0;
}
.oops_fadedown.on {
  transition: 2.3s;
  -webkit-animation: oops_fadedown 2.3s ease-out 1.2s forwards;
  animation: oops_fadedown 2.3s ease-out 1.2s forwards;
}

@-webkit-keyframes oops_fadedown {
  0% {
    transform: translateY(-50px);
    opacity: 0;
  }
  100% {
    transform: translateY(0px);
    opacity: 1;
  }
}
@keyframes oops_fadedown {
  0% {
    transform: translateY(-50px);
    opacity: 0;
  }
  100% {
    transform: translateY(0px);
    opacity: 1;
  }
}
.oops_fadeleft {
  z-index: 1;
  opacity: 0;
}
.oops_fadeleft.on {
  transition: 2.3s;
  -webkit-animation: oops_fadeleft 2.3s ease-out 1.2s forwards;
  animation: oops_fadeleft 2.3s ease-out 1.2s forwards;
}
@-webkit-keyframes oops_fadeleft {
  0% {
    transform: translate(-100px);
    opacity: 0;
  }
  100% {
    transform: translate(0px);
    opacity: 1;
  }
}
@keyframes oops_fadeleft {
  0% {
    transform: translate(-100px);
    opacity: 0;
  }
  100% {
    transform: translate(0px);
    opacity: 1;
  }
}
.animation {
  opacity: 0;
}

.slideup.on {
  opacity: 1;
  -webkit-animation: view-slideup 0.65s cubic-bezier(0.2, 1, 0.2, 1);
          animation: view-slideup 0.65s cubic-bezier(0.2, 1, 0.2, 1);
}

.zoomin.on {
  opacity: 1;
  -webkit-animation: view-zoomin 0.65s cubic-bezier(0.2, 1, 0.2, 1);
          animation: view-zoomin 0.65s cubic-bezier(0.2, 1, 0.2, 1);
}

.fadeUpTrigger {
  opacity: 0;
}

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

@-webkit-keyframes fadeUpAnime {
  from {
    opacity: 0;
    transform: translateY(100px);
  }
  to {
    opacity: 1;
    transform: translateY(0);
  }
}

@keyframes fadeUpAnime {
  from {
    opacity: 0;
    transform: translateY(100px);
  }
  to {
    opacity: 1;
    transform: translateY(0);
  }
}
.gradient {
  background: rgb(2, 133, 135);
  background: linear-gradient(90deg, rgb(2, 133, 135) 0%, rgb(97, 169, 210) 63%);
  background-size: 600% 600%;
  -webkit-animation: anim-gradient 10s ease infinite;
          animation: anim-gradient 10s ease infinite;
}

@-webkit-keyframes anim-gradient {
  0% {
    background-position: 0% 50%;
  }
  50% {
    background-position: 100% 50%;
  }
  100% {
    background-position: 0% 50%;
  }
}

@keyframes anim-gradient {
  0% {
    background-position: 0% 50%;
  }
  50% {
    background-position: 100% 50%;
  }
  100% {
    background-position: 0% 50%;
  }
}
.scroll-parent {
  position: relative;
  width: 100vw;
  height: 20em;
  overflow-x: hidden;
}
.scroll-parent .scroll-element {
  width: inherit;
  height: 20em;
  position: absolute;
  left: 0%;
  top: 0%;
  -webkit-animation: primary 33s linear infinite;
          animation: primary 33s linear infinite;
}
.scroll-parent .scroll-element img {
  width: 100%;
  height: 100%;
  -o-object-fit: contain;
     object-fit: contain;
}
.scroll-parent .primary {
  -webkit-animation: primary 33s linear infinite;
          animation: primary 33s linear infinite;
}
.scroll-parent .secondary {
  -webkit-animation: secondary 33s linear infinite;
          animation: secondary 33s linear infinite;
}
.scroll-parent.right .scroll-element {
  left: inherit;
  right: 0%;
}
.scroll-parent.right .primary {
  -webkit-animation: primary2 33s linear infinite;
          animation: primary2 33s linear infinite;
}
.scroll-parent.right .secondary {
  -webkit-animation: secondary2 33s linear infinite;
          animation: secondary2 33s linear infinite;
}

@-webkit-keyframes primary {
  from {
    left: 0%;
  }
  to {
    left: -100%;
  }
}

@keyframes primary {
  from {
    left: 0%;
  }
  to {
    left: -100%;
  }
}
@-webkit-keyframes secondary {
  from {
    left: 100%;
  }
  to {
    left: 0%;
  }
}
@keyframes secondary {
  from {
    left: 100%;
  }
  to {
    left: 0%;
  }
}
@-webkit-keyframes primary2 {
  from {
    right: 0%;
  }
  to {
    right: -100%;
  }
}
@keyframes primary2 {
  from {
    right: 0%;
  }
  to {
    right: -100%;
  }
}
@-webkit-keyframes secondary2 {
  from {
    right: 100%;
  }
  to {
    right: 0%;
  }
}
@keyframes secondary2 {
  from {
    right: 100%;
  }
  to {
    right: 0%;
  }
}
/*アニメーション前の指定*/
#mask path {
  transition: fill-opacity 0.5s;
  /*カラーがつく際のアニメーション0.5秒で変化*/
  fill: #073829;
  /*塗りがない状態*/
  stroke: #073829;
  /*線の色*/
}

/*アニメーション後に.doneというクラス名がで付与された時の指定*/
#mask.done path {
  fill: #073829;
  /*塗りの色*/
  fill-opacity: 1;
  /*透過1で見える状態*/
  stroke: none;
  /*線の色なし*/
}

.cls-1 {
  fill: #073829;
}

.arrow-line {
  position: absolute;
  color: #fff;
  display: inline-block;
  text-decoration: none;
  outline: none;
  width: 40%;
  bottom: 20px;
  margin: 0 auto;
  left: 0;
  right: 0;
}
@media all and (max-width: 896px) {
  .arrow-line {
    width: 40%;
    bottom: 20px;
  }
}
@media all and (max-width: 639px) {
  .arrow-line {
    width: 50%;
    bottom: 20px;
  }
}
.arrow-line:before {
  content: "";
  position: absolute;
  bottom: 0;
  width: 200px;
  height: 1px;
  background: #fff;
}
.arrow-line:after {
  content: "";
  position: absolute;
  bottom: -2px;
  right: -300px;
  width: 21px;
  height: 11px;
  border-top: 1px solid #fff;
  transform: rotate(45deg);
}
@media all and (max-width: 639px) {
  .arrow-line:after {
    bottom: -3px;
    width: 18px;
  }
}
.arrow-line:before {
  -webkit-animation: arrowlong01 2s ease infinite;
          animation: arrowlong01 2s ease infinite;
}
.arrow-line:after {
  -webkit-animation: arrowlong02 2s ease infinite;
          animation: arrowlong02 2s ease infinite;
}

@-webkit-keyframes arrowlong01 {
  0% {
    width: 0;
    opacity: 0;
  }
  20% {
    width: 0;
    opacity: 1;
  }
  80% {
    width: 105%;
    opacity: 1;
  }
  100% {
    width: 105%;
    opacity: 0;
  }
}

@keyframes arrowlong01 {
  0% {
    width: 0;
    opacity: 0;
  }
  20% {
    width: 0;
    opacity: 1;
  }
  80% {
    width: 105%;
    opacity: 1;
  }
  100% {
    width: 105%;
    opacity: 0;
  }
}
@-webkit-keyframes arrowlong02 {
  0% {
    left: 0;
    opacity: 0;
  }
  20% {
    left: 0;
    opacity: 1;
  }
  80% {
    left: 100%;
    opacity: 1;
  }
  100% {
    left: 100%;
    opacity: 0;
  }
}
@keyframes arrowlong02 {
  0% {
    left: 0;
    opacity: 0;
  }
  20% {
    left: 0;
    opacity: 1;
  }
  80% {
    left: 100%;
    opacity: 1;
  }
  100% {
    left: 100%;
    opacity: 0;
  }
}
.blinking {
  -webkit-animation: blink 1.5s ease-in-out infinite alternate;
  animation: blink 1.5s ease-in-out infinite alternate;
}

@-webkit-keyframes blink {
  0% {
    opacity: 0;
  }
  100% {
    opacity: 1;
  }
}
@keyframes blink {
  0% {
    opacity: 0;
  }
  100% {
    opacity: 1;
  }
}
.fadeout {
  -webkit-animation: fadeout 0.5s ease-in-out infinite alternate;
  animation: fadeout 0.5s ease-in-out infinite alternate;
}

@-webkit-keyframes popup {
  0% {
    opacity: 0;
  }
  50% {
    opacity: 1;
  }
}
@keyframes popup {
  0% {
    opacity: 0;
  }
  100% {
    opacity: 1;
  }
}
.fadeout {
  -webkit-animation-name: fadeout-transform-keyframes;
          animation-name: fadeout-transform-keyframes;
  -webkit-animation-duration: 3000ms;
          animation-duration: 3000ms;
  -webkit-animation-delay: 100ms;
          animation-delay: 100ms;
  -webkit-animation-fill-mode: backwards;
          animation-fill-mode: backwards;
  -webkit-animation-timing-function: linear;
          animation-timing-function: linear;
  -webkit-animation-iteration-count: infinite;
          animation-iteration-count: infinite;
  -webkit-animation-direction: normal;
          animation-direction: normal;
  transform-origin: 0 0;
  display: inline-block;
}

@-webkit-keyframes fadeout-transform-keyframes {
  0% {
    transform: translate(-100px, -40px) scale(2.8) rotateX(0deg) rotateY(0deg) rotateZ(0deg);
    -webkit-animation-timing-function: cubic-bezier(0.1, 0.1, 0.1, 0.1);
            animation-timing-function: cubic-bezier(0.1, 0.1, 0.1, 0.1);
    opacity: 0;
  }
  15.0% {
    transform: translate(0px, 0px) scale(1) rotateX(0deg) rotateY(0deg) rotateZ(0deg);
    opacity: 1;
  }
  66.67% {
    transform: translate(0px, 0px) scale(1) rotateX(0deg) rotateY(0deg) rotateZ(0deg);
    -webkit-animation-timing-function: cubic-bezier(0.25, 0.25, 0.75, 0.75);
            animation-timing-function: cubic-bezier(0.25, 0.25, 0.75, 0.75);
    opacity: 1;
  }
  100% {
    transform: translate(10px, 0px) scale(0.8) rotateX(0deg) rotateY(0deg) rotateZ(0deg);
    opacity: 0;
  }
}

@keyframes fadeout-transform-keyframes {
  0% {
    transform: translate(-100px, -40px) scale(2.8) rotateX(0deg) rotateY(0deg) rotateZ(0deg);
    -webkit-animation-timing-function: cubic-bezier(0.1, 0.1, 0.1, 0.1);
            animation-timing-function: cubic-bezier(0.1, 0.1, 0.1, 0.1);
    opacity: 0;
  }
  15.0% {
    transform: translate(0px, 0px) scale(1) rotateX(0deg) rotateY(0deg) rotateZ(0deg);
    opacity: 1;
  }
  66.67% {
    transform: translate(0px, 0px) scale(1) rotateX(0deg) rotateY(0deg) rotateZ(0deg);
    -webkit-animation-timing-function: cubic-bezier(0.25, 0.25, 0.75, 0.75);
            animation-timing-function: cubic-bezier(0.25, 0.25, 0.75, 0.75);
    opacity: 1;
  }
  100% {
    transform: translate(10px, 0px) scale(0.8) rotateX(0deg) rotateY(0deg) rotateZ(0deg);
    opacity: 0;
  }
}
.popup {
  -webkit-animation: popup 0.5s ease-in-out infinite alternate;
  animation: popup 0.5s ease-in-out infinite alternate;
}

@-webkit-keyframes popup {
  0% {
    opacity: 0;
  }
  50% {
    opacity: 1;
  }
}
@keyframes popup {
  0% {
    opacity: 0;
  }
  100% {
    opacity: 1;
  }
}
.popup {
  -webkit-animation-name: popup-transform-keyframes;
          animation-name: popup-transform-keyframes;
  -webkit-animation-duration: 3000ms;
          animation-duration: 3000ms;
  -webkit-animation-delay: 100ms;
          animation-delay: 100ms;
  -webkit-animation-fill-mode: backwards;
          animation-fill-mode: backwards;
  -webkit-animation-timing-function: linear;
          animation-timing-function: linear;
  -webkit-animation-iteration-count: infinite;
          animation-iteration-count: infinite;
  -webkit-animation-direction: normal;
          animation-direction: normal;
  transform-origin: 0 0;
  display: inline-block;
}

@-webkit-keyframes popup-transform-keyframes {
  0% {
    transform: translate(0px, 0px) scale(1) rotateX(0deg) rotateY(0deg) rotateZ(0deg) translate(0%, 0%);
    -webkit-animation-timing-function: cubic-bezier(0.25, 0.25, 0.75, 0.75);
            animation-timing-function: cubic-bezier(0.25, 0.25, 0.75, 0.75);
    opacity: 0;
  }
  33.33% {
    transform: translate(0px, -20px) scale(1) rotateX(0deg) rotateY(0deg) rotateZ(0deg) translate(0%, 0%);
    opacity: 1;
  }
  66.67% {
    transform: translate(0px, -20px) scale(1) rotateX(0deg) rotateY(0deg) rotateZ(0deg) translate(0%, 0%);
    -webkit-animation-timing-function: cubic-bezier(0.25, 0.25, 0.75, 0.75);
            animation-timing-function: cubic-bezier(0.25, 0.25, 0.75, 0.75);
    opacity: 1;
  }
  100% {
    transform: translate(8px, -15px) scale(0.8) rotateX(0deg) rotateY(0deg) rotateZ(0deg) translate(0%, 0%);
    opacity: 0;
  }
}

@keyframes popup-transform-keyframes {
  0% {
    transform: translate(0px, 0px) scale(1) rotateX(0deg) rotateY(0deg) rotateZ(0deg) translate(0%, 0%);
    -webkit-animation-timing-function: cubic-bezier(0.25, 0.25, 0.75, 0.75);
            animation-timing-function: cubic-bezier(0.25, 0.25, 0.75, 0.75);
    opacity: 0;
  }
  33.33% {
    transform: translate(0px, -20px) scale(1) rotateX(0deg) rotateY(0deg) rotateZ(0deg) translate(0%, 0%);
    opacity: 1;
  }
  66.67% {
    transform: translate(0px, -20px) scale(1) rotateX(0deg) rotateY(0deg) rotateZ(0deg) translate(0%, 0%);
    -webkit-animation-timing-function: cubic-bezier(0.25, 0.25, 0.75, 0.75);
            animation-timing-function: cubic-bezier(0.25, 0.25, 0.75, 0.75);
    opacity: 1;
  }
  100% {
    transform: translate(8px, -15px) scale(0.8) rotateX(0deg) rotateY(0deg) rotateZ(0deg) translate(0%, 0%);
    opacity: 0;
  }
}
.truck {
  -webkit-animation: truck 2s infinite;
  animation: truck 2s infinite;
}

@-webkit-keyframes truck {
  0% {
    transform: translate(0px, 2px);
  }
  5% {
    transform: translate(0px, -2px);
  }
  10% {
    transform: translate(0px, 2px);
  }
  15% {
    transform: translate(0px, -2px);
  }
  20% {
    transform: translate(0px, 2px);
  }
  25% {
    transform: translate(0px, -2px);
  }
  30% {
    transform: translate(0px, 0px);
  }
}
@keyframes truck {
  0% {
    transform: translate(0px, 2px);
  }
  5% {
    transform: translate(0px, -2px);
  }
  10% {
    transform: translate(0px, 2px);
  }
  15% {
    transform: translate(0px, -2px);
  }
  20% {
    transform: translate(0px, 2px);
  }
  25% {
    transform: translate(0px, -2px);
  }
  30% {
    transform: translate(0px, 0px);
  }
}
.fuwafuwa {
  -webkit-animation-name: fuwafuwa;
  -webkit-animation-duration: 2s;
  -webkit-animation-iteration-count: infinite;
  -webkit-animation-timing-function: ease;
  -moz-animation-name: fuwafuwa;
  -moz-animation-duration: 2s;
  -moz-animation-iteration-count: infinite;
  -moz-animation-timing-function: ease;
}

@-webkit-keyframes fuwafuwa {
  0% {
    -webkit-transform: translate(0, 0);
  }
  50% {
    -webkit-transform: translate(0, -10px);
  }
  100% {
    -webkit-transform: translate(0, 0);
  }
}
.yurayura {
  transform-origin: center bottom;
  -webkit-animation-name: yurayura;
  -webkit-animation-duration: 2s;
  -webkit-animation-iteration-count: infinite;
  -webkit-animation-timing-function: ease;
  -moz-animation-name: yurayura;
  -moz-animation-duration: 2s;
  -moz-animation-iteration-count: infinite;
  -moz-animation-timing-function: ease;
}

@-webkit-keyframes yurayura {
  0% {
    transform: rotate(0);
  }
  25% {
    transform: rotate(6deg);
  }
  50% {
    transform: rotate(0deg);
  }
  75% {
    transform: rotate(-6deg);
  }
  100% {
    transform: rotate(0);
  }
}
.rotate_x {
  -webkit-animation: rotate_x 2s linear infinite;
  animation: rotate_x 2s linear infinite;
  transform-origin: center;
  width: 140px;
  display: flex;
  justify-content: center;
}

@-webkit-keyframes rotate_x {
  0% {
    transform: rotateY(0);
  }
  25% {
    opacity: 0;
  }
  50% {
    opacity: 1;
  }
  75% {
    opacity: 0;
  }
  100% {
    transform: rotateY(360deg);
  }
}
@keyframes rotate_x {
  0% {
    transform: rotateY(0);
  }
  25% {
    opacity: 0;
  }
  50% {
    opacity: 1;
  }
  75% {
    opacity: 0;
  }
  100% {
    transform: rotateY(360deg);
  }
}
.rotate {
  -webkit-animation: rotate-anime 25s linear infinite;
  animation: rotate-anime 25s linear infinite;
  transform-origin: center;
}

@-webkit-keyframes rotate-anime {
  0% {
    transform: rotate(0);
  }
  100% {
    transform: rotate(360deg);
  }
}
@keyframes rotate-anime {
  0% {
    transform: rotate(0);
  }
  100% {
    transform: rotate(360deg);
  }
}
@-webkit-keyframes heartbeat {
  0% {
    transform: scale(1);
  }
  14% {
    transform: scale(1.3);
  }
  28% {
    transform: scale(1);
  }
  42% {
    transform: scale(1.3);
  }
  70% {
    transform: scale(1);
  }
}
@keyframes heartbeat {
  0% {
    transform: scale(1);
  }
  14% {
    transform: scale(1.3);
  }
  28% {
    transform: scale(1);
  }
  42% {
    transform: scale(1.3);
  }
  70% {
    transform: scale(1);
  }
}
.heartbeat:not(:required) {
  -webkit-animation: heartbeat 1300ms ease 0s infinite normal;
  animation: heartbeat 1300ms ease 0s infinite normal;
  display: inline-block;
  position: relative;
}

.slide-in {
  overflow: hidden;
  display: inline-block;
}

.slide-in_inner {
  display: inline-block;
}

/*左右のアニメーション*/
.leftAnime {
  opacity: 0;
  /*事前に透過0にして消しておく*/
}

.slideAnimeLeftRight {
  -webkit-animation-name: slideTextX100;
          animation-name: slideTextX100;
  -webkit-animation-duration: 0.8s;
          animation-duration: 0.8s;
  -webkit-animation-fill-mode: forwards;
          animation-fill-mode: forwards;
  opacity: 0;
}

@-webkit-keyframes slideTextX100 {
  from {
    transform: translateX(-100%);
    /*要素を左の枠外に移動*/
    opacity: 0;
  }
  to {
    transform: translateX(0);
    /*要素を元の位置に移動*/
    opacity: 1;
  }
}

@keyframes slideTextX100 {
  from {
    transform: translateX(-100%);
    /*要素を左の枠外に移動*/
    opacity: 0;
  }
  to {
    transform: translateX(0);
    /*要素を元の位置に移動*/
    opacity: 1;
  }
}
.slideAnimeRightLeft {
  -webkit-animation-name: slideTextX-100;
          animation-name: slideTextX-100;
  -webkit-animation-duration: 0.8s;
          animation-duration: 0.8s;
  -webkit-animation-fill-mode: forwards;
          animation-fill-mode: forwards;
  opacity: 0;
}

@-webkit-keyframes slideTextX-100 {
  from {
    transform: translateX(100%);
    /*要素を右の枠外に移動*/
    opacity: 0;
  }
  to {
    transform: translateX(0);
    /*要素を元の位置に移動*/
    opacity: 1;
  }
}

@keyframes slideTextX-100 {
  from {
    transform: translateX(100%);
    /*要素を右の枠外に移動*/
    opacity: 0;
  }
  to {
    transform: translateX(0);
    /*要素を元の位置に移動*/
    opacity: 1;
  }
}
/* 4-2　パタッ（左へ） */
.flipLeft {
  -webkit-animation-name: flipLeftAnime;
          animation-name: flipLeftAnime;
  -webkit-animation-duration: 0.8s;
          animation-duration: 0.8s;
  -webkit-animation-fill-mode: forwards;
          animation-fill-mode: forwards;
  perspective-origin: left center;
  opacity: 0;
}

@-webkit-keyframes flipLeftAnime {
  from {
    transform: perspective(600px) translate3d(0, 0, 0) rotateY(50deg);
    opacity: 0;
  }
  to {
    transform: perspective(600px) translate3d(0, 0, 0) rotateY(0deg);
    opacity: 1;
  }
}

@keyframes flipLeftAnime {
  from {
    transform: perspective(600px) translate3d(0, 0, 0) rotateY(50deg);
    opacity: 0;
  }
  to {
    transform: perspective(600px) translate3d(0, 0, 0) rotateY(0deg);
    opacity: 1;
  }
}
/*========= レイアウトのためのCSS ===============*/
.bgextend {
  width: 220px;
  padding: 0;
  margin: 0;
  box-sizing: border-box;
}

/*========= 背景色の動きのCSS ===============*/
/*背景色が伸びて出現 共通*/
.bgextend {
  -webkit-animation-name: bgextendAnimeBase;
          animation-name: bgextendAnimeBase;
  -webkit-animation-duration: 1s;
          animation-duration: 1s;
  -webkit-animation-fill-mode: forwards;
          animation-fill-mode: forwards;
  position: relative;
  overflow: hidden;
  /*　はみ出た色要素を隠す　*/
  opacity: 0;
}

@-webkit-keyframes bgextendAnimeBase {
  from {
    opacity: 0;
  }
  to {
    opacity: 1;
  }
}

@keyframes bgextendAnimeBase {
  from {
    opacity: 0;
  }
  to {
    opacity: 1;
  }
}
/*中の要素*/
.bgappear {
  -webkit-animation-name: bgextendAnimeSecond;
          animation-name: bgextendAnimeSecond;
  -webkit-animation-duration: 1s;
          animation-duration: 1s;
  -webkit-animation-delay: 0.6s;
          animation-delay: 0.6s;
  -webkit-animation-fill-mode: forwards;
          animation-fill-mode: forwards;
  opacity: 0;
}

@-webkit-keyframes bgextendAnimeSecond {
  0% {
    opacity: 0;
  }
  100% {
    opacity: 1;
  }
}

@keyframes bgextendAnimeSecond {
  0% {
    opacity: 0;
  }
  100% {
    opacity: 1;
  }
}
/*--------- 左から --------*/
.bgLRextend::before {
  -webkit-animation-name: bgLRextendAnime;
          animation-name: bgLRextendAnime;
  -webkit-animation-duration: 1s;
          animation-duration: 1s;
  -webkit-animation-fill-mode: forwards;
          animation-fill-mode: forwards;
  content: "";
  position: absolute;
  width: 100%;
  height: 100%;
  background-color: #073829;
  /*伸びる背景色の設定*/
}

@-webkit-keyframes bgLRextendAnime {
  0% {
    transform-origin: left;
    transform: scaleX(0);
  }
  50% {
    transform-origin: left;
    transform: scaleX(1);
  }
  50.001% {
    transform-origin: right;
  }
  100% {
    transform-origin: right;
    transform: scaleX(0);
  }
}

@keyframes bgLRextendAnime {
  0% {
    transform-origin: left;
    transform: scaleX(0);
  }
  50% {
    transform-origin: left;
    transform: scaleX(1);
  }
  50.001% {
    transform-origin: right;
  }
  100% {
    transform-origin: right;
    transform: scaleX(0);
  }
}
/*--------- 右から --------*/
.bgRLextend::before {
  -webkit-animation-name: bgRLextendAnime;
          animation-name: bgRLextendAnime;
  -webkit-animation-duration: 1s;
          animation-duration: 1s;
  -webkit-animation-fill-mode: forwards;
          animation-fill-mode: forwards;
  content: "";
  position: absolute;
  width: 100%;
  height: 100%;
  background-color: #666;
  /*伸びる背景色の設定*/
}

@-webkit-keyframes bgRLextendAnime {
  0% {
    transform-origin: right;
    transform: scaleX(0);
  }
  50% {
    transform-origin: right;
    transform: scaleX(1);
  }
  50.001% {
    transform-origin: left;
  }
  100% {
    transform-origin: left;
    transform: scaleX(0);
  }
}

@keyframes bgRLextendAnime {
  0% {
    transform-origin: right;
    transform: scaleX(0);
  }
  50% {
    transform-origin: right;
    transform: scaleX(1);
  }
  50.001% {
    transform-origin: left;
  }
  100% {
    transform-origin: left;
    transform: scaleX(0);
  }
}
/*--------- 下から --------*/
.bgDUextend::before {
  -webkit-animation-name: bgDUextendAnime;
          animation-name: bgDUextendAnime;
  -webkit-animation-duration: 1s;
          animation-duration: 1s;
  -webkit-animation-fill-mode: forwards;
          animation-fill-mode: forwards;
  content: "";
  position: absolute;
  width: 100%;
  height: 100%;
  background-color: #666;
  /*伸びる背景色の設定*/
}

@-webkit-keyframes bgDUextendAnime {
  0% {
    transform-origin: bottom;
    transform: scaleY(0);
  }
  50% {
    transform-origin: bottom;
    transform: scaleY(1);
  }
  50.001% {
    transform-origin: top;
  }
  100% {
    transform-origin: top;
    transform: scaleY(0);
  }
}

@keyframes bgDUextendAnime {
  0% {
    transform-origin: bottom;
    transform: scaleY(0);
  }
  50% {
    transform-origin: bottom;
    transform: scaleY(1);
  }
  50.001% {
    transform-origin: top;
  }
  100% {
    transform-origin: top;
    transform: scaleY(0);
  }
}
/*--------- 上から --------*/
.bgUDextend::before {
  -webkit-animation-name: bgUDextendAnime;
          animation-name: bgUDextendAnime;
  -webkit-animation-duration: 1s;
          animation-duration: 1s;
  -webkit-animation-fill-mode: forwards;
          animation-fill-mode: forwards;
  content: "";
  position: absolute;
  width: 100%;
  height: 100%;
  background-color: #666;
  /*伸びる背景色の設定*/
}

@-webkit-keyframes bgUDextendAnime {
  0% {
    transform-origin: top;
    transform: scaleY(0);
  }
  50% {
    transform-origin: top;
    transform: scaleY(1);
  }
  50.001% {
    transform-origin: bottom;
  }
  100% {
    transform-origin: bottom;
    transform: scaleY(0);
  }
}

@keyframes bgUDextendAnime {
  0% {
    transform-origin: top;
    transform: scaleY(0);
  }
  50% {
    transform-origin: top;
    transform: scaleY(1);
  }
  50.001% {
    transform-origin: bottom;
  }
  100% {
    transform-origin: bottom;
    transform: scaleY(0);
  }
}
.animation-go2_bg {
  overflow: hidden;
  position: relative;
  width: 100%;
  height: 100%;
  margin: 120px auto;
}

.animation-go2_txt:after {
  content: "";
  position: absolute;
  background-color: rgba(7, 56, 41, 0.8);
  width: 100%;
  height: 100%;
  top: 0;
  left: 0;
  z-index: -1;
}
.animation-go2_txt:before {
  content: "";
  position: absolute;
  width: 100%;
  height: 100%;
  background-image: url(../images/01.jpg);
  background-repeat: no-repeat;
  background-size: cover;
  z-index: -2;
  top: 0;
  left: 0;
}
@media all and (max-width: 639px) {
  .animation-go2_txt {
    padding: 50px 20px 50px;
    background-size: 50%;
  }
}

.mask {
  position: relative;
  -webkit-clip-path: circle(1%);
          clip-path: circle(1%);
  transition: 0.6s ease-in all;
}
.mask.on {
  -webkit-clip-path: circle(120%);
          clip-path: circle(120%);
}

.animation-go {
  z-index: 0;
  width: 100px;
  height: 100px;
  border-radius: 50%;
  background: linear-gradient(91.17deg, #e0f3aa 0.7%, #e9e199 21.75%, #e9cd99 44.2%, #fad8c2 65.72%, #deb7ad 90.51%);
  transform: scale(0);
  top: calc(50% - 50px);
  right: calc(50% - 50px);
  transition: all 0.6s;
  position: absolute;
  right: 0;
  top: 0;
}
.animation-go.start_anime {
  -webkit-animation: rain-anime 3s forwards;
          animation: rain-anime 3s forwards;
}

.animation-go2 {
  z-index: 0;
  width: 100px;
  height: 100px;
  border-radius: 50%;
  background: rgba(255, 255, 255, 0.8);
  transform: scale(0);
  top: calc(50% - 50px);
  right: calc(50% - 50px);
  transition: all 0.6s;
  position: absolute;
  right: 0;
  top: 0;
}
.animation-go2.start_anime {
  -webkit-animation: rain-anime 3s forwards;
          animation: rain-anime 3s forwards;
}

.animation-go3 {
  z-index: 0;
  width: 100px;
  height: 100px;
  border-radius: 50%;
  background: rgb(239, 255, 226);
  background: linear-gradient(90deg, rgb(239, 255, 226) 0%, rgb(225, 252, 244) 41%, rgb(235, 245, 255) 78%, rgb(237, 231, 255) 100%);
  transform: scale(0);
  top: calc(50% - 50px);
  right: calc(50% - 50px);
  transition: all 0.6s;
  position: absolute;
  right: 0;
  top: 0;
}
.animation-go3.start_anime {
  -webkit-animation: rain-anime 3s forwards;
          animation: rain-anime 3s forwards;
}

.animation-go4 {
  z-index: 0;
  width: 100px;
  height: 100px;
  border-radius: 50%;
  background: linear-gradient(91.17deg, #e0f3aa 0.7%, #e9e199 21.75%, #e9cd99 44.2%, #fad8c2 65.72%, #deb7ad 90.51%);
  transform: scale(0);
  top: calc(50% - 50px);
  right: calc(50% - 50px);
  transition: all 0.6s;
  position: absolute;
  right: 0;
  top: 0;
}
.animation-go4.start_anime {
  -webkit-animation: rain-anime 3s forwards;
          animation: rain-anime 3s forwards;
}

@-webkit-keyframes rain-anime {
  0% {
    transform: scale(0);
  }
  80% {
    transform: scale(50);
  }
  100% {
    opacity: 1;
    transform: scale(50);
  }
}

@keyframes rain-anime {
  0% {
    transform: scale(0);
  }
  80% {
    transform: scale(50);
  }
  100% {
    opacity: 1;
    transform: scale(50);
  }
}
.js-span-text.on {
  opacity: 1;
}
.js-span-text.on span {
  display: inline-block;
  opacity: 0;
}
.js-span-text.on span:nth-child(1) {
  -webkit-animation: text 1s cubic-bezier(0.3, 0.72, 0.56, 0.99) 0.1s forwards;
          animation: text 1s cubic-bezier(0.3, 0.72, 0.56, 0.99) 0.1s forwards;
}
.js-span-text.on span:nth-child(2) {
  -webkit-animation: text 1s cubic-bezier(0.3, 0.72, 0.56, 0.99) 0.2s forwards;
          animation: text 1s cubic-bezier(0.3, 0.72, 0.56, 0.99) 0.2s forwards;
}
.js-span-text.on span:nth-child(3) {
  -webkit-animation: text 1s cubic-bezier(0.3, 0.72, 0.56, 0.99) 0.3s forwards;
          animation: text 1s cubic-bezier(0.3, 0.72, 0.56, 0.99) 0.3s forwards;
}
.js-span-text.on span:nth-child(4) {
  -webkit-animation: text 1s cubic-bezier(0.3, 0.72, 0.56, 0.99) 0.4s forwards;
          animation: text 1s cubic-bezier(0.3, 0.72, 0.56, 0.99) 0.4s forwards;
}
.js-span-text.on span:nth-child(5) {
  -webkit-animation: text 1s cubic-bezier(0.3, 0.72, 0.56, 0.99) 0.5s forwards;
          animation: text 1s cubic-bezier(0.3, 0.72, 0.56, 0.99) 0.5s forwards;
}
.js-span-text.on span:nth-child(6) {
  -webkit-animation: text 1s cubic-bezier(0.3, 0.72, 0.56, 0.99) 0.6s forwards;
          animation: text 1s cubic-bezier(0.3, 0.72, 0.56, 0.99) 0.6s forwards;
}
.js-span-text.on span:nth-child(7) {
  -webkit-animation: text 1s cubic-bezier(0.3, 0.72, 0.56, 0.99) 0.7s forwards;
          animation: text 1s cubic-bezier(0.3, 0.72, 0.56, 0.99) 0.7s forwards;
}
.js-span-text.on span:nth-child(8) {
  -webkit-animation: text 1s cubic-bezier(0.3, 0.72, 0.56, 0.99) 0.8s forwards;
          animation: text 1s cubic-bezier(0.3, 0.72, 0.56, 0.99) 0.8s forwards;
}
.js-span-text.on span:nth-child(9) {
  -webkit-animation: text 1s cubic-bezier(0.3, 0.72, 0.56, 0.99) 0.9s forwards;
          animation: text 1s cubic-bezier(0.3, 0.72, 0.56, 0.99) 0.9s forwards;
}
.js-span-text.on span:nth-child(10) {
  -webkit-animation: text 1s cubic-bezier(0.3, 0.72, 0.56, 0.99) 1s forwards;
          animation: text 1s cubic-bezier(0.3, 0.72, 0.56, 0.99) 1s forwards;
}
.js-span-text.on span:nth-child(11) {
  -webkit-animation: text 1s cubic-bezier(0.3, 0.72, 0.56, 0.99) 1.1s forwards;
          animation: text 1s cubic-bezier(0.3, 0.72, 0.56, 0.99) 1.1s forwards;
}
.js-span-text.on span:nth-child(12) {
  -webkit-animation: text 1s cubic-bezier(0.3, 0.72, 0.56, 0.99) 1.2s forwards;
          animation: text 1s cubic-bezier(0.3, 0.72, 0.56, 0.99) 1.2s forwards;
}
.js-span-text.on span:nth-child(13) {
  -webkit-animation: text 1s cubic-bezier(0.3, 0.72, 0.56, 0.99) 1.3s forwards;
          animation: text 1s cubic-bezier(0.3, 0.72, 0.56, 0.99) 1.3s forwards;
}
.js-span-text.on span:nth-child(14) {
  -webkit-animation: text 1s cubic-bezier(0.3, 0.72, 0.56, 0.99) 1.4s forwards;
          animation: text 1s cubic-bezier(0.3, 0.72, 0.56, 0.99) 1.4s forwards;
}
.js-span-text.on span:nth-child(15) {
  -webkit-animation: text 1s cubic-bezier(0.3, 0.72, 0.56, 0.99) 1.5s forwards;
          animation: text 1s cubic-bezier(0.3, 0.72, 0.56, 0.99) 1.5s forwards;
}
.js-span-text.on span:nth-child(16) {
  -webkit-animation: text 1s cubic-bezier(0.3, 0.72, 0.56, 0.99) 1.6s forwards;
          animation: text 1s cubic-bezier(0.3, 0.72, 0.56, 0.99) 1.6s forwards;
}
.js-span-text.on span:nth-child(17) {
  -webkit-animation: text 1s cubic-bezier(0.3, 0.72, 0.56, 0.99) 1.7s forwards;
          animation: text 1s cubic-bezier(0.3, 0.72, 0.56, 0.99) 1.7s forwards;
}
.js-span-text.on span:nth-child(18) {
  -webkit-animation: text 1s cubic-bezier(0.3, 0.72, 0.56, 0.99) 1.8s forwards;
          animation: text 1s cubic-bezier(0.3, 0.72, 0.56, 0.99) 1.8s forwards;
}
.js-span-text.on span:nth-child(19) {
  -webkit-animation: text 1s cubic-bezier(0.3, 0.72, 0.56, 0.99) 1.9s forwards;
          animation: text 1s cubic-bezier(0.3, 0.72, 0.56, 0.99) 1.9s forwards;
}
.js-span-text.on span:nth-child(20) {
  -webkit-animation: text 1s cubic-bezier(0.3, 0.72, 0.56, 0.99) 2s forwards;
          animation: text 1s cubic-bezier(0.3, 0.72, 0.56, 0.99) 2s forwards;
}
.js-span-text.on span:nth-child(21) {
  -webkit-animation: text 1s cubic-bezier(0.3, 0.72, 0.56, 0.99) 2.1s forwards;
          animation: text 1s cubic-bezier(0.3, 0.72, 0.56, 0.99) 2.1s forwards;
}
.js-span-text.on span:nth-child(22) {
  -webkit-animation: text 1s cubic-bezier(0.3, 0.72, 0.56, 0.99) 2.2s forwards;
          animation: text 1s cubic-bezier(0.3, 0.72, 0.56, 0.99) 2.2s forwards;
}
.js-span-text.on span:nth-child(23) {
  -webkit-animation: text 1s cubic-bezier(0.3, 0.72, 0.56, 0.99) 2.3s forwards;
          animation: text 1s cubic-bezier(0.3, 0.72, 0.56, 0.99) 2.3s forwards;
}
.js-span-text.on span:nth-child(24) {
  -webkit-animation: text 1s cubic-bezier(0.3, 0.72, 0.56, 0.99) 2.4s forwards;
          animation: text 1s cubic-bezier(0.3, 0.72, 0.56, 0.99) 2.4s forwards;
}
.js-span-text.on span:nth-child(25) {
  -webkit-animation: text 1s cubic-bezier(0.3, 0.72, 0.56, 0.99) 2.5s forwards;
          animation: text 1s cubic-bezier(0.3, 0.72, 0.56, 0.99) 2.5s forwards;
}
.js-span-text.on span:nth-child(26) {
  -webkit-animation: text 1s cubic-bezier(0.3, 0.72, 0.56, 0.99) 2.6s forwards;
          animation: text 1s cubic-bezier(0.3, 0.72, 0.56, 0.99) 2.6s forwards;
}
.js-span-text.on span:nth-child(27) {
  -webkit-animation: text 1s cubic-bezier(0.3, 0.72, 0.56, 0.99) 2.7s forwards;
          animation: text 1s cubic-bezier(0.3, 0.72, 0.56, 0.99) 2.7s forwards;
}
.js-span-text.on span:nth-child(28) {
  -webkit-animation: text 1s cubic-bezier(0.3, 0.72, 0.56, 0.99) 2.8s forwards;
          animation: text 1s cubic-bezier(0.3, 0.72, 0.56, 0.99) 2.8s forwards;
}
.js-span-text.on span:nth-child(29) {
  -webkit-animation: text 1s cubic-bezier(0.3, 0.72, 0.56, 0.99) 2.9s forwards;
          animation: text 1s cubic-bezier(0.3, 0.72, 0.56, 0.99) 2.9s forwards;
}
.js-span-text.on span:nth-child(30) {
  -webkit-animation: text 1s cubic-bezier(0.3, 0.72, 0.56, 0.99) 3s forwards;
          animation: text 1s cubic-bezier(0.3, 0.72, 0.56, 0.99) 3s forwards;
}
.js-span-text.on span:nth-child(31) {
  -webkit-animation: text 1s cubic-bezier(0.3, 0.72, 0.56, 0.99) 3.1s forwards;
          animation: text 1s cubic-bezier(0.3, 0.72, 0.56, 0.99) 3.1s forwards;
}
.js-span-text.on span:nth-child(32) {
  -webkit-animation: text 1s cubic-bezier(0.3, 0.72, 0.56, 0.99) 3.2s forwards;
          animation: text 1s cubic-bezier(0.3, 0.72, 0.56, 0.99) 3.2s forwards;
}
.js-span-text.on span:nth-child(33) {
  -webkit-animation: text 1s cubic-bezier(0.3, 0.72, 0.56, 0.99) 3.3s forwards;
          animation: text 1s cubic-bezier(0.3, 0.72, 0.56, 0.99) 3.3s forwards;
}
.js-span-text.on span:nth-child(34) {
  -webkit-animation: text 1s cubic-bezier(0.3, 0.72, 0.56, 0.99) 3.4s forwards;
          animation: text 1s cubic-bezier(0.3, 0.72, 0.56, 0.99) 3.4s forwards;
}
.js-span-text.on span:nth-child(35) {
  -webkit-animation: text 1s cubic-bezier(0.3, 0.72, 0.56, 0.99) 3.5s forwards;
          animation: text 1s cubic-bezier(0.3, 0.72, 0.56, 0.99) 3.5s forwards;
}
.js-span-text.on span:nth-child(36) {
  -webkit-animation: text 1s cubic-bezier(0.3, 0.72, 0.56, 0.99) 3.6s forwards;
          animation: text 1s cubic-bezier(0.3, 0.72, 0.56, 0.99) 3.6s forwards;
}
.js-span-text.on span:nth-child(37) {
  -webkit-animation: text 1s cubic-bezier(0.3, 0.72, 0.56, 0.99) 3.7s forwards;
          animation: text 1s cubic-bezier(0.3, 0.72, 0.56, 0.99) 3.7s forwards;
}
.js-span-text.on span:nth-child(38) {
  -webkit-animation: text 1s cubic-bezier(0.3, 0.72, 0.56, 0.99) 3.8s forwards;
          animation: text 1s cubic-bezier(0.3, 0.72, 0.56, 0.99) 3.8s forwards;
}
.js-span-text.on span:nth-child(39) {
  -webkit-animation: text 1s cubic-bezier(0.3, 0.72, 0.56, 0.99) 3.9s forwards;
          animation: text 1s cubic-bezier(0.3, 0.72, 0.56, 0.99) 3.9s forwards;
}
.js-span-text.on span:nth-child(40) {
  -webkit-animation: text 1s cubic-bezier(0.3, 0.72, 0.56, 0.99) 4s forwards;
          animation: text 1s cubic-bezier(0.3, 0.72, 0.56, 0.99) 4s forwards;
}
.js-span-text.on span:nth-child(41) {
  -webkit-animation: text 1s cubic-bezier(0.3, 0.72, 0.56, 0.99) 4.1s forwards;
          animation: text 1s cubic-bezier(0.3, 0.72, 0.56, 0.99) 4.1s forwards;
}
.js-span-text.on span:nth-child(42) {
  -webkit-animation: text 1s cubic-bezier(0.3, 0.72, 0.56, 0.99) 4.2s forwards;
          animation: text 1s cubic-bezier(0.3, 0.72, 0.56, 0.99) 4.2s forwards;
}
.js-span-text.on span:nth-child(43) {
  -webkit-animation: text 1s cubic-bezier(0.3, 0.72, 0.56, 0.99) 4.3s forwards;
          animation: text 1s cubic-bezier(0.3, 0.72, 0.56, 0.99) 4.3s forwards;
}
.js-span-text.on span:nth-child(44) {
  -webkit-animation: text 1s cubic-bezier(0.3, 0.72, 0.56, 0.99) 4.4s forwards;
          animation: text 1s cubic-bezier(0.3, 0.72, 0.56, 0.99) 4.4s forwards;
}
.js-span-text.on span:nth-child(45) {
  -webkit-animation: text 1s cubic-bezier(0.3, 0.72, 0.56, 0.99) 4.5s forwards;
          animation: text 1s cubic-bezier(0.3, 0.72, 0.56, 0.99) 4.5s forwards;
}

@-webkit-keyframes text {
  0% {
    opacity: 0;
    transform: translateX(-20px) translateY(-10px) scale(1.3);
  }
  100% {
    opacity: 1;
    transform: none;
  }
}

@keyframes text {
  0% {
    opacity: 0;
    transform: translateX(-20px) translateY(-10px) scale(1.3);
  }
  100% {
    opacity: 1;
    transform: none;
  }
}
.repeat {
  display: flex;
  right: -53%;
  overflow: hidden;
  position: absolute;
  top: 63.2px;
  white-space: nowrap;
  width: 153%;
  z-index: -2;
}
.repeat > span {
  -webkit-animation: animation-repeat 10s linear infinite;
  animation: animation-repeat 10s linear infinite;
  color: rgba(7, 56, 41, 0.1);
  padding: 10px 0;
  font-size: 6vw;
  line-height: 1;
  z-index: -2;
  font-family: "Noto Serif JP", "YakuHanMP", "Noto Serif JP", "游明朝 Medium", "Yu Mincho", YuMincho, "Hiragino Mincho ProN", HGS明朝E, serif;
  font-weight: 400;
  letter-spacing: 0;
  text-transform: lowercase !important;
}
.repeat > span:first-letter {
  text-transform: uppercase;
}
@-webkit-keyframes animation-repeat {
  0% {
    transform: translateX(0);
  }
  to {
    transform: translateX(-100%);
  }
}
@keyframes animation-repeat {
  0% {
    transform: translateX(0);
  }
  to {
    transform: translateX(-100%);
  }
}
.scroll_down {
  position: absolute;
  bottom: 6%;
  left: 50%;
  z-index: 2;
  transform: translateX(-50%);
  color: #fff;
  padding-top: 60px;
}
@media all and (max-width: 639px) {
  .scroll_down {
    font-size: 1.1rem;
  }
}
.scroll_down span {
  position: absolute;
  top: 0;
  left: 50%;
  width: 30px;
  height: 50px;
  margin-left: -15px;
  border: 2px solid #fff;
  border-radius: 50px;
  box-sizing: border-box;
}
.scroll_down span:before {
  position: absolute;
  top: 10px;
  left: 50%;
  content: "";
  width: 6px;
  height: 6px;
  margin-left: -3px;
  background-color: #fff;
  border-radius: 100%;
  -webkit-animation: sdb 2s infinite;
  animation: sdb 2s infinite;
  box-sizing: border-box;
}

@-webkit-keyframes sdb {
  0% {
    -webkit-transform: rotateY(0) rotateZ(-45deg) translate(0, 0);
    opacity: 0;
  }
  50% {
    opacity: 1;
  }
  100% {
    -webkit-transform: rotateY(720deg) rotateZ(-45deg) translate(-20px, 20px);
    opacity: 0;
  }
}
@keyframes sdb {
  0% {
    transform: rotateY(0) rotateZ(-45deg) translate(0, 0);
    opacity: 0;
  }
  50% {
    opacity: 1;
  }
  100% {
    transform: rotateY(720deg) rotateZ(-45deg) translate(-20px, 20px);
    opacity: 0;
  }
}
#scrolldown {
  position: absolute;
  right: 35px;
  bottom: 120px;
  color: #fefefe;
  font-family: "Noto Serif JP", "YakuHanMP", "Noto Serif JP", "游明朝 Medium", "Yu Mincho", YuMincho, "Hiragino Mincho ProN", HGS明朝E, serif;
  font-weight: 400;
  letter-spacing: 0;
  text-transform: lowercase !important;
  -ms-writing-mode: tb-rl;
  writing-mode: vertical-rl;
  text-orientation: mixed;
  font-size: 1.4rem;
  z-index: 80;
  height: 210px;
}
#scrolldown:first-letter {
  text-transform: uppercase;
}
#scrolldown:before, #scrolldown:after {
  position: absolute;
  content: "";
  z-index: 2;
  left: 50%;
}
#scrolldown:before {
  width: 1px;
  height: 100px;
  bottom: 0;
  background: #f0f0f0;
  transform: translateX(-50%);
}
#scrolldown:after {
  width: 8px;
  height: 8px;
  background: rgba(255, 255, 255, 0.9);
  border-radius: 100%;
  top: 100px;
  margin-left: -4px;
  -webkit-animation: scroll-point2 2.3s ease-out infinite;
          animation: scroll-point2 2.3s ease-out infinite;
  -webkit-animation-fill-mode: both;
          animation-fill-mode: both;
}
@media all and (max-width: 896px) {
  #scrolldown {
    display: none;
  }
}

@-webkit-keyframes scroll-point2 {
  0% {
    bottom: 0;
    opacity: 0;
  }
  20% {
    opacity: 1;
  }
  50% {
    top: 180px;
    opacity: 1;
  }
  80% {
    opacity: 0;
  }
  100% {
    top: 210px;
    opacity: 0;
  }
}

@keyframes scroll-point2 {
  0% {
    bottom: 0;
    opacity: 0;
  }
  20% {
    opacity: 1;
  }
  50% {
    top: 180px;
    opacity: 1;
  }
  80% {
    opacity: 0;
  }
  100% {
    top: 210px;
    opacity: 0;
  }
}
#scrolldown_bx {
  position: absolute;
  left: 0;
  right: 0;
  bottom: 0px;
  color: #073829;
  font-size: 1rem;
  z-index: 100;
  height: 110px;
  text-align: center;
  font-weight: bold;
}
#scrolldown_bx:before, #scrolldown_bx:after {
  position: absolute;
  content: "";
  z-index: 2;
  left: 50%;
}
#scrolldown_bx:before {
  width: 1px;
  height: 80px;
  bottom: 0;
  background: #aaa;
  transform: translateX(-80%);
}
#scrolldown_bx:after {
  width: 8px;
  height: 8px;
  background: rgba(7, 56, 41, 0.9);
  border-radius: 100%;
  top: 0px;
  margin-left: -4px;
  -webkit-animation: scroll-point1 2.3s ease-out infinite;
          animation: scroll-point1 2.3s ease-out infinite;
  -webkit-animation-fill-mode: both;
          animation-fill-mode: both;
}
@media all and (max-width: 896px) {
  #scrolldown_bx {
    display: none;
  }
}

#scrolldown_02 {
  position: absolute;
  left: 0;
  right: 0;
  top: 60%;
  color: #fff;
  font-size: 1rem;
  z-index: 100;
  height: 50px;
  text-align: center;
  font-weight: bold;
}
#scrolldown_02:before, #scrolldown_02:after {
  position: absolute;
  content: "";
  z-index: 2;
  left: 50%;
}
#scrolldown_02:before {
  width: 1px;
  height: 120px;
  bottom: -120px;
  background: #fff;
  transform: translateX(0%);
}
#scrolldown_02:after {
  width: 8px;
  height: 8px;
  background: rgba(255, 255, 255, 0.9);
  border-radius: 100%;
  top: 0px;
  margin-left: -4px;
  -webkit-animation: scroll-point02 2.3s ease-out infinite;
          animation: scroll-point02 2.3s ease-out infinite;
  -webkit-animation-fill-mode: both;
          animation-fill-mode: both;
}
@media all and (max-width: 896px) {
  #scrolldown_02 {
    display: none;
  }
}

@-webkit-keyframes scroll-point02 {
  0% {
    top: 50px;
    opacity: 0;
  }
  20% {
    opacity: 1;
  }
  50% {
    opacity: 1;
  }
  80% {
    opacity: 0;
  }
  100% {
    top: 160px;
    opacity: 0;
  }
}

@keyframes scroll-point02 {
  0% {
    top: 50px;
    opacity: 0;
  }
  20% {
    opacity: 1;
  }
  50% {
    opacity: 1;
  }
  80% {
    opacity: 0;
  }
  100% {
    top: 160px;
    opacity: 0;
  }
}
span.smoothText {
  overflow: hidden;
  display: block;
}

/* アニメーションで傾斜がついている文字列を水平に戻す*/
span.smoothTextTrigger {
  transition: 1.2s ease-in-out;
  transform: translate3d(0, 100%, 0) skewY(12deg);
  transform-origin: left;
  display: block;
}

span.smoothTextTrigger.smoothTextAppear {
  transform: translate3d(0, 0, 0) skewY(0);
}

.parallax_txt {
  position: absolute;
  bottom: 0;
  left: 0;
  z-index: 0;
  font-family: "Noto Serif JP", "YakuHanMP", "Noto Serif JP", "游明朝 Medium", "Yu Mincho", YuMincho, "Hiragino Mincho ProN", HGS明朝E, serif;
  font-weight: 400;
  letter-spacing: 0;
  text-transform: lowercase !important;
}
.parallax_txt:first-letter {
  text-transform: uppercase;
}

.parallax_txt span {
  display: block;
  padding-left: 15%;
  -webkit-animation: animate-banner 20s linear infinite;
  animation: animate-banner 20s linear infinite;
  -webkit-user-select: none;
  -moz-user-select: none;
  -ms-user-select: none;
  user-select: none;
  font-size: 24rem;
  font-weight: 600;
  color: rgba(7, 56, 41, 0.8);
  text-align: center;
  line-height: 1;
  white-space: nowrap;
  opacity: 0.05;
}

@-webkit-keyframes animate-banner {
  0% {
    transform: translateX(0);
  }
  100% {
    transform: translateX(-115%);
  }
}
@keyframes animate-banner {
  0% {
    transform: translateX(0);
  }
  100% {
    transform: translateX(-115%);
  }
}
.start {
  opacity: 0;
  transition-duration: 500ms;
  transition-property: opacity, transform;
}
.start.on {
  opacity: 1;
  transform: translate(0, 0);
}
.start.delay_1 {
  transition-delay: 0.3s;
}
.start.delay_1:before {
  -webkit-animation-duration: 1.2s;
          animation-duration: 1.2s;
}
.start.delay_2 {
  transition-delay: 0.6s;
}
.start.delay_2:before {
  -webkit-animation-duration: 1.4s;
          animation-duration: 1.4s;
}
.start.delay_3 {
  transition-delay: 0.9s;
}
.start.delay_3:before {
  -webkit-animation-duration: 1.6s;
          animation-duration: 1.6s;
}
.start.delay_4 {
  transition-delay: 1.2s;
}
.start.delay_4:before {
  -webkit-animation-duration: 1.8s;
          animation-duration: 1.8s;
}
.start.delay_5 {
  transition-delay: 1.4s;
}
.start.delay_5:before {
  -webkit-animation-duration: 2s;
          animation-duration: 2s;
}
.start.delay_6 {
  transition-delay: 1.6s;
}
.start.delay_6:before {
  -webkit-animation-duration: 2.2s;
          animation-duration: 2.2s;
}

.inup {
  transform: translate(0, 50px);
}

.indown {
  transform: translate(0, -50px);
}

.inleft {
  transform: translate(-50px, 0);
}

.inright {
  transform: translate(50px, 0);
}

.curtain_l {
  position: relative;
}
.curtain_l.on:before {
  display: block;
  content: "";
  position: absolute;
  z-index: 999;
  width: 100%;
  height: 100%;
  top: 0;
  left: 0;
  transform: scaleX(0);
  transition-delay: 0.3s;
  background-color: #073829;
  -webkit-animation-name: curtain_l;
          animation-name: curtain_l;
  -webkit-animation-duration: 1.2s;
          animation-duration: 1.2s;
  -webkit-animation-timing-function: ease-in-out;
          animation-timing-function: ease-in-out;
  -webkit-animation-fill-mode: forwards;
          animation-fill-mode: forwards;
}
.curtain_l.on:after {
  display: block;
  content: "";
  position: absolute;
  z-index: 998;
  width: 100%;
  height: 100%;
  top: 0;
  left: 0;
  background-color: #fff;
  -webkit-animation-name: curtain;
          animation-name: curtain;
  -webkit-animation-delay: 0.8s;
          animation-delay: 0.8s;
  -webkit-animation-duration: 0.8s;
          animation-duration: 0.8s;
  -webkit-animation-timing-function: ease-in-out;
          animation-timing-function: ease-in-out;
  -webkit-animation-fill-mode: forwards;
          animation-fill-mode: forwards;
}

@-webkit-keyframes curtain {
  0% {
    opacity: 1;
  }
  100% {
    opacity: 0;
  }
}

@keyframes curtain {
  0% {
    opacity: 1;
  }
  100% {
    opacity: 0;
  }
}
@-webkit-keyframes curtain_l {
  0% {
    transform-origin: left;
    transform: scaleX(0);
  }
  50% {
    transform-origin: left;
    transform: scaleX(1);
  }
  50.001% {
    transform-origin: right;
  }
  100% {
    transform-origin: right;
    transform: scaleX(0);
  }
}
@keyframes curtain_l {
  0% {
    transform-origin: left;
    transform: scaleX(0);
  }
  50% {
    transform-origin: left;
    transform: scaleX(1);
  }
  50.001% {
    transform-origin: right;
  }
  100% {
    transform-origin: right;
    transform: scaleX(0);
  }
}
.sitemap {
  margin: 0 auto;
  width: 500px;
}
.sitemap li span {
  display: inline-block;
  text-align: center;
  width: 12em;
  padding: 0px 20px;
  border: 1px solid #aaa;
}
.sitemap li ul {
  margin-top: 0.2em;
  margin-bottom: 0.75em;
  margin-left: 100px;
}
.sitemap li ul li {
  margin: 0 0 0.25em 5em;
  position: relative;
}
.sitemap li ul li span {
  display: inline-block;
  text-align: center;
  width: 12em;
  padding: 0px 20px;
  border: 1px solid #aaa;
}
.sitemap li ul li::before {
  content: "";
  position: absolute;
  top: -0.2em;
  left: -85px;
  width: 10px;
  height: calc(100% + 0.75em);
  border-left: 1px solid #aaa;
}
.sitemap li ul li:last-child::before {
  height: 1.25em;
}
.sitemap li ul li::after {
  content: "";
  position: absolute;
  top: 1em;
  left: -85px;
  width: 86px;
  border-bottom: 1px solid #aaa;
}

.step_columnbox {
  max-width: 1600px;
  position: relative;
  z-index: 1;
  margin: 0 auto 0;
}
.step_columnbox .number_box {
  position: absolute;
  top: -1px;
  left: -1px;
  line-height: 1;
  border: 1px solid #073829;
  width: 80px;
  height: 80px;
  display: grid;
  place-items: center;
}
@media all and (max-width: 639px) {
  .step_columnbox .number_box {
    width: 60px;
    height: 60px;
  }
}
.step_columnbox .number_box .ttl {
  line-height: 1.1;
}
.step_columnbox .number_box .num {
  font-size: 3rem;
  line-height: 3rem;
  font-weight: 500;
  text-transform: uppercase;
  font-weight: 300;
  position: relative;
  z-index: 1;
  color: #073829;
  text-align: center;
}
.step_columnbox .number_box .txt {
  font-size: 1.1rem;
  color: #073829;
  text-align: center;
}
@media all and (max-width: 639px) {
  .step_columnbox .number_box {
    padding: 5px;
  }
}
@media all and (max-width: 639px) {
  .step_columnbox .number_box .num {
    font-size: 1.8rem;
    line-height: 1.8rem;
  }
}
@media all and (max-width: 639px) {
  .step_columnbox .number_box .txt {
    font-size: 1rem;
  }
}
.step_columnbox.type1 {
  display: flex;
  flex-wrap: wrap;
}
.step_columnbox.type1 .column-inner {
  width: 48%;
  margin-right: 2%;
}
.step_columnbox.type1 .column-inner:nth-child(2n) {
  margin-right: 0;
}
.step_columnbox .column-inner {
  margin-bottom: 80px;
  position: relative;
}
.step_columnbox .column-inner:nth-of-type(2n-1) .column-inner-contents {
  display: flex;
  flex-wrap: wrap;
  flex-direction: row-reverse;
}
.step_columnbox .column-inner-contents {
  display: flex;
  flex-wrap: wrap;
}
.step_columnbox .column-inner-contents.no1 {
  background-color: rgba(231, 166, 126, 0.3);
}
.step_columnbox .column-inner-contents.no2 {
  background-color: rgba(159, 224, 159, 0.3);
}
.step_columnbox .column-inner-contents.no3 {
  background-color: rgba(228, 203, 116, 0.3);
}
.step_columnbox .column-inner-contents.no4 {
  background-color: rgba(143, 195, 229, 0.3);
}
.step_columnbox .column-inner-contents.type3 {
  color: #333;
  align-items: inherit;
  display: block;
}
.step_columnbox .photo {
  position: relative;
  width: 50%;
}
.step_columnbox .column-inner-contents-txtarea {
  left: 0px;
  width: 50%;
  padding: 120px 40px 30px;
  margin: 0 auto;
  border: 1px solid #073829;
  position: relative;
}
.step_columnbox .column-inner-contents-txtarea.no1, .step_columnbox .column-inner-contents-txtarea.no2, .step_columnbox .column-inner-contents-txtarea.no3, .step_columnbox .column-inner-contents-txtarea.no4 {
  background-color: rgba(255, 255, 255, 0.3);
}
.step_columnbox .column-inner-contents-txtarea.type2 {
  padding: 50px 70px;
  border: none;
  border-bottom: 1px solid #ccbf94;
}
.step_columnbox .column-inner-contents-txtarea.type2 span {
  font-family: "Arvo", serif;
  font-weight: 500;
  font-size: 3rem;
}
.step_columnbox .column-inner-contents-txtarea.type2 .txt {
  font-size: 1.8rem;
}
.step_columnbox .column-inner-contents-txtarea.type3 {
  position: relative;
  width: 100%;
  max-width: 1200px;
  padding: 50px 70px;
  border: none;
  text-align: left;
  background-color: transparent;
}
.step_columnbox .column-inner-contents-txtarea.type3 span {
  font-family: "Arvo", serif;
  font-weight: 500;
  font-size: 2rem;
  border-bottom: 1px solid #073829;
  padding: 10px 0;
  margin-bottom: 10px;
}
.step_columnbox .column-inner-contents-txtarea.type3 .txt {
  font-size: 1.6rem;
  text-align: left;
  margin-top: 10px;
}
.step_columnbox .column-inner-contents-txtarea:before {
  content: "";
  background: inherit;
  -moz-filter: blur(5px);
  -o-filter: blur(5px);
  -ms-filter: blur(5px);
  filter: blur(5px);
  position: absolute;
  top: -5px;
  left: -5px;
  right: -5px;
  bottom: -5px;
  z-index: -1;
}
.step_columnbox .column-inner-contents-txtarea.type-right {
  left: auto;
  right: 0px;
}
.step_columnbox .column-inner-contents-txtarea span {
  font-family: "Arvo", serif;
  font-weight: 500;
  font-size: 3rem;
}
.step_columnbox .txt {
  font-size: 1.6rem;
  width: auto;
  margin: 0;
  display: block;
  text-align: left;
  width: 100%;
  height: auto;
  font-weight: normal;
}
.step_columnbox img {
  width: 100%;
  height: 100%;
}
.step_columnbox .column-sub-txt {
  font-size: 1.8rem;
  width: auto;
  margin: 40px auto;
  display: block;
  text-align: left;
  width: 100%;
  height: auto;
  font-weight: normal;
  color: #333;
}

@media all and (max-width: 639px) {
  .step_columnbox.type1 {
    display: block;
  }
  .step_columnbox.type1 .column-inner {
    width: 100%;
    margin-right: auto;
  }
  .step_columnbox.type1 .column-inner:nth-child(2n) {
    margin-right: auto;
  }
}
@media all and (max-width: 639px) {
  .step_columnbox {
    width: 100%;
  }
}
@media all and (max-width: 639px) {
  .step_columnbox .column-inner-contents.type2 {
    display: block;
    margin-bottom: 100px;
  }
}
@media all and (max-width: 639px) {
  .step_columnbox .column-inner-contents.type3 {
    display: block;
  }
}
@media all and (max-width: 639px) {
  .step_columnbox .column-inner-contents {
    display: block;
  }
}
@media all and (max-width: 639px) {
  .step_columnbox .photo {
    width: 100%;
    margin: 0 auto;
  }
}
@media all and (max-width: 639px) {
  .step_columnbox .photo2 {
    width: 100%;
    margin: 0 auto;
  }
}
@media all and (max-width: 639px) {
  .step_columnbox .photo2 .photo-txt {
    font-size: 4rem;
  }
}
@media all and (max-width: 639px) {
  .step_columnbox .photo3 {
    width: 100%;
    margin: 0 auto;
    position: relative;
  }
  .step_columnbox .photo3:before {
    display: none;
  }
}
@media all and (max-width: 639px) {
  .step_columnbox .photo3 .photo-txt {
    font-size: 4rem;
  }
}
@media all and (max-width: 639px) {
  .step_columnbox .photo3-2 {
    width: 100%;
    margin: 0 auto;
    position: relative;
  }
  .step_columnbox .photo3-2:before {
    display: none;
  }
}
@media all and (max-width: 639px) {
  .step_columnbox .column-inner-contents-txtarea.type2 {
    position: relative;
    margin-top: 0;
    padding: 50px 20px;
  }
}
@media all and (max-width: 639px) {
  .step_columnbox .column-inner-contents-txtarea.type2 span {
    font-size: 1.8rem;
  }
}
@media all and (max-width: 639px) {
  .step_columnbox .column-inner-contents-txtarea.type2 .txt {
    font-size: 1.3rem;
  }
}
@media all and (max-width: 639px) {
  .step_columnbox .column-inner-contents-txtarea.type3 {
    position: relative;
    margin-top: 0;
    padding: 50px 20px;
  }
}
@media all and (max-width: 639px) {
  .step_columnbox .column-inner-contents-txtarea.type3 span {
    font-size: 1.8rem;
    padding: 2px;
  }
}
@media all and (max-width: 639px) {
  .step_columnbox .column-inner-contents-txtarea.type3 .txt {
    font-size: 1.3rem;
  }
}
@media all and (max-width: 639px) {
  .step_columnbox .column-inner-contents-txtarea {
    width: 100%;
    padding: 70px 20px 30px;
    left: 0;
    right: 0;
    margin: 0px auto;
  }
}
@media all and (max-width: 639px) {
  .step_columnbox .column-inner-contents-txtarea.type-right {
    width: 100%;
    padding: 70px 20px 30px;
    left: 0;
    right: 0;
    margin: 0px auto;
  }
}
@media all and (max-width: 639px) {
  .step_columnbox .column-inner-contents-txtarea span {
    font-size: 1.8rem;
  }
}
@media all and (max-width: 639px) {
  .step_columnbox .txt {
    font-size: 1.3rem;
  }
}
@media all and (max-width: 639px) {
  .step_columnbox .column-sub-txt {
    font-size: 1.3rem;
    margin: 0;
    padding-top: 20px;
  }
}
@-webkit-keyframes hd-scrolled {
  0% {
    opacity: 0;
    transform: translate(0, -100%);
  }
  100% {
    opacity: 1;
    transform: translate(0, 0);
  }
}
@keyframes hd-scrolled {
  0% {
    opacity: 0;
    transform: translate(0, -100%);
  }
  100% {
    opacity: 1;
    transform: translate(0, 0);
  }
}
#top {
  position: relative;
}

#header_box {
  position: absolute;
  top: 50px;
  left: 50px;
  z-index: 10;
  width: 400px;
  height: auto;
  background-color: #e6e6e6;
  box-shadow: rgba(17, 17, 17, 0.2) 0 0 5px 5px;
  padding: 40px;
}
#header_box #logo {
  text-align: center;
  padding: 30px 0;
  margin-bottom: 20px;
}
#header_box .header_box_tel {
  border-top: 1px solid #073829;
  border-bottom: 1px solid #073829;
  padding: 8px 0;
  margin-bottom: 20px;
  text-align: center;
  font-size: 1.8rem;
  font-weight: bold;
}
#header_box .header_box_tel a {
  font-size: 3rem;
  line-height: 1.2;
  color: #073829;
}
#header_box .header_box_tel a:before {
  font-family: "Font Awesome 5 Free";
  content: "\f879";
  font-weight: 900;
  margin-right: 5px;
  font-size: 80%;
}
#header_box #header_box_nav {
  width: 90%;
  margin: 20px auto;
}
#header_box #header_box_nav li {
  padding: 10px 0;
  color: #073829;
  position: relative;
  border-bottom: 1px solid rgba(7, 56, 41, 0.3);
}
#header_box #header_box_nav li.before {
  position: absolute;
  content: "";
  left: 0;
  right: 0;
  margin: 0 auto;
  top: -100px;
  width: 20px;
  height: 20px;
}
#header_box #header_box_nav li a {
  display: block;
  position: relative;
  padding: 0;
  color: #073829;
  font-size: 1.9rem;
  font-weight: bold;
}
#header_box #header_box_nav li a span {
  display: block;
  font-size: 1.4rem;
  font-weight: 500;
  color: #68482A;
  position: relative;
  letter-spacing: 0.1rem;
  font-family: "Noto Serif JP", "YakuHanMP", "Noto Serif JP", "游明朝 Medium", "Yu Mincho", YuMincho, "Hiragino Mincho ProN", HGS明朝E, serif;
  font-weight: 400;
  letter-spacing: 0;
  text-transform: lowercase !important;
}
#header_box #header_box_nav li a span:first-letter {
  text-transform: uppercase;
}
#header_box #header_box_nav li a:before {
  content: "";
  position: absolute;
  bottom: -10px;
  width: 0%;
  border-bottom: 2px solid #073829;
  transition: all 0.5s 0s ease;
}
#header_box #header_box_nav li:hover a, #header_box #header_box_nav li.active a {
  color: #073829;
}
#header_box #header_box_nav li:hover a:before, #header_box #header_box_nav li.active a:before {
  content: "";
  width: 100%;
  border-bottom: 2px solid #073829;
}
#header_box #header_box_nav li:hover a span, #header_box #header_box_nav li.active a span {
  color: #fef7f7;
  transition: 0.2s width ease-in;
}
@media all and (max-width: 896px) {
  #header_box {
    width: 300px;
    padding: 20px;
  }
}
@media all and (max-width: 639px) {
  #header_box {
    width: 140px;
    padding: 10px;
    top: 10px;
    left: 10px;
  }
  #header_box #logo {
    padding: 10px 0;
    margin-bottom: 0px;
  }
  #header_box .header_box_tel {
    display: none;
  }
  #header_box #header_box_nav {
    display: none;
  }
}

#header {
  width: 100%;
  position: absolute;
  z-index: 200;
  top: 0;
  left: 0;
  transition: all 0.2s ease-in;
  padding: 5px 0 0;
}
@media all and (max-width: 639px) {
  #header {
    padding: 0;
  }
}
#header.is-fixed {
  margin: 0px auto;
  right: 0;
  position: fixed;
  padding: 0;
  transition: 0.3s ease;
  background-color: #fff;
  box-shadow: rgba(17, 17, 17, 0.1) 0 2px 10px 2px;
}
#header.is-fixed:before {
  width: 140%;
}
#header.is-fixed .head-right {
  color: #555;
}
#header.is-fixed .head-right.border {
  border: 1px solid #fff;
}
#header.is-fixed .head-right_tel span {
  color: #555;
}
#header.is-fixed .head-right_tel a {
  color: #555;
  position: relative;
}
#header.is-fixed .head-right_tel a:hover {
  color: #68482A;
}
#header.is-fixed .inner #logo {
  width: 310px;
  position: relative;
}
#header.is-fixed .inner #logo img {
  filter: none;
}
@media all and (max-width: 639px) {
  #header.is-fixed .inner #logo {
    width: 260px;
  }
}
#header.is-hide {
  transform: translateY(-100%);
}
#header .inner {
  display: flex;
  max-width: 100%;
  margin: 0 auto;
  padding: 10px 5% 12px;
  align-items: center;
  justify-content: space-between;
  position: relative;
}
#header .inner.bar:before {
  position: absolute;
  content: "";
  width: 90%;
  height: 1px;
  left: 0;
  right: 0;
  bottom: 0px;
  margin: 0 auto;
  background-color: #fff;
}
@media all and (max-width: 1100px) {
  #header .inner.bar:before {
    bottom: 0px;
    width: 100%;
  }
}
@media all and (max-width: 1450px) {
  #header .inner {
    padding: 20px 5% 12px;
  }
}
@media all and (max-width: 1100px) {
  #header .inner {
    display: block;
  }
}
@media all and (max-width: 896px) {
  #header .inner {
    min-width: inherit;
    max-width: 90%;
    margin: 0 auto;
    display: block;
    padding: 8px 0;
  }
}
#header .inner #logo {
  width: 390px;
  padding-left: 35px;
}
#header .inner #logo img {
  filter: brightness(0) invert(1);
}
#header .inner #logo.type1 img {
  filter: none;
}
@media all and (max-width: 1100px) {
  #header .inner #logo {
    width: 320px;
    margin: 0 auto;
    text-align: center;
  }
}
@media all and (max-width: 896px) {
  #header .inner #logo {
    width: 270px;
    text-align: left;
    margin-left: 0px;
    margin: 0 0;
    text-align: left;
    padding: 0 0 10px 0;
  }
}
@media all and (max-width: 639px) {
  #header .inner #logo {
    max-width: 320px;
    max-height: 50px;
    text-align: left;
    margin-left: 0px;
    padding: 0;
  }
  #header .inner #logo img {
    height: 50px;
    -o-object-fit: contain;
       object-fit: contain;
  }
}
#header .head-right {
  margin-left: auto;
  margin-right: 0px;
  color: #fff;
}
#header .head-right.border {
  border: 1px solid #fff;
  padding: 10px 20px;
}
#header .head-right.border .head-right_contact {
  margin-right: 0;
}
@media all and (max-width: 1100px) {
  #header .head-right {
    text-align: center;
    margin: 0px auto 0;
    width: 760px;
  }
  #header .head-right .head-right_tel,
#header .head-right .head-right_btn {
    display: none;
  }
}
@media all and (max-width: 896px) {
  #header .head-right {
    display: none;
  }
}
#header .head-right_contact {
  display: flex;
  flex-wrap: wrap;
  justify-content: flex-end;
  align-items: center;
  margin-left: auto;
  margin-right: 50px;
  margin-bottom: 10px;
}
#header .head-right_tel a,
#header .head-right_btn a {
  display: block;
  padding: 4px 10px;
  transition: all 0.2s ease-in;
  color: #fff;
  font-size: 1.3rem;
}
#header .head-right_tel a:before,
#header .head-right_btn a:before {
  margin-right: 5px;
}
#header .head-right_tel {
  line-height: 1;
  text-align: center;
}
#header .head-right_tel b {
  font-size: 1.4rem;
  color: #073829;
}
#header .head-right_tel span {
  color: #fff;
  font-size: 1.2rem;
  letter-spacing: 0;
  padding-bottom: 10px;
}
#header .head-right_tel a {
  background: transparent;
  color: #fff;
  padding-top: 12px;
  font-weight: 600;
  font-size: 2.6rem;
  position: relative;
  line-height: 0.4;
  font-family: "Noto Serif JP", "YakuHanMP", "Noto Serif JP", "游明朝 Medium", "Yu Mincho", YuMincho, "Hiragino Mincho ProN", HGS明朝E, serif;
  font-weight: 400;
  letter-spacing: 0;
  text-transform: lowercase !important;
}
#header .head-right_tel a:first-letter {
  text-transform: uppercase;
}
@media all and (max-width: 896px) {
  #header .head-right_tel a {
    pointer-events: inherit;
  }
}
#header .head-right_tel a:hover {
  color: #0d654a;
}
#header .head-right_btn {
  margin: 0 4px;
}
#header .head-right_btn a {
  display: flex;
  justify-content: center;
  align-items: center;
  font-size: 1.6rem;
  text-align: center;
  width: 200px;
  position: relative;
  color: #fefefe;
  background: #68482A;
  border: 1px solid #68482A;
  font-family: "Noto Serif JP", "YakuHanMP", "Noto Serif JP", "游明朝 Medium", "Yu Mincho", YuMincho, "Hiragino Mincho ProN", HGS明朝E, serif;
  font-weight: 400;
  letter-spacing: 0;
  text-transform: lowercase !important;
}
#header .head-right_btn a span {
  display: block;
  font-size: 13px;
  margin-bottom: -5px;
}
#header .head-right_btn a:first-letter {
  text-transform: uppercase;
}
#header .head-right_btn a i {
  margin: 0 5px 0 0;
}
#header .head-right_btn a:hover {
  background: #fff;
  color: #68482A;
}
#header.transparent {
  background-color: transparent !important;
}
#header.transparent.is-fixed {
  background-color: #fff !important;
}
#header.type_r {
  background-color: #fff;
  color: #555;
}
#header.type_r.is-fixed {
  background-color: #fff;
}
#header.type_r .head-right_tel span {
  color: #555;
}
#header.type_r .head-right_tel a {
  font-size: 3.6rem;
  line-height: 1;
  color: #073829;
  position: relative;
}
#header.type_r .head-right_tel a:hover {
  opacity: 0.8;
}
#header.type_r .head-right_btn {
  line-height: 1.6;
}
#header.type_r .head-right_btn i {
  font-size: 3rem;
}
#header.type_r #header_nav {
  width: 100%;
  max-width: 1000px;
}
#header.type_r #header_nav ul li a {
  color: #333;
  padding: 8px 16px;
  border-radius: 20px;
  font-size: 1.6rem;
  text-align: center;
}
#header.type_r #header_nav ul li a::after {
  display: none;
}
#header.type_r #header_nav ul li a span {
  color: #073829;
}
#header.type_r #header_nav ul li a.active span, #header.type_r #header_nav ul li a:hover span {
  opacity: 0.6;
}
#header.type_r #header_nav ul li a:hover {
  color: #073829;
  background-color: #18c08d;
}
#header.type_r #header_nav ul li a:hover span {
  color: #555;
}
#header.type_r #header_nav ul li .dropdown .dropdown-li a {
  font-size: 1.4rem;
  text-align: left;
}
#header.type_r .inner {
  padding: 10px 0;
}
#header.type_r .inner:before {
  display: none;
}
@media all and (max-width: 1100px) {
  #header.type_r .inner {
    padding: 10px 0;
  }
}
#header.type_r .inner #logo {
  position: relative;
}
#header.type_r .inner #logo img {
  filter: none;
}
@media all and (max-width: 1100px) {
  #header.type_r .inner #logo {
    padding: 10px 0;
  }
}
@media all and (max-width: 639px) {
  #header.type_r .inner #logo {
    padding: 0;
  }
}
#header.type1 {
  background-color: #fff;
  color: #555;
}
#header.type1.transparent {
  background: transparent;
}
#header.type1.is-fixed {
  background-color: #fff;
}
#header.type1 .head-right_tel span {
  color: #555;
}
#header.type1 .head-right_tel a {
  color: #073829;
  position: relative;
}
#header.type1 .head-right_tel a:hover {
  color: #68482A;
}
#header.type1 #header_nav ul li a {
  color: #555;
  padding: 8px 8px;
}
#header.type1 #header_nav ul li a::after {
  display: none;
}
#header.type1 #header_nav ul li a span {
  color: #073829;
}
#header.type1 #header_nav ul li a.active span, #header.type1 #header_nav ul li a:hover span {
  color: #107c5b;
}
#header.type1 #header_nav ul li a:hover {
  color: #fff;
  background-color: #12936b;
}
#header.type1 #header_nav ul li a:hover span {
  color: #000;
}
#header.type1 #header_nav ul li .dropdon-li a {
  text-align: left;
}
#header.type1 .inner {
  padding: 10px 0 0;
}
#header.type1 .inner:before {
  display: none;
}
@media all and (max-width: 1100px) {
  #header.type1 .inner {
    padding: 10px 0;
  }
}
#header.type1 .inner #logo {
  width: 310px;
  position: relative;
  padding: 10px 10px 10px 35px;
}
#header.type1 .inner #logo img {
  filter: none;
}
@media all and (max-width: 1100px) {
  #header.type1 .inner #logo {
    padding: 10px 0;
  }
}
@media all and (max-width: 639px) {
  #header.type1 .inner #logo {
    padding: 0;
  }
}

#header_nav {
  position: relative;
  width: 650px;
  max-width: 1180px;
}
@media all and (max-width: 1100px) {
  #header_nav {
    width: 100%;
  }
}
.is-fixed #header_nav .head-right_tel a {
  color: #68482A;
}
@media all and (max-width: 1100px) {
  .is-fixed #header_nav {
    margin: 0 auto 0;
  }
}
.is-fixed #header_nav ul li a {
  color: #555;
}
.is-fixed #header_nav ul li a::after {
  display: none;
}
.is-fixed #header_nav ul li a span {
  color: #073829;
}
.is-fixed #header_nav ul li a.active span, .is-fixed #header_nav ul li a:hover span {
  color: #107c5b;
}
.is-fixed #header_nav ul li a:hover {
  color: #888;
}
.is-fixed #header_nav ul li a:hover span {
  color: rgba(51, 51, 51, 0.8);
}
#header_nav ul {
  margin: 0 auto;
  display: flex;
  flex-wrap: wrap;
}
#header_nav ul li {
  position: relative;
  flex: 1 0 auto;
}
#header_nav ul li .sub_nav {
  display: none;
}
#header_nav ul li .dropdown {
  display: none;
  position: absolute;
  left: 0;
  top: 35px;
  z-index: 999;
  padding-top: 30px;
}
#header_nav ul li .dropdown .dropdown-li {
  border-right: 0;
  margin: 0 0 0px;
  background: #fff;
  padding: 0;
}
#header_nav ul li .dropdown .dropdown-li a {
  display: block;
  font-size: 1.2rem;
  width: 200px;
  padding: 8px 8px;
  color: #333;
}
#header_nav ul li .dropdown .dropdown-li.foot_only {
  display: none;
}
#header_nav ul li a {
  display: block;
  font-weight: 600;
  position: relative;
  line-height: 1.3;
  font-size: 1.2rem;
  padding: 12px 0;
  color: #fff;
}
#header_nav ul li a span {
  display: block;
  font-size: 1.6rem;
  color: #fff;
  position: relative;
  letter-spacing: 0.1rem;
  font-weight: 600;
  font-family: "Noto Serif JP", "YakuHanMP", "Noto Serif JP", "游明朝 Medium", "Yu Mincho", YuMincho, "Hiragino Mincho ProN", HGS明朝E, serif;
  font-weight: 400;
  letter-spacing: 0;
  text-transform: lowercase !important;
}
#header_nav ul li a span:first-letter {
  text-transform: uppercase;
}
#header_nav ul li a:after {
  position: absolute;
  content: "";
  width: 0;
  height: 2px;
  background: #073829;
  left: 0;
  bottom: 0px;
  transition: 0.2s width ease-in;
}
@media all and (max-width: 1100px) {
  #header_nav ul li a:after {
    right: 0;
    text-align: center;
    margin: 0 auto;
  }
}
#header_nav ul li a:hover span, #header_nav ul li a.active span {
  color: #12936b;
  transition: 0.2s width ease-in;
}

#header_nav.deco01 {
  position: relative;
  z-index: 3;
  margin-bottom: -30px;
  background: #fff;
  padding: 0 0 0 8px;
  border-radius: 15px 0 0 15px;
  border-top: 1px solid #073829;
  border-left: 1px solid #073829;
  border-bottom: 2px solid #073829;
}
@media all and (max-width: 1100px) {
  #header_nav.deco01 {
    border-radius: 15px;
    width: 95%;
    margin-inline: auto;
  }
}
#header_nav.deco01 ul li:not(:last-of-type) {
  border-right: 1px dashed rgba(31, 163, 58, 0.3);
}
#header_nav.deco01 ul li a {
  color: #333;
  border-radius: 20px;
  font-size: 1.5rem;
  text-align: center;
  line-height: 1.6;
}
#header_nav.deco01 ul li a::after {
  display: none;
}
#header_nav.deco01 ul li a span {
  color: #68482A;
  font-family: "Noto Serif JP", "YakuHanMP", "Noto Serif JP", "游明朝 Medium", "Yu Mincho", YuMincho, "Hiragino Mincho ProN", HGS明朝E, serif;
  font-weight: 400;
  letter-spacing: 0;
  text-transform: lowercase !important;
  font-size: 1.2rem;
}
#header_nav.deco01 ul li a span:first-letter {
  text-transform: uppercase;
}
#header_nav.deco01 ul li a span:first-letter {
  color: #ff9da4;
}
#header_nav.deco01 ul li a:before {
  position: absolute;
  content: "";
  left: -21px;
  top: -13px;
  width: 25px;
  height: 25px;
  background: url(../images/japanese/picture_mask.png);
  margin-left: -13px;
  border-radius: 40%;
  opacity: 0;
  transition: 0.2s ease-in opacity;
  z-index: -1;
}
#header_nav.deco01 ul li a.active span, #header_nav.deco01 ul li a:hover span {
  opacity: 0.6;
}
#header_nav.deco01 ul li a.active:before, #header_nav.deco01 ul li a:hover:before {
  opacity: 0.5;
}
#header_nav.deco01 ul li a:hover {
  color: #073829;
}
#header_nav.deco01 ul li a:hover span {
  color: #555;
}

#header_nav_sub {
  background-color: #eee;
  margin: 0 auto;
  width: 100%;
  text-align: center;
  z-index: 110;
  padding: 20px 0;
}
#header_nav_sub.is-fixed {
  width: 100%;
  background-color: rgba(255, 255, 255, 0.9);
  box-shadow: rgba(170, 170, 170, 0.19) 0px 6px 6px 0px;
  position: fixed;
  top: 0;
  left: 0;
  right: 0;
  height: 70px;
  padding: 13px 0;
}
@media all and (max-width: 639px) {
  #header_nav_sub {
    display: none;
  }
}
#header_nav_sub .header_nav_sub_inner {
  width: 100%;
  max-width: 1200px;
  margin: 0 auto;
  display: flex;
  flex-wrap: wrap;
  align-items: center;
}
#header_nav_sub .header_nav_sub_inner #logo {
  width: 14%;
}
#header_nav_sub .header_nav_sub_inner #logo img {
  width: 90%;
  height: auto;
  -o-object-fit: cover;
     object-fit: cover;
}
#header_nav_sub ul {
  width: 100%;
  max-width: 43%;
  margin: 0 auto;
  display: flex;
  flex-wrap: wrap;
}
#header_nav_sub ul li {
  position: relative;
  flex: 1 0 auto;
  border-right: 1px solid #fff;
}
#header_nav_sub ul li:last-child {
  border-right: 0px solid #fff;
}
#header_nav_sub ul li.before {
  position: absolute;
  content: "";
  left: 0;
  right: 0;
  margin: 0 auto;
  top: -100px;
  width: 20px;
  height: 20px;
}
#header_nav_sub ul li a {
  display: block;
  position: relative;
  line-height: 1.2;
  font-size: 1.2rem;
  padding: 0;
  font-weight: 600;
  color: #333;
  text-align: center;
}
#header_nav_sub ul li a span {
  display: block;
  font-size: 1.6rem;
  font-family: "Noto Serif JP", "YakuHanMP", "Noto Serif JP", "游明朝 Medium", "Yu Mincho", YuMincho, "Hiragino Mincho ProN", HGS明朝E, serif;
  font-weight: 400;
  letter-spacing: 0;
  text-transform: lowercase !important;
  color: #073829;
  position: relative;
  letter-spacing: 0.1rem;
}
#header_nav_sub ul li a span:first-letter {
  text-transform: uppercase;
}
@media all and (max-width: 896px) {
  #header_nav_sub ul li a {
    font-size: 1.1rem;
  }
  #header_nav_sub ul li a span {
    font-size: 1.4rem;
  }
}
#header_nav_sub ul li a:after {
  position: absolute;
  content: "";
  width: 0;
  height: 2px;
  background: #073829;
  left: 0;
  bottom: 0px;
  transition: 0.2s width ease-in;
}
@media all and (max-width: 1100px) {
  #header_nav_sub ul li a:after {
    right: 0;
    text-align: center;
    margin: 0 auto;
  }
}
#header_nav_sub ul li:hover a, #header_nav_sub ul li.active a {
  color: #073829;
}
#header_nav_sub ul li:hover a span, #header_nav_sub ul li.active a span {
  color: #68482A;
  transition: 0.2s width ease-in;
}

#view_nav {
  position: absolute;
  bottom: 20px;
  left: 0;
  right: 0;
  margin: 0 auto;
  width: 100%;
  text-align: center;
  z-index: 110;
}
@media all and (max-width: 639px) {
  #view_nav {
    display: none;
  }
}
#view_nav.is-fixed {
  width: 100%;
  background-color: rgba(255, 255, 255, 0.8);
  box-shadow: rgba(170, 170, 170, 0.19) 0px 6px 6px 0px;
  -webkit-backdrop-filter: blur(4px);
          backdrop-filter: blur(4px);
  position: fixed;
  top: 0;
  left: 0;
  right: 0;
  height: 65px;
  padding: 10px 0;
}
#view_nav.is-fixed ul li {
  border-left: 1px solid #111;
}
#view_nav.is-fixed ul li a {
  color: #111;
}
#view_nav ul {
  width: 100%;
  max-width: 1200px;
  margin: 0 auto;
  display: flex;
  flex-wrap: wrap;
}
#view_nav ul li {
  position: relative;
  flex: 1 0 auto;
  border-right: 1px solid #fff;
}
#view_nav ul li:last-child {
  border-right: 0px solid #fff;
}
#view_nav ul li.before {
  position: absolute;
  content: "";
  left: 0;
  right: 0;
  margin: 0 auto;
  top: -100px;
  width: 20px;
  height: 20px;
}
#view_nav ul li a {
  display: block;
  line-height: 1.5;
  padding: 0;
  font-weight: 600;
  color: #fff;
  font-weight: 500;
  text-transform: uppercase;
  position: relative;
  display: block;
  font-size: 1.3rem;
}
#view_nav ul li a .eng {
  font-size: 1.8rem;
  letter-spacing: 0.1rem;
  display: block;
  font-family: "Noto Serif JP", "YakuHanMP", "Noto Serif JP", "游明朝 Medium", "Yu Mincho", YuMincho, "Hiragino Mincho ProN", HGS明朝E, serif;
  font-weight: 400;
  letter-spacing: 0;
  text-transform: lowercase !important;
}
#view_nav ul li a .eng:first-letter {
  text-transform: uppercase;
}
#view_nav ul li a:after {
  position: absolute;
  content: "";
  width: 0;
  height: 2px;
  background: #073829;
  left: 0;
  bottom: 0px;
  transition: 0.2s width ease-in;
}
#view_nav ul li:hover a, #view_nav ul li.active a {
  color: #073829;
}
#view_nav ul li:hover a span, #view_nav ul li.active a span {
  color: #073829;
  transition: 0.2s width ease-in;
}
#view_nav ul li:hover.type1, #view_nav ul li:hover.type2, #view_nav ul li:hover.type3, #view_nav ul li:hover.type4, #view_nav ul li:hover.type5, #view_nav ul li:hover.type6 {
  transition: 0.2s ease-in;
}
#view_nav ul li.active.type1, #view_nav ul li.active.type2, #view_nav ul li.active.type3, #view_nav ul li.active.type4, #view_nav ul li.active.type5, #view_nav ul li.active.type6 {
  transition: 0.2s ease-in;
}
#view_nav ul li:hover.type1:before, #view_nav ul li:hover.type2:before, #view_nav ul li:hover.type3:before, #view_nav ul li:hover.type4:before, #view_nav ul li:hover.type5:before, #view_nav ul li:hover.type6:before {
  position: absolute;
  content: "";
  width: 45px;
  height: 45px;
  left: 0;
  right: 0;
  margin: 0 auto;
  top: -35px;
  opacity: 0.7;
}
#view_nav ul li.active.type1:before, #view_nav ul li.active.type2:before, #view_nav ul li.active.type3:before, #view_nav ul li.active.type4:before, #view_nav ul li.active.type5:before, #view_nav ul li.active.type6:before {
  position: absolute;
  content: "";
  width: 45px;
  height: 45px;
  left: 0;
  right: 0;
  margin: 0 auto;
  top: -35px;
  opacity: 0.7;
}

#main_nav01 {
  position: relative;
  width: 100%;
  max-width: 1180px;
  margin: 0 auto 0;
  border-top: 1px solid #ccc;
}
#main_nav01 ul {
  margin: 0 auto;
  display: flex;
  flex-wrap: wrap;
}
#main_nav01 ul li {
  position: relative;
  flex: 1 0 auto;
  padding: 12px 0;
  transition: 0.3s;
}
#main_nav01 ul li:hover {
  opacity: 0.6;
  background-color: #eee;
  transition: 0.3s;
}
#main_nav01 ul li a {
  display: block;
  font-weight: 600;
  position: relative;
  line-height: 1.1;
  color: #333;
  text-align: center;
  font-size: 1.6rem;
  line-height: 1.6;
}
#main_nav01 ul li a span {
  font-family: "Noto Serif JP", "YakuHanMP", "Noto Serif JP", "游明朝 Medium", "Yu Mincho", YuMincho, "Hiragino Mincho ProN", HGS明朝E, serif;
  font-weight: 400;
  letter-spacing: 0;
  text-transform: lowercase !important;
  color: #073829;
  font-size: 1.9rem;
  display: block;
  position: relative;
  letter-spacing: 0.1rem;
  font-weight: 600;
}
#main_nav01 ul li a span:first-letter {
  text-transform: uppercase;
}
#main_nav01 ul li a.active {
  color: #0d654a;
}
#main_nav01 ul > li a {
  border-right: 1px solid #eee;
}
#main_nav01 ul > li:last-child a {
  border-right: 0px solid #eee;
}
#main_nav01 .dropdown {
  display: none;
  position: absolute;
  left: 0;
  top: 35px;
  z-index: 999;
  padding-top: 30px;
}
#main_nav01 .dropdown .dropdown-li {
  border-right: 0;
  margin: 0 0 2px;
  background: #fff;
  text-align: left;
  padding: 0;
}
#main_nav01 .dropdown .dropdown-li a {
  display: block;
  text-align: left;
  font-size: 1.2rem;
  width: 220px;
  padding: 8px 8px;
  color: #333;
  box-shadow: rgba(51, 51, 51, 0.3) 0 0 5px;
}
#main_nav01 .dropdown .dropdown-li.foot_only {
  display: none;
}
@media all and (max-width: 1100px) {
  #main_nav01 ul li a {
    font-size: 1.2rem;
  }
  #main_nav01 ul li a span {
    font-size: 1.4rem;
  }
}
@media all and (max-width: 896px) {
  #main_nav01 {
    display: none;
  }
}

#main_nav02 {
  position: relative;
  margin: 0 auto;
  width: 100%;
  text-align: center;
  z-index: 110;
  background-color: white;
}
#main_nav02 .main_nav_wrap {
  display: flex;
  justify-content: space-between;
  width: 100%;
  max-width: 1200px;
  padding: 20px 0;
  margin: 0 auto;
}
#main_nav02 .main_nav_tel {
  background: transparent;
  color: #073829;
  width: auto;
  height: auto;
  text-align: center;
  line-height: 1.8rem;
  position: relative;
  font-size: 1.8rem;
  font-weight: normal;
}
#main_nav02 .main_nav_tel span {
  font-size: 1.8rem;
  font-weight: normal;
  font-family: "PT Serif", serif;
  font-weight: 500;
}
#main_nav02 .main_nav_tel span:before {
  font-family: "Font Awesome 5 Free";
  content: "\f879";
  font-weight: 900;
  font-size: 80%;
  margin-right: 8px;
}
#main_nav02:after {
  content: "";
  background-color: rgba(238, 132, 125, 0.2);
  position: absolute;
  width: 25%;
  height: 100%;
  top: 0;
  right: 0;
  z-index: -1;
}
#main_nav02.is-fixed {
  width: 100%;
  background-color: rgba(255, 255, 255, 0.9);
  box-shadow: rgba(170, 170, 170, 0.19) 0px 6px 6px 0px;
  position: fixed;
  top: 0;
  left: 0;
  right: 0;
  height: 60px;
  padding: 0;
}
#main_nav02 ul {
  margin: 0 auto 0 0;
  display: flex;
  flex-wrap: wrap;
  gap: 0 80px;
}
#main_nav02 ul li {
  position: relative;
  flex: 1 0 auto;
}
#main_nav02 ul li:last-child {
  border-right: 0px solid #fff;
}
#main_nav02 ul li.before {
  position: absolute;
  content: "";
  left: 0;
  right: 0;
  margin: 0 auto;
  top: -100px;
  width: 20px;
  height: 20px;
}
#main_nav02 ul li a {
  display: block;
  position: relative;
  line-height: 1.5;
  font-size: 1.5rem;
  padding: 0;
  font-weight: 300;
  color: #555;
}
#main_nav02 ul li a span {
  display: block;
  font-size: 1.8rem;
  font-family: "PT Serif", serif;
  font-weight: 500;
  color: #073829;
  position: relative;
  letter-spacing: 0.1rem;
}
#main_nav02 ul li a:before {
  content: "";
  position: absolute;
  bottom: -10px;
  width: 0%;
  border-bottom: 2px solid #073829;
  transition: all 0.5s 0s ease;
}
#main_nav02 ul li:hover a, #main_nav02 ul li.active a {
  color: #073829;
}
#main_nav02 ul li:hover a:before, #main_nav02 ul li.active a:before {
  content: "";
  width: 100%;
  border-bottom: 2px solid #073829;
}
#main_nav02 ul li:hover a span, #main_nav02 ul li.active a span {
  color: #fef7f7;
  transition: 0.2s width ease-in;
}
#main_nav02 .dropdown {
  display: none;
  position: absolute;
  left: 0;
  top: 20px;
  z-index: 999;
  padding-top: 20px;
}
#main_nav02 .dropdown .dropdown-li {
  border-right: 0;
  margin: 0;
}
#main_nav02 .dropdown .dropdown-li a {
  display: block;
  width: 220px;
  padding: 10px 8px;
  font-size: 1.4rem;
  letter-spacing: 0.1rem;
  text-align: left;
  color: #333;
  background: #fff;
  border-bottom: 1px solid #f2f2f2;
}
#main_nav02 .dropdown .dropdown-li a:before {
  display: none;
}
#main_nav02 .dropdown .dropdown-li a:hover {
  color: #073829;
  background: rgba(242, 242, 242, 0.8);
}
#main_nav02 .dropdown .dropdown-li a:after {
  display: none;
}
#main_nav02.UpMove {
  position: fixed;
  width: 100%;
  -webkit-animation: UpAnime 0.5s forwards;
  animation: UpAnime 0.5s forwards;
}
#main_nav02.DownMove {
  position: fixed;
  top: 0;
  margin-top: 0;
  width: 100%;
  -webkit-animation: DownAnime 0.5s forwards;
  animation: DownAnime 0.5s forwards;
  background-color: white;
  box-shadow: 0px 0px 16px -6px rgba(0, 0, 0, 0.6);
}
#main_nav02.DownMove ul {
  width: 100%;
  max-width: 880px;
}
#main_nav02.DownMove ul li:before {
  display: none;
}
@media all and (max-width: 1100px) {
  #main_nav02 {
    text-align: center;
    margin: 0 auto;
    width: 80%;
    width: 760px;
  }
}
@media all and (max-width: 639px) {
  #main_nav02 {
    display: none;
  }
}

.flogo {
  margin: 0 auto 40px;
  min-height: 0;
  max-width: 300px;
  text-align: center;
}
@media all and (max-width: 639px) {
  .flogo {
    margin: 0 auto 20px;
    width: 50%;
  }
}
.flogo.white img {
  filter: brightness(0) invert(1);
}

.footer_type01 {
  font-size: 1.3rem;
  position: relative;
}
.footer_type01.bar:before {
  content: "";
  position: absolute;
  top: -10px;
  left: 0;
  right: 0;
  width: 90%;
  margin: 0 auto;
  border-top: 1px solid #fff;
}
.footer_type01.type1 {
  color: #555;
}
.footer_type01.type1 .flogo img {
  filter: none;
}
.footer_type01.type1 .footer_navi {
  margin: 0 0 0 30px;
}
.footer_type01.type1 .footer_navi ul li a {
  color: #555;
}
.footer_type01.type1 .footer_navi ul li a:before {
  color: #555;
  display: none;
}
.footer_type01.type1 .footer_navi ul li a:hover {
  opacity: 0.6;
}
.footer_type01 .copy {
  text-align: center;
  padding: 20px 0;
  background-color: #fff;
  color: #333;
}
@media all and (max-width: 896px) {
  .footer_type01 .copy {
    padding-bottom: 80px;
  }
}
.footer_type01 .ggmap {
  position: relative;
  padding-bottom: 40%;
  height: 0;
  overflow: hidden;
}
@media all and (max-width: 896px) {
  .footer_type01 .ggmap {
    padding-bottom: 80%;
    height: 0;
  }
}
.footer_type01 .ggmap iframe,
.footer_type01 .ggmap object,
.footer_type01 .ggmap embed {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
}

.footer_type02 {
  display: flex;
  position: relative;
  gap: 5% 5%;
  align-items: flex-start;
}
@media all and (max-width: 639px) {
  .footer_type02.res_none {
    display: flex !important;
  }
  .footer_type02.res_none figure {
    max-width: 30%;
  }
}
.footer_type02.reverse {
  flex-direction: row-reverse;
}
.footer_type02.j-center {
  justify-content: center;
}
.footer_type02.a-center {
  align-items: center;
}
.footer_type02 .information {
  max-width: 30%;
  position: relative;
}
.footer_type02 .information .logo {
  margin: 0 0 20px;
}
.footer_type02 .information .logo img {
  max-width: 200px;
}
.footer_type02 .information .address {
  font-size: 80%;
}
.footer_type02 .guidance {
  flex: 1;
}
@media all and (max-width: 896px) {
  .footer_type02 {
    display: block;
  }
  .footer_type02 .information {
    max-width: 100%;
    position: relative;
    text-align: center;
    margin: 0 0 30px;
  }
  .footer_type02 .information .logo img {
    max-width: 200px;
  }
  .footer_type02 .information .address {
    font-size: 100%;
  }
}
.footer_type02.half {
  gap: 0% 0%;
}
.footer_type02.half .figure,
.footer_type02.half figure {
  max-width: 50%;
  width: 50%;
  height: 100%;
  max-height: 50vw;
}
.footer_type02.half .txtarea {
  width: 50%;
  padding: 0px 100px;
}
@media all and (max-width: 1100px) {
  .footer_type02.half .txtarea {
    padding: 0px 50px;
  }
}
@media all and (max-width: 896px) {
  .footer_type02.half {
    display: block;
  }
  .footer_type02.half .figure,
.footer_type02.half figure {
    max-width: 100%;
    width: 100%;
    height: 100%;
    max-height: 60vw;
  }
  .footer_type02.half .txtarea {
    width: 100%;
    padding: 30px 10px;
  }
}

.footer_navi {
  flex-basis: 100%;
  margin: 40px auto 0;
}
.footer_navi ul {
  margin: 0 auto 0px;
  justify-content: center;
  max-width: 1200px;
  padding: 10px 0;
}
.footer_navi ul li {
  display: inline-block;
  padding: 0 10px;
}
@media all and (max-width: 1100px) {
  .footer_navi ul li {
    padding: 0px;
  }
}
.footer_navi ul li a {
  color: #fff;
  font-size: 1.3rem;
  position: relative;
  font-weight: 600;
  /*     &:before {
    content: "";
    background-color: rgb(180, 180, 180);
    width: 130px;
    height: 1px;
    position: absolute;
    bottom: -6px;
    left: 0;
  } */
}
.footer_navi ul li a span {
  display: none;
}
.footer_navi ul li a:before {
  font-family: "Font Awesome 5 Free";
  content: "\f068";
  font-weight: 900;
  margin-right: 5px;
  color: #fff;
}
.footer_navi ul li a:hover {
  opacity: 0.6;
}
.footer_navi ul li:last-child a {
  /*  &:before {
    display: none;
  } */
}
.footer_navi ul li .dropdown {
  display: none;
}
.footer_navi ul li .dropdown .dropdon-li a {
  font-size: 1.2rem;
}
.footer_navi.type1 ul {
  text-align: center;
}
.footer_navi.type1 ul li a {
  color: #333;
}
.footer_navi.type1 ul li a:before {
  color: #073829;
}
.footer_navi.bar ul {
  border-top: 1px solid #aaa;
  border-bottom: 1px solid #aaa;
  background-color: rgba(255, 255, 255, 0.6);
}
.footer_navi.base ul {
  max-width: 100%;
}
.footer_navi.base ul li {
  padding: 0 25px 0 0;
}
.footer_navi.base ul li a {
  color: #555;
}
.footer_navi.base ul li a:before {
  font-family: "Font Awesome 5 Free";
  content: "\f0a9";
  font-weight: 900;
  color: #fff;
}
.footer_navi.white {
  margin-bottom: 30px;
}
.footer_navi.white ul {
  border-top: 1px solid #fff;
  border-bottom: 1px solid #fff;
  text-align: center;
}
.footer_navi.white ul li a {
  color: #fff;
}
.footer_navi.white ul li a:before {
  color: #fff;
}
.footer_navi.type2 ul li {
  display: block;
}

.footer_navi02 > ul {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 24px 24px;
}
@media all and (max-width: 639px) {
  .footer_navi02 > ul {
    grid-template-columns: repeat(2, 1fr);
    gap: 5px 10px;
  }
  .footer_navi02 > ul .dropdown .dropdown-li a {
    display: none;
  }
}
.footer_navi02 > ul > li > a {
  color: #111;
  position: relative;
  font-weight: normal;
  font-size: 80%;
  line-height: 1.4;
  border-bottom: 1px solid #ccc;
  display: block;
  padding: 5px 0;
  font-weight: bold;
  /* 
  &:before {
    @include awesome(\f068);
    margin-right: 5px;
    color: #fff;
  } 
  */
}
.footer_navi02 > ul > li > a span {
  display: block;
  color: #073829;
  font-weight: normal;
}
.footer_navi02 > ul > li > a:hover {
  opacity: 0.6;
}
.footer_navi02 > ul .dropdown .dropdown-li a {
  font-size: 80%;
  color: #111;
  padding: 0 0 0 10px;
}
.footer_navi02 > ul .dropdown .dropdown-li a:hover {
  opacity: 0.6;
}
.footer_navi02 > ul.white {
  margin-bottom: 30px;
}
.footer_navi02 > ul.white ul {
  border-top: 1px solid #fff;
  border-bottom: 1px solid #fff;
  text-align: center;
}
.footer_navi02 > ul.white ul li a {
  color: #fff;
}
.footer_navi02 > ul.white ul li a:before {
  color: #fff;
}

.footer_contact {
  display: flex;
  justify-content: space-between;
  flex-direction: row-reverse;
  align-items: center;
}
@media all and (max-width: 639px) {
  .footer_contact {
    display: block;
  }
}
.footer_contact .telno {
  font-weight: bold;
  color: #073829;
  font-size: 1.5rem;
  margin: 0 8px 0 0;
}
@media all and (max-width: 639px) {
  .footer_contact .telno {
    text-align: center;
    margin: 12px auto 12px;
    width: 91%;
  }
  .footer_contact .telno i {
    display: none;
  }
  .footer_contact .telno a {
    display: block;
  }
}
.footer_contact .telno a {
  font-size: 2.2rem;
  font-weight: normal;
  color: #073829;
  border: 1px solid #073829;
  padding: 8px 20px;
  border-radius: 10px;
}
.footer_contact .telno a:hover {
  opacity: 0.6;
}
.footer_contact .telno a:before {
  font-family: "Font Awesome 5 Free";
  content: "\f879";
  font-weight: 900;
  margin-right: 5px;
  font-size: 80%;
}

.copyright {
  background-color: #f2f2f2;
  text-align: center;
  margin: 0 auto 0;
  padding: 24px 0px 24px;
  font-size: 1.4rem;
  position: relative;
  z-index: 2;
  color: #555;
}
@media all and (max-width: 896px) {
  .copyright {
    font-size: 12px;
    margin-top: 0;
    padding: 20px 0 80px;
  }
}

.contact_bnr {
  position: relative;
  z-index: 2;
  margin: 40px auto;
  max-width: 1200px;
  display: flex;
  flex-wrap: wrap;
  justify-content: space-around;
}
.contact_bnr.bar li:last-child {
  position: relative;
}
.contact_bnr.bar li:last-child:before {
  position: absolute;
  content: "";
  border-left: 2px solid #073829;
  width: 100%;
  height: 100%;
  top: 0px;
  left: -7px;
}
@media all and (max-width: 639px) {
  .contact_bnr.bar li:last-child:before {
    display: none;
  }
}
.contact_bnr.type2 > li:last-child:before {
  border-left: 0px solid #073829;
}
@media all and (max-width: 639px) {
  .contact_bnr {
    margin: 20px auto;
  }
}
.contact_bnr > li {
  width: 49%;
  text-align: center;
  background-color: #fff;
}
.contact_bnr > li.border {
  border: 2px solid #073829;
}
@media all and (max-width: 639px) {
  .contact_bnr > li {
    width: 90%;
    margin: 0 auto;
    font-size: 1rem;
    box-shadow: rgba(17, 17, 17, 0.2) 0px 0px 1px 2px;
    padding-bottom: 5px;
  }
  .contact_bnr > li:last-child {
    border-left: 0px solid #073829;
    margin-bottom: 5px;
  }
  .contact_bnr > li:not(:last-child) {
    border-right: 0;
    margin-bottom: 5px;
  }
}
.contact_bnr > li .bnr_tel:before {
  font-family: "Font Awesome 5 Free";
  content: "\f879";
  font-weight: 900;
  font-size: 80%;
}
.contact_bnr > li .bnr_fax:before {
  font-family: "Font Awesome 5 Free";
  content: "\f1ac";
  font-weight: 900;
}
.contact_bnr > li .bnr_mail:before {
  font-family: "Font Awesome 5 Free";
  content: "\f0e0";
  font-weight: 900;
}
.contact_bnr > li b {
  font-size: 80%;
}
.contact_bnr > li a,
.contact_bnr > li span {
  font-family: "Noto Serif JP", "YakuHanMP", "Noto Serif JP", "游明朝 Medium", "Yu Mincho", YuMincho, "Hiragino Mincho ProN", HGS明朝E, serif;
  font-weight: 400;
  letter-spacing: 0;
  text-transform: lowercase !important;
  position: relative;
  display: block;
  font-size: 3.5rem;
  line-height: 3.5rem;
  color: #555;
  padding: 10px;
  margin: 0 auto;
}
.contact_bnr > li a:first-letter,
.contact_bnr > li span:first-letter {
  text-transform: uppercase;
}
@media all and (max-width: 639px) {
  .contact_bnr > li a,
.contact_bnr > li span {
    font-size: 1.8rem;
    line-height: 1.8rem;
    padding: 10px 0 0;
  }
}
.contact_bnr > li a:hover,
.contact_bnr > li span:hover {
  color: #073829;
}
.contact_bnr > li a:before,
.contact_bnr > li span:before {
  margin-right: 5px;
}
@media all and (max-width: 896px) {
  .contact_bnr > li a,
.contact_bnr > li span {
    font-size: 1.6rem;
  }
}
@media all and (max-width: 639px) {
  .contact_bnr > li a,
.contact_bnr > li span {
    width: 100%;
  }
  .contact_bnr > li a:before,
.contact_bnr > li span:before {
    font-size: 1.4rem;
  }
}
.contact_bnr.type1 > li {
  background-color: inherit;
  color: #fff;
  transition: 0.4s;
}
@media all and (max-width: 639px) {
  .contact_bnr.type1 > li {
    border: 1px solid #fff;
  }
}
.contact_bnr.type1 > li:last-child:before {
  border-left: 1px solid #fff;
}
.contact_bnr.type1 > li:hover {
  opacity: 0.3;
}
.contact_bnr.type1 > li span,
.contact_bnr.type1 > li a {
  color: #fff;
}

#pagetop {
  position: fixed;
  bottom: 10px;
  right: 7px;
  z-index: 980;
  opacity: 0;
  align-items: center;
  transition: 0.4s ease-in-out;
}
#pagetop.view {
  opacity: 1;
  transition: 0.4s ease-in-out;
}
#pagetop a {
  display: grid;
  place-items: center;
  background: #fff;
  box-shadow: rgba(51, 51, 51, 0.1) 0px 2px 2px 2px;
  color: #073829;
  border: 1px solid #073829;
  width: 50px;
  height: 50px;
  border-radius: 50%;
  font-size: 2.2rem;
}
#pagetop a:hover {
  opacity: 0.6;
}
@media all and (max-width: 639px) {
  #pagetop {
    bottom: 50px;
  }
  #pagetop a {
    width: 40px;
    height: 40px;
    font-size: 1.6rem;
  }
}

#page-top_img {
  position: fixed;
  bottom: 10px;
  right: 7px;
  z-index: 980;
}
#page-top_img a {
  display: block;
}
#page-top_img a img {
  width: 120px;
}
@media all and (max-width: 639px) {
  #page-top_img a img {
    bottom: 40px;
  }
}
#page-top_img a:hover {
  opacity: 0.6;
}
@media all and (max-width: 639px) {
  #page-top_img {
    bottom: 70px;
  }
}

.pagetop_show {
  position: fixed;
  right: -130px;
  bottom: 115%;
  width: 100px;
  height: 100px;
  z-index: 120;
  transition: right 1.2s, bottom 1.2s;
  cursor: pointer;
  -webkit-backface-visibility: hidden;
  backface-visibility: hidden;
  will-change: transform;
}
.pagetop_show a {
  position: absolute;
  width: 100%;
  height: 100%;
  top: 0;
  left: 0;
  z-index: 1;
}
.pagetop_show.show {
  right: 1.5%;
  bottom: 100px;
  z-index: 1000;
}
.pagetop_show span {
  position: absolute;
  display: block;
  width: 100px;
  height: 100px;
  transition: all 0.2s;
  -webkit-backface-visibility: hidden;
  backface-visibility: hidden;
}
.pagetop_show span.s1 {
  background: url(../pagetop/swallow_01.svg) center center/100px auto no-repeat;
  transform: scale(1);
  -webkit-transform: scale(1);
}
.pagetop_show span.s2 {
  background: url(../pagetop/swallow_02.svg) center center/100px auto no-repeat;
  opacity: 0;
  transform: scale(0.7);
  -webkit-transform: scale(0.7);
}
.pagetop_show span.s3 {
  background: url(../pagetop/swallow_03.svg) center center/100px auto no-repeat;
  opacity: 0;
  transform: scale(1.3);
  -webkit-transform: scale(1.3);
}
.pagetop_show span.s4 {
  background: url(../pagetop/swallow_04.svg) center center/100px auto no-repeat;
  opacity: 0;
  transform: scale(1);
  -webkit-transform: scale(1);
}
@media all and (max-width: 639px) {
  .pagetop_show span {
    width: 60px;
    height: 60px;
  }
  .pagetop_show span.s1, .pagetop_show span.s2, .pagetop_show span.s3, .pagetop_show span.s4 {
    background-size: 60px 60px;
  }
}
.pagetop_show p {
  position: relative;
  left: 0;
  top: 0;
  transition: margin 0.2s;
  -webkit-backface-visibility: hidden;
  backface-visibility: hidden;
}
.pagetop_show.wait p {
  -webkit-animation-play-state: paused;
          animation-play-state: paused;
}
.pagetop_show:hover span.s1, .pagetop_show.up:hover span.s1 {
  opacity: 0;
  transform: scale(1.3);
  -webkit-transform: scale(1.3);
}
.pagetop_show:hover span.s2, .pagetop_show.up:hover span.s2 {
  opacity: 1;
  transform: scale(1);
  -webkit-transform: scale(1);
}
.pagetop_show:hover span.s3 {
  opacity: 0;
  transform: scale(1.3);
  -webkit-transform: scale(1.3);
}
.pagetop_show.up:hover span.s3 {
  opacity: 0;
  transform: scale(1.3);
  -webkit-transform: scale(1.3);
}
.pagetop_show.up span.s1 {
  opacity: 0;
  transform: scale(1.3);
  -webkit-transform: scale(1.3);
  -webkit-animation: swallow1 3s ease-in-out infinite, swallow2 6s ease-in-out 1.5s infinite;
          animation: swallow1 3s ease-in-out infinite, swallow2 6s ease-in-out 1.5s infinite;
}
.pagetop_show.up span.s2 {
  opacity: 0;
  transform: scale(0.7);
  -webkit-transform: scale(0.7);
  -webkit-animation: swallow1 3s ease-in-out infinite, swallow2 6s ease-in-out 1.5s infinite;
          animation: swallow1 3s ease-in-out infinite, swallow2 6s ease-in-out 1.5s infinite;
}
.pagetop_show.up span.s3 {
  opacity: 1;
  transform: scale(1);
  -webkit-transform: scale(1);
  -webkit-animation: swallow1 3s ease-in-out infinite, swallow2 6s ease-in-out 1.5s infinite;
          animation: swallow1 3s ease-in-out infinite, swallow2 6s ease-in-out 1.5s infinite;
}
.pagetop_show span.s4 {
  opacity: 0;
}
.pagetop_show.wait span.s1, .pagetop_show.wait span.s3 {
  opacity: 0;
}
.pagetop_show.wait span.s4 {
  opacity: 1;
}
.pagetop_show:hover span.s4, .pagetop_show.up:hover span.s4 {
  opacity: 0 !important;
  transform: scale(1.3);
  -webkit-transform: scale(1.3);
}
.pagetop_show.down span.s1 {
  opacity: 1;
  -webkit-animation: swallow1 3s ease-in-out infinite, swallow2 6s ease-in-out 1.5s infinite;
          animation: swallow1 3s ease-in-out infinite, swallow2 6s ease-in-out 1.5s infinite;
}
.pagetop_show.down span.s3, .pagetop_show.down span.s4 {
  opacity: 0;
  -webkit-animation: swallow1 3s ease-in-out infinite, swallow2 6s ease-in-out 1.5s infinite;
          animation: swallow1 3s ease-in-out infinite, swallow2 6s ease-in-out 1.5s infinite;
}
.pagetop_show.down:hover span.s1 {
  opacity: 0;
}
.pagetop_show.up span.s3 {
  opacity: 1;
  -webkit-animation: swallow1 3s ease-in-out infinite, swallow2 6s ease-in-out 1.5s infinite;
          animation: swallow1 3s ease-in-out infinite, swallow2 6s ease-in-out 1.5s infinite;
}
.pagetop_show.up span.s1, .pagetop_show.up span.s4 {
  opacity: 0;
  -webkit-animation: swallow1 3s ease-in-out infinite, swallow2 6s ease-in-out 1.5s infinite;
          animation: swallow1 3s ease-in-out infinite, swallow2 6s ease-in-out 1.5s infinite;
}

@-webkit-keyframes swallow1 {
  0% {
    left: 30%;
  }
  50% {
    left: -30%;
  }
  100% {
    left: 30%;
  }
}

@keyframes swallow1 {
  0% {
    left: 30%;
  }
  50% {
    left: -30%;
  }
  100% {
    left: 30%;
  }
}
@-webkit-keyframes swallow2 {
  0% {
    top: -10%;
  }
  50% {
    top: 10%;
  }
  100% {
    top: -10%;
  }
}
@keyframes swallow2 {
  0% {
    top: -10%;
  }
  50% {
    top: 10%;
  }
  100% {
    top: -10%;
  }
}
.first_text {
  position: absolute;
  width: 100%;
  height: 100%;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  text-align: center;
}
.first_text .edge_b {
  text-shadow: 0px 0px 5px rgba(17, 17, 17, 0.1), 0px 0px 5px rgba(17, 17, 17, 0.1), 0px 0px 10px rgba(17, 17, 17, 0.1), 0px 0px 10px rgba(17, 17, 17, 0.1), 0px 0px 15px rgba(17, 17, 17, 0.1), 0px 0px 15px;
}
.first_text .first_text_bg {
  position: absolute;
  width: 500px;
  height: 500px;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  text-align: center;
  z-index: -1;
}
.first_text .first_text_bg img {
  width: 100%;
  height: 100%;
  -o-object-fit: cover;
     object-fit: cover;
}
@media all and (max-width: 639px) {
  .first_text .first_text_bg {
    width: 80%;
    height: 80%;
  }
  .first_text .first_text_bg img {
    -o-object-fit: contain;
       object-fit: contain;
  }
}
.first_text .first_text_bg_right {
  position: absolute;
  bottom: 10px;
  right: 10px;
  width: 820px;
  height: 747px;
  display: flex;
  z-index: -1;
  opacity: 0.6;
}
.first_text .first_text_bg_right img {
  width: 100%;
  height: 100%;
  -o-object-fit: cover;
     object-fit: cover;
}
@media all and (max-width: 639px) {
  .first_text .first_text_bg_right {
    width: 80%;
    height: 80%;
  }
  .first_text .first_text_bg_right img {
    -o-object-fit: contain;
       object-fit: contain;
  }
}
.first_text.left {
  left: 2%;
  bottom: 5%;
  width: 100%;
  height: 100%;
  display: flex;
  flex-direction: column;
  align-items: start;
  justify-content: flex-end;
  text-align: left;
}
.first_text.left .edge_b {
  text-shadow: 0px 0px 5px #555, 0px 0px 5px #555, 0px 0px 10px #555, 0px 0px 10px #111, 0px 0px 15px #555, 0px 0px 15px;
}
@media all and (max-width: 639px) {
  .first_text.left {
    left: 2%;
    bottom: 0;
    justify-content: center;
  }
}
.first_text .wrap_border {
  width: calc(100% - 20px);
  height: calc(100% - 20px);
  margin: auto;
  border: 10px solid #fff;
  mix-blend-mode: overlay;
}
.first_text .wrap_border.left {
  display: flex;
  flex-direction: column;
  align-items: start;
  justify-content: flex-end;
  text-align: left;
  padding: 30px;
}
.first_text .border {
  padding: 30px;
  margin: auto;
  border: 10px solid #fff;
}
.first_text .point {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 0 20px;
}
.first_text .point li {
  border-radius: 100%;
  width: 160px;
  height: 160px;
  display: flex;
  align-items: center;
  justify-content: center;
  flex-direction: column;
  border: 1px solid #fff;
  color: #fff;
}
.first_text .point li .icon {
  fill: #fff;
  width: 60px;
  height: 60px;
  margin-bottom: 10px;
}
.first_text .point li .icon img {
  width: 60px;
  filter: brightness(0) invert(1);
}
@media all and (max-width: 639px) {
  .first_text .point li {
    width: 100px;
    height: 100px;
    font-size: 1rem;
  }
  .first_text .point li .icon {
    fill: #fff;
    width: 30px;
    height: 30px;
    margin-bottom: 5px;
  }
  .first_text .point li .icon img {
    width: 30px;
    filter: brightness(0) invert(1);
  }
}
.first_text .eng {
  font-size: 8rem;
  line-height: 8rem;
  font-weight: bold;
  color: #fff;
  display: block;
  margin-bottom: 0px;
  letter-spacing: 0.5em;
  font-family: "Noto Serif JP", "YakuHanMP", "Noto Serif JP", "游明朝 Medium", "Yu Mincho", YuMincho, "Hiragino Mincho ProN", HGS明朝E, serif;
  font-weight: 400;
  letter-spacing: 0;
  text-transform: lowercase !important;
}
.first_text .eng:first-letter {
  text-transform: uppercase;
}
.first_text .eng.small {
  font-size: 4rem;
  line-height: 4rem;
}
@media all and (max-width: 639px) {
  .first_text .eng {
    font-size: 4rem;
    line-height: 4rem;
  }
  .first_text .eng .small {
    font-size: 1.2rem;
  }
}
.first_text .ja {
  font-size: 6vw;
  line-height: 6vw;
  color: #fff;
  margin-bottom: 20px;
  letter-spacing: 0.01em;
}
.first_text .ja.middle {
  font-size: 3vw;
  line-height: 1.4;
}
.first_text .ja.small {
  font-size: 2rem;
  line-height: 1.6;
}
.first_text .ja.border {
  border: 1px solid #fff;
  display: inline-block;
  padding: 5px 30px;
}
.first_text .ja.bg_color {
  padding: 20px 30px;
  display: inline-block;
  margin: 10px;
  background-color: #073829;
}
.first_text .ja.bg_color.type1 {
  background-color: #0083de;
}
.first_text .ja.bg_color.type2 {
  background-color: #68482A;
}
@media all and (max-width: 639px) {
  .first_text .ja.middle {
    font-size: 2.1rem;
  }
  .first_text .ja.small {
    font-size: 1.2rem;
  }
}

.first_point01 {
  position: absolute;
  top: 200px;
  right: 65px;
  width: 358px;
  height: 358px;
  border-radius: 50%;
  display: grid;
  place-items: center;
  color: #fff;
  font-size: 2rem;
  text-align: center;
  z-index: 1;
  border: 1px solid #073829;
  text-shadow: rgba(51, 51, 51, 0.2) 3px 3px 5px;
}
.first_point01:before {
  content: "";
  position: absolute;
  background: url(../img/pattern/elegant02b.jpg) repeat;
  opacity: 0.8;
  width: 100%;
  height: 100%;
  border-radius: 50%;
  z-index: -1;
}
@media all and (max-width: 639px) {
  .first_point01 {
    font-size: 1.2rem;
    width: 200px;
    height: 200px;
    top: 315px;
    right: 11px;
  }
}

.first_point02 {
  position: absolute;
  top: 450px;
  right: 250px;
  width: 358px;
  height: 358px;
  border-radius: 50%;
  display: grid;
  place-items: center;
  color: #fff;
  font-size: 2rem;
  text-align: center;
  z-index: 1;
  border: 1px solid #fff;
  text-shadow: rgba(51, 51, 51, 0.2) 3px 3px 5px;
}
.first_point02:before {
  content: "";
  position: absolute;
  background: url(../img/pattern/elegant02.jpg) repeat;
  opacity: 0.7;
  border-radius: 50%;
  width: 100%;
  height: 100%;
  border-radius: 50%;
  z-index: -1;
}
@media all and (max-width: 639px) {
  .first_point02 {
    font-size: 1.2rem;
    width: 200px;
    height: 200px;
    top: 397px;
    right: 180px;
  }
}

.ftext_wrap {
  width: 100%;
  height: 100%;
  padding: 320px 0;
}

.first_text_rl {
  position: absolute;
  width: 11vw;
  height: 378px;
  top: 25%;
  bottom: inherit;
  left: 0;
  right: 0;
  margin: 0 auto;
  display: block;
  -ms-writing-mode: tb-rl;
  writing-mode: vertical-rl;
}
.first_text_rl .ja {
  font-size: 5rem;
  font-weight: bold;
  color: #fff;
  padding: 0 45px;
  text-shadow: rgba(17, 17, 17, 0.5) 0 0 8px;
}
@media all and (max-width: 639px) {
  .first_text_rl .ja {
    font-size: 3rem;
  }
}
.first_text_rl .ja_middle {
  font-size: 5rem;
  line-height: 1.4;
  font-weight: normal;
  color: #fff;
  display: block;
  padding: 0 25px;
  text-shadow: rgba(17, 17, 17, 0.5) 0 0 8px;
  letter-spacing: 0.01em;
}
@media all and (max-width: 639px) {
  .first_text_rl .ja_middle {
    font-size: 4rem;
  }
}
.first_text_rl .ja_middle.border {
  border: 1px solid #fff;
  display: inline-block;
  padding: 5px 30px;
}
.first_text_rl .ja_middle.bg_color {
  padding: 20px 30px;
  display: inline-block;
  margin: 10px;
  background-color: #073829;
}
.first_text_rl .ja_middle.bg_color.type1 {
  background-color: #0083de;
}
.first_text_rl .ja_middle.bg_color.type2 {
  background-color: #68482A;
}
@media all and (max-width: 639px) {
  .first_text_rl .ja_middle.bg_color {
    font-size: 5rem;
  }
}
.first_text_rl .ja_small {
  font-size: 1.6rem;
  line-height: 1.8;
  font-weight: normal;
  color: #fff;
  display: inline-block;
  text-shadow: rgba(17, 17, 17, 0.5) 0 0 8px;
}
.first_text_rl .ja_small.bg_color {
  padding: 20px 30px;
  border-radius: 50px;
  display: inline-block;
  margin: 10px;
  line-height: 1.3;
  background-color: #073829;
}
.first_text_rl .ja_small.bg_color.type1 {
  background-color: #0083de;
}
.first_text_rl .ja_small.bg_color.type2 {
  background-color: #68482A;
}
.first_text_rl .ja_small.bg_color.radius {
  border-radius: 100%;
  width: 180px;
  height: 180px;
  display: grid;
  place-items: center;
}
@media all and (max-width: 639px) {
  .first_text_rl .ja_small.bg_color {
    margin: 5px 0;
  }
  .first_text_rl .ja_small.bg_color.radius {
    width: 100px !important;
    height: 100px;
    padding: 0;
  }
}
.first_text_rl .eng {
  font-size: 8rem;
  line-height: 8rem;
  font-weight: bold;
  color: #fff;
  padding: 20px 0;
  font-family: "Noto Serif JP", "YakuHanMP", "Noto Serif JP", "游明朝 Medium", "Yu Mincho", YuMincho, "Hiragino Mincho ProN", HGS明朝E, serif;
  font-weight: 400;
  letter-spacing: 0;
  text-transform: lowercase !important;
  text-shadow: rgba(17, 17, 17, 0.5) 0 0 8px;
}
.first_text_rl .eng:first-letter {
  text-transform: uppercase;
}
.first_text_rl .eng_small {
  font-size: 4rem;
  line-height: 4rem;
  font-weight: bold;
  color: #fff;
  display: inline-block;
  padding: 20px 0;
  font-family: "Noto Serif JP", "YakuHanMP", "Noto Serif JP", "游明朝 Medium", "Yu Mincho", YuMincho, "Hiragino Mincho ProN", HGS明朝E, serif;
  font-weight: 400;
  letter-spacing: 0;
  text-transform: lowercase !important;
  text-shadow: rgba(17, 17, 17, 0.5) 0 0 8px;
}
.first_text_rl .eng_small:first-letter {
  text-transform: uppercase;
}
@media all and (max-width: 639px) {
  .first_text_rl {
    top: 13%;
    width: 100%;
    height: 100%;
    display: flex;
    align-items: center;
  }
}

#bxslider_flow_wrap {
  width: 100%;
  height: auto;
  max-height: 630px;
  margin: 0px auto 0;
  position: relative;
}
@media all and (max-width: 896px) {
  #bxslider_flow_wrap {
    height: auto !important;
  }
}
#bxslider_flow_wrap .bxslider_flow_txt {
  height: 100%;
  padding: 160px 15px 0;
  position: absolute;
  top: 0;
  left: 0;
  margin: 0 auto;
  z-index: 10;
  overflow: hidden;
}
@media all and (max-width: 639px) {
  #bxslider_flow_wrap .bxslider_flow_txt {
    padding: 50px 0 0;
  }
}
#bxslider_flow_wrap .bxslider_flow_txt .txt01 span {
  background: #073829;
  color: #fff;
  padding: 10px 30px;
  font-size: 6rem;
}
@media all and (max-width: 896px) {
  #bxslider_flow_wrap .bxslider_flow_txt .txt01 span {
    font-size: 4.5vw;
    padding: 5px 0px;
  }
}
#bxslider_flow_wrap .bxslider_flow_txt .txt02 {
  margin-top: 10px;
}
#bxslider_flow_wrap .bxslider_flow_txt .txt02 span {
  background: #fff;
  color: #073829;
  padding: 10px 30px;
  font-size: 3rem;
  letter-spacing: 0.2rem;
}
@media all and (max-width: 896px) {
  #bxslider_flow_wrap .bxslider_flow_txt .txt02 {
    margin-top: 5px;
  }
  #bxslider_flow_wrap .bxslider_flow_txt .txt02 span {
    font-size: 3vw;
    padding: 5px 5px;
  }
}
@media all and (max-width: 896px) {
  #bxslider_flow_wrap .bxslider_flow_txt {
    margin-top: 5px;
    height: 60%;
    padding: 0 !important;
    top: inherit;
    bottom: 0;
    background: none;
  }
}
#bxslider_flow_wrap .txt03 {
  color: #fff;
  padding: 10px 30px;
  font-size: 3rem;
  display: inline-block;
}
#bxslider_flow_wrap .txt03 span {
  font-size: 1.2rem;
}
@media all and (max-width: 896px) {
  #bxslider_flow_wrap .txt03 {
    font-size: 1.2rem;
    padding: 5px 10px;
  }
  #bxslider_flow_wrap .txt03 span {
    font-size: 1.2rem;
  }
}
#bxslider_flow_wrap .bxslider_flow li figure {
  width: 100%;
  height: 630px;
}
#bxslider_flow_wrap .bxslider_flow li figure img {
  width: 100%;
  height: 100%;
  -o-object-fit: cover;
     object-fit: cover;
}
@media all and (max-width: 639px) {
  #bxslider_flow_wrap .bxslider_flow li {
    height: 330px;
  }
  #bxslider_flow_wrap .bxslider_flow li figure {
    width: 100%;
    height: 330px;
  }
}

.bxslider_single {
  position: relative;
  width: 100%;
  max-width: 1500px;
  margin: 0 auto;
  overflow: hidden;
}
.bxslider_single .slider_single {
  width: 100% !important;
  max-width: 880px !important;
  height: 100%;
  overflow: hidden;
  margin: 0 0 0 auto;
  position: relative;
}
@media all and (max-width: 639px) {
  .bxslider_single {
    height: 500px;
  }
  .bxslider_single .slider_single {
    margin: auto 0 0 0;
  }
}

#bxslidertop {
  position: relative;
  width: 100%;
  height: 100%;
  overflow: hidden;
  padding-top: 182px;
  padding-bottom: 20px;
  background-color: #073829;
}
@media all and (max-width: 639px) {
  #bxslidertop {
    padding-top: 95px;
  }
}

#bxslider {
  width: 100%;
  margin-left: 50%;
}
#bxslider li {
  margin-left: -480px;
  /* 画像サイズ / 2 */
  margin-right: 500px !important;
  /* 画像サイズ / 2 + 20 */
  /* div {
    height: 600px;
  }

  img {
    border-radius: 25px;
    width: 100%;
    height: 100%;
    object-fit: cover;
  } */
}
#bxslider li figure {
  width: 100%;
  height: 100%;
  max-height: 500px;
  overflow: hidden;
}
#bxslider li figure img {
  width: 100%;
  height: 100%;
  -o-object-fit: cover;
     object-fit: cover;
}
@media screen and (max-width: 960px) {
  #bxslider {
    width: 100%;
    margin-left: 0%;
  }
  #bxslider li {
    width: 90%;
    margin-left: 0%;
    margin-right: 0% !important;
  }
}
@media all and (max-width: 639px) {
  #bxslider li figure {
    max-height: 300px;
  }
}

.bxslider_wrap {
  position: relative;
}

.bxslidertext {
  z-index: 10;
  position: absolute;
  left: 5%;
  bottom: 10%;
  width: 100%;
  max-width: 800px;
  transition: opacity 2s cubic-bezier(0.18, 0.06, 0.23, 1);
}
.bxslidertext .eng {
  display: block;
  font-family: "Noto Serif JP", "YakuHanMP", "Noto Serif JP", "游明朝 Medium", "Yu Mincho", YuMincho, "Hiragino Mincho ProN", HGS明朝E, serif;
  font-weight: 400;
  letter-spacing: 0;
  text-transform: lowercase !important;
  font-size: 8rem;
  line-height: 8rem;
  color: #073829;
  /*     color: transparent;
     background: #fff;
     text-shadow: 0 0 0.1em rgba(255, 255, 255, 0.05), 0.01em 0.04em 0.03em rgba(148, 148, 148, 0.4);
     -webkit-background-clip: text;
  */
}
.bxslidertext .eng:first-letter {
  text-transform: uppercase;
}
.bxslidertext .ja_middle {
  display: inline-block;
  font-size: 4.5rem;
  line-height: 4.5rem;
  color: #fff;
  text-shadow: rgba(17, 17, 17, 0.8) 0 0 10px;
  font-weight: bold;
  padding: 8px 0;
}
.bxslidertext .ja {
  font-size: 1.8rem;
  line-height: 6rem;
  color: #fff;
  background-color: #68482A;
  text-shadow: rgba(17, 17, 17, 0.5) 0 0 10px 10px;
  font-weight: bold;
  padding: 8px 20px;
}
@media all and (max-width: 896px) {
  .bxslidertext .ja_middle {
    font-size: 2vw;
    line-height: 1.6;
  }
}
@media all and (max-width: 639px) {
  .bxslidertext {
    transform: translateY(4px);
  }
  .bxslidertext .ja_middle {
    font-size: 5vw;
    line-height: 1.6;
  }
  .bxslidertext .eng {
    font-size: 8vw;
    line-height: 1.6;
  }
  .bxslidertext .ja {
    font-size: 1.2rem;
    line-height: 1.3rem;
    padding: 4px 10px;
  }
}
@media all and (max-width: 639px) {
  .bxslidertext {
    bottom: 80px;
    left: 10px;
    width: 100%;
  }
}

@-webkit-keyframes zoom-in {
  0% {
    transform: scale(1);
  }
  100% {
    transform: scale(1.12);
  }
}

@keyframes zoom-in {
  0% {
    transform: scale(1);
  }
  100% {
    transform: scale(1.12);
  }
}
.swiper-slide-active .slide-img,
.swiper-slide-duplicate-active .slide-img,
.swiper-slide-prev .slide-img {
  -webkit-animation: zoom-in 11s linear 0s 1 normal both;
          animation: zoom-in 11s linear 0s 1 normal both;
}

.swiper-slide {
  position: relative;
}
.swiper-slide:before {
  position: absolute;
  width: 100%;
  height: 100%;
  content: "";
  right: 0;
  top: 0;
  background-position: 50%;
  background-size: cover;
  z-index: -1;
}
.swiper-slide.slide1:before {
  background-image: url(../images/1.jpg);
  background-position: 60% 50%;
}
.swiper-slide.slide2:before {
  background-image: url(../images/2.jpg);
  background-position: 50% 50%;
}
.swiper-slide.slide3:before {
  background-image: url(../images/3.jpg);
  background-position: 90% 50%;
}

.slide-img {
  overflow: hidden;
  width: 100%;
  height: 100vh;
}
.slide-img img {
  width: 100%;
  height: 100%;
  -o-object-fit: cover;
     object-fit: cover;
  font-family: "object-fit: cover;";
}
@media all and (max-width: 1100px) {
  .slide-img {
    height: 80vw;
  }
}
@media all and (max-width: 896px) {
  .slide-img {
    height: 80vw;
  }
}
@media all and (max-width: 639px) {
  .slide-img {
    height: 130vw;
  }
}

#slide-wrap_small {
  position: relative;
  padding-bottom: 120px;
}
#slide-wrap_small.type1 {
  padding-bottom: 0;
  position: relative;
}
#slide-wrap_small.type1:before {
  content: "";
  position: absolute;
  top: -400px;
  left: -400px;
  background-color: #073829;
  width: 800px;
  height: 800px;
  transform: rotate(45deg);
  z-index: 9;
}
@media all and (max-width: 639px) {
  #slide-wrap_small.type1:before {
    top: -100px;
    left: -100px;
    width: 200px;
    height: 200px;
  }
}
@media all and (max-width: 639px) {
  #slide-wrap_small {
    overflow: hidden;
    padding-bottom: 40px;
  }
}

.slide-wrap_small_bg {
  position: relative;
}
.slide-wrap_small_bg:before {
  content: "";
  position: absolute;
  width: 100%;
  background-image: url(../images/slide-wrap_small_bg.jpg);
  background-position: bottom center;
  background-size: 100%;
  background-repeat: no-repeat;
  top: inherit;
  bottom: 0;
  right: 0;
  left: 0;
  width: 100%;
  height: 100%;
  z-index: 0;
}

#slideshow_small {
  position: relative;
  width: 83%;
  margin-left: auto;
  margin-right: 2%;
  padding-top: 10vh;
}
@media all and (max-width: 896px) {
  #slideshow_small {
    width: calc(100% - 60px);
    margin-right: 2%;
    padding-top: 100px;
    margin-bottom: 50px;
  }
}
#slideshow_small .slide-img {
  overflow: hidden;
  width: 100%;
  height: 75vh;
}
#slideshow_small .slide-img img {
  width: 100%;
  height: 100%;
  -o-object-fit: cover;
     object-fit: cover;
  font-family: "object-fit: cover;";
}
@media all and (max-width: 1100px) {
  #slideshow_small .slide-img {
    height: 55vw;
  }
}
@media all and (max-width: 896px) {
  #slideshow_small .slide-img {
    height: 48vh;
  }
}
@media all and (max-width: 639px) {
  #slideshow_small .slide-img {
    height: 50vh;
  }
}
#slideshow_small.type1 {
  overflow: hidden;
  border-radius: 40px 0 0 40px;
  padding-top: 0;
  margin-right: 0%;
}
#slideshow_small.type1 .slide-img {
  height: 80vh;
}
@media all and (max-width: 1100px) {
  #slideshow_small.type1 .slide-img {
    height: 55vw;
  }
}
@media all and (max-width: 896px) {
  #slideshow_small.type1 .slide-img {
    height: 48vh;
  }
}
@media all and (max-width: 639px) {
  #slideshow_small.type1 .slide-img {
    height: 50vh;
  }
}
#slideshow_small.type_r {
  overflow: hidden;
  border-radius: 40px 40px;
  padding: 0;
  margin: 0 auto;
  width: 96%;
}
#slideshow_small.type_r .slide-img {
  height: 75vh;
}
@media all and (max-width: 1100px) {
  #slideshow_small.type_r .slide-img {
    height: 55vw;
  }
}
@media all and (max-width: 896px) {
  #slideshow_small.type_r .slide-img {
    height: 48vh;
  }
}
@media all and (max-width: 639px) {
  #slideshow_small.type_r .slide-img {
    height: 50vh;
  }
}
#slideshow_small.type2 {
  overflow: hidden;
  margin-right: 0%;
  padding-top: 0px;
}
#slideshow_small.type2 .slide-img {
  height: 100vh;
}
@media all and (max-width: 1100px) {
  #slideshow_small.type2 .slide-img {
    height: 100vw;
  }
}
@media all and (max-width: 896px) {
  #slideshow_small.type2 .slide-img {
    height: 80vh;
  }
}
@media all and (max-width: 639px) {
  #slideshow_small.type2 .slide-img {
    height: 80vh;
  }
}

.slide-txt {
  position: absolute;
  left: 50%;
  top: 47%;
  transform: translate(-50%, -50%);
  width: 34%;
  padding: 10px;
  z-index: 20;
  text-align: center;
}
@media all and (max-width: 1100px) {
  .slide-txt {
    width: 55%;
  }
}
@media all and (max-width: 639px) {
  .slide-txt {
    margin-top: 30px;
    width: 80%;
  }
}

.slide-fixed {
  position: absolute;
  left: 50%;
  bottom: 2%;
  transform: translateX(-50%);
  width: 500px;
  display: flex;
  flex-wrap: wrap;
  justify-content: space-between;
  z-index: 20;
}
@media all and (max-width: 896px) {
  .slide-fixed {
    width: 50%;
  }
}
.slide-fixed li {
  width: 31%;
}
@media all and (max-width: 639px) {
  .slide-fixed {
    width: 60%;
  }
}

.top_space {
  width: 100%;
  height: 100px;
}
.top_space.type1 {
  height: 180px;
}
@media all and (max-width: 639px) {
  .top_space.type1 {
    height: 80px;
  }
}
@media all and (max-width: 639px) {
  .top_space {
    height: 90px;
  }
}

#swiper_catch {
  opacity: 0;
  z-index: 10;
  position: absolute;
  left: 0;
  right: 0;
  margin: auto;
  bottom: 0;
  top: 0;
  display: gap;
  place-items: center;
  width: 100%;
  max-width: 940px;
  height: 200px;
  text-align: center;
}
#swiper_catch.on {
  opacity: 1;
}
#swiper_catch .eng {
  display: block;
  font-family: "Noto Serif JP", "YakuHanMP", "Noto Serif JP", "游明朝 Medium", "Yu Mincho", YuMincho, "Hiragino Mincho ProN", HGS明朝E, serif;
  font-weight: 400;
  letter-spacing: 0;
  text-transform: lowercase !important;
  font-size: 8rem;
  line-height: 8rem;
  color: #073829;
  /*     color: transparent;
     background: #fff;
     text-shadow: 0 0 0.1em rgba(255, 255, 255, 0.05), 0.01em 0.04em 0.03em rgba(148, 148, 148, 0.4);
     -webkit-background-clip: text;
  */
}
#swiper_catch .eng:first-letter {
  text-transform: uppercase;
}
#swiper_catch .ja_middle {
  display: inline-block;
  font-size: 4.8rem;
  line-height: 6rem;
  color: #073829;
  background-color: rgba(255, 255, 255, 0.8);
  font-weight: bold;
  padding: 8px 20px;
  font-family: "Noto Serif JP", "YakuHanMP", "Noto Serif JP", "游明朝 Medium", "Yu Mincho", YuMincho, "Hiragino Mincho ProN", HGS明朝E, serif;
}
#swiper_catch .ja {
  font-size: 1.8rem;
  line-height: 6rem;
  color: #fff;
  background-color: #68482A;
  font-weight: bold;
  padding: 8px 20px;
}
@media all and (max-width: 896px) {
  #swiper_catch .ja_middle {
    font-size: 4vw;
    line-height: 1.6;
  }
}
@media all and (max-width: 639px) {
  #swiper_catch {
    transform: translateY(4px);
  }
  #swiper_catch .ja_middle {
    font-size: 4vw;
    line-height: 1.6;
  }
  #swiper_catch .eng {
    font-size: 8vw;
    line-height: 1.6;
  }
  #swiper_catch .ja {
    font-size: 1.2rem;
    line-height: 1.3rem;
    padding: 4px 10px;
  }
}
@media all and (max-width: 639px) {
  #swiper_catch {
    bottom: 80px;
    left: 10px;
    width: 100%;
  }
}

#swiper_catch_small {
  z-index: 50;
  position: absolute;
  left: 20px;
  bottom: 30%;
  width: 100%;
  max-width: 940px;
  transition: opacity 2s cubic-bezier(0.18, 0.06, 0.23, 1);
  opacity: 0;
}
#swiper_catch_small.on {
  opacity: 1;
}
#swiper_catch_small .eng {
  display: block;
  font-family: "Noto Serif JP", "YakuHanMP", "Noto Serif JP", "游明朝 Medium", "Yu Mincho", YuMincho, "Hiragino Mincho ProN", HGS明朝E, serif;
  font-weight: 400;
  letter-spacing: 0;
  text-transform: lowercase !important;
  font-size: 8rem;
  line-height: 8rem;
  color: #073829;
  /*     color: transparent;
     background: #fff;
     text-shadow: 0 0 0.1em rgba(255, 255, 255, 0.05), 0.01em 0.04em 0.03em rgba(148, 148, 148, 0.4);
     -webkit-background-clip: text;
  */
}
#swiper_catch_small .eng:first-letter {
  text-transform: uppercase;
}
#swiper_catch_small .ja_middle {
  display: inline-block;
  font-size: 4.8rem;
  line-height: 6rem;
  color: #073829;
  font-weight: bold;
  padding: 8px 20px;
  /* text-shadow: rgba(#fff,0.8) 0 0 2px; */
  text-shadow: 1.9px 1.9px 0 #fff, -1.9px 1.9px 0 #fff, 1.9px -1.9px 0 #fff, -1.9px -1.9px 0 #fff;
}
#swiper_catch_small .ja {
  font-size: 1.8rem;
  line-height: 6rem;
  color: #fff;
  background-color: #073829;
  border-radius: 20px;
  font-weight: bold;
  padding: 8px 20px;
}
@media all and (max-width: 896px) {
  #swiper_catch_small .ja_middle {
    font-size: 4vw;
    line-height: 1.6;
  }
}
@media all and (max-width: 639px) {
  #swiper_catch_small {
    transform: translateY(4px);
    bottom: 80%;
  }
  #swiper_catch_small .ja_middle {
    font-size: 7vw;
    line-height: 1.6;
  }
  #swiper_catch_small .eng {
    font-size: 8vw;
    line-height: 1.6;
  }
  #swiper_catch_small .ja {
    font-size: 1.2rem;
    line-height: 1.3rem;
    padding: 4px 10px;
  }
}
@media all and (max-width: 639px) {
  #swiper_catch_small {
    bottom: 20%;
    left: 10px;
    width: 100%;
  }
}

#swiper_catch_small02 {
  z-index: 50;
  position: absolute;
  left: 0;
  right: 0;
  top: 0;
  bottom: 0;
  width: 36%;
  height: 100%;
  margin: auto;
  transition: opacity 2s cubic-bezier(0.18, 0.06, 0.23, 1);
  opacity: 0;
  -ms-writing-mode: tb-rl;
  writing-mode: vertical-rl;
  text-align: center;
}
#swiper_catch_small02.on {
  opacity: 1;
}
#swiper_catch_small02 .ja_middle {
  font-size: 8vw;
  line-height: 1;
  color: #fff;
  font-weight: bold;
  padding: 8px 20px;
  text-shadow: 0px 0px 5px #111, 0px 0px 5px #111, 0px 0px 10px #111, 0px 0px 10px #111, 0px 0px 15px #111, 0px 0px 15px;
}
#swiper_catch_small02 .ja_small {
  font-size: 2vw;
  line-height: 6rem;
  color: #fff;
  background-color: #68482A;
  border: 4px double #fff;
  font-weight: bold;
  padding: 30px 8px;
}
@media all and (max-width: 639px) {
  #swiper_catch_small02 {
    bottom: 20%;
    left: 10px;
  }
  #swiper_catch_small02 .ja_middle {
    font-size: 16vw;
  }
  #swiper_catch_small02 .ja_small {
    font-size: 7vw;
  }
}

.top {
  position: relative;
  overflow: hidden;
}

#u-firstview {
  overflow: hidden;
  position: relative;
  height: 100vh;
  overflow: hidden;
}
#u-firstview.gray:before {
  filter: grayscale(100%);
}
#u-firstview.blur {
  overflow: hidden;
}
#u-firstview.blur:before {
  filter: blur(4px);
}
#u-firstview.bg_black_grad:after {
  content: "";
  position: absolute;
  width: 100%;
  background: rgb(0, 0, 0);
  background: linear-gradient(180deg, rgba(0, 0, 0, 0) 0%, rgba(0, 0, 0, 0.6) 95%);
  background-position: center center;
  background-size: cover;
  top: 0;
  bottom: 0;
  right: 0;
  left: 0;
  width: 100%;
  height: 100%;
  z-index: -1;
}
#u-firstview.bg_white_grad:after {
  content: "";
  position: absolute;
  background: rgb(255, 255, 255);
  background: linear-gradient(180deg, rgb(255, 255, 255) 0%, rgba(255, 255, 255, 0.5) 90%);
  top: 0;
  bottom: 0;
  right: 0;
  left: 0;
  width: 100%;
  height: 100%;
  margin: auto;
  z-index: 0;
}
#u-firstview.bg_base_grd:after {
  background: rgb(2, 133, 135);
  background: linear-gradient(90deg, rgb(2, 133, 135) 0%, rgb(97, 169, 210) 63%);
  content: "";
  position: absolute;
  width: 100%;
  background-position: center center;
  background-size: cover;
  top: 0;
  bottom: 0;
  right: 0;
  left: 0;
  width: 100%;
  height: 100%;
  z-index: -1;
  opacity: 0.8;
}
#u-firstview.bg_sharp:after {
  clip-path: polygon(0 0, 100% 4rem, 100% 100%, 0 calc(100% - 4rem));
  -webkit-clip-path: polygon(0 0, 100% 4rem, 100% 100%, 0 calc(100% - 4rem));
}
#u-firstview.bg_base:before {
  filter: grayscale(100%);
  filter: blur(4px);
}
#u-firstview.bg_base:after {
  content: "";
  position: absolute;
  width: 100%;
  background-color: rgba(7, 56, 41, 0.8);
  background-position: center center;
  background-size: cover;
  top: 0;
  bottom: 0;
  right: 0;
  left: 0;
  width: 100%;
  height: 100%;
  z-index: -1;
}
#u-firstview.bg_white:after {
  content: "";
  position: absolute;
  width: 100%;
  background-color: rgba(255, 255, 255, 0.8);
  background-position: center center;
  background-size: cover;
  top: 0;
  bottom: 0;
  right: 0;
  left: 0;
  width: 100%;
  height: 100%;
  z-index: -1;
}
#u-firstview.bg_black:after {
  content: "";
  position: absolute;
  width: 100%;
  background-color: rgba(0, 0, 0, 0.8);
  background-position: center center;
  background-size: cover;
  top: 0;
  bottom: 0;
  right: 0;
  left: 0;
  width: 100%;
  height: 100%;
  z-index: -1;
}
#u-firstview.curve {
  -webkit-clip-path: ellipse(100% 100% at top);
  clip-path: ellipse(100% 100% at top);
  overflow: hidden;
}
#u-firstview.type_r {
  border-radius: 30px;
  width: 96%;
  margin: 0 auto 30px;
  overflow: hidden;
}
#u-firstview.type_r {
  height: 70vh;
}
@media all and (max-width: 639px) {
  #u-firstview.type_r {
    height: 40vh;
  }
}
#u-firstview #underlay1 {
  position: absolute;
  top: 0;
  right: 0;
  width: 100%;
  height: 100%;
  z-index: -1;
}
#u-firstview #underlay2 {
  position: absolute;
  bottom: 0;
  left: 0;
  width: 70%;
  height: 80%;
  z-index: -2;
}
@media all and (max-width: 1100px) {
  #u-firstview {
    height: 70vh;
  }
}
@media all and (max-width: 639px) {
  #u-firstview {
    height: 90vh;
  }
}

#slideshow {
  position: relative;
}
#slideshow .position_text {
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  gap: 1ch;
  position: absolute;
  z-index: 100;
  margin: auto;
  width: 100%;
  height: 100%;
}
#slideshow:before {
  position: absolute;
  content: "";
  width: 100%;
  height: 100%;
  top: 0;
  left: 0;
  z-index: 1;
  -webkit-animation: anime-logo2-2 8s ease-in forwards;
          animation: anime-logo2-2 8s ease-in forwards;
  opacity: 0;
  background-position: center center;
  background-size: cover;
}
#slideshow:after {
  position: absolute;
  content: "";
  width: 100%;
  height: 100%;
  top: 0;
  left: 0;
  z-index: 2;
  background-color: #111111;
  -webkit-animation: anime-logo2-2 8s ease-in forwards;
          animation: anime-logo2-2 8s ease-in forwards;
}

.form {
  margin: 0 auto;
  width: 90%;
}
.form dl dt {
  float: left;
  width: 280px;
  padding-top: 20px;
  font-weight: 600;
}
.form dl dt span {
  color: #fff;
  background: #073829;
  padding: 5px 8px;
  margin-right: 5px;
  font-size: 11px;
  border-radius: 20px;
  position: relative;
  top: -2px;
}
.form dl dt span.nini {
  background: #ffff59;
  color: #333;
}
.form dl dd {
  padding-left: 280px;
  padding-bottom: 20px;
  padding-top: 23px;
  line-height: 1.5;
  border-bottom: 1px dotted #cccccc;
}
.form dl dd.type1 p {
  display: inline;
}
.form dl dd.type1 .w20 {
  width: 20%;
}
@media all and (max-width: 896px) {
  .form dl dd.type1 .w20 {
    width: 30%;
  }
}
.form dl dd.type1 .w30 {
  width: 30%;
}
@media all and (max-width: 639px) {
  .form dl dd.type1.type1-name .w30 {
    width: 48%;
  }
}
.form dl dd.type1 .w60 {
  width: 60%;
}
.form dl dd:last-child {
  border-bottom: none;
}
.form .textarea,
.form textarea {
  border: 0;
  padding: 15px;
  width: 100%;
  border-radius: 0;
  -webkit-appearance: none;
  background: #f0f0f0;
}
.form .textarea02 {
  width: 48.5%;
  margin-right: 3%;
  background: #f9fcff;
  box-shadow: 0 8px 8px rgba(165, 165, 165, 0.4);
}
.form .textarea02:last-child {
  margin-right: 0;
}
.form .textarea03 {
  width: 20%;
  margin-right: 1%;
}
.form .formbutton {
  cursor: pointer;
  display: block;
  color: #fff;
  text-align: center;
  transition: all 0.2s ease-in-out 0s;
  border: 1px solid #363636;
  font-weight: 600;
  padding: 12px 5px;
  margin: 0 auto;
  width: 250px;
  background: #363636;
  border-radius: 25px;
}
.form .formbutton:hover {
  background: #fff;
  color: #363636;
}
.form .formbutton:before {
  font-weight: normal;
  font-family: "Font Awesome 5 Free";
  content: "\f0e0";
  font-weight: 900;
  margin-right: 10px;
}
.form .select-wrap {
  position: relative;
  overflow: hidden;
  display: inline-block;
  min-width: 192px;
  min-width: 12em;
  background-color: #ffffff;
  border: 1px solid #dddddd;
  color: #333;
}
.form .select-wrap select {
  -webkit-appearance: none;
  -moz-appearance: none;
  appearance: none;
  position: relative;
  z-index: 2;
  display: block;
  width: 200%;
  width: -webkit-calc(100% + 5em);
  margin: 0;
  padding: 11px 35px 11px 11px;
  padding: 0.6875rem 2.1875rem 0.6875rem 0.6875rem;
  background: transparent;
  border: 0;
  outline: none;
  line-height: 1.5;
}
.form .entypo-down-open-mini:before {
  font-family: "FontAwesome";
  content: "\f0ab";
  position: absolute;
  z-index: 1;
  top: 50%;
  right: 12px;
  right: 0.75rem;
  margin-top: -8px;
  margin-top: -0.5rem;
  font-size: 16px;
  font-size: 1rem;
  line-height: 1;
  color: #073829;
}
.form label.radio_text {
  cursor: pointer;
  position: relative;
  margin-right: 20px;
  overflow: hidden;
  padding-left: 20px;
  display: inline-block;
}
.form label.radio_text:before {
  position: absolute;
  width: 15px;
  height: 15px;
  border: 1px solid #ccc;
  border-radius: 50%;
  left: 0px;
  top: 5px;
  content: "";
  z-index: 3;
}
@media all and (max-width: 639px) {
  .form label.radio_text:before {
    top: 4px;
  }
}
.form label.radio_text:after {
  content: "";
  position: absolute;
  width: 11px;
  height: 11px;
  border-radius: 100%;
  left: 2px;
  top: 7px;
  background-color: #073829;
  z-index: 1;
}
@media all and (max-width: 639px) {
  .form label.radio_text:after {
    top: 6px;
  }
}
.form label.radio_text input[type=radio] {
  -moz-appearance: none;
  -webkit-appearance: none;
  position: absolute;
  z-index: 2;
  width: 20px;
  height: 20px;
  left: -23px;
  top: 0px;
  margin: 0px;
  box-shadow: 20px -1px #fff;
}
.form label.radio_text input[type=radio]:checked {
  box-shadow: none;
}
.form label.radio_text input[type=radio]:focus {
  opacity: 0.2;
  box-shadow: 20px -1px #eeebda;
}
.form label.checkbox_text {
  cursor: pointer;
  position: relative;
  padding-left: 25px;
  margin: 0 20px 5px 0;
  overflow: hidden;
  display: inline-block;
}
.form label.checkbox_text:before {
  content: "";
  position: absolute;
  width: 18px;
  height: 18px;
  left: 0px;
  top: 0;
  border: 1px solid #ccc;
  z-index: 3;
  padding: 1px;
}
.form label.checkbox_text:after {
  content: "";
  position: absolute;
  top: 40%;
  left: 5px;
  display: block;
  margin-top: -9px;
  width: 8px;
  height: 12px;
  border-right: 3px solid #073829;
  border-bottom: 3px solid #073829;
  transform: rotate(45deg);
  z-index: 1;
}
@media all and (max-width: 639px) {
  .form label.checkbox_text:after {
    margin-top: -6px;
  }
}
.form label.checkbox_text input[type=checkbox] {
  -moz-appearance: none;
  -webkit-appearance: none;
  position: absolute;
  left: -40px;
  width: 20px;
  height: 20px;
  display: block;
  box-shadow: 41px 0px #fff;
  z-index: 2;
  margin: 0px;
  padding: 0px;
}
.form label.checkbox_text input[type=checkbox]:checked {
  box-shadow: none;
}
.form label.checkbox_text input[type=checkbox]:checked:focus {
  box-shadow: 40px 0px #666;
  opacity: 0.1;
}
.form label.checkbox_text input[type=checkbox]:focus {
  box-shadow: 41px 0px #eee;
}
.form textarea {
  font-size: 16px;
}

@media all and (max-width: 639px) {
  /* form */
  .form {
    width: 100%;
    padding-bottom: 30px;
  }
  .form dl {
    margin: 10px 0;
  }
  .form dl dt {
    float: none;
    width: 100%;
    padding-top: 15px;
  }
  .form dl dd {
    width: 100%;
    padding-left: 0;
    padding-bottom: 15px;
    padding-top: 10px;
    line-height: 20px;
  }
  .form dl dd:last-child {
    border-bottom: 0px;
    margin-bottom: 0px;
  }
  .form .textarea,
.form textarea {
    width: 100%;
    font-size: 16px;
  }
  .form .textarea.textarea03 {
    width: 35%;
  }
  .form .textarea02 {
    width: 43.5%;
  }
  .form button {
    width: 95%;
    padding: 20px 0;
    border-radius: 50px;
  }
}
.fm-txt {
  font-size: 1.4rem;
  background: rgba(255, 255, 255, 0.5);
  padding: 5px;
}

.thanks {
  padding: 40px;
  border: 3px solid rgb(148, 148, 148);
  background-color: #fff;
  max-width: 700px;
  margin: 0 auto;
}
@media all and (max-width: 639px) {
  .thanks {
    max-width: 90%;
    padding: 30px 10px;
  }
}

.policy {
  padding: 30px;
  margin-top: 30px;
  background: rgba(242, 242, 242, 0.4);
}

.mtitle {
  margin: 0 auto 40px;
  text-align: center;
}
.mtitle.inline {
  text-align: center;
}
.mtitle.inline .eng,
.mtitle.inline .ja {
  display: inline-block;
}
.mtitle.inline .ja:before {
  content: "/";
  margin: 0 10px;
}
.mtitle.bar {
  position: relative;
}
.mtitle.bar:before {
  content: "";
  background-color: #aaa;
  background-size: contain;
  background-image: linear-gradient(to right, #aaa 50%, #073829 50%);
  z-index: -1;
  width: 120px;
  height: 3px;
  position: absolute;
  top: inherit;
  bottom: 30px;
  left: 0;
  right: 0;
  margin: 0 auto;
}
@media all and (max-width: 639px) {
  .mtitle.bar:before {
    left: 0;
    right: 0;
    margin: 0 auto;
    bottom: 20px;
    height: 2px;
  }
}
.mtitle.icon {
  position: relative;
}
.mtitle.icon:before {
  content: "";
  background: url(../images/icon/mtitle.png) top left no-repeat;
  background-size: contain;
  z-index: -1;
  width: 50px;
  height: 64px;
  position: absolute;
  top: 0px;
  left: 0;
  right: 0;
  margin: 0 auto;
}
@media all and (max-width: 639px) {
  .mtitle.icon:before {
    left: 0;
    right: 0;
    margin: 0 auto;
  }
}
.mtitle.tleft {
  text-align: left;
}
.mtitle.white {
  color: #fff;
}
.mtitle.white .ja {
  color: #fff;
}
.mtitle.white .eng {
  color: #fff;
}
.mtitle.sub .eng {
  color: #68482A;
}
.mtitle .eng {
  font-size: 6rem;
  display: block;
  line-height: 1.2;
  color: #073829;
  font-family: "Noto Serif JP", "YakuHanMP", "Noto Serif JP", "游明朝 Medium", "Yu Mincho", YuMincho, "Hiragino Mincho ProN", HGS明朝E, serif;
  font-weight: 400;
  letter-spacing: 0;
  text-transform: lowercase !important;
}
.mtitle .eng:first-letter {
  text-transform: uppercase;
}
.mtitle .ja {
  font-size: 1.8rem;
  color: #333;
  font-weight: bold;
}
.mtitle .ja.type2 {
  color: #073829;
}
.mtitle .ja:first-letter {
  color: #68482A;
}
.mtitle .ja.white {
  color: #fff;
}
.mtitle.white {
  color: #fff;
}
.mtitle.white span {
  color: #fff;
}
.mtitle.white span:after {
  background-color: #eee;
}
.mtitle.white span.eng {
  opacity: 1;
  font-size: 5rem;
}
.mtitle.white span.eng:first-letter {
  color: #fff;
}
.mtitle.black {
  color: #333;
}
.mtitle.black span {
  color: #555;
}
.mtitle.black span:after {
  background-color: #555;
}
@media all and (max-width: 639px) {
  .mtitle {
    text-align: center;
    margin-bottom: 20px;
  }
  .mtitle .eng {
    font-size: 3rem;
  }
  .mtitle .eng:before {
    height: 60px;
    top: -64px;
  }
  .mtitle .ja {
    font-size: 1.3rem;
  }
  .mtitle.white {
    color: #fff;
  }
  .mtitle.white span {
    color: #fff;
  }
  .mtitle.white span:after {
    background-color: #eee;
  }
  .mtitle.white span.eng {
    opacity: 1;
    font-size: 2rem;
  }
}

.share_ttl {
  text-align: center;
  margin: 20px auto;
  font-size: 1.6rem;
}
.share_ttl.white span {
  color: #fff;
}
.share_ttl.white span:before, .share_ttl.white span:after {
  background-color: #fff;
}
@media all and (max-width: 639px) {
  .share_ttl {
    font-size: 1.2rem;
  }
}
.share_ttl span {
  color: #073829;
  position: relative;
  text-align: center;
}
.share_ttl span:before, .share_ttl span:after {
  position: absolute;
  content: "";
  width: 2px;
  height: 26px;
  background-color: #073829;
  z-index: 1;
  top: -2px;
}
.share_ttl span:before {
  left: -20px;
  transform: rotate(-0.1turn);
}
.share_ttl span:after {
  right: -20px;
  transform: rotate(0.1turn);
}

.mtitle_deco_radius {
  margin: 0 auto 40px;
  position: relative;
  text-align: center;
}
.mtitle_deco_radius .eng {
  font-size: 3rem;
  color: #6daf4e;
  position: relative;
  z-index: 2;
  display: block;
  font-family: "Crimson Text", serif;
  font-weight: 600;
  text-transform: uppercase;
}
.mtitle_deco_radius .ja {
  position: relative;
  z-index: 2;
  font-size: 2.4rem;
  color: #fff;
  font-weight: 600;
  background-color: #073829;
  padding: 14px 40px;
  border-radius: 50px;
}
.mtitle_deco_radius .ja:before {
  position: absolute;
  content: "";
  width: 56px;
  height: 78px;
  background: url(../img_leaf/mtitle_deco_radius_left.png) no-repeat;
  background-size: cover;
  bottom: -20px;
  left: -30px;
  z-index: -1;
}
.mtitle_deco_radius .ja:after {
  position: absolute;
  content: "";
  width: 51px;
  height: 68px;
  background: url(../img_leaf/mtitle_deco_radius_right.png) no-repeat;
  background-size: cover;
  top: -16px;
  right: -35px;
  z-index: -1;
  transform: rotate(15deg);
}
.mtitle_deco_radius.white {
  color: #fff;
  text-shadow: 0 0 3px rgba(0, 0, 0, 0.2);
}
.mtitle_deco_radius.white span {
  color: #fff;
  text-shadow: 0 0 3px rgba(0, 0, 0, 0.2);
}
.mtitle_deco_radius.white span:after {
  background-color: #eee;
}
.mtitle_deco_radius.white span.ja {
  border-bottom-color: #fefefe;
}
@media all and (max-width: 639px) {
  .mtitle_deco_radius {
    text-align: center;
  }
  .mtitle_deco_radius .eng {
    font-size: 1.5rem;
  }
  .mtitle_deco_radius .ja {
    font-size: 2rem;
  }
}

.mtitle_ribbon {
  display: block;
  position: relative;
  height: 45px;
  text-align: center;
  box-sizing: border-box;
  margin: 0 auto 30px;
  width: calc(100% - 52px);
}
.mtitle_ribbon:before {
  content: "";
  position: absolute;
  width: 10px;
  bottom: -20px;
  left: -26px;
  z-index: -2;
  border: 20px solid #0d654a;
  border-left-color: transparent;
}
.mtitle_ribbon:after {
  content: "";
  position: absolute;
  width: 10px;
  bottom: -20px;
  right: -26px;
  z-index: -2;
  border: 20px solid #0d654a;
  border-right-color: transparent;
}
.mtitle_ribbon span {
  display: inline-block;
  position: relative;
  width: 100%;
  margin: 0;
  padding: 0 20px;
  line-height: 55px;
  font-size: 2.6rem;
  color: #fff;
  background: #073829;
}
@media all and (max-width: 639px) {
  .mtitle_ribbon span {
    font-size: 1.8rem;
  }
}
.mtitle_ribbon span:before {
  position: absolute;
  content: "";
  top: 100%;
  left: 0;
  border: none;
  border-bottom: solid 10px transparent;
  border-right: solid 15px #010b08;
}
.mtitle_ribbon span:after {
  position: absolute;
  content: "";
  top: 100%;
  right: 0;
  border: none;
  border-bottom: solid 10px transparent;
  border-left: solid 15px #010b08;
}

.mtitle_smart {
  margin-top: 40px;
  margin-bottom: 40px;
  position: relative;
}
.mtitle_smart.white .eng:first-letter {
  color: #fff;
}
.mtitle_smart.white:after {
  position: absolute;
  border-bottom: 1px solid #fff;
}
.mtitle_smart:after {
  position: absolute;
  border-bottom: 1px solid #073829;
  content: "";
  background-size: contain;
  width: 97px;
  z-index: -1;
  bottom: -12px;
  left: 0;
}
.mtitle_smart.tcenter {
  margin: 0 auto 50px;
  left: 0;
}
.mtitle_smart.tcenter:after {
  left: 0;
  right: 0;
  margin: 0 auto;
  width: 130px;
}
.mtitle_smart .eng {
  margin-bottom: 10px;
  display: block;
  font-size: 4.2rem;
  line-height: 4.2rem;
  position: relative;
  font-weight: normal;
  z-index: 2;
  color: #333;
  font-family: "PT Serif", serif;
  font-weight: 500;
}
.mtitle_smart .eng:first-letter {
  color: #073829;
  text-transform: uppercase !important;
}
.mtitle_smart .ja {
  padding-top: 10px;
  position: relative;
  z-index: 2;
  font-size: 1.7rem;
  color: #555;
  letter-spacing: 0.15em;
  font-weight: 600;
  font-family: "YakuHanMP", "Cinzel", "Noto Serif JP", "游明朝 Medium", "Yu Mincho", YuMincho, "Hiragino Mincho ProN", HGS明朝E, serif;
  font-weight: 500;
}
.mtitle_smart.center {
  margin-left: auto;
  margin-right: auto;
  text-align: center;
}
.mtitle_smart.white {
  color: #fff;
  text-shadow: 0 0 3px rgba(0, 0, 0, 0.2);
}
.mtitle_smart.white .eng,
.mtitle_smart.white .ja {
  color: #fefefe;
}

@media all and (max-width: 639px) {
  .mtitle {
    text-align: center;
  }
  .mtitle:after {
    right: 0;
    left: 0;
    margin: 0 auto;
  }
  .mtitle .eng {
    font-size: 3rem;
    line-height: 3rem;
  }
  .mtitle .ja {
    font-size: 1.8rem;
  }
}
.mtitle_s {
  width: 100%;
  margin: 0 auto 0;
  text-align: center;
  background-color: #eaeaea;
  padding: 5px 0;
}
.mtitle_s.white {
  background: #fff;
}
.mtitle_s.white .ja,
.mtitle_s.white .eng {
  color: #073829;
}
.mtitle_s.white .ja:first-letter,
.mtitle_s.white .eng:first-letter {
  color: #073829;
}
.mtitle_s .ja {
  display: inline-block;
  font-weight: 500;
  font-size: 1.8rem;
  line-height: 1.4;
  color: #131313;
  margin-left: 10px;
}
.mtitle_s .eng {
  display: inline-block;
  font-size: 3.2rem;
  color: #333;
  line-height: 1;
  font-weight: 500;
  text-transform: uppercase;
  letter-spacing: 0.2em;
  font-family: "Noto Serif JP", "YakuHanMP", "Noto Serif JP", "游明朝 Medium", "Yu Mincho", YuMincho, "Hiragino Mincho ProN", HGS明朝E, serif;
  font-weight: 400;
  letter-spacing: 0;
  text-transform: lowercase !important;
}
.mtitle_s .eng:first-letter {
  text-transform: uppercase;
}
.mtitle_s .eng:first-letter {
  color: #073829;
}
.mtitle_s.attention .eng {
  font-size: 2.8rem;
}
.mtitle_s.attention:before {
  position: absolute;
  content: "";
  width: 20%;
  height: 2px;
  left: 0;
  top: 40%;
  background: #998969;
  background: linear-gradient(90deg, #998969 0%, rgba(255, 255, 255, 0) 100%);
}
.mtitle_s.attention:after {
  position: absolute;
  content: "";
  width: 20%;
  height: 2px;
  right: 0;
  top: 40%;
  background: #998969;
  background: linear-gradient(270deg, #998969 0%, rgba(255, 255, 255, 0) 100%);
}

@media all and (max-width: 639px) {
  .mtitle_s {
    flex-direction: column;
    flex-wrap: wrap;
    align-items: flex-start;
  }
  .mtitle_s .eng {
    font-size: 1.8rem;
    flex: 0 1 auto;
    margin-left: auto;
    line-height: 1.3;
    letter-spacing: 0.1em;
  }
  .mtitle_s .ja {
    font-size: 1.2rem;
  }
}
@media all and (max-width: 639px) {
  .mtitle2_s2.attention .eng {
    font-size: 1.8rem;
  }
}
.mtitle_eng {
  font-size: 8vw;
  color: #888;
  position: absolute;
  top: -5%;
  left: 0;
  mix-blend-mode: difference;
  z-index: 1;
  letter-spacing: 0;
  font-family: "Noto Serif JP", "YakuHanMP", "Noto Serif JP", "游明朝 Medium", "Yu Mincho", YuMincho, "Hiragino Mincho ProN", HGS明朝E, serif;
  font-weight: 400;
  letter-spacing: 0;
  text-transform: lowercase !important;
}
.mtitle_eng:first-letter {
  text-transform: uppercase;
}
@media all and (max-width: 1100px) {
  .mtitle_eng {
    top: -24%;
  }
}
@media all and (max-width: 896px) {
  .mtitle_eng {
    font-size: 4vw;
    position: relative;
  }
}
@media all and (max-width: 639px) {
  .mtitle_eng {
    font-size: 11vw;
  }
}
.mtitle_eng.white {
  color: rgba(187, 187, 187, 0.3) !important;
  top: -22%;
}
.mtitle_eng.tright {
  text-align: right;
  left: inherit;
  right: 0;
}
.mtitle_eng.tcenter {
  text-align: center;
  left: 0;
  right: 0;
}

.mtitle_inline {
  margin: 0 auto 40px;
  text-align: center;
  text-align: center;
  position: relative;
}
.mtitle_inline.bar:before {
  content: "";
  background-color: #073829;
  background-size: contain;
  background-image: linear-gradient(to right, #073829 50%, #aaa 50%);
  z-index: -1;
  width: 120px;
  height: 3px;
  position: absolute;
  top: inherit;
  bottom: -5px;
  left: 0;
  right: 0;
  margin: 0 auto;
}
@media all and (max-width: 639px) {
  .mtitle_inline.bar:before {
    left: 0;
    right: 0;
    width: 80px;
    margin: 0 auto;
    bottom: -15px;
    height: 2px;
  }
}
.mtitle_inline.bar2:before {
  content: "";
  background-color: #073829;
  z-index: -1;
  width: 80%;
  height: 1px;
  position: absolute;
  top: inherit;
  bottom: -5px;
  left: auto;
  right: 0;
  margin: 0 0 0 auto;
}
@media all and (max-width: 639px) {
  .mtitle_inline.bar2:before {
    left: 0;
    right: 0;
    width: 80px;
    margin: 0 auto;
    bottom: -15px;
    height: 2px;
  }
}
.mtitle_inline .eng,
.mtitle_inline .ja {
  display: inline-block;
}
.mtitle_inline .ja:before {
  content: "/";
  margin: 0 10px;
}
.mtitle_inline .eng {
  font-size: 4rem;
  line-height: 1.2;
  color: #073829;
  font-family: "Noto Serif JP", "YakuHanMP", "Noto Serif JP", "游明朝 Medium", "Yu Mincho", YuMincho, "Hiragino Mincho ProN", HGS明朝E, serif;
  font-weight: 400;
  letter-spacing: 0;
  text-transform: lowercase !important;
}
.mtitle_inline .eng:first-letter {
  text-transform: uppercase;
}
.mtitle_inline .ja {
  font-size: 1.8rem;
  color: #333;
}
@media all and (max-width: 639px) {
  .mtitle_inline .eng {
    font-size: 3rem;
    display: block;
  }
  .mtitle_inline .eng:before {
    height: 60px;
    top: -64px;
  }
  .mtitle_inline .ja {
    font-size: 1.6rem;
    display: block;
  }
  .mtitle_inline .ja:before {
    content: "";
    margin: 0 0px;
  }
}

.mtitle_ja {
  margin: 0 auto 40px;
  text-align: center;
}
.mtitle_ja.tleft {
  text-align: left;
}
@media all and (max-width: 639px) {
  .mtitle_ja.tleft {
    text-align: center !important;
  }
}
.mtitle_ja.white {
  color: #fff;
}
.mtitle_ja.white .ja {
  color: #fff;
}
.mtitle_ja.white .ja:first-letter {
  color: #fff;
}
.mtitle_ja.white .eng {
  color: #fff;
}
.mtitle_ja .eng {
  font-size: 2rem;
  display: block;
  line-height: 1.6;
  color: #333;
  font-family: "Noto Serif JP", "YakuHanMP", "Noto Serif JP", "游明朝 Medium", "Yu Mincho", YuMincho, "Hiragino Mincho ProN", HGS明朝E, serif;
  font-weight: 400;
  letter-spacing: 0;
  text-transform: lowercase !important;
}
.mtitle_ja .eng:first-letter {
  text-transform: uppercase;
}
.mtitle_ja .ja {
  font-size: 3.6rem;
  color: #073829;
}
.mtitle_ja .ja.small {
  font-size: 2rem;
}
.mtitle_ja .ja.type2 {
  color: #073829;
}
.mtitle_ja .ja.white {
  color: #fff;
}
.mtitle_ja.white {
  color: #fff;
}
.mtitle_ja.white span {
  color: #fff;
}
.mtitle_ja.white span:after {
  background-color: #eee;
}
.mtitle_ja.white span.eng {
  opacity: 1;
  font-size: 5rem;
}
.mtitle_ja.white span.eng:first-letter {
  color: #ffff59;
}
.mtitle_ja.white span.eng:before {
  position: absolute;
  content: "";
  width: 1px;
  height: 130px;
  background-color: #fff;
  left: 0;
  right: 0;
  top: -150px;
  margin: 0 auto;
}
.mtitle_ja.black {
  color: #555;
}
.mtitle_ja.black span {
  color: #555;
}
.mtitle_ja.black span:after {
  background-color: #555;
}
@media all and (max-width: 639px) {
  .mtitle_ja {
    text-align: center;
    margin-bottom: 20px;
  }
  .mtitle_ja .eng {
    font-size: 1.6rem;
  }
  .mtitle_ja .eng:before {
    height: 60px;
    top: -64px;
  }
  .mtitle_ja .ja {
    font-size: 2.2rem;
  }
  .mtitle_ja.white {
    color: #fff;
  }
  .mtitle_ja.white span {
    color: #fff;
  }
  .mtitle_ja.white span:after {
    background-color: #eee;
  }
  .mtitle_ja.white span.eng {
    opacity: 1;
    font-size: 2rem;
  }
  .mtitle_ja.white span.eng:first-letter {
    color: #ffff59;
  }
  .mtitle_ja.white span.eng:before {
    position: absolute;
    content: "";
    width: 1px;
    height: 130px;
    background-color: #fff;
    left: 0;
    right: 0;
    top: -150px;
    margin: 0 auto;
  }
}

.mtitle_dashed {
  width: 100%;
  max-width: 100%;
  padding: 0.4em 0.5em 0.4em;
  margin: 30px auto;
  font-size: 1.5em;
  font-weight: 900;
  line-height: 1.2;
  color: white;
  text-align: center;
  letter-spacing: 0.2em;
  background: #073829;
  border: dashed 1px white;
  box-shadow: 0 0 0 5px #073829;
}
@media all and (max-width: 639px) {
  .mtitle_dashed {
    font-size: 1.4rem;
    line-height: 1.6;
    padding: 15px 0;
  }
}

.mtitle_fleter {
  margin-bottom: 20px;
  padding: 5px 0;
  font-size: inherit;
  font-weight: 700;
  line-height: 1.2;
  border-bottom: solid thin #aaa;
}
.mtitle_fleter.bar {
  border-bottom: solid thin #aaa;
}
.mtitle_fleter::first-letter {
  font-size: 1.8em;
  color: #073829;
  margin-right: 3px;
}
.mtitle_fleter.big {
  font-size: 1.2em;
}
.mtitle_fleter.big::first-letter {
  font-size: 2.2em;
  color: #073829;
}

.mtitle_num {
  margin: 15px 0;
  padding: 5px 0;
  font-size: inherit;
  font-weight: 700;
  line-height: 1.2;
  border-bottom: solid thin #ccc;
  display: flex;
  align-items: center;
}
.mtitle_num > .num {
  font-size: 1.8em;
  color: #073829;
  margin-right: 12px;
}
.mtitle_num.type_r > .num {
  font-size: 1.8em;
  color: #fff;
  background: #073829;
  border-radius: 50%;
  display: grid;
  place-items: center;
  width: 50px;
  padding: 0 10px;
  height: 50px;
  flex: 0;
}
.mtitle_num.sub > .num {
  color: #68482A;
}
.mtitle_num > .txt {
  color: #073829;
}

.mtitle_line {
  width: 100%;
  position: relative;
  margin: 0 auto 30px;
  text-align: center;
}
.mtitle_line.bigger .eng {
  font-size: 11rem;
  line-height: 1;
  font-family: "Noto Serif JP", "YakuHanMP", "Noto Serif JP", "游明朝 Medium", "Yu Mincho", YuMincho, "Hiragino Mincho ProN", HGS明朝E, serif;
  font-weight: 400;
  letter-spacing: 0;
  text-transform: lowercase !important;
  letter-spacing: 0.3em;
  color: #68482A;
  text-transform: uppercase !important;
}
.mtitle_line.bigger .eng:first-letter {
  text-transform: uppercase;
}
.mtitle_line.bigger .eng:first-letter {
  color: #073829;
}
.mtitle_line.bigger .eng:before {
  height: 2px;
  background: #073829;
}
@media all and (max-width: 1100px) {
  .mtitle_line.bigger .eng {
    font-size: 7rem;
  }
}
@media all and (max-width: 639px) {
  .mtitle_line.bigger .eng {
    font-size: 3rem;
  }
}
.mtitle_line:before {
  position: absolute;
  content: "";
  width: 25%;
  height: 2px;
  left: 0;
  top: 40%;
  background: #68482A;
  background: linear-gradient(90deg, #68482A 0%, rgba(255, 255, 255, 0) 100%);
}
.mtitle_line:after {
  position: absolute;
  content: "";
  width: 25%;
  height: 2px;
  right: 0;
  top: 40%;
  background: #68482A;
  background: linear-gradient(270deg, #68482A 0%, rgba(255, 255, 255, 0) 100%);
}
.mtitle_line .ja {
  display: block;
  font-size: 2.5rem;
  line-height: 1.4;
  color: #073829;
}
.mtitle_line .eng {
  display: block;
  font-size: 1.8rem;
  color: #68482A;
  line-height: 1;
}
@media all and (max-width: 639px) {
  .mtitle_line {
    flex-direction: column;
    flex-wrap: wrap;
    align-items: flex-start;
  }
  .mtitle_line .eng {
    font-size: 1.2rem;
    flex: 0 1 auto;
    margin-left: auto;
    line-height: 1.3;
  }
  .mtitle_line .ja {
    font-size: 1.8rem;
  }
}
.mtitle_line.attention .eng {
  font-size: 2.8rem;
}
@media all and (max-width: 639px) {
  .mtitle_line.attention .eng {
    font-size: 1.8rem;
  }
}
.mtitle_line.attention:before {
  position: absolute;
  content: "";
  width: 20%;
  height: 2px;
  left: 0;
  top: 40%;
  background: rgb(153, 137, 105);
  background: linear-gradient(90deg, rgb(153, 137, 105) 0%, rgba(255, 255, 255, 0) 100%);
}
.mtitle_line.attention:after {
  position: absolute;
  content: "";
  width: 20%;
  height: 2px;
  right: 0;
  top: 40%;
  background: rgb(153, 137, 105);
  background: linear-gradient(270deg, rgb(153, 137, 105) 0%, rgba(255, 255, 255, 0) 100%);
}

.mtitle_deco {
  margin: 0 auto 40px;
  position: relative;
  text-align: center;
}
.mtitle_deco.ita .eng {
  font-family: "Noto Serif JP", "YakuHanMP", "Noto Serif JP", "游明朝 Medium", "Yu Mincho", YuMincho, "Hiragino Mincho ProN", HGS明朝E, serif;
  font-weight: 400;
  letter-spacing: 0;
  text-transform: lowercase !important;
}
.mtitle_deco.ita .eng:first-letter {
  text-transform: uppercase;
}
.mtitle_deco .eng {
  font-family: "Anton", sans-serif;
  font-size: 6.5rem;
  color: rgba(7, 56, 41, 0.1);
  background-image: url(../img/pattern/spray_b.png);
  background-repeat: repeat;
  font-weight: bold;
  background-clip: text;
  -webkit-background-clip: text;
  letter-spacing: 0.02em;
  position: relative;
  z-index: 2;
  display: block;
}
@media all and (-ms-high-contrast: none) {
  .mtitle_deco .eng {
    color: #68482A;
    background-image: none;
  }
}
.mtitle_deco .eng.big {
  font-size: 8rem;
}
@media all and (max-width: 639px) {
  .mtitle_deco .eng.big {
    font-size: 5rem;
  }
}
.mtitle_deco .ja {
  position: relative;
  z-index: 2;
  letter-spacing: 0.2em;
  font-size: 2rem;
}
.mtitle_deco .ja.big {
  font-size: 2.5rem;
}
@media all and (max-width: 639px) {
  .mtitle_deco .ja.big {
    font-size: 2rem;
  }
}
.mtitle_deco.left {
  text-align: left;
  margin-left: 0;
  margin-right: 0;
}
.mtitle_deco.left:before {
  left: 2%;
  transform: translate(0, -50%);
}
.mtitle_deco.left span:after {
  left: 0;
  transform: none;
}
@media all and (max-width: 639px) {
  .mtitle_deco {
    text-align: center;
  }
  .mtitle_deco .eng {
    font-size: 4rem;
  }
  .mtitle_deco .ja {
    font-size: 1.3rem;
  }
}

.mtitle_deco01 {
  margin: 20px auto 20px;
  text-align: center;
  position: relative;
}
.mtitle_deco01 .eng {
  font-size: 3.8rem;
  color: #fff;
  text-shadow: 0px 0px 5px #073829, 0px 0px 5px #073829, 0px 0px 10px #073829, 0px 0px 10px #073829, 0px 0px 15px #073829, 0px 0px 15px;
  color: #073829;
  font-family: "Noto Serif JP", "YakuHanMP", "Noto Serif JP", "游明朝 Medium", "Yu Mincho", YuMincho, "Hiragino Mincho ProN", HGS明朝E, serif;
  font-weight: 400;
  letter-spacing: 0;
  text-transform: lowercase !important;
}
.mtitle_deco01 .eng:first-letter {
  text-transform: uppercase;
}
@media all and (max-width: 639px) {
  .mtitle_deco01 .eng {
    font-size: 2rem;
  }
}
.mtitle_deco01 .ja {
  font-size: 3.8rem;
  color: #fff;
  text-shadow: 0px 0px 5px #073829, 0px 0px 5px #073829, 0px 0px 10px #073829, 0px 0px 10px #073829, 0px 0px 15px #073829, 0px 0px 15px;
}
@media all and (max-width: 639px) {
  .mtitle_deco01 .ja {
    font-size: 2rem;
  }
}
.mtitle_deco01 .ja:first-letter {
  color: white;
}
.mtitle_deco01 .ja.white {
  color: #fff;
}
.mtitle_deco01:before {
  content: "";
  background: url(../img_chuo/mtitle_deco01.png) top center no-repeat;
  background-size: contain;
  z-index: -1;
  width: 100%;
  height: 5vw;
  position: absolute;
  top: 20px;
  left: 0;
  right: 0;
  margin: 0 auto;
}
@media all and (max-width: 639px) {
  .mtitle_deco01:before {
    left: 0;
    right: 0;
    margin: 0 auto;
    width: 100%;
    height: 198%;
  }
}

.mtitle_deco02 {
  margin: 20px auto 70px;
  text-align: center;
  position: relative;
  font-weight: bold;
}
.mtitle_deco02 .eng {
  font-size: 3.8rem;
  color: #fff;
  color: #073829;
  font-family: "Noto Serif JP", "YakuHanMP", "Noto Serif JP", "游明朝 Medium", "Yu Mincho", YuMincho, "Hiragino Mincho ProN", HGS明朝E, serif;
  font-weight: 400;
  letter-spacing: 0;
  text-transform: lowercase !important;
}
.mtitle_deco02 .eng:first-letter {
  text-transform: uppercase;
}
@media all and (max-width: 639px) {
  .mtitle_deco02 .eng {
    font-size: 2rem;
  }
}
.mtitle_deco02 .ja {
  font-size: 3.8rem;
  color: #073829;
}
@media all and (max-width: 639px) {
  .mtitle_deco02 .ja {
    font-size: 2rem;
  }
}
.mtitle_deco02 .ja.white {
  color: #fff;
}
.mtitle_deco02:before {
  content: "";
  background: url(../img_chuo/mtitle_deco01.png) top center no-repeat;
  background-size: contain;
  text-align: center;
  z-index: -1;
  width: 100%;
  height: 100%;
  position: absolute;
  top: 41px;
  left: 0;
  right: 0;
  margin: 0 auto;
}
@media all and (max-width: 639px) {
  .mtitle_deco02:before {
    left: 0;
    right: 0;
    margin: 0 auto;
  }
}

.mtitle2 {
  position: relative;
}
.mtitle2.tleft {
  text-align: left;
}
.mtitle2 .eng {
  font-size: 10rem;
  color: #68482A;
  display: block;
  line-height: 1.2;
  font-family: "Noto Serif JP", "YakuHanMP", "Noto Serif JP", "游明朝 Medium", "Yu Mincho", YuMincho, "Hiragino Mincho ProN", HGS明朝E, serif;
  font-weight: 400;
  letter-spacing: 0;
  text-transform: lowercase !important;
  position: absolute;
  opacity: 0.2;
  bottom: -56px;
  right: 0;
}
.mtitle2 .eng:first-letter {
  text-transform: uppercase;
}
.mtitle2 .ja {
  font-size: 3rem;
  color: #073829;
  position: relative;
}
.mtitle2 .ja:before {
  position: absolute;
  content: "";
  width: 100px;
  height: 1px;
  bottom: -30px;
  background-color: #073829;
}
@media all and (max-width: 639px) {
  .mtitle2 .ja:before {
    bottom: -7px;
  }
}
@media all and (max-width: 639px) {
  .mtitle2 {
    text-align: center;
  }
  .mtitle2 .eng {
    font-size: 4rem;
  }
  .mtitle2 .ja {
    font-size: 1.6rem;
  }
}

.mtitle3 {
  margin: 0 0 0px;
  text-align: right;
  position: relative;
}
@media all and (max-width: 639px) {
  .mtitle3 {
    text-align: center;
  }
}
.mtitle3.tright {
  text-align: right;
}
.mtitle3 .eng {
  font-size: 5rem;
  color: #073829;
  display: block;
  line-height: 1.2;
}
.mtitle3 .ja {
  font-size: 3rem;
  color: #555;
  font-weight: 300;
  position: relative;
}
@media all and (max-width: 639px) {
  .mtitle3 {
    text-align: center;
  }
  .mtitle3 .eng {
    font-size: 3rem;
  }
  .mtitle3 .ja {
    font-size: 1.4rem;
  }
}

.mtitle4 {
  margin: 0 auto 80px;
  text-align: center;
  position: relative;
}
.mtitle4.tleft {
  text-align: left;
}
.mtitle4 .eng {
  font-size: 3rem;
  color: #073829;
  display: block;
  line-height: 1.2;
  font-family: "Noto Serif JP", "YakuHanMP", "Noto Serif JP", "游明朝 Medium", "Yu Mincho", YuMincho, "Hiragino Mincho ProN", HGS明朝E, serif;
  font-weight: 400;
  letter-spacing: 0;
  text-transform: lowercase !important;
  -ms-writing-mode: tb-rl;
  writing-mode: vertical-rl;
  position: absolute;
  left: -35px;
}
.mtitle4 .eng:first-letter {
  text-transform: uppercase;
}
.mtitle4 .ja {
  font-size: 3rem;
  color: #333;
  position: relative;
  -ms-writing-mode: tb-rl;
  writing-mode: vertical-rl;
}
.mtitle4 .ja:before {
  position: absolute;
  content: "";
  width: 80px;
  height: 1px;
  bottom: -30px;
  background-color: #073829;
}
@media all and (max-width: 639px) {
  .mtitle4 {
    text-align: center;
  }
  .mtitle4 .eng {
    font-size: 4rem;
    -ms-writing-mode: inherit;
        writing-mode: inherit;
    position: inherit;
    left: auto;
    right: auto;
    bottom: auto;
    text-align: center;
  }
  .mtitle4 .ja {
    font-size: 1.6rem;
    -ms-writing-mode: inherit;
        writing-mode: inherit;
    text-align: center;
    margin: 0 auto;
    display: block;
  }
  .mtitle4 .ja:before {
    width: 70px;
    height: 1px;
    bottom: -10px;
  }
}

.mtitle_sub {
  padding: 0 0 0 10px;
  font-weight: 600;
  position: relative;
  border-left: 6px solid #073829;
  margin: 0px 0 15px 0px;
  font-size: 1.1em;
  line-height: 1.4;
  text-align: left;
}
.mtitle_sub .hissu {
  color: #fff;
  background: #0d654a;
  padding: 5px 8px;
  margin-right: 5px;
  font-size: 11px;
  border-radius: 20px;
}
.mtitle_sub:before {
  position: absolute;
  left: -6px;
  bottom: 0;
  content: "";
  width: 6px;
  height: 50%;
  background-color: #68482A;
}

.mtitle_bar {
  margin: 15px 0;
}
.mtitle_bar::after {
  content: "";
  display: block;
  width: 100%;
  height: 0.7rem;
  background: repeating-linear-gradient(-45deg, transparent 0, transparent 0.3rem, rgba(7, 56, 41, 0.2) 0.3rem, rgba(7, 56, 41, 0.2) 0.7rem);
}

.mtitle_box {
  background: #073829;
  color: #fff;
  font-size: 2rem;
  position: relative;
  padding: 15px 25px;
  margin-bottom: 25px;
  font-weight: 600;
  overflow: hidden;
  margin: 25px 0;
}
.mtitle_box.f-2 {
  text-align: center;
}
.mtitle_box.f-2 span {
  font-size: 2rem;
  text-align: center;
}
.mtitle_box span {
  font-weight: normal;
  font-size: 14px;
  padding-left: 10px;
}
.mtitle_box:before {
  background-color: rgba(255, 255, 255, 0.6);
  content: "";
  display: block;
  transform: rotate(50deg);
  position: absolute;
  bottom: -250px;
  right: -150px;
  width: 300px;
  height: 280px;
}
@media all and (max-width: 896px) {
  .mtitle_box:before {
    font-size: 1.5rem;
    right: -200px;
  }
}
@media all and (max-width: 639px) {
  .mtitle_box {
    font-size: 1.5rem;
    margin: 0 0 15px;
  }
}
.mtitle_box.type1 {
  background-image: -webkit-gradient(linear, right top, left top, from(#073829), to(#68482A));
}
.mtitle_box.type2 {
  background: #8fb8c9;
}
.mtitle_box.type_n {
  text-align: center;
  background: #e3dbd5;
  color: #073829;
  font-family: "Noto Serif JP", "YakuHanMP", "Noto Serif JP", "游明朝 Medium", "Yu Mincho", YuMincho, "Hiragino Mincho ProN", HGS明朝E, serif;
}
.mtitle_box.type_n:before {
  display: none;
}

.mtitle_box2 {
  background: rgba(7, 56, 41, 0.2);
  font-size: 2.2rem;
  color: #232323;
  position: relative;
  font-weight: 600;
  overflow: hidden;
  letter-spacing: 0.1rem;
  box-shadow: rgba(17, 17, 17, 0.1) 0 6px 3px 2px;
  padding: 60px 60px;
  margin-bottom: 25px;
}
.mtitle_box2 .small-cap {
  font-weight: normal;
  font-size: 14px;
}
.mtitle_box2:after {
  background-color: #073829;
  content: "";
  display: block;
  transform: rotate(50deg);
  position: absolute;
  top: -250px;
  left: -150px;
  width: 300px;
  height: 280px;
}
.mtitle_box2:before {
  background-color: #073829;
  content: "";
  display: block;
  transform: rotate(50deg);
  position: absolute;
  bottom: -250px;
  right: -150px;
  width: 300px;
  height: 280px;
}
@media all and (max-width: 639px) {
  .mtitle_box2 {
    font-size: 15px;
    line-height: 1.5;
    padding: 25px 20px;
  }
  .mtitle_box2 span {
    font-size: 2rem;
  }
  .mtitle_box2:after {
    width: 123px;
    left: -170px;
    top: -98px;
  }
  .mtitle_box2:before {
    width: 123px;
    right: -170px;
    top: -106px;
  }
}

.mtitle_box3 {
  background: #073829;
  color: #fff;
  padding: 15px 20px;
  font-size: 1.8rem;
  font-weight: bold;
  position: relative;
  overflow: hidden;
  margin: 25px 0;
}
.mtitle_box3 .eng {
  font-size: 2.2rem;
  font-family: "Noto Serif JP", "YakuHanMP", "Noto Serif JP", "游明朝 Medium", "Yu Mincho", YuMincho, "Hiragino Mincho ProN", HGS明朝E, serif;
  font-weight: 400;
  letter-spacing: 0;
  text-transform: lowercase !important;
}
.mtitle_box3 .eng:first-letter {
  text-transform: uppercase;
}
.mtitle_box3 .ja {
  font-size: 1.6rem;
}
.mtitle_box3.sub {
  background: #68482A;
}
@media all and (max-width: 639px) {
  .mtitle_box3 {
    font-size: 1.5rem;
  }
}
.mtitle_box3.b-m0 {
  margin-bottom: 0px !important;
}
.mtitle_box3::before {
  background-color: #fff;
  content: "";
  transform: rotate(-144deg);
  display: block;
  opacity: 0.1;
  position: absolute;
  top: 350%;
  left: -4%;
  width: 200%;
  height: 930%;
}
@media all and (max-width: 639px) {
  .mtitle_box3::before {
    top: 280%;
    left: -64%;
  }
}
.mtitle_box3::after {
  background-color: #fff;
  content: "";
  display: block;
  opacity: 0.2;
  position: absolute;
  bottom: -190%;
  left: 85%;
  width: 10%;
  transform: rotate(45deg);
  height: 620%;
}
@media all and (max-width: 639px) {
  .mtitle_box3::after {
    width: 40%;
  }
}
.mtitle_box3 .photo {
  margin: 0 auto;
  text-align: center;
}

.photo-h img {
  width: 100%;
  height: 500px;
  -o-object-fit: cover;
     object-fit: cover;
}
@media all and (max-width: 639px) {
  .photo-h img {
    width: 100%;
    height: 130px;
    -o-object-fit: cover;
       object-fit: cover;
    margin-top: 60px;
    margin-bottom: 16px;
  }
}

.mtitle_bl {
  font-size: 1.6rem;
  border-left: 3px solid #073829;
  line-height: 1.6;
  font-weight: 600;
  margin: 24px 0;
  padding: 6px 0.5em;
}
@media all and (max-width: 639px) {
  .mtitle_bl {
    font-size: 1.5rem;
    padding: 6px 0.5em;
    margin-top: 30px;
  }
}

.mtitle_cursol_b {
  position: relative;
  padding: 1rem 0.5rem;
  margin-bottom: 30px;
  font-size: 1.6rem;
  font-weight: 700;
  color: #073829;
  border-top: solid 1px #073829;
  border-bottom: solid 1px #073829;
}
.mtitle_cursol_b.type_w {
  border-left: solid 1px #073829;
  border-right: solid 1px #073829;
  background-color: #fff;
}
.mtitle_cursol_b::after {
  position: absolute;
  top: 100%;
  left: 110px;
  width: 0;
  height: 0;
  content: "";
  border: solid 15px transparent;
  border-top-color: #073829;
}
.mtitle_cursol_b.tcenter::after {
  position: absolute;
  top: 100%;
  left: 0;
  right: 0;
  width: 0;
  height: 0;
  margin: 0 auto;
  content: "";
  border: solid 10px transparent;
  border-top-color: #073829;
}
@media (max-width: 992px) {
  .mtitle_cursol_b {
    padding: 1rem 0;
    text-align: center;
  }
  .mtitle_cursol_b::after {
    left: 50%;
    border-width: 10px;
    transform: translateX(-50%);
  }
}

.mtitle_cursol_b2 {
  color: #fff;
  position: relative;
  padding: 20px 1rem;
  margin-bottom: 30px;
  font-size: 1.5rem;
  font-weight: 700;
  color: white;
  background-color: #073829;
}
.mtitle_cursol_b2.tcenter::after {
  position: absolute;
  top: 100%;
  left: 0;
  right: 0;
  width: 0;
  height: 0;
  margin: 0 auto;
  content: "";
  border: solid 15px transparent;
  border-top-color: #073829;
}
.mtitle_cursol_b2::after {
  position: absolute;
  top: 100%;
  left: 50px;
  width: 0;
  height: 0;
  z-index: 10;
  content: "";
  border: solid 15px transparent;
  border-top-color: #073829;
}
@media (max-width: 1100px) {
  .mtitle_cursol_b2::after {
    border-width: 10px;
  }
}
@media (max-width: 576px) {
  .mtitle_cursol_b2 {
    font-size: 1.2rem;
    letter-spacing: 0;
  }
}

.mttl_bl {
  font-size: 1.6rem;
  border-left: 2px solid #073829;
  background-color: #f2f2f2;
  line-height: 1.6;
  font-weight: 600;
  margin: 24px 0;
  padding: 6px 0.5em;
}
@media all and (max-width: 639px) {
  .mttl_bl {
    font-size: 1.5rem;
    padding: 6px 0.5em;
    margin-top: 30px;
  }
}

.mtitle_category {
  margin-bottom: 15px;
  padding: 5px 0;
  font-size: 1.6rem;
  font-weight: bold;
  color: #888;
  border-bottom: 1px solid #ccc;
}
.mtitle_category:before {
  font-family: "Font Awesome 5 Free";
  content: "\f0ca";
  font-weight: 900;
  margin-right: 5px;
  color: #073829;
}

.mtitle_back {
  margin-top: 80px;
  margin-bottom: 80px;
  margin-left: 0;
  position: relative;
}
@media all and (max-width: 639px) {
  .mtitle_back.s-p0 {
    margin-bottom: 0px;
  }
}
.mtitle_back .eng {
  position: absolute;
  font-size: 15rem;
  color: rgba(7, 56, 41, 0.6);
  font-weight: normal;
  opacity: 0.8;
  display: block;
  font-family: "Noto Serif JP", "YakuHanMP", "Noto Serif JP", "游明朝 Medium", "Yu Mincho", YuMincho, "Hiragino Mincho ProN", HGS明朝E, serif;
  font-weight: 400;
  letter-spacing: 0;
  text-transform: lowercase !important;
  top: -100px;
  left: 0;
  right: 0;
  margin: 0 auto;
}
.mtitle_back .eng:first-letter {
  text-transform: uppercase;
}
.mtitle_back .eng.basecolor {
  color: #073829;
}
.mtitle_back .eng.white {
  color: rgba(255, 255, 255, 0.2) !important;
}
@media all and (max-width: 639px) {
  .mtitle_back .eng {
    font-size: 4rem;
  }
}
.mtitle_back .ja {
  position: relative;
  z-index: 2;
  font-size: 2.8rem;
  color: #073829;
  letter-spacing: 0.15em;
  font-weight: 600;
}
.mtitle_back .ja.black {
  color: #333;
}
.mtitle_back.center {
  margin-left: auto;
  margin-right: auto;
  text-align: center;
}
.mtitle_back.white {
  color: #fff;
  text-shadow: 0 0 3px rgba(0, 0, 0, 0.2);
}
.mtitle_back.white .eng {
  color: rgba(254, 254, 254, 0.4);
}
.mtitle_back.white .ja {
  color: #fefefe;
}
@media all and (max-width: 639px) {
  .mtitle_back {
    text-align: center;
    margin: 40px 0 20px;
  }
  .mtitle_back .eng {
    font-size: 21vw;
    top: -71px;
  }
  .mtitle_back .ja {
    font-size: 1.6rem;
  }
}

.mtitle_small {
  position: relative;
  font-size: 1.6rem;
  margin-bottom: 20px;
  color: #073829;
  font-weight: 600;
  padding: 10px;
  border-bottom: 1px double #ccc;
}
.mtitle_small:before {
  content: "";
  width: 50px;
  height: 1px;
  background-color: #073829;
  position: absolute;
  left: 0;
  bottom: -1px;
}
@media all and (max-width: 639px) {
  .mtitle_small {
    font-size: 1.3rem;
    line-height: 1.5;
    padding: 10px 0;
  }
}

.mtitle_small2 {
  position: relative;
  margin-bottom: 10px;
  padding-left: 20px;
}
.mtitle_small2:before {
  content: "";
  background-color: #073829;
  width: 10px;
  height: 4px;
  position: absolute;
  top: 0.6em;
  left: 0;
}

.mtitle_box4 {
  background: rgba(7, 56, 41, 0.2);
  font-size: 1.6rem;
  position: relative;
  padding: 13px 22px;
  margin: 20px 0;
  font-weight: 700;
}
.mtitle_box4 span {
  font-weight: normal;
  font-size: 14px;
  padding-left: 10px;
}
.mtitle_box4:before {
  position: absolute;
  font-family: "Font Awesome 5 Free";
  content: "\f061";
  font-weight: 900;
  display: block;
  left: -1px;
  top: 50%;
  transform: translateY(-50%);
  color: #fff;
}
@media all and (max-width: 639px) {
  .mtitle_box4 {
    font-size: 1.5rem;
  }
}

.mtitle_icon {
  font-size: 1.8rem;
  color: #073829;
  font-weight: bold;
  margin: 16px 0;
  border-bottom: 3px double #68482A;
}
.mtitle_icon:before {
  content: "";
  width: 1.8em;
  height: 1.8em;
  background: url(../img_wood/point02.png) no-repeat;
  background-size: contain;
  display: inline-block;
  margin: 0;
  vertical-align: middle;
  margin-right: 5px;
  color: #073829;
}
@media all and (max-width: 639px) {
  .mtitle_icon {
    font-size: 1.4rem;
  }
  .mtitle_icon:before {
    content: "";
    width: 1.3em;
    height: 1.3em;
  }
}

.mtitle_border_item {
  position: relative;
  padding: 0.75em 1em;
  margin: 0 0 1.6em 0;
  border: 2px solid #aaa;
  line-height: 1;
  text-align: center;
  color: #073829;
  font-size: 24px;
}
.mtitle_border_item:before {
  content: "";
  position: absolute;
  width: 10px;
  height: 10px;
  border: solid 2px #aaa;
}
.mtitle_border_item:after {
  content: "";
  position: absolute;
  width: 10px;
  height: 10px;
  border: solid 2px #aaa;
  top: -7px;
  left: -7px;
}
.mtitle_border_item:before {
  bottom: -7px;
  right: -7px;
}

.mtitle_tline {
  position: relative;
  padding: 0 65px;
  margin: 30px 0;
  text-align: center;
}
@media all and (max-width: 639px) {
  .mtitle_tline {
    padding: 0 25px;
  }
}
.mtitle_tline.bigger .eng {
  font-size: 11rem;
  line-height: 1;
  font-family: "Noto Serif JP", "YakuHanMP", "Noto Serif JP", "游明朝 Medium", "Yu Mincho", YuMincho, "Hiragino Mincho ProN", HGS明朝E, serif;
  font-weight: 400;
  letter-spacing: 0;
  text-transform: lowercase !important;
  letter-spacing: 0.3em;
  color: #68482A;
  text-transform: uppercase !important;
}
.mtitle_tline.bigger .eng:first-letter {
  text-transform: uppercase;
}
.mtitle_tline.bigger .eng:first-letter {
  color: #073829;
}
@media all and (max-width: 1100px) {
  .mtitle_tline.bigger .eng {
    font-size: 7rem;
  }
}
@media all and (max-width: 639px) {
  .mtitle_tline.bigger .eng {
    font-size: 3rem;
  }
}
.mtitle_tline.bigger:before {
  height: 2px;
  background: #073829;
}
.mtitle_tline:before {
  position: absolute;
  top: calc(50% - 1px);
  left: 0;
  width: 100%;
  height: 1px;
  content: "";
  background: #aaa;
}
.mtitle_tline span {
  position: relative;
  padding: 0 1em;
  font-size: 1.6rem;
  color: #073829;
  background: #fff;
}

.mtitle_large {
  margin-bottom: 40px;
  position: relative;
}
.mtitle_large.white {
  color: #fff;
}
.mtitle_large.white .ja:first-letter {
  color: #fff;
}
.mtitle_large .ja {
  margin-bottom: 20px;
  display: block;
  font-size: 4.5rem;
  line-height: 1.3;
  letter-spacing: 0.15em;
  font-weight: normal;
  position: relative;
  z-index: 2;
  color: #073829;
  /* &:first-letter {
    color: $base_color;
  } */
}
.mtitle_large .ja .num {
  color: #073829;
  font-size: 8rem;
}
@media all and (max-width: 639px) {
  .mtitle_large .ja .num {
    font-size: 4rem;
  }
}
.mtitle_large .eng {
  padding-top: 10px;
  position: relative;
  z-index: 2;
  font-size: 2.8rem;
  color: #333;
  letter-spacing: 0.15em;
  font-weight: 600;
  color: #073829;
  font-family: "Noto Serif JP", "YakuHanMP", "Noto Serif JP", "游明朝 Medium", "Yu Mincho", YuMincho, "Hiragino Mincho ProN", HGS明朝E, serif;
  font-weight: 400;
  letter-spacing: 0;
  text-transform: lowercase !important;
}
.mtitle_large .eng:first-letter {
  text-transform: uppercase;
}
.mtitle_large.center {
  margin-left: auto;
  margin-right: auto;
  text-align: center;
}
.mtitle_large.white {
  color: #fff;
  text-shadow: 0 0 3px rgba(0, 0, 0, 0.2);
}
.mtitle_large.white .eng {
  color: #fefefe;
}
.mtitle_large.white .ja {
  color: #fefefe;
}
@media all and (max-width: 639px) {
  .mtitle_large {
    text-align: center;
    margin-bottom: 0px;
  }
  .mtitle_large .eng {
    font-size: 1.3rem;
    line-height: 1.3rem;
  }
  .mtitle_large .ja {
    font-size: 2.6rem;
    line-height: 1.6;
    margin-bottom: 5px;
  }
}

.mtitle_circle_mini {
  font-size: 2.8rem;
  line-height: 1;
  font-family: "Josefin Sans", sans-serif;
  border-radius: 50%;
  border: 1px solid #073829;
  color: #073829;
  width: 70px;
  height: 70px;
  display: flex;
  align-items: center;
  justify-content: center;
  flex-direction: column;
  background-color: #fff;
  margin: 0 auto 15px;
}
.mtitle_circle_mini span {
  font-size: 50%;
}

.mtitle_square_mini {
  font-size: 2.8rem;
  line-height: 1;
  font-family: "Josefin Sans", sans-serif;
  border: 1px solid #073829;
  color: #073829;
  width: 70px;
  height: 70px;
  display: flex;
  align-items: center;
  justify-content: center;
  flex-direction: column;
  background-color: #fff;
  margin: 0 auto 15px;
}
.mtitle_square_mini span {
  font-size: 50%;
}

.mtitle_circle {
  color: #333;
  width: 100px;
  height: 100px;
  border-radius: 50%;
  font-weight: normal;
  font-size: 1.4rem;
  letter-spacing: 0;
  display: inline-block;
  text-align: center;
  display: flex;
  align-items: center;
  justify-content: center;
  flex-direction: column;
  line-height: 1;
  position: relative;
  transition: all 0.3s 0s ease;
  border: 1px solid #fff;
  color: #fff;
}
.mtitle_circle.type2 {
  border: 1px solid #073829;
  background: #fff;
  color: #073829;
}
.mtitle_circle.type2 .ttl {
  color: #073829;
}
.mtitle_circle.type3 {
  border: 1px solid #073829;
  background: #073829;
  color: #fff;
}
.mtitle_circle.type3 .ttl {
  color: #fff;
}
.mtitle_circle.tcenter {
  margin: 0 auto 20px;
}
.mtitle_circle a {
  position: absolute;
  width: 100%;
  height: 100%;
  top: 0;
  left: 0;
  z-index: 1;
}
.mtitle_circle.black {
  background-color: #111;
  color: #fff;
}
.mtitle_circle.black .ttl,
.mtitle_circle.black .num {
  color: #fff;
}
.mtitle_circle .num {
  font-size: 300%;
  padding-top: 5px;
  font-family: "Noto Serif JP", "YakuHanMP", "Noto Serif JP", "游明朝 Medium", "Yu Mincho", YuMincho, "Hiragino Mincho ProN", HGS明朝E, serif;
  font-weight: 400;
  letter-spacing: 0;
  text-transform: lowercase !important;
}
.mtitle_circle .num:first-letter {
  text-transform: uppercase;
}
.mtitle_circle i {
  margin-bottom: 5px;
  font-size: 130%;
  color: #073829;
}
@media all and (max-width: 639px) {
  .mtitle_circle {
    color: #073829;
    font-size: 1.2rem;
    width: 100px;
    height: 100px;
  }
  .mtitle_circle a {
    color: #073829;
  }
}

.mtitle_minibar {
  font-size: 1.8rem;
  font-weight: bold;
  text-align: center;
  margin: 15px auto 35px;
  position: relative;
  color: #073829;
}
.mtitle_minibar:before {
  content: "";
  position: absolute;
  width: 50px;
  height: 3px;
  background-color: #073829;
  bottom: -20px;
  left: 0;
  right: 0;
  margin: 0 auto;
}

.mtitle_m {
  -ms-writing-mode: tb-rl;
  writing-mode: vertical-rl;
  text-orientation: mixed;
  font-feature-settings: "pkna";
  position: absolute;
  min-height: 100px;
  top: 0;
  left: 0;
}
.mtitle_m .ja {
  display: block;
  font-size: 2.8rem;
  letter-spacing: 0.2em;
  padding-right: 5px;
  line-height: 2;
  font-weight: normal;
}
.mtitle_m .eng {
  display: block;
  font-family: "PT Serif", serif;
  font-weight: 500;
  font-size: 2rem;
  color: #073829;
}

@media all and (max-width: 639px) {
  .mtitle_m {
    -ms-writing-mode: inherit;
    writing-mode: inherit;
    position: static;
    margin-bottom: 20px;
    min-height: initial;
    min-height: auto;
    text-align: center;
  }
  .mtitle_m .ja {
    font-size: 1.8rem;
    line-height: 1.3;
  }
  .mtitle_m .eng {
    font-size: 3rem;
    line-height: 1.3;
  }
}
.mtitle_product {
  margin: 0 0 16px;
}
.mtitle_product .ja {
  font-size: 2rem;
  color: #073829;
}

.mtitle_normal {
  background: #12936b;
  padding: 8px;
  margin: 0 0 16px;
  color: #fff;
}
.mtitle_normal + p {
  padding: 8px;
}
.mtitle_normal.gray {
  background: #eee;
}
.mtitle_normal.gray .ja {
  color: #333 !important;
}
.mtitle_normal.base {
  background: #073829;
  color: #fff;
}
.mtitle_normal.sub {
  background: #b17a47;
  color: #68482A;
}
.mtitle_normal .eng {
  font-size: 3rem;
  font-family: "Noto Serif JP", "YakuHanMP", "Noto Serif JP", "游明朝 Medium", "Yu Mincho", YuMincho, "Hiragino Mincho ProN", HGS明朝E, serif;
  font-weight: 400;
  letter-spacing: 0;
  text-transform: lowercase !important;
}
.mtitle_normal .eng:first-letter {
  text-transform: uppercase;
}
.mtitle_normal .ja {
  color: #073829;
}
@media all and (max-width: 639px) {
  .mtitle_normal .eng {
    font-size: 1.6rem;
  }
}

.num {
  font-weight: 600;
}
.num a {
  color: #073829;
  font-size: 2.8rem;
  text-align: center;
  margin-left: 5px;
}
@media all and (max-width: 639px) {
  .num a {
    font-size: 2rem;
  }
}
.num a:before {
  font-family: "Font Awesome 5 Free";
  content: "\f879";
  font-weight: 900;
  margin-right: 5px;
}
.num a:hover {
  color: #ff6a49;
}

.num_bg .num {
  color: rgba(170, 170, 170, 0.3);
  font-size: 20rem;
  line-height: 1;
  font-style: oblique;
  position: absolute;
  z-index: -1;
  bottom: 0;
  left: 0;
  font-family: "Noto Serif JP", "YakuHanMP", "Noto Serif JP", "游明朝 Medium", "Yu Mincho", YuMincho, "Hiragino Mincho ProN", HGS明朝E, serif;
  font-weight: 400;
  letter-spacing: 0;
  text-transform: lowercase !important;
}
.num_bg .num:first-letter {
  text-transform: uppercase;
}
@media all and (max-width: 1100px) {
  .num_bg .num {
    font-size: 15rem;
  }
}
@media all and (max-width: 639px) {
  .num_bg .num {
    font-size: 10rem;
  }
}
.num_bg.right .num {
  left: inherit;
  right: 0;
}

.check01 {
  position: absolute;
  top: -10px;
  left: -10px;
  z-index: 10;
  width: 60px;
  height: 60px;
  border-radius: 50%;
  font-weight: normal;
  font-size: 1.1rem;
  letter-spacing: 0;
  display: inline-block;
  text-align: center;
  display: flex;
  align-items: center;
  justify-content: center;
  flex-direction: column;
  line-height: 1;
  transition: all 0.3s 0s ease;
  border: 1px solid #fff;
  background-color: #fff;
  color: #073829;
}
.check01 a {
  position: absolute;
  width: 100%;
  height: 100%;
  top: 0;
  left: 0;
  z-index: 1;
}
.check01 .num {
  font-size: 300%;
  padding-top: 5px;
  font-family: "Noto Serif JP", "YakuHanMP", "Noto Serif JP", "游明朝 Medium", "Yu Mincho", YuMincho, "Hiragino Mincho ProN", HGS明朝E, serif;
  font-weight: 400;
  letter-spacing: 0;
  text-transform: lowercase !important;
}
.check01 .num:first-letter {
  text-transform: uppercase;
}
.check01 i {
  font-size: 180%;
  color: #073829;
}
@media all and (max-width: 639px) {
  .check01 {
    color: #073829;
    font-size: 1.1rem;
    width: 50px;
    height: 50px;
  }
  .check01 a {
    color: #073829;
  }
}

/* txtdeco
----------------------------------*/
.txtdeco {
  font-size: 3rem;
  font-weight: bold;
  color: #073829;
}
@media all and (max-width: 896px) {
  .txtdeco {
    font-size: 1.6rem;
  }
}
.txtdeco.black {
  color: #000;
  font-weight: 800;
}
.txtdeco.white {
  color: #fff;
}
@media all and (max-width: 896px) {
  .txtdeco.white {
    font-size: 1.4rem;
  }
}
.txtdeco.txt-eng {
  font-size: 5rem;
  opacity: 0.5;
  font-family: "Noto Serif JP", "YakuHanMP", "Noto Serif JP", "游明朝 Medium", "Yu Mincho", YuMincho, "Hiragino Mincho ProN", HGS明朝E, serif;
  font-weight: 400;
  letter-spacing: 0;
  text-transform: lowercase !important;
}
.txtdeco.txt-eng:first-letter {
  text-transform: uppercase;
}
@media all and (max-width: 896px) {
  .txtdeco.txt-eng {
    font-size: 3rem;
  }
}
.txtdeco.txt-ja {
  font-size: 2rem;
  color: #333;
}
@media all and (max-width: 896px) {
  .txtdeco.txt-ja {
    font-size: 1.4rem;
  }
}

.txtdeco_a {
  font-size: 3rem;
  font-weight: bold;
  color: #073829;
}
@media all and (max-width: 896px) {
  .txtdeco_a {
    font-size: 1.6rem;
  }
}
.txtdeco_a.black {
  color: #000;
  font-weight: 800;
}
.txtdeco_a.white {
  color: #fff;
}
@media all and (max-width: 896px) {
  .txtdeco_a.white {
    font-size: 1.4rem;
  }
}
.txtdeco_a .bgLRextendTrigger:before {
  background-color: #68482A;
}
.txtdeco_a.txt-eng {
  font-size: 3rem;
  opacity: 0.5;
}
@media all and (max-width: 896px) {
  .txtdeco_a.txt-eng {
    font-size: 3rem;
  }
}
.txtdeco_a.txt-ja {
  font-size: 2rem;
  color: #333;
}
@media all and (max-width: 896px) {
  .txtdeco_a.txt-ja {
    font-size: 1.4rem;
  }
}

.txtdeco-ttl {
  margin-left: auto;
  margin-right: auto;
  text-align: center;
}
.txtdeco-ttl .bgLRextendTrigger.txt-ja:before {
  background-color: #073829;
}

.txtdeco2 span {
  color: #073829;
  padding: 8px 35px;
  margin-right: 5px;
  border-radius: 40px;
  line-height: 3rem;
  border: 2px solid #073829;
  font-weight: bold;
}
@media all and (max-width: 896px) {
  .txtdeco2 span {
    padding: 4px 10px;
    border: 1px solid #073829;
    line-height: 1.4;
    font-size: 1.1rem;
  }
}

.txtdeco3 {
  line-height: 3rem;
  font-weight: bold;
  position: relative;
  font-size: 1.6rem;
  margin: 6px 0;
}
@media all and (max-width: 896px) {
  .txtdeco3 {
    font-size: 1.1rem;
  }
}
.txtdeco3 span {
  font-weight: bold;
  background-color: #073829;
  color: #fff;
  padding: 2px 10px;
}

.ttl_box {
  margin: 30px 0;
}
.ttl_box .ttl .txtsub {
  font-weight: bold;
}
.ttl_box .ttl .ttlmain {
  font-weight: bold;
  color: #073829;
  border-bottom: 2px solid #073829;
  font-size: 2rem;
  margin-bottom: 20px;
}
@media all and (max-width: 639px) {
  .ttl_box .ttl .ttlmain {
    font-size: 1.4rem;
  }
}

.txtdeco4 {
  padding: 5px 15px;
  margin-right: 5px;
  line-height: 2rem;
  position: relative;
  display: table;
}
.txtdeco4 .num {
  font-weight: bold;
  margin-right: 10px;
  background-color: #ffff59;
  color: #333;
  padding: 2px 10px;
  display: table-cell;
  vertical-align: middle;
}
.txtdeco4 .sub {
  font-weight: bold;
  margin-right: 10px;
  border: 1px solid #fff;
  color: #fff;
  padding: 2px 10px;
  display: table-cell;
  vertical-align: middle;
  width: 140px;
  margin-right: 10px;
}
.txtdeco4 .txt {
  padding-left: 15px;
  text-align: left;
  display: table-cell;
}
@media all and (max-width: 896px) {
  .txtdeco4 {
    display: block;
    padding: 5px 0px;
  }
  .txtdeco4 .num {
    font-weight: bold;
    margin-right: 10px;
    background-color: #fff;
    color: #fff;
    padding: 2px 10px;
    display: table-cell;
    vertical-align: middle;
    font-size: 1.4rem;
  }
  .txtdeco4 .sub {
    font-weight: bold;
    margin-right: 10px;
    border: 1px solid #fff;
    color: #fff;
    padding: 2px 10px;
    display: table-cell;
    vertical-align: middle;
    width: 140px;
    margin-right: 10px;
    font-size: 1.4rem;
  }
  .txtdeco4 .txt {
    padding-left: 5px;
    padding: 10px;
    text-align: left;
    display: block;
    width: 100%;
    margin-bottom: 20px;
    font-size: 1.4rem;
  }
}

.txtdeco-list li {
  display: flex;
  flex-wrap: wrap;
}
@media all and (max-width: 896px) {
  .txtdeco-list li {
    display: block;
  }
}
.txtdeco-list li i {
  color: #073829;
  padding-right: 5px;
  padding-top: 7px;
}
@media all and (max-width: 896px) {
  .txtdeco-list li p {
    display: contents;
  }
}

.mtext1 {
  font-size: 2rem;
  line-height: 1.6;
  font-weight: 600;
  color: #073829;
}
.mtext1.tb-rl {
  -ms-writing-mode: tb-rl;
  writing-mode: vertical-rl;
}
@media all and (max-width: 639px) {
  .mtext1.tb-rl {
    -ms-writing-mode: horizontal-tb;
    writing-mode: horizontal-tb;
  }
}
.mtext1.type1 {
  margin-left: 30px;
}
@media all and (max-width: 639px) {
  .mtext1.type1 {
    margin-left: 0px;
  }
}
@media all and (max-width: 639px) {
  .mtext1 {
    font-size: 1.5rem;
    padding: 0;
    margin-top: 30px;
  }
}
.mtext1.deco {
  position: relative;
}
.mtext1.deco:before {
  content: "";
  background: url(../japanese/point02.png) top center no-repeat;
  background-size: contain;
  z-index: -1;
  width: 100%;
  height: 5vw;
  position: absolute;
  top: -7px;
  left: 0;
  right: 0;
  margin: 0 auto;
  opacity: 0.3;
}
@media all and (max-width: 639px) {
  .mtext1.deco:before {
    height: 13vw;
    top: -20px;
  }
}
.mtext1.bigger {
  margin-bottom: 20px;
  display: block;
  font-size: 4.5rem;
  line-height: 1.3;
  letter-spacing: 0.15em;
  font-weight: normal;
  position: relative;
  z-index: 2;
  color: #073829;
}
@media all and (max-width: 639px) {
  .mtext1.bigger {
    font-size: 1.8rem;
  }
}

.mtext_line {
  padding: 10px;
  margin: 20px 0;
  font-size: 1.8rem;
  font-weight: 700;
  line-height: 1.6;
  letter-spacing: 0.1em;
  border-top: solid 2px #073829;
  border-bottom: solid 2px #073829;
  color: #073829;
}
.mtext_line span {
  font-size: 1.3rem;
}
@media all and (max-width: 639px) {
  .mtext_line {
    font-size: 1.4rem;
  }
  .mtext_line span {
    font-size: 1.1rem;
  }
}

.mtext_large {
  font-weight: bold;
  font-size: 3.2rem;
  letter-spacing: 0.2em;
  line-height: 1.5;
  text-align: center;
  margin-bottom: 10px;
}
@media all and (max-width: 1100px) {
  .mtext_large {
    font-size: 2rem;
  }
}
@media all and (max-width: 639px) {
  .mtext_large {
    font-size: 2rem;
  }
}
.mtext_large.t-center {
  text-align: center;
}
.mtext_large.white {
  color: #fff;
}
@media all and (max-width: 639px) {
  .mtext_large.white {
    font-size: 2rem;
  }
}

.mtext_middle {
  font-weight: bold;
  font-size: 2.6rem;
  letter-spacing: 0.2em;
  line-height: 1.5;
  text-align: center;
  margin-bottom: 10px;
}
@media all and (max-width: 1100px) {
  .mtext_middle {
    font-size: 2rem;
  }
}
@media all and (max-width: 639px) {
  .mtext_middle {
    font-size: 1.6rem;
  }
}
.mtext_middle.t-center {
  text-align: center;
}
.mtext_middle.white {
  color: #fff;
}

.mtext2-list {
  width: 95%;
  margin-top: 50px;
}

.mtext2 {
  font-size: 3rem;
  font-weight: 600;
  letter-spacing: 0.1rem;
  line-height: 1.6;
  text-align: center;
  margin: 0 auto;
}
@media all and (max-width: 639px) {
  .mtext2 {
    font-size: 1.8rem;
    padding: 4px 8px;
  }
}

.mtext3 {
  font-size: 1.8rem;
  letter-spacing: 0.15em;
}
@media all and (max-width: 639px) {
  .mtext3 {
    font-size: 1.4rem;
  }
}

.time_txt span {
  color: #073829;
}
.time_txt i {
  color: #073829;
  font-weight: 900;
  padding: 0 4px;
}

.s-txt {
  font-size: 1.8rem;
}
@media all and (max-width: 639px) {
  .s-txt {
    font-size: 1.5rem;
    padding: 0 20px;
  }
}

.price_txt {
  display: flex;
  align-items: center;
}
.price_txt.center {
  justify-content: center;
}
.price_txt .icn_circle {
  background: #073829;
  color: #fff;
  width: 80px;
  height: 80px;
  font-size: 1.2rem;
  border-radius: 50%;
  text-align: center;
  margin-right: 10px;
}
.price_txt .icn_circle > span {
  display: grid;
  place-items: center;
  line-height: 1.1;
  height: 100%;
  margin: auto;
  width: 100%;
}
.price_txt .price b {
  font-size: 3.6rem;
  color: #073829;
  margin-right: 0.2rem;
}
.price_txt .price > span {
  font-weight: bold;
  font-size: 1.6rem;
  margin-left: 0.5rem;
}
@media all and (max-width: 639px) {
  .price_txt .icn_circle {
    width: 50px;
    height: 50px;
    font-size: 1rem;
  }
  .price_txt .price {
    line-height: 1.2;
  }
  .price_txt .price b {
    font-size: 2.2rem;
  }
  .price_txt .price > span {
    font-size: 1.1rem;
  }
}

.accent_txt {
  font-size: 40px;
  color: #111;
  text-align: center;
  border-top: 3px solid #111;
  border-bottom: 3px solid #111;
  padding: 32px 0;
  font-weight: bold;
  font-style: italic;
  text-shadow: rgba(17, 17, 17, 0.2) 3px 3px 0;
}
@media all and (max-width: 639px) {
  .accent_txt {
    font-size: 18px;
    padding: 16px 0;
  }
}
.accent_txt.green {
  color: #1fa33a;
  border-top: 3px solid #1fa33a;
  border-bottom: 3px solid #1fa33a;
}
.accent_txt.white {
  color: #fff;
  border-top: 3px solid #fff;
  border-bottom: 3px solid #fff;
}

.accent_txts {
  font-size: 40px;
  color: #111;
  text-align: center;
  font-weight: bold;
  font-style: italic;
  text-shadow: rgba(17, 17, 17, 0.2) 3px 3px 0;
}
@media all and (max-width: 639px) {
  .accent_txts {
    font-size: 18px;
    padding: 16px 0;
  }
}
.accent_txts.green {
  color: #1fa33a;
}
.accent_txts.white {
  color: #fff;
}

.txt-link {
  font-weight: 600;
  text-decoration: underline;
  pointer-events: none;
}
@media all and (max-width: 896px) {
  .txt-link {
    pointer-events: inherit;
  }
}
.txt-link:hover {
  text-decoration: none;
}

.btn_aline {
  display: flex;
  justify-content: center;
  gap: 20px 20px;
}
.btn_aline.center {
  text-align: center;
}
.btn_aline li,
.btn_aline .child {
  max-width: 360px;
  width: 100%;
}
@media all and (max-width: 639px) {
  .btn_aline {
    display: block;
    margin: 10px auto;
  }
  .btn_aline li,
.btn_aline .child {
    max-width: 100%;
    width: 100%;
  }
}

.btn_more01 {
  position: relative;
  display: flex;
  justify-content: flex-end;
  margin-top: 50px;
}
.btn_more01 a {
  display: flex;
  align-items: center;
  font-weight: 500;
  font-size: 16px;
  line-height: 1;
  color: #073829;
  padding-right: 30px;
}
.btn_more01:before {
  position: absolute;
  content: "";
  width: 20px;
  height: 20px;
  border: 1px solid #073829;
  border-radius: 50%;
  top: 50%;
  right: 0;
  transform: translateY(-50%);
  transition: 0.3s ease-in-out;
}
.btn_more01:after {
  position: absolute;
  content: "";
  width: 5px;
  height: 5px;
  top: 50%;
  right: 10px;
  border-top: 1px solid #073829;
  border-right: 1px solid #073829;
  transform: rotate(45deg) translateY(-50%);
  transition: 0.3s ease-in-out;
}
.btn_more01:hover:before {
  background: #073829;
}
.btn_more01:hover:after {
  border-color: #fefefe !important;
}
@media all and (max-width: 896px) {
  .btn_more01 {
    justify-content: flex-start;
    max-width: 160px;
    margin: 10px auto;
    background: #fff;
    padding: 6px 20px;
    border-radius: 30px;
  }
  .btn_more01:before {
    right: 10px;
  }
  .btn_more01:after {
    right: 20px;
  }
}

.btn01 a {
  background: #fefefe;
  text-align: center;
  max-width: 300px;
  margin: 15px auto;
  color: #073829;
  display: block;
  padding: 8px 5px;
  font-weight: 600;
  border: 1px solid #073829;
}
.btn01 a:hover {
  background: #073829;
  color: #fefefe;
}
.btn01.mail {
  flex-basis: 100%;
}
.btn01.mail a:before {
  font-family: "Font Awesome 5 Free";
  content: "\f0e0";
  font-weight: 900;
  margin-right: 5px;
}
.btn01.tel {
  flex-basis: 100%;
}
.btn01.tel a:before {
  font-family: "Font Awesome 5 Free";
  content: "\f879";
  font-weight: 900;
  margin-right: 5px;
}
@media all and (max-width: 639px) {
  .btn01 a {
    width: 95%;
  }
}

.btn02 a {
  text-align: center;
  max-width: 300px;
  margin: 15px auto;
  display: block;
  padding: 8px 5px;
  font-weight: 600;
  border: 1px solid #073829;
  background: #073829;
  color: #fefefe;
}
.btn02 a:hover {
  background: #fff;
  color: #073829;
}
.btn02.mail {
  flex-basis: 100%;
}
.btn02.mail a:before {
  font-family: "Font Awesome 5 Free";
  content: "\f0e0";
  font-weight: 900;
  margin-right: 5px;
}
.btn02.tel {
  flex-basis: 100%;
}
.btn02.tel a:before {
  font-family: "Font Awesome 5 Free";
  content: "\f879";
  font-weight: 900;
  margin-right: 5px;
}
@media all and (max-width: 639px) {
  .btn02 a {
    width: 95%;
  }
}

.btn03 a {
  background: #fff;
  box-shadow: rgba(136, 136, 136, 0.2) 0 0 2px 2px;
  text-align: center;
  max-width: 300px;
  margin: 15px auto;
  color: #073829;
  display: block;
  padding: 8px 5px;
  font-weight: 600;
}
.btn03 a:hover {
  background: #073829;
  color: #fefefe;
}
.btn03.mail {
  flex-basis: 100%;
}
.btn03.mail a:before {
  font-family: "Font Awesome 5 Free";
  content: "\f0e0";
  font-weight: 900;
  margin-right: 5px;
}
.btn03.tel {
  flex-basis: 100%;
}
.btn03.tel a:before {
  font-family: "Font Awesome 5 Free";
  content: "\f879";
  font-weight: 900;
  margin-right: 5px;
}
@media all and (max-width: 639px) {
  .btn03 a {
    width: 95%;
  }
}

.btn04 {
  margin-top: 10px;
  margin-bottom: 10px;
}
.btn04 i {
  margin-bottom: 5px;
  font-size: 2.2rem;
}
.btn04.center a {
  margin: 0 auto;
}
.btn04.right a {
  margin: 0 0 0 auto;
}
@media all and (max-width: 896px) {
  .btn04.right a {
    margin: 0 auto;
  }
}
.btn04.radius a {
  overflow: hidden;
}
.btn04.radius a::before {
  border-radius: 20px;
}
.btn04.white a {
  color: #555;
  background: #fff;
  box-shadow: rgba(17, 17, 17, 0.1) 0 0 2px 2px;
}
.btn04.white a:after {
  color: #073829;
}
.btn04.white a::before {
  background: #073829;
  color: #fff;
}
.btn04.white a:hover {
  color: #fff;
}
.btn04.white a:hover::after {
  color: #fff;
}
.btn04.white a:hover {
  opacity: 1;
}
.btn04.sub a {
  background: #68482A;
}
.btn04.sub a::before {
  background: #322214;
}
.btn04 a {
  color: #fff;
  display: block;
  font-size: 1.8rem;
  letter-spacing: 0.1px;
  line-height: 1;
  padding: 30px 40px;
  position: relative;
  text-align: center;
  transition: color 0.3s ease-in-out, border 0.3s ease-in-out;
  max-width: 360px;
  background: #073829;
  position: relative;
  z-index: 10;
  color: #fff;
  font-weight: bold;
}
@media all and (max-width: 896px) {
  .btn04 a {
    font-size: 1.3rem;
    margin: 0 auto;
  }
}
.btn04 a:after {
  font-family: "Font Awesome 5 Free";
  content: "\f105";
  font-weight: 900;
  position: absolute;
  display: grid;
  top: 0;
  bottom: 0;
  right: 10%;
  place-items: center;
  color: #fff;
  z-index: -1;
  transition: 0.3s;
}
.btn04 a:hover::after {
  right: 1%;
  transition: 0.3s;
}
.btn04 a::before {
  position: absolute;
  top: 0;
  right: 0;
  bottom: 0;
  left: 0;
  z-index: -2;
  content: "";
  background: black;
  transform-origin: right top;
  transform: scale(0, 1);
  transition: transform 0.3s;
}
.btn04 a:hover::before {
  transform-origin: left top;
  transform: scale(1, 1);
}

.btn_mini.radius a {
  border-radius: 20px;
}
.btn_mini a {
  background: #fefefe;
  text-align: center;
  width: 150px;
  color: #073829;
  display: block;
  padding: 3px 5px;
  font-weight: 600;
  border: 1px solid;
}
.btn_mini a:hover {
  background: #073829;
  color: #fefefe;
}
@media all and (max-width: 639px) {
  .btn_mini a {
    margin: 10px auto;
  }
}
.btn_mini.center a {
  margin: 10px auto;
}
.btn_mini.right a {
  margin: 10px 0 0 auto;
}
@media all and (max-width: 639px) {
  .btn_mini.right a {
    margin: 10px auto;
  }
}
.btn_mini.mail {
  flex-basis: 100%;
}
.btn_mini.mail a {
  background: #ffc517;
  margin: 15px auto 25px;
}
.btn_mini.mail a:before {
  font-family: "Font Awesome 5 Free";
  content: "\f0e0";
  font-weight: 900;
  margin-right: 5px;
}

.btn05 a {
  display: flex;
  justify-content: space-between;
  align-items: center;
  position: relative;
  margin: 0 auto;
  padding: 1em 2em;
  width: 300px;
  color: #333;
  font-size: 1.5rem;
  font-weight: 700;
  background-color: #cccccc;
  transition: 0.3s;
}
.btn05 a:before {
  content: "";
  position: absolute;
  bottom: -7px;
  right: -7px;
  width: 100%;
  height: 2px;
  background-color: #bbbbbb;
  transition: 0.2s ease 0s;
}
.btn05 a:after {
  content: "";
  position: absolute;
  top: 7px;
  right: -7px;
  width: 2px;
  height: 100%;
  background-color: #bbbbbb;
  transition: 0.2s ease 0.2s;
}
.btn05 a:hover {
  text-decoration: none;
  background-color: rgba(7, 56, 41, 0.7);
}
.btn05 a:hover:before {
  width: 0%;
}
.btn05 a:hover:after {
  height: 0%;
}

.btn06 {
  width: 300px;
  margin: 20px auto 20px;
}
.btn06 a {
  display: block;
  position: relative;
  padding: 15px 0;
  background-color: #073829;
  border: 1px solid #073829;
  line-height: 24px;
  letter-spacing: 0.1rem;
  font-size: 1.4rem;
  text-align: center;
  color: #ffffff;
  border-radius: 50px;
}
.btn06 a i {
  display: block;
  position: absolute;
  top: 50%;
  right: -10px;
  width: 50px;
  height: 1px;
  background-color: #ffffff;
  transition: all 0.3s ease;
}
.btn06 a:hover {
  background-color: #fff;
  border: 1px solid #073829;
  color: #073829;
}
.btn06 a:hover i {
  width: 34px;
  background-color: #073829;
}
.btn06.type2 a {
  background-color: #1fa33a;
  border: 1px solid #1fa33a;
}
.btn06.type2 a:hover {
  background-color: #fff;
  border: 1px solid #1fa33a;
  color: #1fa33a;
}
.btn06.type2 a:hover i {
  width: 34px;
  background-color: #1fa33a;
}
@media all and (max-width: 639px) {
  .btn06 {
    width: 90%;
  }
  .btn06 a {
    font-size: 1.2rem;
  }
}

.btn06_s {
  position: relative;
  color: #fff;
  padding: 10px 50px 10px 30px;
  display: inline-block;
  text-decoration: none;
  outline: none;
}
@media all and (max-width: 639px) {
  .btn06_s {
    padding: 10px 30px 10px 30px;
    max-width: 250px;
    width: 100%;
  }
}
.btn06_s:before, .btn06_s:after {
  content: "";
  position: absolute;
  z-index: 1;
  bottom: 0;
  left: 0;
  /*線の形状*/
  background: #fff;
  width: 100%;
  height: 2px;
  transition: all 0.3s ease-in-out;
}
.btn06_s:after {
  width: 0;
  background-image: linear-gradient(-225deg, #fbc2eb 0%, #a6c1ee 100%);
}
.btn06_s:hover:after {
  width: 100%;
}
.btn06_s:hover span:after {
  right: 15px;
}
.btn06_s span:after {
  content: "";
  position: absolute;
  top: 1.3em;
  right: 20px;
  width: 5px;
  height: 5px;
  border-top: 1px solid #fff;
  border-right: 1px solid #fff;
  transform: rotate(45deg);
  transition: all 0.3s;
}

.txt_tel {
  margin: 10px 0;
}
.txt_tel.large a {
  font-size: 3vw;
}
@media all and (max-width: 639px) {
  .txt_tel.large a {
    font-size: 8vw;
  }
}
.txt_tel.white a {
  color: #fff;
}
@media all and (max-width: 639px) {
  .txt_tel {
    text-align: center;
  }
}
.txt_tel a {
  background: transparent;
  font-size: 2.8rem;
  position: relative;
  color: #073829;
}
@media all and (max-width: 896px) {
  .txt_tel a {
    pointer-events: inherit;
  }
}
@media all and (max-width: 639px) {
  .txt_tel a {
    font-size: 2.4rem;
  }
}
.txt_tel a:before {
  font-family: "Font Awesome 5 Free";
  content: "\f879";
  font-weight: 900;
  margin-right: 5px;
  font-size: 80%;
}
.txt_tel a:hover {
  color: rgb(153, 153, 153);
}

.sns_btn {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 5px 5px;
}
.sns_btn li {
  display: grid;
  place-items: center;
  width: 50px;
  height: 50px;
  border-radius: 100%;
  position: relative;
  fill: #fff;
}
@media all and (max-width: 639px) {
  .sns_btn li {
    width: 40px;
    height: 40px;
  }
}
.sns_btn li a {
  position: absolute;
  width: 100%;
  height: 100%;
  top: 0;
  left: 0;
  z-index: 1;
}
.sns_btn li a:hover {
  background-color: rgba(255, 255, 255, 0.4);
}
.sns_btn li img {
  width: 20px;
  height: 20px;
}
@media all and (max-width: 639px) {
  .sns_btn li img {
    width: 15px;
    height: 15px;
  }
}
.sns_btn li svg {
  width: 20px;
  height: 20px;
}
@media all and (max-width: 639px) {
  .sns_btn li svg {
    width: 15px;
    height: 15px;
  }
}
.sns_btn li.tel {
  background: #073829;
}
.sns_btn li.cart {
  background: #073829;
}
.sns_btn li.mail {
  background: #073829;
}
.sns_btn li.youtube {
  background: #e61f19;
}
.sns_btn li.facebook {
  background: #315096;
}
.sns_btn li.twitter {
  background: #55acee;
}
.sns_btn li.instagram {
  background: linear-gradient(135deg, #427eff 0%, #f13f79 70%) no-repeat !important;
}
.sns_btn li.hatena {
  background: #008fde;
}
.sns_btn li.poket {
  background: #dc3d50;
}
.sns_btn li.feedly {
  background: #6cc655;
}
.sns_btn li.line {
  background: #50cc1a;
}
.sns_btn li.tiktok {
  background: #111;
}
.sns_btn.type1 li.tel, .sns_btn.type1 li.cart, .sns_btn.type1 li.mail, .sns_btn.type1 li.youtube, .sns_btn.type1 li.facebook, .sns_btn.type1 li.twitter, .sns_btn.type1 li.instagram, .sns_btn.type1 li.hatena, .sns_btn.type1 li.poket, .sns_btn.type1 li.feedly, .sns_btn.type1 li.tiktok, .sns_btn.type1 li.line {
  background: #fff !important;
  box-shadow: rgba(136, 136, 136, 0.1) 0 0 2px 2px;
}
.sns_btn.type1 li.tel {
  fill: #073829;
}
.sns_btn.type1 li.cart {
  fill: #073829;
}
.sns_btn.type1 li.mail {
  fill: #073829;
}
.sns_btn.type1 li.youtube {
  fill: #e61f19;
}
.sns_btn.type1 li.facebook {
  fill: #315096;
}
.sns_btn.type1 li.twitter {
  fill: #55acee;
}
.sns_btn.type1 li.instagram {
  fill: #f13f79 !important;
}
.sns_btn.type1 li.hatena {
  fill: #008fde;
}
.sns_btn.type1 li.poket {
  fill: #dc3d50;
}
.sns_btn.type1 li.feedly {
  fill: #6cc655;
}
.sns_btn.type1 li.line {
  fill: #50cc1a;
}
.sns_btn.type1 li.tiktok {
  fill: #111;
}
.sns_btn.type2 li.facebook, .sns_btn.type2 li.twitter, .sns_btn.type2 li.instagram, .sns_btn.type2 li.hatena, .sns_btn.type2 li.poket, .sns_btn.type2 li.feedly, .sns_btn.type2 li.tiktok, .sns_btn.type2 li.line {
  background: #fff !important;
  box-shadow: rgba(136, 136, 136, 0.1) 0 0 2px 2px;
  fill: #fff;
  stroke-miterlimit: 5;
  stroke-width: 2;
}
.sns_btn.type2 li.facebook {
  stroke: #315096;
}
.sns_btn.type2 li.twitter {
  stroke: #55acee;
}
.sns_btn.type2 li.instagram {
  stroke: #f13f79 !important;
}
.sns_btn.type2 li.hatena {
  stroke: #008fde;
}
.sns_btn.type2 li.poket {
  stroke: #dc3d50;
}
.sns_btn.type2 li.feedly {
  stroke: #6cc655;
}
.sns_btn.type2 li.line {
  stroke: #50cc1a;
}
.sns_btn.type2 li.tiktok {
  stroke: #111;
}

.contactbox_tel {
  background: #fff;
  width: auto;
  height: auto;
  text-align: center;
  padding: 20px 0;
  border: 1px solid #ddd;
  margin-bottom: 5px;
  line-height: 1.4;
  position: relative;
  font-size: 1.4rem;
  font-weight: normal;
}
.contactbox_tel.white {
  background: inherit;
  border: 1px solid #fff;
  padding: 33px 0;
}
.contactbox_tel.white .tel {
  margin-bottom: 0;
  font-size: 2.9rem;
  color: #fff;
}
.contactbox_tel.white .tel a {
  color: #fff;
}
.contactbox_tel.type1 {
  border-radius: 0;
  border: 1px solid #ddd;
}
.contactbox_tel.type1 .btn02 {
  margin-top: 5px;
  margin-bottom: 0;
}
.contactbox_tel.type1 .tel {
  margin-bottom: 0;
  font-size: 2.9rem;
  color: #073829;
}
.contactbox_tel.type1 .tel a {
  color: #073829;
}
.contactbox_tel .tel {
  font-size: 2.6rem;
  font-weight: normal;
  color: #555;
  margin: 12px 0;
  font-family: "PT Serif", serif;
  font-weight: 500;
}
.contactbox_tel .tel:before {
  font-family: "Font Awesome 5 Free";
  content: "\f879";
  font-weight: 900;
  font-size: 80%;
  margin-right: 8px;
}

@media all and (max-width: 639px) {
  .contactbox_tel .tel {
    font-size: 2.2rem;
  }
}
.buttonBox {
  margin: 0 auto 40px;
  position: relative;
  width: 100%;
  max-width: 420px;
  min-width: 150px;
}
.buttonBox.type-bm0 {
  margin-bottom: 0px;
}
.buttonBox.type-tm30 {
  margin-top: 30px;
}
.buttonBox .button {
  padding: 5% 0 0;
  width: 100%;
  height: 80px;
  position: relative;
  text-transform: uppercase;
  color: #073829;
  font-weight: 700;
  letter-spacing: 1px;
  border: none;
  font-size: 2rem;
  text-align: center;
  align-items: center;
  outline: none;
  cursor: pointer;
  transition: 0.3s;
}
@media all and (max-width: 896px) {
  .buttonBox .button {
    padding: 6% 0 0;
  }
}
@media all and (max-width: 639px) {
  .buttonBox .button {
    padding: 8% 0 0;
  }
}
.buttonBox .button .button_bnr {
  color: #073829;
}
.buttonBox .button .button_bnr span {
  text-align: center;
  margin: 0 auto;
  display: block;
  overflow: hidden;
  text-decoration: none;
  color: #073829;
  position: relative;
  font-size: 2rem;
}
@media all and (max-width: 639px) {
  .buttonBox .button .button_bnr span {
    font-size: 1.3rem;
    padding-right: 60px;
  }
}
.buttonBox .button .button_bnr span::before, .buttonBox .button .button_bnr span::after {
  content: "";
  position: absolute;
  background: #073829;
}
.buttonBox .button .button_bnr span::before {
  top: 21px;
  right: 20px;
  height: 1px;
  width: 42px;
}
.buttonBox .button .button_bnr span::after {
  top: 17px;
  right: 19px;
  height: 1px;
  width: 10px;
  transform: rotate(45deg);
}
@media all and (max-width: 639px) {
  .buttonBox.type-w {
    margin: 30px auto;
    text-align: center;
    max-width: 320px;
  }
}
.buttonBox::before {
  content: "";
  width: 100%;
  height: 100%;
  position: absolute;
  top: 0;
  left: 0;
  background: #68482A;
  transform-origin: 100% 50%;
  transform: scaleX(0);
  transition: transform ease 0.3s;
}
.buttonBox:hover {
  color: #fff;
}
.buttonBox:hover .button_bnr span {
  color: #fff;
}
.buttonBox:hover .button_bnr span::before, .buttonBox:hover .button_bnr span::after {
  content: "";
  position: absolute;
  background: #fff;
}
.buttonBox:hover::before {
  background: rgb(0, 68, 163);
  transform-origin: 0% 50%;
  transform: scaleX(1);
}
.buttonBox:hover::before .button {
  background: rgb(0, 68, 163);
}
.buttonBox .border,
.buttonBox .border2 {
  position: absolute;
  background: none;
  transition: all 0.5s ease-in-out;
}
.buttonBox .border {
  top: 0;
  left: 0;
  border-left: 1px solid #073829;
  border-top: 1px solid #073829;
  width: 30px;
  height: 30px;
}
.buttonBox .border2 {
  bottom: 0;
  right: 0;
  border-right: 1px solid #073829;
  border-bottom: 1px solid #073829;
  width: 30px;
  height: 30px;
}
.buttonBox:hover .border, .buttonBox:hover .border2 {
  width: 102%;
  height: 105%;
}
.buttonBox.type1 .button {
  background: #073829;
  color: #fff;
}
.buttonBox.type1 .button_bnr span {
  color: #fff;
}
.buttonBox.type1 .button_bnr span::before, .buttonBox.type1 .button_bnr span::after {
  content: "";
  position: absolute;
  background: #fff;
}
.buttonBox.type1 .border {
  border-left: 1px solid #8fb8c9;
  border-top: 1px solid #8fb8c9;
}
.buttonBox.type1 .border2 {
  border-right: 1px solid #8fb8c9;
  border-bottom: 1px solid #8fb8c9;
}
.buttonBox.type1:hover {
  color: #fff;
}
.buttonBox.type1:hover .button_bnr span {
  color: #fff;
}
.buttonBox.type1:hover .button_bnr span::before, .buttonBox.type1:hover .button_bnr span::after {
  content: "";
  position: absolute;
  background: #fff;
}
.buttonBox.type1:hover::before {
  background: rgb(0, 68, 163);
  transform-origin: 0% 50%;
  transform: scaleX(1);
}
.buttonBox.type1:hover::before .button {
  background: rgb(0, 68, 163);
}

.page_link > li {
  position: relative;
}
.page_link > li figure {
  width: 100%;
  overflow: hidden;
  height: 14vw;
  border: 10px solid #f2f2f2;
}
@media all and (max-width: 896px) {
  .page_link > li figure {
    height: 15vw;
    border: 5px solid #f2f2f2;
  }
}
@media all and (max-width: 639px) {
  .page_link > li figure {
    height: 20vw;
    border: 3px solid #f2f2f2;
  }
}
.page_link > li figure img {
  width: 100%;
  height: 100%;
  -o-object-fit: cover;
     object-fit: cover;
  transition: 0.3s;
}
.page_link > li:hover figure img {
  opacity: 1;
  transform: scale(1.2);
  transition: 0.5s;
}
.page_link > li:hover p:before {
  right: 4px;
  transition: 0.5s;
}
.page_link > li:hover a {
  background-color: rgba(255, 255, 255, 0.4);
}
.page_link > li a {
  position: absolute;
  width: 100%;
  height: 100%;
  top: 0;
  left: 0;
  z-index: 1;
}
.page_link > li p {
  background-color: #073829;
  color: #fff;
  padding: 10px 10px;
  text-align: left;
  position: relative;
  width: 100%;
}
@media all and (max-width: 639px) {
  .page_link > li p {
    font-size: 1rem;
  }
}
.page_link > li p:before {
  position: absolute;
  font-family: "Font Awesome 5 Free";
  content: "\f0da";
  font-weight: 900;
  right: 8px;
  display: grid;
  place-items: center;
  transition: 0.3s;
}
.page_link > li p:after {
  position: absolute;
  left: 8px;
  display: grid;
  place-items: center;
  transition: 0.3s;
}
.page_link.type1 li figure {
  border: 5px solid #073829;
  height: 200px;
}
.page_link.type1 li p {
  position: absolute;
  background: none;
  top: 0;
  height: 100%;
  width: 100%;
  display: grid;
  place-items: center;
  text-align: center;
  font-size: 1.8rem;
  background-color: rgba(7, 56, 41, 0.8);
}
.page_link.type1 li p:before {
  content: "";
  right: 10%;
  width: 50px;
  height: 1px;
  background-color: #fff;
}
.page_link.type1 li p:after {
  content: "";
  left: 10%;
  width: 50px;
  height: 1px;
  background-color: #fff;
}
@media all and (max-width: 639px) {
  .page_link.type1 li p {
    font-size: 1.4rem;
  }
  .page_link.type1 li p:before {
    width: 20px;
  }
  .page_link.type1 li p:after {
    width: 20px;
  }
}
.page_link.type1 li:hover p:before {
  width: 20px;
}
.page_link.type1 li:hover p:after {
  width: 20px;
}
@media all and (max-width: 639px) {
  .page_link.type1 li:hover p:before {
    width: 5px;
  }
  .page_link.type1 li:hover p:after {
    width: 5px;
  }
}
.page_link.type2 li {
  border-radius: 20px;
  overflow: hidden;
}
.page_link.type2 li figure {
  border: 0px;
  height: 160px;
  border-radius: 10px;
}
@media all and (max-width: 639px) {
  .page_link.type2 li figure {
    height: 120px;
  }
}
.page_link.type2 li figure img {
  opacity: 0.2;
}
.page_link.type2 li p {
  position: absolute;
  background: none;
  top: 0;
  height: 100%;
  width: 100%;
  display: grid;
  place-items: center;
  text-align: center;
  font-size: 3rem;
  color: #333;
  font-weight: bold;
  background-color: rgba(255, 255, 255, 0.3);
}
.page_link.type2 li p b {
  padding: 8px 35px;
  border-radius: 20px;
}
.page_link.type2 li p .txt {
  font-size: 1.8rem;
  margin-top: -20px;
}
@media all and (max-width: 639px) {
  .page_link.type2 li p .txt {
    font-size: 1.1rem;
  }
}
.page_link.type2 li p:before {
  font-family: "Font Awesome 5 Free";
  content: "\f105";
  font-weight: 900;
  right: 10%;
  width: 50px;
  height: 50px;
  border-radius: 50%;
  display: grid;
  place-items: center;
  background-color: #fff;
}
.page_link.type2 li p:after {
  display: none;
  left: 10%;
  width: 50px;
  height: 50px;
}
@media all and (max-width: 639px) {
  .page_link.type2 li p {
    font-size: 1.4rem;
  }
  .page_link.type2 li p:before {
    width: 30px;
    height: 30px;
  }
  .page_link.type2 li p:after {
    width: 30px;
    height: 30px;
  }
}
.page_link.type2 li:hover p:before {
  right: 6%;
  width: 50px;
}
.page_link.type2 li:hover p:after {
  width: 20px;
}
@media all and (max-width: 639px) {
  .page_link.type2 li:hover p:before {
    width: 5px;
  }
  .page_link.type2 li:hover p:after {
    width: 5px;
  }
}
.page_link.type3 li {
  border-radius: 20px;
  overflow: hidden;
}
.page_link.type3 li:hover figure:before {
  left: 60px;
  background-color: #073829;
  transition: 0.5s;
}
.page_link.type3 li figure {
  border: 0px;
  height: 426px;
  border-radius: 20px 50px 20px 20px;
  position: relative;
}
.page_link.type3 li figure img {
  opacity: 1;
}
.page_link.type3 li figure:before {
  position: absolute;
  font-family: "Font Awesome 5 Free";
  content: "\f105";
  font-weight: 900;
  left: 20px;
  bottom: 20px;
  width: 100px;
  height: 100px;
  border-radius: 50%;
  display: grid;
  place-items: center;
  color: #fff;
  font-size: 3rem;
  border: 2px solid #fff;
  z-index: 999;
  transition: 0.5s;
}
@media all and (max-width: 639px) {
  .page_link.type3 li figure {
    height: 330px;
  }
  .page_link.type3 li figure:before {
    width: 50px;
    height: 50px;
    font-size: 1.5rem;
  }
}
.page_link.type3 li p {
  position: absolute;
  top: -10px;
  right: -5px;
  height: 95%;
  width: 90px;
  padding: 25px 20px;
  text-align: left;
  font-size: 1.8rem;
  color: #073829;
  font-weight: bold;
  background-color: #fff;
  border-radius: 0 0 0 10px;
  -ms-writing-mode: tb-rl;
  writing-mode: vertical-rl;
}
.page_link.type3 li p b {
  padding: 8px 35px;
  border-radius: 20px;
}
.page_link.type3 li p:before {
  display: none;
  font-family: "Font Awesome 5 Free";
  content: "\f105";
  font-weight: 900;
}
.page_link.type3 li p:after {
  display: none;
}
@media all and (max-width: 639px) {
  .page_link.type3 li p {
    font-size: 1.3rem;
    width: 60px;
    padding: 25px 10px;
  }
  .page_link.type3 li p:before {
    width: 30px;
    height: 30px;
  }
  .page_link.type3 li p:after {
    width: 30px;
    height: 30px;
  }
}
.page_link.type3 li:hover p:before {
  right: 6%;
  width: 50px;
}
.page_link.type3 li:hover p:after {
  width: 20px;
}
@media all and (max-width: 639px) {
  .page_link.type3 li:hover p:before {
    width: 5px;
  }
  .page_link.type3 li:hover p:after {
    width: 5px;
  }
}

.telbnr {
  display: flex;
  flex-wrap: wrap;
  justify-content: space-between;
  margin: 30px auto 30px;
}
.telbnr li {
  width: 47%;
  border: 3px solid #ccc;
  padding: 10px 10px;
  text-align: center;
  border-radius: 50px;
}
.telbnr li.telbnr-mail a {
  pointer-events: inherit;
  font-size: 2rem;
  padding-top: 5px;
}
.telbnr li.telbnr-mail a:before {
  font-family: "Font Awesome 5 Free";
  content: "\f0e0";
  font-weight: 900;
}
@media all and (max-width: 639px) {
  .telbnr li.telbnr-mail a {
    font-size: 1.4rem;
    padding: 0;
  }
}
.telbnr li.telbnr-fax a {
  pointer-events: inherit;
  font-size: 2rem;
  padding-top: 5px;
}
.telbnr li.telbnr-fax a:before {
  font-family: "Font Awesome 5 Free";
  content: "\f1ac";
  font-weight: 900;
}
@media all and (max-width: 639px) {
  .telbnr li.telbnr-fax a {
    font-size: 1.4rem;
    padding: 0;
  }
}
.telbnr li a {
  display: block;
  font-size: 2.4rem;
  font-weight: 600;
  color: #073829;
  pointer-events: none;
}
@media all and (max-width: 896px) {
  .telbnr li a {
    pointer-events: inherit;
  }
}
.telbnr li a:before {
  font-family: "Font Awesome 5 Free";
  content: "\f879";
  font-weight: 900;
  margin-right: 5px;
}
.telbnr li a:hover {
  color: #073829;
}
@media all and (max-width: 639px) {
  .telbnr {
    max-width: 90%;
  }
  .telbnr li {
    width: 100%;
    margin: 0 auto 30px;
  }
  .telbnr li a {
    font-size: 2rem;
  }
}

.telbnr-ttl {
  font-weight: 600;
  font-size: 1.6rem;
  color: #333;
  margin-top: -30px;
}
.telbnr-ttl span {
  background: #fff;
  padding: 0 20px;
}
@media all and (max-width: 639px) {
  .telbnr-ttl {
    font-size: 1.3rem;
  }
}

.telbox {
  max-width: 600px;
  margin: 0 auto 20px;
  padding: 20px;
  background: #333;
  text-align: center;
}
.telbox .inner {
  background: #fff;
  padding: 10px;
}

.bnr_list {
  text-align: center;
}
.bnr_list.grid1 li {
  max-width: 400px;
}
@media all and (max-width: 639px) {
  .bnr_list.grid1 li {
    max-width: 98%;
  }
}
.bnr_list li {
  margin: 0 auto;
  width: 100%;
  text-align: center;
  background: #fefefe;
  padding: 8px 5px;
  font-size: 1.3rem;
  height: 100%;
  box-shadow: rgba(17, 17, 17, 0.1) 0 0 2px 2px;
  position: relative;
}
.bnr_list li img {
  width: auto;
  max-width: 100%;
  margin: 0 auto;
  height: 45px;
}
@media all and (max-width: 639px) {
  .bnr_list li {
    font-size: 12px;
    line-height: 1.5;
  }
  .bnr_list li img {
    height: 30px;
  }
}
.bnr_list .bnr_txt {
  margin-top: 4px;
  padding: 2px 0;
  font-size: 1.2rem;
  line-height: 1;
  background: #f2f2f2;
}
@media all and (max-width: 639px) {
  .bnr_list .bnr_txt {
    font-size: 1.5rem;
  }
}
.bnr_list a {
  position: absolute;
  width: 100%;
  height: 100%;
  top: 0;
  left: 0;
  z-index: 1;
}
.bnr_list a:hover {
  background-color: rgba(255, 255, 255, 0.4);
}

.bg_curve {
  position: relative;
}
.bg_curve:before {
  content: "";
  position: absolute;
  width: 100%;
  height: 300px;
  top: -100px;
  left: 0;
  background-color: #073829;
  z-index: -1;
  transform: rotate(180deg);
  -webkit-clip-path: polygon(100% 0%, 0% 0%, 0% 67.71%, 1% 67.67%, 2% 67.55%, 3% 67.34%, 4% 67.06%, 5% 66.7%, 6% 66.27%, 7% 65.76%, 8% 65.18%, 9% 64.53%, 10% 63.81%, 11% 63.04%, 12% 62.21%, 13% 61.32%, 14% 60.39%, 15% 59.42%, 16% 58.4%, 17% 57.36%, 18% 56.28%, 19% 55.19%, 20% 54.07%, 21% 52.95%, 22% 51.83%, 23% 50.7%, 24% 49.58%, 25% 48.48%, 26% 47.39%, 27% 46.33%, 28% 45.3%, 29% 44.3%, 30% 43.34%, 31% 42.43%, 32% 41.57%, 33% 40.76%, 34% 40.02%, 35% 39.33%, 36% 38.72%, 37% 38.17%, 38% 37.69%, 39% 37.29%, 40% 36.97%, 41% 36.72%, 42% 36.55%, 43% 36.47%, 44% 36.47%, 45% 36.54%, 46% 36.7%, 47% 36.94%, 48% 37.26%, 49% 37.65%, 50% 38.12%, 51% 38.67%, 52% 39.28%, 53% 39.96%, 54% 40.7%, 55% 41.5%, 56% 42.36%, 57% 43.26%, 58% 44.22%, 59% 45.21%, 60% 46.24%, 61% 47.3%, 62% 48.38%, 63% 49.49%, 64% 50.6%, 65% 51.73%, 66% 52.86%, 67% 53.98%, 68% 55.09%, 69% 56.19%, 70% 57.27%, 71% 58.32%, 72% 59.33%, 73% 60.31%, 74% 61.25%, 75% 62.14%, 76% 62.97%, 77% 63.75%, 78% 64.47%, 79% 65.12%, 80% 65.71%, 81% 66.23%, 82% 66.67%, 83% 67.03%, 84% 67.32%, 85% 67.53%, 86% 67.66%, 87% 67.71%, 88% 67.67%, 89% 67.56%, 90% 67.36%, 91% 67.09%, 92% 66.74%, 93% 66.31%, 94% 65.8%, 95% 65.23%, 96% 64.59%, 97% 63.88%, 98% 63.11%, 99% 62.28%, 100% 61.4%);
  clip-path: polygon(100% 0%, 0% 0%, 0% 67.71%, 1% 67.67%, 2% 67.55%, 3% 67.34%, 4% 67.06%, 5% 66.7%, 6% 66.27%, 7% 65.76%, 8% 65.18%, 9% 64.53%, 10% 63.81%, 11% 63.04%, 12% 62.21%, 13% 61.32%, 14% 60.39%, 15% 59.42%, 16% 58.4%, 17% 57.36%, 18% 56.28%, 19% 55.19%, 20% 54.07%, 21% 52.95%, 22% 51.83%, 23% 50.7%, 24% 49.58%, 25% 48.48%, 26% 47.39%, 27% 46.33%, 28% 45.3%, 29% 44.3%, 30% 43.34%, 31% 42.43%, 32% 41.57%, 33% 40.76%, 34% 40.02%, 35% 39.33%, 36% 38.72%, 37% 38.17%, 38% 37.69%, 39% 37.29%, 40% 36.97%, 41% 36.72%, 42% 36.55%, 43% 36.47%, 44% 36.47%, 45% 36.54%, 46% 36.7%, 47% 36.94%, 48% 37.26%, 49% 37.65%, 50% 38.12%, 51% 38.67%, 52% 39.28%, 53% 39.96%, 54% 40.7%, 55% 41.5%, 56% 42.36%, 57% 43.26%, 58% 44.22%, 59% 45.21%, 60% 46.24%, 61% 47.3%, 62% 48.38%, 63% 49.49%, 64% 50.6%, 65% 51.73%, 66% 52.86%, 67% 53.98%, 68% 55.09%, 69% 56.19%, 70% 57.27%, 71% 58.32%, 72% 59.33%, 73% 60.31%, 74% 61.25%, 75% 62.14%, 76% 62.97%, 77% 63.75%, 78% 64.47%, 79% 65.12%, 80% 65.71%, 81% 66.23%, 82% 66.67%, 83% 67.03%, 84% 67.32%, 85% 67.53%, 86% 67.66%, 87% 67.71%, 88% 67.67%, 89% 67.56%, 90% 67.36%, 91% 67.09%, 92% 66.74%, 93% 66.31%, 94% 65.8%, 95% 65.23%, 96% 64.59%, 97% 63.88%, 98% 63.11%, 99% 62.28%, 100% 61.4%);
}
@media all and (max-width: 639px) {
  .bg_curve:before {
    height: 150px;
    top: -30px;
  }
}
.bg_curve:after {
  content: "";
  position: absolute;
  width: 130%;
  height: 300px;
  top: -90px;
  left: -30%;
  background-color: rgba(7, 56, 41, 0.3);
  z-index: -2;
  transform: rotate(180deg);
  -webkit-clip-path: polygon(100% 0%, 0% 0%, 0% 67.71%, 1% 67.67%, 2% 67.55%, 3% 67.34%, 4% 67.06%, 5% 66.7%, 6% 66.27%, 7% 65.76%, 8% 65.18%, 9% 64.53%, 10% 63.81%, 11% 63.04%, 12% 62.21%, 13% 61.32%, 14% 60.39%, 15% 59.42%, 16% 58.4%, 17% 57.36%, 18% 56.28%, 19% 55.19%, 20% 54.07%, 21% 52.95%, 22% 51.83%, 23% 50.7%, 24% 49.58%, 25% 48.48%, 26% 47.39%, 27% 46.33%, 28% 45.3%, 29% 44.3%, 30% 43.34%, 31% 42.43%, 32% 41.57%, 33% 40.76%, 34% 40.02%, 35% 39.33%, 36% 38.72%, 37% 38.17%, 38% 37.69%, 39% 37.29%, 40% 36.97%, 41% 36.72%, 42% 36.55%, 43% 36.47%, 44% 36.47%, 45% 36.54%, 46% 36.7%, 47% 36.94%, 48% 37.26%, 49% 37.65%, 50% 38.12%, 51% 38.67%, 52% 39.28%, 53% 39.96%, 54% 40.7%, 55% 41.5%, 56% 42.36%, 57% 43.26%, 58% 44.22%, 59% 45.21%, 60% 46.24%, 61% 47.3%, 62% 48.38%, 63% 49.49%, 64% 50.6%, 65% 51.73%, 66% 52.86%, 67% 53.98%, 68% 55.09%, 69% 56.19%, 70% 57.27%, 71% 58.32%, 72% 59.33%, 73% 60.31%, 74% 61.25%, 75% 62.14%, 76% 62.97%, 77% 63.75%, 78% 64.47%, 79% 65.12%, 80% 65.71%, 81% 66.23%, 82% 66.67%, 83% 67.03%, 84% 67.32%, 85% 67.53%, 86% 67.66%, 87% 67.71%, 88% 67.67%, 89% 67.56%, 90% 67.36%, 91% 67.09%, 92% 66.74%, 93% 66.31%, 94% 65.8%, 95% 65.23%, 96% 64.59%, 97% 63.88%, 98% 63.11%, 99% 62.28%, 100% 61.4%);
  clip-path: polygon(100% 0%, 0% 0%, 0% 67.71%, 1% 67.67%, 2% 67.55%, 3% 67.34%, 4% 67.06%, 5% 66.7%, 6% 66.27%, 7% 65.76%, 8% 65.18%, 9% 64.53%, 10% 63.81%, 11% 63.04%, 12% 62.21%, 13% 61.32%, 14% 60.39%, 15% 59.42%, 16% 58.4%, 17% 57.36%, 18% 56.28%, 19% 55.19%, 20% 54.07%, 21% 52.95%, 22% 51.83%, 23% 50.7%, 24% 49.58%, 25% 48.48%, 26% 47.39%, 27% 46.33%, 28% 45.3%, 29% 44.3%, 30% 43.34%, 31% 42.43%, 32% 41.57%, 33% 40.76%, 34% 40.02%, 35% 39.33%, 36% 38.72%, 37% 38.17%, 38% 37.69%, 39% 37.29%, 40% 36.97%, 41% 36.72%, 42% 36.55%, 43% 36.47%, 44% 36.47%, 45% 36.54%, 46% 36.7%, 47% 36.94%, 48% 37.26%, 49% 37.65%, 50% 38.12%, 51% 38.67%, 52% 39.28%, 53% 39.96%, 54% 40.7%, 55% 41.5%, 56% 42.36%, 57% 43.26%, 58% 44.22%, 59% 45.21%, 60% 46.24%, 61% 47.3%, 62% 48.38%, 63% 49.49%, 64% 50.6%, 65% 51.73%, 66% 52.86%, 67% 53.98%, 68% 55.09%, 69% 56.19%, 70% 57.27%, 71% 58.32%, 72% 59.33%, 73% 60.31%, 74% 61.25%, 75% 62.14%, 76% 62.97%, 77% 63.75%, 78% 64.47%, 79% 65.12%, 80% 65.71%, 81% 66.23%, 82% 66.67%, 83% 67.03%, 84% 67.32%, 85% 67.53%, 86% 67.66%, 87% 67.71%, 88% 67.67%, 89% 67.56%, 90% 67.36%, 91% 67.09%, 92% 66.74%, 93% 66.31%, 94% 65.8%, 95% 65.23%, 96% 64.59%, 97% 63.88%, 98% 63.11%, 99% 62.28%, 100% 61.4%);
}
@media all and (max-width: 639px) {
  .bg_curve:after {
    height: 150px;
    top: -30px;
  }
}

.bg_slash {
  position: relative;
}
.bg_slash:before {
  content: "";
  position: absolute;
  width: 100%;
  height: 150px;
  bottom: -1;
  left: 0;
  -webkit-clip-path: polygon(0 0, 100% 100%, 0 100%);
          clip-path: polygon(0 0, 100% 100%, 0 100%);
  background-color: #fff;
}

.bg_shine {
  position: relative;
  background-image: linear-gradient(16deg, rgba(116, 116, 116, 0.05) 0%, rgba(116, 116, 116, 0.05) 25%, transparent 25%, transparent 96%, rgba(177, 177, 177, 0.08) 96%, rgba(177, 177, 177, 0.08) 100%), linear-gradient(236deg, rgba(148, 148, 148, 0.04) 0%, rgba(148, 148, 148, 0.04) 53%, transparent 53%, transparent 59%, rgba(56, 56, 56, 0.02) 59%, rgba(56, 56, 56, 0.02) 100%), linear-gradient(284deg, rgba(16, 16, 16, 0.03) 0%, rgba(16, 16, 16, 0.03) 46%, transparent 46%, transparent 71%, rgba(181, 181, 181, 0.1) 71%, rgba(181, 181, 181, 0.1) 100%), linear-gradient(316deg, rgba(197, 197, 197, 0.02) 0%, rgba(197, 197, 197, 0.02) 26%, transparent 26%, transparent 49%, rgba(58, 58, 58, 0.02) 49%, rgba(58, 58, 58, 0.02) 100%), linear-gradient(90deg, rgb(255, 255, 255), rgb(255, 255, 255));
}
.bg_shine.type_base {
  background-image: linear-gradient(-164deg, rgba(7, 56, 41, 0.07) 0%, rgba(7, 56, 41, 0.07) 25%, transparent 25%, transparent 96%, rgba(7, 56, 41, 0.08) 96%, rgba(7, 56, 41, 0.08) 100%), linear-gradient(210deg, rgba(7, 56, 41, 0.04) 0%, rgba(7, 56, 41, 0.04) 53%, transparent 53%, transparent 59%, rgba(241, 245, 233, 0.4) 59%, rgba(241, 245, 233, 0.4) 100%), linear-gradient(255deg, rgba(7, 56, 41, 0.07) 0%, rgba(7, 56, 41, 0.07) 46%, transparent 46%, transparent 71%, rgba(7, 56, 41, 0.15) 71%, rgba(7, 56, 41, 0.15) 100%), linear-gradient(316deg, rgba(241, 245, 233, 0.6) 0%, rgba(241, 245, 233, 0.6) 26%, transparent 26%, transparent 49%, rgba(241, 245, 233, 0.6) 49%, rgba(241, 245, 233, 0.6) 100%), linear-gradient(90deg, rgba(241, 245, 233, 0.2), rgba(241, 245, 233, 0.2));
}

.bg_color {
  background-color: #fff;
}

.bg_base01 {
  width: 100%;
  position: relative;
  background-color: #dbf1fc;
}
.bg_base01.type1 {
  background-color: inherit !important;
}
.bg_base01.type1:before {
  content: "";
  position: absolute;
  width: 100%;
  background-color: #f2f2f2 !important;
  background-position: center center;
  background-size: cover;
  top: 20%;
  bottom: 0;
  right: 0;
  left: 0;
  width: 100%;
  height: 80%;
  z-index: 0;
}

.bg_base02 {
  margin: 50px auto;
  width: 96%;
  position: relative;
  background-color: #dbf1fc;
}
.bg_base02.type_r {
  border-radius: 20px;
}

.bg_base03 {
  margin-top: 20px;
  margin-left: 20px;
  margin-right: 20px;
  padding: 40px 15px;
  background: #dbf1fc;
}

.bg_base04 {
  position: relative;
}
.bg_base04:before {
  content: "";
  position: absolute;
  width: 100%;
  background: #dbf1fc;
  background-position: center center;
  top: 3%;
  bottom: 0;
  right: 0;
  left: auto;
  width: 80%;
  height: 90%;
  z-index: -1;
}
.bg_base04.reverse:before {
  right: auto;
  left: 0;
}

.bg_base05 {
  background: #dbf1fc;
  position: relative;
}
.bg_base05:before {
  position: absolute;
  content: "";
  width: 100%;
  height: 100%;
  background: #fff;
  -webkit-clip-path: polygon(12% 0, 100% 0%, 88% 100%, 0% 100%);
          clip-path: polygon(12% 0, 100% 0%, 88% 100%, 0% 100%);
}

.bg_base06 {
  position: relative;
}
.bg_base06:before {
  position: absolute;
  content: "";
  width: 100%;
  height: 100%;
  background: linear-gradient(165deg, rgba(255, 255, 255, 0.8) 50%, rgba(219, 241, 252, 0.9) 50%);
  z-index: -2;
}

.bg_pattern01 {
  width: 100%;
  position: relative;
  background: url(../img/pattern/elegant2.jpg);
}
.bg_pattern01.type1 {
  background: url(../img/pattern/water_g.jpg);
}

.bg_pattern02 {
  margin: 50px auto;
  padding: 30px 0;
  width: calc(100% - 80px);
  position: relative;
  border-radius: 20px;
  background: url(../img/pattern/elegant2.jpg);
}

.bg_pattern03 {
  margin-top: 20px;
  margin-left: 20px;
  margin-right: 20px;
  padding: 40px 15px;
  background: url(../img/pattern/elegant2.jpg);
}

.bg_pattern04 {
  position: relative;
}
.bg_pattern04:before {
  content: "";
  position: absolute;
  width: 100%;
  background-image: url(../img/pattern/elegant2.jpg);
  background-repeat: repeat;
  background-attachment: cover;
  top: 0;
  right: 0;
  left: auto;
  width: 80%;
  height: 80%;
  z-index: -1;
}
.bg_pattern04.reverse:before {
  right: auto;
  left: 0;
}

.bg_pattern05 {
  background: url(../img/pattern/elegant2.jpg);
  position: relative;
}
.bg_pattern05:before {
  position: absolute;
  content: "";
  width: 100%;
  height: 100%;
  background: #fff;
  -webkit-clip-path: polygon(12% 0, 100% 0%, 88% 100%, 0% 100%);
          clip-path: polygon(12% 0, 100% 0%, 88% 100%, 0% 100%);
}

.bg-gray {
  margin: 50px auto;
  width: 96%;
  position: relative;
  border-radius: 20px;
  background-image: linear-gradient(23deg, rgba(224, 224, 224, 0.02) 0%, rgba(202, 202, 202, 0.02) 13%, transparent 13%, transparent 80%, rgba(65, 65, 65, 0.02) 80%, rgba(163, 163, 163, 0.02) 100%), linear-gradient(42deg, rgba(98, 98, 98, 0.02) 0%, rgba(128, 128, 128, 0.02) 36%, transparent 36%, transparent 77%, rgba(252, 252, 252, 0.02) 77%, rgba(252, 252, 252, 0.02) 100%), linear-gradient(286deg, rgba(173, 173, 173, 0.02) 0%, rgba(173, 173, 173, 0.02) 2%, transparent 2%, transparent 12%, rgba(196, 196, 196, 0.02) 12%, rgba(105, 105, 105, 0.02) 100%), linear-gradient(77deg, rgba(87, 87, 87, 0.02) 0%, rgba(136, 136, 136, 0.02) 18%, transparent 18%, transparent 55%, rgba(247, 247, 247, 0.02) 55%, rgba(247, 247, 247, 0.02) 100%), linear-gradient(90deg, #fff, #fff);
}
@media all and (max-width: 896px) {
  .bg-gray {
    width: calc(100% - 20px);
    margin: 50px auto;
    padding: 0 10px;
  }
}
@media all and (max-width: 639px) {
  .bg-gray {
    width: calc(100% - 0px);
    margin: 30px auto;
    padding: 0 0px;
  }
}

.bg-gray2 {
  margin-left: 20px;
  margin-right: 20px;
  padding: 40px 15px;
  background-image: linear-gradient(23deg, rgba(228, 228, 228, 0.02) 0%, rgba(202, 202, 202, 0.02) 13%, transparent 13%, transparent 80%, rgba(107, 107, 107, 0.02) 80%, rgba(11, 11, 11, 0.02) 100%), linear-gradient(42deg, rgba(98, 98, 98, 0.02) 0%, rgba(98, 98, 98, 0.02) 36%, transparent 36%, transparent 77%, rgba(252, 252, 252, 0.02) 77%, rgba(252, 252, 252, 0.02) 100%), linear-gradient(286deg, rgba(173, 173, 173, 0.02) 0%, rgba(173, 173, 173, 0.02) 2%, transparent 2%, transparent 12%, rgba(59, 59, 59, 0.02) 12%, rgba(59, 59, 59, 0.02) 100%), linear-gradient(77deg, rgba(87, 87, 87, 0.02) 0%, rgba(87, 87, 87, 0.02) 18%, transparent 18%, transparent 55%, rgba(247, 247, 247, 0.02) 55%, rgba(247, 247, 247, 0.02) 100%), linear-gradient(90deg, #fff, #fff);
}
@media all and (max-width: 639px) {
  .bg-gray2 {
    padding: 0px 5px;
    margin: 0px;
  }
}

.bg-gray3 {
  margin-top: 20px;
  margin-left: 20px;
  margin-right: 20px;
  background: #f2f2f2;
}

.bg-gray4 {
  position: relative;
}
.bg-gray4:before {
  content: "";
  position: absolute;
  width: 100%;
  background: #f2f2f2;
  background-position: center center;
  top: 3%;
  bottom: 0;
  right: 0;
  left: auto;
  width: 80%;
  height: 90%;
  z-index: -1;
}
.bg-gray4.reverse:before {
  right: auto;
  left: 0;
}

.bg-gray5 {
  background: #f2f2f2;
  position: relative;
}
.bg-gray5:before {
  position: absolute;
  content: "";
  width: 100%;
  height: 100%;
  background: #fff;
  -webkit-clip-path: polygon(12% 0, 100% 0%, 88% 100%, 0% 100%);
          clip-path: polygon(12% 0, 100% 0%, 88% 100%, 0% 100%);
}

.bg-beige {
  position: relative;
  background: #f6f0df;
}
.bg-beige.type1 {
  background: transparent;
}
.bg-beige.type1:before {
  position: absolute;
  content: "";
  width: calc(100% - 80px);
  height: 100%;
  top: 0;
  left: 50%;
  transform: translate(-50%, 0);
  background: #f6f0df;
  z-index: -1;
  opacity: 0.8;
}
@media all and (max-width: 639px) {
  .bg-beige.type1:before {
    width: calc(100% - 10px);
  }
}

.bg-beige2 {
  background: #f6f0df;
  position: relative;
}
.bg-beige2:before {
  position: absolute;
  content: "";
  width: 100%;
  height: 100%;
  background: #fff;
  -webkit-clip-path: polygon(12% 0, 100% 0%, 88% 100%, 0% 100%);
          clip-path: polygon(12% 0, 100% 0%, 88% 100%, 0% 100%);
}

.bg_base_color {
  background-color: rgba(7, 56, 41, 0.6);
}
.bg_base_color.beta {
  background-color: #073829;
}
.bg_base_color.type1 {
  background-color: rgba(7, 56, 41, 0);
  position: relative;
}
.bg_base_color.type1:before {
  content: "";
  position: absolute;
  width: 100%;
  height: 86%;
  left: 0;
  bottom: 0;
  background-color: rgba(7, 56, 41, 0.3);
}
.bg_base_color.type_beta {
  background-color: rgba(7, 56, 41, 0);
  position: relative;
}
.bg_base_color.type_beta:before {
  content: "";
  position: absolute;
  width: 100%;
  height: 90%;
  left: 0;
  bottom: 0;
  background-color: #073829;
}

.bg_deco {
  position: relative;
}
.bg_deco:before {
  position: absolute;
  top: 0;
  bottom: 0;
  right: 0;
  left: 0;
  width: 100%;
  height: 100%;
  background: url(../elegant/bg_wave02.jpg) repeat-y top center;
  z-index: -2;
}
.bg_deco.reverse:before {
  transform: scale(-1, 1);
}

.bg_deco_side {
  position: relative;
  z-index: 1;
}
.bg_deco_side .single {
  z-index: 10 !important;
}
.bg_deco_side.type1:before, .bg_deco_side.type1:after {
  position: absolute;
  content: "";
  width: 80%;
  height: 40%;
  z-index: 1;
  opacity: 0.6;
}
@media all and (max-width: 639px) {
  .bg_deco_side.type1:before, .bg_deco_side.type1:after {
    width: 35%;
  }
}
.bg_deco_side:before, .bg_deco_side:after {
  position: absolute;
  content: "";
  width: 55%;
  height: 40%;
  opacity: 0.6;
}
@media all and (max-width: 896px) {
  .bg_deco_side:before, .bg_deco_side:after {
    width: 55%;
  }
}
@media all and (max-width: 639px) {
  .bg_deco_side:before, .bg_deco_side:after {
    width: 15%;
  }
}
.bg_deco_side:before {
  left: 0;
  top: 0;
  z-index: -1;
  background: url(../images/wood/bg_deco_left.png) no-repeat left top/contain;
}
.bg_deco_side:after {
  right: 0;
  bottom: 0;
  z-index: -1;
  background: url(../images/wood/bg_deco_right.png) no-repeat right bottom/contain;
}
.bg_deco_side.type_top:before {
  left: 0;
  top: 0;
  background: url(../images/wood/bg_deco_left.png) no-repeat left top/contain;
}
.bg_deco_side.type_top:after {
  right: 0;
  top: 0;
  background: url(../images/wood/bg_deco_right.png) no-repeat right bottom/contain;
}
.bg_deco_side.type_bottom:before {
  left: 0;
  top: 0;
  background: url(../images/wood/bg_deco_left.png) no-repeat left top/contain;
}
.bg_deco_side.type_bottom:after {
  right: 0;
  top: 0;
  background: url(../images/wood/bg_deco_right.png) no-repeat right bottom/contain;
}

.bg_deco_side2 {
  position: relative;
}
.bg_deco_side2:before, .bg_deco_side2:after {
  position: absolute;
  content: "";
  width: 55%;
  height: 40%;
}
@media all and (max-width: 639px) {
  .bg_deco_side2:before, .bg_deco_side2:after {
    width: 55%;
  }
}
.bg_deco_side2:before {
  left: 0;
  top: 0;
  background: url(../images/wood/bg_deco_left.png) no-repeat left top/contain;
}
.bg_deco_side2:after {
  right: 0;
  bottom: 0;
  background: url(../images/wood/bg_deco_right.png) no-repeat right bottom/contain;
}
.bg_deco_side2.type_top:before {
  left: 0;
  top: 0;
  background: url(../images/wood/bg_deco_left.png) no-repeat left top/contain;
}
.bg_deco_side2.type_top:after {
  right: 0;
  top: 0;
  background: url(../images/wood/bg_deco_right.png) no-repeat right bottom/contain;
}
.bg_deco_side2.type_bottom:before {
  left: 0;
  top: 0;
  background: url(../images/wood/bg_deco_left.png) no-repeat left top/contain;
}
.bg_deco_side2.type_bottom:after {
  right: 0;
  top: 0;
  background: url(../images/wood/bg_deco_right.png) no-repeat right bottom/contain;
}

.bg_deco_left {
  position: relative;
}
.bg_deco_left.type1:before {
  position: absolute;
  content: "";
  width: 226px;
  height: 450px;
}
@media all and (max-width: 639px) {
  .bg_deco_left.type1:before {
    width: 35%;
  }
}
.bg_deco_left:before {
  position: absolute;
  content: "";
  width: 35%;
  height: 40%;
}
@media all and (max-width: 639px) {
  .bg_deco_left:before {
    width: 55%;
  }
}
.bg_deco_left:before {
  left: 0;
  top: 0;
  background: url(../images/wood/bg_deco_left.png) no-repeat left top/contain;
}

.bg_deco_right {
  position: relative;
}
.bg_deco_right:after {
  position: absolute;
  content: "";
  width: 35%;
  height: 40%;
}
@media all and (max-width: 639px) {
  .bg_deco_right:after {
    width: 55%;
  }
}
.bg_deco_right:after {
  right: 0;
  top: 0;
  background: url(../images/wood/bg_deco_right.png) no-repeat right bottom/contain;
}

.deco_line01 {
  position: relative;
  height: 150px;
  margin-bottom: -50px;
  z-index: 2;
}
@media all and (max-width: 639px) {
  .deco_line01 {
    height: 110px;
    margin-bottom: -30px;
  }
}
.deco_line01:before {
  position: absolute;
  content: "";
  left: 0;
  top: 0;
  width: 100%;
  height: 100%;
  background: url(../images/wood/deco_line01.png) repeat-x center bottom/contain;
}

.bg_deco_center {
  position: relative;
}
.bg_deco_center:before {
  position: absolute;
  content: "";
  left: 50%;
  top: 50%;
  width: 400px;
  height: 400px;
  transform: translate(-50%, -50%);
  background: url(../images/wood/bg_deco_center.png) no-repeat center/contain;
  z-index: -1;
  opacity: 0.5;
}
@media all and (max-width: 639px) {
  .bg_deco_center:before {
    width: 95%;
    height: 95%;
  }
}

.bg_deco_sand {
  background-image: url(../images/wood/bg_top.png), url(../images/wood/bg_bottom.png);
  background-position: top, bottom;
  background-repeat: repeat-x;
}

.bg_deco_top {
  background-image: url(../images/wood/bg_top.png);
  background-position: top;
  background-repeat: repeat-x;
}

.bg_deco_bottom {
  background-image: url(../images/wood/bg_bottom.png);
  background-position: bottom;
  background-repeat: repeat-x;
}

.bg_img {
  position: relative;
  width: 100%;
  height: 100%;
  overflow: hidden;
}
.bg_img.type1:before {
  background-image: url(../images/farm/05.jpg);
}
.bg_img.type2:before {
  background-image: url(../images/house/02.jpg);
}
.bg_img.type3:before {
  background-image: url(../images/house/03.jpg);
}
.bg_img.type4:before {
  background-image: url(../images/house/04.jpg);
}
.bg_img.type5:before {
  background-image: url(../images/house/05.jpg);
}
.bg_img.type6:before {
  background-image: url(../images/house/06.jpg);
}
.bg_img.type7:before {
  background-image: url(../images/house/07.jpg);
}
.bg_img.type8:before {
  background-image: url(../images/house/08.jpg);
}
.bg_img.type9:before {
  background-image: url(../images/house/09.jpg);
}
.bg_img.type10:before {
  background-image: url(../images/house/10.jpg);
}
.bg_img.type11:before {
  background-image: url(../geometr/bg01.jpg);
}
.bg_img.gray:before {
  filter: grayscale(100%);
}
.bg_img.blur {
  overflow: hidden;
}
.bg_img.blur:before {
  filter: blur(4px);
}
.bg_img.bg_black_grad:after {
  content: "";
  position: absolute;
  width: 100%;
  background: rgb(0, 0, 0);
  background: linear-gradient(180deg, rgba(0, 0, 0, 0) 0%, rgba(0, 0, 0, 0.6) 95%);
  background-position: center center;
  background-size: cover;
  top: 0;
  bottom: 0;
  right: 0;
  left: 0;
  width: 100%;
  height: 100%;
  z-index: -1;
}
.bg_img.bg_white_grad:after {
  content: "";
  position: absolute;
  background: rgb(255, 255, 255);
  background: linear-gradient(180deg, rgb(255, 255, 255) 0%, rgba(255, 255, 255, 0.5) 90%);
  top: 0;
  bottom: 0;
  right: 0;
  left: 0;
  width: 100%;
  height: 100%;
  margin: auto;
  z-index: 0;
}
.bg_img.bg_base_grd:after {
  background: rgb(2, 133, 135);
  background: linear-gradient(90deg, rgb(2, 133, 135) 0%, rgb(97, 169, 210) 63%);
  content: "";
  position: absolute;
  width: 100%;
  background-position: center center;
  background-size: cover;
  top: 0;
  bottom: 0;
  right: 0;
  left: 0;
  width: 100%;
  height: 100%;
  z-index: -1;
  opacity: 0.8;
}
.bg_img.bg_sharp:after {
  clip-path: polygon(0 0, 100% 4rem, 100% 100%, 0 calc(100% - 4rem));
  -webkit-clip-path: polygon(0 0, 100% 4rem, 100% 100%, 0 calc(100% - 4rem));
}
.bg_img.bg_base:before {
  filter: grayscale(100%);
  filter: blur(4px);
}
.bg_img.bg_base:after {
  content: "";
  position: absolute;
  width: 100%;
  background-color: rgba(7, 56, 41, 0.8);
  background-position: center center;
  background-size: cover;
  top: 0;
  bottom: 0;
  right: 0;
  left: 0;
  width: 100%;
  height: 100%;
  z-index: -1;
}
.bg_img.bg_white:after {
  content: "";
  position: absolute;
  width: 100%;
  background-color: rgba(255, 255, 255, 0.8);
  background-position: center center;
  background-size: cover;
  top: 0;
  bottom: 0;
  right: 0;
  left: 0;
  width: 100%;
  height: 100%;
  z-index: -1;
}
.bg_img.bg_black:after {
  content: "";
  position: absolute;
  width: 100%;
  background-color: rgba(0, 0, 0, 0.8);
  background-position: center center;
  background-size: cover;
  top: 0;
  bottom: 0;
  right: 0;
  left: 0;
  width: 100%;
  height: 100%;
  z-index: -1;
}
.bg_img.curve {
  -webkit-clip-path: ellipse(100% 100% at top);
  clip-path: ellipse(100% 100% at top);
  overflow: hidden;
}
.bg_img.type_r {
  border-radius: 30px;
  width: 96%;
  margin: 0 auto 30px;
  overflow: hidden;
}
.bg_img:before {
  content: "";
  position: absolute;
  width: 100%;
  height: 100%;
  background-repeat: no-repeat;
  background-size: cover;
  background-position: center center;
  z-index: -2;
  top: 0;
  left: 0;
}
.bg_img.fixed:before {
  background-attachment: fixed;
}

.bg_img_scroll {
  position: fixed;
  z-index: -2;
  top: 0;
  width: 100%;
  height: 100vh;
  background-size: cover;
  transform-origin: center;
}
.bg_img_scroll.gray:before {
  filter: grayscale(100%);
}
.bg_img_scroll.blur {
  overflow: hidden;
}
.bg_img_scroll.blur:before {
  filter: blur(4px);
}
.bg_img_scroll.bg_black_grad:after {
  content: "";
  position: absolute;
  width: 100%;
  background: rgb(0, 0, 0);
  background: linear-gradient(180deg, rgba(0, 0, 0, 0) 0%, rgba(0, 0, 0, 0.6) 95%);
  background-position: center center;
  background-size: cover;
  top: 0;
  bottom: 0;
  right: 0;
  left: 0;
  width: 100%;
  height: 100%;
  z-index: -1;
}
.bg_img_scroll.bg_white_grad:after {
  content: "";
  position: absolute;
  background: rgb(255, 255, 255);
  background: linear-gradient(180deg, rgb(255, 255, 255) 0%, rgba(255, 255, 255, 0.5) 90%);
  top: 0;
  bottom: 0;
  right: 0;
  left: 0;
  width: 100%;
  height: 100%;
  margin: auto;
  z-index: 0;
}
.bg_img_scroll.bg_base_grd:after {
  background: rgb(2, 133, 135);
  background: linear-gradient(90deg, rgb(2, 133, 135) 0%, rgb(97, 169, 210) 63%);
  content: "";
  position: absolute;
  width: 100%;
  background-position: center center;
  background-size: cover;
  top: 0;
  bottom: 0;
  right: 0;
  left: 0;
  width: 100%;
  height: 100%;
  z-index: -1;
  opacity: 0.8;
}
.bg_img_scroll.bg_sharp:after {
  clip-path: polygon(0 0, 100% 4rem, 100% 100%, 0 calc(100% - 4rem));
  -webkit-clip-path: polygon(0 0, 100% 4rem, 100% 100%, 0 calc(100% - 4rem));
}
.bg_img_scroll.bg_base:before {
  filter: grayscale(100%);
  filter: blur(4px);
}
.bg_img_scroll.bg_base:after {
  content: "";
  position: absolute;
  width: 100%;
  background-color: rgba(7, 56, 41, 0.8);
  background-position: center center;
  background-size: cover;
  top: 0;
  bottom: 0;
  right: 0;
  left: 0;
  width: 100%;
  height: 100%;
  z-index: -1;
}
.bg_img_scroll.bg_white:after {
  content: "";
  position: absolute;
  width: 100%;
  background-color: rgba(255, 255, 255, 0.8);
  background-position: center center;
  background-size: cover;
  top: 0;
  bottom: 0;
  right: 0;
  left: 0;
  width: 100%;
  height: 100%;
  z-index: -1;
}
.bg_img_scroll.bg_black:after {
  content: "";
  position: absolute;
  width: 100%;
  background-color: rgba(0, 0, 0, 0.8);
  background-position: center center;
  background-size: cover;
  top: 0;
  bottom: 0;
  right: 0;
  left: 0;
  width: 100%;
  height: 100%;
  z-index: -1;
}
.bg_img_scroll.curve {
  -webkit-clip-path: ellipse(100% 100% at top);
  clip-path: ellipse(100% 100% at top);
  overflow: hidden;
}
.bg_img_scroll.type_r {
  border-radius: 30px;
  width: 96%;
  margin: 0 auto 30px;
  overflow: hidden;
}
.bg_img_scroll.type1 {
  background: url("../images/house/01.jpg") no-repeat top center;
}
.bg_img_scroll.type2 {
  background: url("../images/house/02.jpg") no-repeat top center;
}
.bg_img_scroll.type3 {
  background: url("../images/house/03.jpg") no-repeat top center;
}
.bg_img_scroll.type4 {
  background: url("../images/house/04.jpg") no-repeat top center;
}
.bg_img_scroll.type5 {
  background: url("../images/house/05.jpg") no-repeat top center;
}
.bg_img_scroll.type6 {
  background: url("../images/house/06.jpg") no-repeat top center;
}
.bg_img_scroll.type7 {
  background: url("../images/house/07.jpg") no-repeat top center;
}
.bg_img_scroll.type8 {
  background: url("../images/house/08.jpg") no-repeat top center;
}
.bg_img_scroll.type9 {
  background: url("../images/house/09.jpg") no-repeat top center;
}
.bg_img_scroll.type10 {
  background: url("../images/house/10.jpg") no-repeat top center;
}

.bg_img_growing {
  position: fixed;
  z-index: -2;
  top: 0;
  width: 100%;
  height: 100vh;
  background-size: cover;
  transform-origin: center;
}
.bg_img_growing.gray:before {
  filter: grayscale(100%);
}
.bg_img_growing.blur {
  overflow: hidden;
}
.bg_img_growing.blur:before {
  filter: blur(4px);
}
.bg_img_growing.bg_black_grad:after {
  content: "";
  position: absolute;
  width: 100%;
  background: rgb(0, 0, 0);
  background: linear-gradient(180deg, rgba(0, 0, 0, 0) 0%, rgba(0, 0, 0, 0.6) 95%);
  background-position: center center;
  background-size: cover;
  top: 0;
  bottom: 0;
  right: 0;
  left: 0;
  width: 100%;
  height: 100%;
  z-index: -1;
}
.bg_img_growing.bg_white_grad:after {
  content: "";
  position: absolute;
  background: rgb(255, 255, 255);
  background: linear-gradient(180deg, rgb(255, 255, 255) 0%, rgba(255, 255, 255, 0.5) 90%);
  top: 0;
  bottom: 0;
  right: 0;
  left: 0;
  width: 100%;
  height: 100%;
  margin: auto;
  z-index: 0;
}
.bg_img_growing.bg_base_grd:after {
  background: rgb(2, 133, 135);
  background: linear-gradient(90deg, rgb(2, 133, 135) 0%, rgb(97, 169, 210) 63%);
  content: "";
  position: absolute;
  width: 100%;
  background-position: center center;
  background-size: cover;
  top: 0;
  bottom: 0;
  right: 0;
  left: 0;
  width: 100%;
  height: 100%;
  z-index: -1;
  opacity: 0.8;
}
.bg_img_growing.bg_sharp:after {
  clip-path: polygon(0 0, 100% 4rem, 100% 100%, 0 calc(100% - 4rem));
  -webkit-clip-path: polygon(0 0, 100% 4rem, 100% 100%, 0 calc(100% - 4rem));
}
.bg_img_growing.bg_base:before {
  filter: grayscale(100%);
  filter: blur(4px);
}
.bg_img_growing.bg_base:after {
  content: "";
  position: absolute;
  width: 100%;
  background-color: rgba(7, 56, 41, 0.8);
  background-position: center center;
  background-size: cover;
  top: 0;
  bottom: 0;
  right: 0;
  left: 0;
  width: 100%;
  height: 100%;
  z-index: -1;
}
.bg_img_growing.bg_white:after {
  content: "";
  position: absolute;
  width: 100%;
  background-color: rgba(255, 255, 255, 0.8);
  background-position: center center;
  background-size: cover;
  top: 0;
  bottom: 0;
  right: 0;
  left: 0;
  width: 100%;
  height: 100%;
  z-index: -1;
}
.bg_img_growing.bg_black:after {
  content: "";
  position: absolute;
  width: 100%;
  background-color: rgba(0, 0, 0, 0.8);
  background-position: center center;
  background-size: cover;
  top: 0;
  bottom: 0;
  right: 0;
  left: 0;
  width: 100%;
  height: 100%;
  z-index: -1;
}
.bg_img_growing.curve {
  -webkit-clip-path: ellipse(100% 100% at top);
  clip-path: ellipse(100% 100% at top);
  overflow: hidden;
}
.bg_img_growing.type_r {
  border-radius: 30px;
  width: 96%;
  margin: 0 auto 30px;
  overflow: hidden;
}
.bg_img_growing.type1 {
  background: url("../images/house/01.jpg") no-repeat top center;
}
.bg_img_growing.type2 {
  background: url("../images/house/02.jpg") no-repeat top center;
}
.bg_img_growing.type3 {
  background: url("../images/house/03.jpg") no-repeat top center;
}
.bg_img_growing.type4 {
  background: url("../images/house/04.jpg") no-repeat top center;
}
.bg_img_growing.type5 {
  background: url("../images/house/05.jpg") no-repeat top center;
}
.bg_img_growing.type6 {
  background: url("../images/house/06.jpg") no-repeat top center;
}
.bg_img_growing.type7 {
  background: url("../images/house/07.jpg") no-repeat top center;
}
.bg_img_growing.type8 {
  background: url("../images/house/08.jpg") no-repeat top center;
}
.bg_img_growing.type9 {
  background: url("../images/house/09.jpg") no-repeat top center;
}
.bg_img_growing.type10 {
  background: url("../images/house/10.jpg") no-repeat top center;
}

.bg_img_growing_wrap {
  padding: 300px 0;
}
.bg_img_growing_wrap .ttl {
  position: fixed;
  top: 30%;
  left: 10%;
  z-index: -2;
}
@media all and (max-width: 639px) {
  .bg_img_growing_wrap .ttl {
    left: 2%;
  }
}

.bg_resycle {
  position: relative;
  width: 100%;
  height: 100%;
}
.bg_resycle.fixed:before {
  background-attachment: fixed;
}
.bg_resycle:before {
  content: "";
  position: absolute;
  width: 100%;
  height: 100%;
  background-repeat: no-repeat;
  background-size: 100%;
  z-index: -2;
  top: 0;
  left: 0;
}
.bg_resycle.type1:before {
  background-image: url(../resycle/bg01.jpg);
}

.bg_area {
  position: relative;
  padding: 100px auto 0;
}
.bg_area.jp {
  background: url(../img/area/bg-area_jp.png) no-repeat center;
}
.bg_area.kantou {
  background: url(../img/area/bg-area_kantou.png) no-repeat center;
}
.bg_area.miyagi {
  background: url(../img/area/bg-area_miyagi.png) no-repeat center;
}
.bg_area.kagawa {
  background: url(../img/area/bg-area_kagawa.png) no-repeat center;
}
@media all and (max-width: 639px) {
  .bg_area {
    padding: 50px 0;
  }
}

.bg_basecolor {
  background-color: #073829 !important;
}

.bg_grid {
  background: rgba(255, 255, 255, 0.9);
  /* border-top: 1px solid #555;
  border-bottom: 1px solid #555;*/
  background-image: linear-gradient(90deg, transparent 95%, rgba(204, 204, 204, 0.2) 50%, rgba(204, 204, 204, 0.2)), linear-gradient(0deg, transparent 95%, rgba(204, 204, 204, 0.2) 50%, rgba(204, 204, 204, 0.2));
  background-size: 20px 20px;
  background-repeat: repeat;
}

.bg_stripe {
  position: relative;
}
.bg_stripe:before {
  content: "";
  display: block;
  position: absolute;
  top: 0;
  left: 0;
  z-index: -1;
  width: 100%;
  height: 100%;
  background-image: linear-gradient(90deg, #fff 25%, #18c08d 25%, #18c08d 50%, #fff 50%, #fff 75%, #18c08d 75%, #18c08d);
  background-size: 100px 100px;
}

.bg_svg {
  position: relative;
}
.bg_svg:before {
  content: "";
  position: absolute;
  width: 100%;
  background-image: url(../img/svg/bg_img_okinawa.svg);
  background-position: center center;
  background-size: 100%;
  background-repeat: repeat-y;
  top: 0;
  bottom: 0;
  right: 0;
  left: 0;
  width: 100%;
  height: 100%;
  z-index: -1;
}
.bg_svg.fixed:before {
  background-position: center bottom;
  background-repeat: no-repeat;
  background-attachment: fixed;
}

.bg-orange {
  background-color: #ff6a49 !important;
}

.bg-red {
  background-color: #d81e1e !important;
}

.bg-blue {
  background-color: #0083de !important;
}

.bg-green {
  background-color: #1fa33a !important;
}

.bg-yellow {
  background-color: #ffff59 !important;
}

.bg-white {
  background-color: #fff !important;
}
.bg-white.radius {
  border-radius: 25px;
  overflow: hidden;
}

.bg-black {
  background-color: #000 !important;
}

.bg-beige {
  background-color: #f6f0df !important;
}

.bg-brown {
  background-color: #3a200c !important;
}

.bg-111 {
  background-color: #111 !important;
}

.bg-222 {
  background-color: #222 !important;
}

.bg-333 {
  background-color: #333 !important;
}

.bg-aaa {
  background-color: #aaa !important;
}

.bg-bbb {
  background-color: #bbb !important;
}

.bg-ccc {
  background-color: #ccc !important;
}

.bg-ddd {
  background-color: #ddd !important;
}

.bg-eee {
  background-color: #eee !important;
}

.bg-f2 {
  background-color: #f2f2f2 !important;
}
.bg-f2.type1 {
  position: relative;
  background-color: inherit !important;
}
.bg-f2.type1:before {
  content: "";
  position: absolute;
  width: 100%;
  background-color: #f2f2f2 !important;
  background-position: center center;
  background-size: cover;
  top: 10%;
  bottom: 10%;
  right: 0;
  left: 0;
  width: 100%;
  height: 80%;
  z-index: 0;
}

.bg-line {
  background-color: #2bac38 !important;
}

.bg-facebook {
  background-color: #365491 !important;
}

.bg-twitter {
  background-color: #3596d4 !important;
}

.bg-insta {
  background-color: #f13f79;
  background: linear-gradient(135deg, #427eff 0%, #f13f79 70%) no-repeat !important;
}

.breadcrumb {
  padding: 20px 30px;
  position: relative;
  z-index: 10;
  max-width: 90%;
  margin: 0 auto;
  font-size: 1.2rem;
  text-align: left;
}
.breadcrumb.tcenter {
  max-width: 100%;
  text-align: center;
  margin: 0 auto;
}
.breadcrumb.type1 {
  position: absolute;
  bottom: -20px;
  padding: 10px 30px;
  background-color: #073829;
}
.breadcrumb.type1 li a {
  color: #fff;
}
.breadcrumb li {
  display: inline-block;
}
.breadcrumb li a {
  color: #073829;
}
.breadcrumb li + li:before {
  margin: 0 10px;
  content: ">";
}
@media all and (max-width: 1100px) {
  .breadcrumb {
    padding: 10px 0px;
  }
}

.page_title01 {
  position: relative;
  padding-bottom: 120px;
  padding-bottom: 0;
  position: relative;
  overflow: hidden;
  height: 75vh;
}
.page_title01.type1:after {
  background-image: url(../images/01.jpg);
}
.page_title01.type2:after {
  background-image: url(../images/02.jpg);
}
.page_title01.column-inner-contents-txtarea.type3:after {
  background-image: url(../images/03.jpg);
}
.page_title01.type4:after {
  background-image: url(../images/04.jpg);
}
.page_title01.type5:after {
  background-image: url(../images/05.jpg);
}
.page_title01:before {
  content: "";
  position: absolute;
  top: -400px;
  left: -400px;
  background-color: #073829;
  width: 800px;
  height: 800px;
  transform: rotate(45deg);
  z-index: 9;
}
@media all and (max-width: 639px) {
  .page_title01:before {
    top: -100px;
    left: -100px;
    width: 200px;
    height: 200px;
  }
}
.page_title01:after {
  content: "";
  position: absolute;
  background-position: center center;
  background-size: cover;
  top: 0;
  bottom: 0;
  right: 0;
  left: auto;
  width: 90%;
  height: 100%;
  z-index: 0;
}
@media all and (max-width: 639px) {
  .page_title01:after {
    overflow: hidden;
    padding-bottom: 40px;
  }
}
.page_title01 .ttl {
  z-index: 50;
  position: absolute;
  line-height: 6.2;
  left: 0;
  right: 0;
  top: 0;
  bottom: 0;
  width: 36%;
  height: 100%;
  margin: auto;
  transition: opacity 2s cubic-bezier(0.18, 0.06, 0.23, 1);
  -ms-writing-mode: tb-rl;
  writing-mode: vertical-rl;
  text-align: center;
}
.page_title01 .ttl .ja_middle {
  font-size: 5vw;
  line-height: 1;
  color: #fff;
  font-weight: bold;
  padding: 8px 20px;
  text-shadow: 0px 0px 5px #111, 0px 0px 5px #111, 0px 0px 10px #111, 0px 0px 10px #111, 0px 0px 15px #111, 0px 0px 15px;
}
.page_title01 .ttl .ja_small {
  font-size: 2vw;
  line-height: 6rem;
  color: #fff;
  background-color: #68482A;
  border: 4px double #fff;
  font-weight: bold;
  padding: 30px 8px;
}
@media all and (max-width: 639px) {
  .page_title01 .ttl {
    bottom: 20%;
    left: 10px;
  }
  .page_title01 .ttl .ja_middle {
    font-size: 14vw;
  }
  .page_title01 .ttl .ja_small {
    font-size: 6vw;
  }
}

.page_title02 {
  position: relative;
  width: 100%;
  z-index: 0;
}
.page_title02.type_r .photo {
  border-radius: 30px;
  width: 96%;
}
.page_title02.type_clip .photo {
  -webkit-clip-path: polygon(0% 0, 50% 100%, 100% 0);
  clip-path: polygon(0% 0, 50% 100%, 100% 0);
}
.page_title02.bigger .photo img {
  width: 100%;
  height: 650px;
}
@media all and (max-width: 639px) {
  .page_title02.bigger .photo img {
    height: 350px;
  }
}
.page_title02 .photo {
  position: relative;
  overflow: hidden;
  width: 100%;
  margin: 0 auto;
}
.page_title02 .photo img {
  width: 100%;
  height: 450px;
  -o-object-fit: cover;
     object-fit: cover;
}
@media all and (max-width: 639px) {
  .page_title02 .photo img {
    height: 250px;
  }
}
.page_title02 .photo:before {
  position: absolute;
  content: "";
  width: 100%;
  height: 100%;
  background-color: #111;
  opacity: 0.3;
  z-index: 1;
}
.page_title02 .icon {
  margin-bottom: 20px;
  position: relative;
}
.page_title02 .icon img {
  width: 60px;
  filter: brightness(0) invert(1);
}
.page_title02 .ttl {
  font-size: 1.8rem;
  display: flex;
  align-items: center;
  justify-content: center;
  flex-direction: column;
  position: absolute;
  top: 0;
  bottom: 0;
  left: 0;
  right: 0;
  margin: auto;
  z-index: 2;
}
.page_title02 .ttl .mtitle_ja .ja,
.page_title02 .ttl .mtitle_ja .eng,
.page_title02 .ttl .mtitle .ja,
.page_title02 .ttl .mtitle .eng {
  color: #fff;
}
.page_title02 .ttl .mtitle_ja .ja::first-letter,
.page_title02 .ttl .mtitle_ja .eng::first-letter,
.page_title02 .ttl .mtitle .ja::first-letter,
.page_title02 .ttl .mtitle .eng::first-letter {
  color: #fff;
}
.page_title02 .ttl .mtitle_ja .ja {
  font-size: 5rem;
}
@media all and (max-width: 639px) {
  .page_title02 .ttl .mtitle_ja .ja {
    font-size: 2rem;
  }
}
.page_title02 .ttl .mtitle_ja .small {
  font-size: 2.8rem;
}
@media all and (max-width: 639px) {
  .page_title02 .ttl .mtitle_ja .small {
    font-size: 2rem;
  }
}

.page_title03 {
  position: relative;
  width: 100%;
}
.page_title03.gray:before {
  filter: grayscale(100%);
}
.page_title03.blur {
  overflow: hidden;
}
.page_title03.blur:before {
  filter: blur(4px);
}
.page_title03.bg_black_grad:after {
  content: "";
  position: absolute;
  width: 100%;
  background: rgb(0, 0, 0);
  background: linear-gradient(180deg, rgba(0, 0, 0, 0) 0%, rgba(0, 0, 0, 0.6) 95%);
  background-position: center center;
  background-size: cover;
  top: 0;
  bottom: 0;
  right: 0;
  left: 0;
  width: 100%;
  height: 100%;
  z-index: -1;
}
.page_title03.bg_white_grad:after {
  content: "";
  position: absolute;
  background: rgb(255, 255, 255);
  background: linear-gradient(180deg, rgb(255, 255, 255) 0%, rgba(255, 255, 255, 0.5) 90%);
  top: 0;
  bottom: 0;
  right: 0;
  left: 0;
  width: 100%;
  height: 100%;
  margin: auto;
  z-index: 0;
}
.page_title03.bg_base_grd:after {
  background: rgb(2, 133, 135);
  background: linear-gradient(90deg, rgb(2, 133, 135) 0%, rgb(97, 169, 210) 63%);
  content: "";
  position: absolute;
  width: 100%;
  background-position: center center;
  background-size: cover;
  top: 0;
  bottom: 0;
  right: 0;
  left: 0;
  width: 100%;
  height: 100%;
  z-index: -1;
  opacity: 0.8;
}
.page_title03.bg_sharp:after {
  clip-path: polygon(0 0, 100% 4rem, 100% 100%, 0 calc(100% - 4rem));
  -webkit-clip-path: polygon(0 0, 100% 4rem, 100% 100%, 0 calc(100% - 4rem));
}
.page_title03.bg_base:before {
  filter: grayscale(100%);
  filter: blur(4px);
}
.page_title03.bg_base:after {
  content: "";
  position: absolute;
  width: 100%;
  background-color: rgba(7, 56, 41, 0.8);
  background-position: center center;
  background-size: cover;
  top: 0;
  bottom: 0;
  right: 0;
  left: 0;
  width: 100%;
  height: 100%;
  z-index: -1;
}
.page_title03.bg_white:after {
  content: "";
  position: absolute;
  width: 100%;
  background-color: rgba(255, 255, 255, 0.8);
  background-position: center center;
  background-size: cover;
  top: 0;
  bottom: 0;
  right: 0;
  left: 0;
  width: 100%;
  height: 100%;
  z-index: -1;
}
.page_title03.bg_black:after {
  content: "";
  position: absolute;
  width: 100%;
  background-color: rgba(0, 0, 0, 0.8);
  background-position: center center;
  background-size: cover;
  top: 0;
  bottom: 0;
  right: 0;
  left: 0;
  width: 100%;
  height: 100%;
  z-index: -1;
}
.page_title03.curve {
  -webkit-clip-path: ellipse(100% 100% at top);
  clip-path: ellipse(100% 100% at top);
  overflow: hidden;
}
.page_title03.type_r {
  border-radius: 30px;
  width: 96%;
  margin: 0 auto 30px;
  overflow: hidden;
}
.page_title03.bigger .photo img {
  height: 650px;
}
.page_title03 .photo {
  position: relative;
  overflow: hidden;
  width: 100%;
}
.page_title03 .photo img {
  width: 100%;
  height: 250px;
  -o-object-fit: cover;
     object-fit: cover;
}
.page_title03 .photo:before {
  position: absolute;
  content: "";
  width: 100%;
  height: 100%;
  background-color: #111;
  opacity: 0.2;
}
.page_title03 .ttl {
  margin-bottom: 20px;
  position: absolute;
  left: 0;
  margin: 0 auto;
  bottom: 0;
  text-align: left;
  width: 100%;
  padding: 15px 30px 0;
  color: #073829;
}
.page_title03 .ttl.left {
  width: auto;
}
.page_title03 .ttl.right {
  width: auto;
  left: auto;
  right: 0;
  margin: 0 0 0 auto;
}
.page_title03 .ttl .mtitle {
  margin: 0;
}
.page_title03 .ttl span {
  font-size: 2rem;
  margin-bottom: 20px;
  position: absolute;
  left: 0;
  margin: 0 auto;
  bottom: 0;
  text-align: left;
  padding: 15px 30px;
  background-color: rgba(7, 56, 41, 0.8);
  color: #fff;
}
@media all and (max-width: 639px) {
  .page_title03 .ttl {
    padding: 0;
  }
  .page_title03 .ttl span {
    position: relative;
    display: block;
    font-size: 1.6rem;
    padding: 15px;
  }
}
.page_title03 .txtarea {
  background-color: rgba(170, 170, 170, 0.2);
  padding: 30px;
  width: 100%;
}
@media all and (max-width: 639px) {
  .page_title03 .txtarea {
    padding: 15px;
  }
}

.contentlist li {
  background-color: #fff;
  position: relative;
  width: 100%;
  padding: 1%;
}
.contentlist li a {
  position: absolute;
  width: 100%;
  height: 100%;
  top: 0;
  left: 0;
  z-index: 1;
}
.contentlist li a:hover {
  background-color: rgba(255, 255, 255, 0.4);
}
.contentlist li:hover {
  transition: 0.8s;
}
.contentlist li:hover .link-arrow {
  transition: 0.8s;
  right: 10px;
  mix-blend-mode: color-burn;
}
.contentlist li:hover figure {
  position: relative;
}
.contentlist li:hover figure img {
  transform: scale(1.2);
  position: relative;
}
.contentlist li:hover .txt-box {
  transition: 0.8s;
  background-color: #073829;
}
.contentlist li:hover .txt {
  display: block;
  bottom: 0;
  left: 110px;
  color: #fff;
  text-align: left;
  padding: 56px 0 0 30px;
}
@media all and (max-width: 896px) {
  .contentlist li:hover .txt {
    position: initial;
    padding: 0 0 0 0;
    text-align: center;
  }
}
.contentlist li figure {
  position: relative;
  overflow: hidden;
  width: 100%;
  height: 20vw;
}
@media all and (max-width: 639px) {
  .contentlist li figure {
    height: 40vw;
  }
}
.contentlist li figure img {
  -o-object-fit: cover;
     object-fit: cover;
  transition: all 0.4s ease;
  width: 100%;
  height: 100%;
  opacity: 1;
}
.contentlist li .txt-box {
  position: relative;
  background-color: #073829;
  padding: 30px 0;
}
.contentlist li .ttl {
  text-align: center;
  margin: 0 auto;
  font-size: 1.2rem;
  font-weight: bold;
  text-align: center;
  line-height: 1.11em;
  font-weight: normal;
  color: #fff;
}
@media all and (max-width: 639px) {
  .contentlist li .ttl {
    font-size: 1rem;
  }
}
.contentlist li .subttl {
  font-size: 2rem;
  text-align: center;
  color: #fff;
  font-weight: bold;
}
@media all and (max-width: 896px) {
  .contentlist li .subttl {
    text-align: center;
    font-size: 1.4rem;
  }
}

.puton {
  position: absolute;
  z-index: 10;
}
.puton.r01 {
  top: 0;
  right: 0;
  margin: 0 0 auto auto;
}
.puton.r02 {
  bottom: 0;
  right: 0;
  margin: auto 0 0 auto;
}
.puton.r03 {
  bottom: -60px;
  right: -160px;
  margin: auto 0 0 auto;
}
@media all and (max-width: 639px) {
  .puton.r03 {
    bottom: -40px;
    right: -20px;
  }
}
.puton.l01 {
  top: 0px;
  left: 0;
  margin: 0 auto auto 0;
}
.puton.l02 {
  bottom: -40px;
  left: 0px;
  margin: 0 auto auto 0;
}
.puton figure {
  width: 400px;
  height: 400px;
}
.puton figure img {
  width: 100%;
  height: 100%;
  -o-object-fit: contain;
     object-fit: contain;
}
@media all and (max-width: 1100px) {
  .puton figure {
    width: 280px;
    height: 280px;
  }
}
@media all and (max-width: 896px) {
  .puton figure {
    width: 180px;
    height: 180px;
  }
}
@media all and (max-width: 639px) {
  .puton figure {
    width: 80px;
    height: 80px;
  }
}
.puton.small figure {
  width: 200px;
  height: 200px;
}
.puton.small figure img {
  width: 100%;
  height: 100%;
  -o-object-fit: contain;
     object-fit: contain;
}
@media all and (max-width: 639px) {
  .puton.small figure {
    width: 100px;
    height: 100px;
  }
}

.greeting_photo {
  position: absolute;
  top: -95px;
  right: -180px;
}
.greeting_photo figure {
  max-width: 380px;
  height: 240px;
}
.greeting_photo figure img {
  width: 100%;
  height: 100%;
  -o-object-fit: cover;
     object-fit: cover;
}

@media all and (max-width: 840px) {
  .greeting_photo {
    position: relative;
    top: 0;
    right: 0;
  }
  .greeting_photo figure {
    text-align: center;
    margin: 0 auto;
    height: auto;
  }
}
.img_deco {
  position: absolute;
  top: -110px;
  right: 0;
  left: 0;
  margin: 0 auto 20px;
  max-width: 260px;
}
.img_deco img {
  width: 100%;
}
@media all and (max-width: 896px) {
  .img_deco {
    position: relative;
    margin: 20px auto 0px;
    top: -30px;
    max-width: 300px;
  }
}

.tbl_scroll {
  width: 100%;
}
@media all and (max-width: 639px) {
  .tbl_scroll {
    overflow-x: scroll;
    overflow-y: hidden;
    max-width: 900px;
    margin: 0 auto;
  }
  .tbl_scroll table {
    width: 600px !important;
  }
  .tbl_scroll .sitemap {
    width: 500px !important;
  }
}

.tbl {
  width: 100%;
  font-size: 1.1rem !important;
  margin: 10px 0;
}
.tbl a {
  text-decoration: underline;
}
.tbl a:before {
  font-family: "Font Awesome 5 Free";
  content: "\f1c1";
  font-weight: 900;
  color: #d81e1e;
  margin-right: 3px;
}
.tbl.set_4 {
  font-size: 1.2rem;
}
.tbl.set_4 th {
  width: 25% !important;
}
.tbl.set_4 td {
  width: 25% !important;
}
.tbl.shima th:nth-child(2n), .tbl.shima th:nth-child(3n), .tbl.shima th:nth-child(4n), .tbl.shima th:nth-child(5n) {
  width: 55px;
}
@media all and (max-width: 639px) {
  .tbl.shima th:nth-child(2n), .tbl.shima th:nth-child(3n), .tbl.shima th:nth-child(4n), .tbl.shima th:nth-child(5n) {
    width: 20px !important;
  }
}
.tbl.callendar {
  text-align: center;
}
.tbl.callendar th {
  width: 12.5%;
}
.tbl.callendar td {
  width: 12.5%;
}
.tbl th,
.tbl td {
  font-size: 1.2rem !important;
}
@media all and (max-width: 639px) {
  .tbl {
    font-size: 1.1rem !important;
    padding: 5px;
  }
  .tbl th,
.tbl td {
    font-size: 1.1rem !important;
  }
}
.tbl.type01 th {
  width: 35%;
}
.tbl th,
.tbl td {
  padding: 10px;
  vertical-align: middle;
  border: 1px solid #aaa;
}
.tbl th {
  color: #073829;
  background: #18c08d;
}
.tbl th span {
  font-size: 1.4rem;
}
.tbl td.price {
  text-align: right;
  font-size: 1.2em;
  font-weight: 600;
}
.tbl td.price span {
  font-size: 1.1rem;
}
.tbl .cell01 {
  width: 25%;
}
.tbl.type_shima th,
.tbl.type_shima td {
  padding: 10px;
  vertical-align: middle;
  border: 1px solid #ddd;
}
.tbl.type_shima th:first-child {
  width: 20%;
}
.tbl.type_shima th:nth-child(2n) {
  width: 60%;
}
.tbl.type_shima th:last-child {
  width: 20%;
}
.tbl.type_shima td:last-child {
  text-align: center;
}
@media all and (max-width: 639px) {
  .tbl th {
    width: 35%;
    text-align: left;
  }
  .tbl th,
.tbl td {
    padding: 10px;
  }
}

.tbl_fee {
  width: 100%;
  line-height: 1.2;
  margin-bottom: 20px;
  background-color: #fafafa;
  border: 1px solid #ddd;
}
.tbl_fee.type1 {
  background-color: #fff;
  border: 0px solid #333;
  font-weight: bold;
}
.tbl_fee.type1 th,
.tbl_fee.type1 td {
  vertical-align: top;
  padding: 15px 0px;
  border-bottom: 1px solid #333;
  font-weight: bold;
  color: #111;
}
.tbl_fee.type1 td {
  color: #d81e1e;
}
.tbl_fee.type1 tr:nth-child(even) {
  background-color: rgba(238, 238, 238, 0.2);
}
.tbl_fee tr:nth-child(even) {
  background-color: #eee;
}
.tbl_fee th,
.tbl_fee td {
  vertical-align: top;
  padding: 15px 10px;
  border-bottom: 1px solid #ddd;
}
.tbl_fee th span,
.tbl_fee td span {
  font-size: 80%;
}
.tbl_fee th {
  text-align: left;
  font-weight: 500;
}
.tbl_fee td {
  text-align: right;
  font-size: 1.2em;
  font-weight: 600;
}
.tbl_fee td.price {
  color: #073829;
}
.tbl_fee td span {
  font-size: 1.1rem;
}

.tbl_price_calc {
  width: 100%;
}
.tbl_price_calc th,
.tbl_price_calc td {
  font-size: 1.4rem;
  padding: 15px;
  vertical-align: middle;
  line-height: 1.5;
  font-weight: bold;
  text-align: center;
}
.tbl_price_calc th span.price,
.tbl_price_calc td span.price {
  font-size: 2rem;
  color: #073829;
}
@media all and (max-width: 639px) {
  .tbl_price_calc th span.price,
.tbl_price_calc td span.price {
    font-size: 1.4rem;
  }
}
.tbl_price_calc th .small,
.tbl_price_calc td .small {
  font-weight: normal;
}
.tbl_price_calc th {
  background: rgba(7, 56, 41, 0.1);
  border: 2px solid #073829;
}
.tbl_price_calc td {
  background-color: #eff4dd;
}
.tbl_price_calc .th-1 {
  background-color: #fff !important;
  padding: 5px;
  font-weight: 3.2rem;
}
@media all and (max-width: 639px) {
  .tbl_price_calc th,
.tbl_price_calc td {
    padding: 10px 5px;
    font-size: 10px;
  }
  .tbl_price_calc th span,
.tbl_price_calc td span {
    font-size: 10px;
  }
}

.tbl_price_kaigo {
  width: 100%;
}
.tbl_price_kaigo th,
.tbl_price_kaigo td {
  padding: 15px;
  vertical-align: middle;
  font-size: 1.4rem;
  line-height: 1.5;
  font-weight: bold;
  text-align: center;
  border: 1px solid #fff;
}
.tbl_price_kaigo th .small,
.tbl_price_kaigo td .small {
  font-weight: normal;
}
.tbl_price_kaigo tr {
  background-color: #e1edc5;
}
.tbl_price_kaigo tr:nth-child(even) td {
  background-color: #e1edc5;
}
.tbl_price_kaigo th {
  background: #c1db80;
}
.tbl_price_kaigo td {
  background-color: #eff4dd;
}
.tbl_price_kaigo .th-1 {
  background-color: #fff !important;
  padding: 5px;
}
@media all and (max-width: 639px) {
  .tbl_price_kaigo th,
.tbl_price_kaigo td {
    padding: 10px 5px;
    font-size: 10px;
  }
  .tbl_price_kaigo th span,
.tbl_price_kaigo td span {
    font-size: 10px;
  }
}

.tbl_new {
  width: 100%;
}
.tbl_new tr th,
.tbl_new tr td {
  vertical-align: middle;
  padding: 15px 10px;
}
.tbl_new tr th {
  font-weight: 600;
  width: 20%;
  color: #073829;
  text-align: left;
  padding-left: 30px;
  letter-spacing: 0;
}
@media all and (max-width: 639px) {
  .tbl_new tr th {
    padding-left: 10px;
  }
}
.tbl_new tr:nth-child(odd) th, .tbl_new tr:nth-child(odd) td {
  background: #f0f0f0;
}

.tbl_new2 {
  width: 100%;
}
.tbl_new2 tr th,
.tbl_new2 tr td {
  vertical-align: middle;
  padding: 15px 10px;
  border: 1px solid #d4d4d4;
}
.tbl_new2 tr th {
  width: 80%;
}
.tbl_new2 tr td {
  width: 20%;
}
.tbl_new2 tr th {
  font-weight: 700;
}
.tbl_new2 tr th span {
  font-size: 1.4rem;
}
@media all and (max-width: 639px) {
  .tbl_new2 tr th span {
    font-size: 1.2rem;
  }
}

.tbl_border {
  width: 100%;
}
.tbl_border .t-right {
  text-align: right;
}
.tbl_border th,
.tbl_border td {
  padding: 15px;
  border-bottom: 2px solid #dddddd;
  vertical-align: middle;
}
.tbl_border th.type1,
.tbl_border td.type1 {
  width: 190px;
}
@media all and (max-width: 639px) {
  .tbl_border th.type1,
.tbl_border td.type1 {
    width: 150px;
  }
}
.tbl_border th.b-no,
.tbl_border td.b-no {
  padding-bottom: 0;
  border-bottom: none;
}
.tbl_border th.tm-no,
.tbl_border td.tm-no {
  padding-top: 0;
}
@media all and (max-width: 639px) {
  .tbl_border th,
.tbl_border td {
    padding: 10px;
    font-size: 1.2rem;
  }
}
.tbl_border th {
  width: 25%;
  text-align: left;
  font-weight: 600;
  border-bottom-color: #073829;
}
.tbl_border th.th-1 {
  width: 45%;
}
.tbl_color {
  width: 100%;
  background-color: rgba(7, 56, 41, 0.1);
}
.tbl_color .t-right {
  text-align: right;
}
.tbl_color.bar td {
  padding: 25px;
  border-right: 3px solid #fff;
}
.tbl_color.black {
  background-color: rgba(17, 17, 17, 0.1);
}
.tbl_color.black th,
.tbl_color.black td {
  border-bottom: 3px solid rgba(255, 255, 255, 0);
}
.tbl_color.black th {
  background-color: rgba(17, 17, 17, 0.6);
  border-right: 3px solid rgba(255, 255, 255, 0);
}
.tbl_color.black tr:nth-child(2n) {
  background-color: rgba(17, 17, 17, 0.05);
}
.tbl_color.black tr:nth-child(2n) th {
  background-color: rgba(17, 17, 17, 0.9);
}
.tbl_color.black tr:hover {
  background-color: rgba(17, 17, 17, 0.12);
  transition: 0.2s;
}
.tbl_color.black tr:hover th {
  background-color: rgba(17, 17, 17, 0.62);
}
.tbl_color tr:nth-child(2n) {
  background-color: rgba(7, 56, 41, 0.05);
}
.tbl_color tr:nth-child(2n) th {
  background-color: rgba(7, 56, 41, 0.9);
}
.tbl_color tr:hover {
  background-color: rgba(7, 56, 41, 0.12);
  transition: 0.2s;
}
.tbl_color tr:hover th {
  background-color: rgba(7, 56, 41, 0.92);
}
.tbl_color th,
.tbl_color td {
  padding: 25px;
  border-bottom: 3px solid #fff;
  vertical-align: middle;
}
.tbl_color th.type1,
.tbl_color td.type1 {
  width: 190px;
}
@media all and (max-width: 639px) {
  .tbl_color th.type1,
.tbl_color td.type1 {
    width: 150px;
  }
}
.tbl_color th.b-no,
.tbl_color td.b-no {
  padding-bottom: 0;
  border-bottom: none;
}
.tbl_color th.tm-no,
.tbl_color td.tm-no {
  padding-top: 0;
}
@media all and (max-width: 639px) {
  .tbl_color th,
.tbl_color td {
    padding: 10px;
    font-size: 1.2rem;
  }
}
.tbl_color th {
  width: 25%;
  background-color: rgba(7, 56, 41, 0.8);
  color: #fff;
  text-align: left;
  font-weight: 600;
  border-right: 3px solid #fff;
}
.tbl_color th.th-1 {
  width: 45%;
}
.tbl_flow {
  width: 100%;
  background-color: rgba(7, 56, 41, 0.1);
  /* 
  tr {
    &:nth-child(2n) {
      background-color: rgba($base_color, 0.05);

      th {
        background-color: rgba($base_color, 0.9);
      }
    }

    &:hover {
      background-color: rgba($base_color, 0.12);
      transition: 0.2s;

      th {
        background-color: rgba($base_color, 0.92);
      }
    }
  } */
}
.tbl_flow tr td {
  background: #fdeff4;
}
.tbl_flow tr td:nth-child(2n) {
  background: #fffdeb;
  font-weight: bold;
}
.tbl_flow tr td:nth-child(3n) {
  background: #dbf1fc;
}
.tbl_flow tr th {
  background: #fdeff4;
}
.tbl_flow tr th:nth-child(2n) {
  background: #fffdeb;
  font-weight: bold;
}
.tbl_flow tr th:nth-child(3n) {
  background: #dbf1fc;
}
.tbl_flow .t-right {
  text-align: right;
}
.tbl_flow.bar td {
  padding: 25px;
  border-right: 3px solid #fff;
}
.tbl_flow th,
.tbl_flow td {
  padding: 25px;
  border-bottom: 1px solid #333;
  vertical-align: middle;
}
@media all and (max-width: 639px) {
  .tbl_flow th,
.tbl_flow td {
    padding: 5px;
    font-size: 1rem;
  }
}
.tbl_flow th {
  width: 33.33%;
  font-weight: 600;
}
@media all and (max-width: 639px) {
  .tbl_flow th {
    padding: 15px 5px;
  }
}
.tbl_flow th.th-1 {
  width: 45%;
}
.tbl_company {
  width: 100%;
  border-collapse: separate;
  border-spacing: 0 5px;
}
.tbl_company th,
.tbl_company td {
  padding: 10px 10px;
  vertical-align: middle;
}
.tbl_company th {
  text-align: left;
  width: 25%;
  position: relative;
  background: #073829;
  color: #fff;
  font-weight: 600;
}
.tbl_company th::after {
  left: 100%;
  top: 50%;
  border: solid transparent;
  content: " ";
  height: 0;
  width: 0;
  position: absolute;
  pointer-events: none;
  border-color: #f9f9f9;
  border-width: 10px;
  border-left-color: #073829;
  margin-top: -10px;
}
.tbl_company td {
  background: #f9f9f9;
  padding-left: 20px;
}

.tbl0 {
  width: 100%;
}
.tbl0 th,
.tbl0 td {
  padding: 3px 5px;
  border: 0;
}
.tbl0 th {
  padding-left: 0;
  font-weight: normal;
  background: none;
  width: 25%;
  color: #111;
}
.tbl0 th:after, .tbl0 th:before {
  display: none;
}
@media all and (max-width: 639px) {
  .tbl0 th {
    width: 40%;
  }
}

.tbl_time {
  /*   thead th:last-child,
  tbody td:last-child {
    width: 12%;
    text-align: left;
  } */
}
.tbl_time .box {
  background: #fff;
  padding: 15px 0px;
  margin-bottom: 10px;
  border: 1px solid #ddd;
}
.tbl_time.blue .box {
  background: rgba(41, 126, 222, 0.1);
}
.tbl_time.blue tbody td {
  color: #297ede;
}
.tbl_time.white table {
  color: #fff;
}
.tbl_time.white thead th {
  font-weight: normal;
  line-height: 1.5;
  padding: 18px 0 9px;
  background-color: #fff;
  color: #073829;
  border-bottom: 1px solid #fff;
  text-align: center;
}
.tbl_time.white th,
.tbl_time.white td {
  padding: 15px 2px;
  color: #fff;
}
.tbl_time.white tr {
  border-bottom: 1px solid #fff;
}
.tbl_time table {
  color: #333;
}
.tbl_time th {
  font-weight: 500;
  font-weight: 500;
}
.tbl_time tbody td {
  color: #073829;
}
.tbl_time table {
  width: 100%;
  max-width: 550px;
  margin: 0 auto;
}
.tbl_time.day8 table {
  max-width: 470px;
}
.tbl_time thead th {
  font-weight: normal;
  line-height: 1.5;
  padding: 9px 0 9px;
  border-bottom: 1px solid #aaa;
  text-align: center;
}
.tbl_time thead th:first-child {
  width: 36%;
}
.tbl_time tbody th {
  width: 36%;
  text-align: center;
}
.tbl_time.day8 thead th:first-child,
.tbl_time.day8 tbody th {
  width: 33%;
}
.tbl_time tbody th,
.tbl_time tbody td {
  padding: 4px 0;
  line-height: 1.5;
}
.tbl_time tbody th {
  font-weight: normal;
  padding-right: 13px;
}
.tbl_time thead th:not(:first-child),
.tbl_time tbody td {
  width: 8.1666666667%;
  text-align: left;
}
.tbl_time.day8 tbody th {
  padding-right: 10px;
}
.tbl_time.day8 thead th:not(:first-child),
.tbl_time.day8 tbody td {
  width: 7.5714285714%;
}
.tbl_time.day8 thead th:last-child,
.tbl_time.day8 tbody td:last-child {
  width: 11%;
}
.tbl_time tbody td {
  font-size: 77.78%;
  padding-left: 0.05em;
}
.tbl_time tbody tr:first-child th {
  padding-left: 0.6em;
}

.tbl_sinple {
  margin: 32px 0;
  background: #fff;
  font-size: 90%;
  width: 100%;
}
.tbl_sinple.type_s th {
  padding: 5px 8px;
  width: 80px;
  font-size: 1.2rem;
}
.tbl_sinple.type_s td {
  font-size: 1.2rem;
}
.tbl_sinple th {
  text-align: left;
  vertical-align: middle;
  padding: 16px 8px;
  font-weight: normal;
  line-height: 1.5;
  border-top: #888 1px solid;
  border-left: #888 0px solid;
  border-right: #888 0px solid;
  border-bottom: #888 1px solid;
  color: #333;
  width: 25%;
}
@media all and (max-width: 639px) {
  .tbl_sinple th {
    width: 35%;
  }
}
.tbl_sinple td {
  padding: 5px 10px;
  vertical-align: middle;
  border-top: #888 1px solid;
  border-bottom: #888 1px solid;
  border-left: #888 0px solid;
  border-right: #888 0px solid;
}
.tbl_sinple td b {
  color: #d81e1e;
}

.timetable {
  width: 100%;
}
.timetable.type1 {
  border-top: none;
}
.timetable.type1 th,
.timetable.type1 td {
  border: none;
}
.timetable th,
.timetable td {
  border-bottom: 1px solid rgba(7, 56, 41, 0.3);
  padding: 20px 5px;
  text-align: center;
  vertical-align: middle;
  line-height: 1.4;
  font-weight: normal;
}
.timetable th .txt,
.timetable td .txt {
  letter-spacing: 0;
  font-size: 12px;
}
@media all and (max-width: 639px) {
  .timetable th,
.timetable td {
    font-size: 12px;
  }
}
.timetable thead tr {
  background: rgba(7, 56, 41, 0.3);
}
.timetable .th-1 {
  width: 35%;
  text-align: center;
  ont-weight: normal;
}
.timetable .circle {
  color: #68482A;
}
.timetable .circle.type-brown {
  color: #073829;
}
.timetable .triangle {
  color: #0083de;
}
@media all and (max-width: 639px) {
  .timetable {
    padding: 15px 10px;
  }
  .timetable .th-1 {
    width: 25%;
  }
}
.timetable.type2 .circle {
  color: #073829;
}

.news_list.type1 > li {
  box-shadow: rgba(170, 170, 170, 0) 0 0 5px 5px;
  background-color: #fff;
  border-bottom: 1px solid #eee;
}
.news_list.type1 > li .data {
  color: #333;
  background-color: inherit;
  border-right: 1px solid #aaa;
  padding: 1px 8px;
  margin-right: 8px;
}
@media all and (max-width: 639px) {
  .news_list.type1 > li .data {
    margin-right: 0px;
    border-right: 0px solid #aaa;
  }
}
.news_list > li {
  display: flex;
  flex-wrap: wrap;
  align-items: flex-start;
  justify-content: center;
  padding: 16px;
  font-size: 1.2rem;
  position: relative;
  box-shadow: rgba(170, 170, 170, 0.2) 0 0 5px 5px;
  background-color: #fff;
}
.news_list > li a {
  position: absolute;
  width: 100%;
  height: 100%;
  top: 0;
  left: 0;
  z-index: 1;
}
.news_list > li a:hover {
  background-color: rgba(242, 242, 242, 0.4);
}
.news_list > li:after {
  font-family: "Font Awesome 5 Free";
  content: "\f105";
  font-weight: 900;
  position: absolute;
  top: 0;
  right: 15px;
  height: 100%;
  display: grid;
  place-items: center;
  transition: all 0.3s 0s ease;
  color: #073829;
}
@media all and (max-width: 639px) {
  .news_list > li:after {
    top: -7px;
    place-items: end;
  }
}
.news_list > li:after:after {
  right: 10px;
}
.news_list > li:hover:after {
  right: 10px;
}
.news_list > li:not(:last-of-type) {
  margin-bottom: 15px;
}
.news_list > li .data {
  color: #fff;
  padding: 1px 16px;
  min-width: 120px;
  background-color: #073829;
  text-align: center;
}
.news_list > li .tag {
  color: #073829;
  background-color: #eee;
  border: 1px solid #eee;
  padding: 0px 16px;
  margin-left: 5px;
  min-width: 120px;
  text-align: center;
  /*background: #111;*/
}
.news_list > li .txt {
  flex: 1;
  margin: 0;
  padding: 4px 0 0 10px;
  line-height: 1.4;
}
@media all and (max-width: 896px) {
  .news_list > li .data {
    display: inline-block;
    padding: 3px 6px;
    margin-left: 0;
  }
  .news_list > li .tag {
    padding: 2px 6px;
    margin-left: 8px;
  }
  .news_list > li .txt {
    flex: 100;
    margin: 5px 0 0;
    width: 100%;
    display: block;
    font-size: 1.2rem;
  }
}
@media all and (max-width: 639px) {
  .news_list > li {
    padding: 4px;
    justify-content: space-between;
  }
  .news_list > li .data {
    width: 49%;
    padding: 1px 6px;
    text-align: center;
  }
  .news_list > li .tag {
    width: 49%;
    padding: 1px 6px 0px;
    margin-left: 4px;
  }
  .news_list > li .txt {
    padding: 8px 0;
    margin-left: 4px;
    flex: none;
  }
}

.list_amenity li {
  width: calc(100% - 0px);
  height: calc(100% - 1px);
  padding: 0 0 0 8px;
  background-color: #f2f2f2;
  display: flex;
  justify-content: space-between;
  align-items: center;
}
.list_amenity span {
  background: #fafafa;
  width: 40px;
  padding: 5px 0;
  text-align: center;
}

.list_grd li {
  align-items: center;
  padding: 16px 0.5em;
  margin-right: 0.5em;
  margin-bottom: 0.5em;
  font-weight: bold;
  line-height: 1.3;
  color: #999;
  background: white;
  border-left: solid 6px #d1cab6;
  box-shadow: 2px 2px 6px #aaa inset;
  transform: skewX(-5deg);
  font-size: 1.8rem;
}
.list_grd li span {
  font-size: 1.6rem;
}
@media all and (max-width: 639px) {
  .list_grd li {
    font-size: 1.3rem;
  }
  .list_grd li span {
    font-size: 1rem;
  }
}

.list_common li {
  padding-bottom: 5px;
  padding-left: 1rem;
  margin-bottom: 5px;
  border-bottom: 1px dotted #cccccc;
}
.list_common li:last-child {
  padding-bottom: 0;
  margin-bottom: 0;
  border-bottom: none;
}

.list-policy {
  background: rgba(255, 255, 255, 0.7);
  padding: 25px;
  margin-bottom: 40px;
}
.list-policy li {
  font-family: "YakuHanJP", Lato, "游ゴシック Medium", "游ゴシック体", "Yu Gothic Medium", YuGothic, "ヒラギノ角ゴ ProN", "Hiragino Kaku Gothic ProN", "メイリオ", Meiryo, "ＭＳ Ｐゴシック", "MS PGothic", sans-serif;
  font-size: 2rem;
  padding-bottom: 5px;
  margin-bottom: 6px;
  font-weight: 600;
}
.list-policy li:before {
  content: "一、";
  margin-right: 7px;
  color: #073829;
}
@media all and (max-width: 639px) {
  .list-policy {
    padding: 15px;
  }
  .list-policy li {
    font-size: 1.4rem;
  }
}

.list_check.sub li:before {
  color: #68482A;
}
.list_check li {
  padding: 8px;
  font-weight: 600;
}
.list_check li:before {
  font-family: "Font Awesome 5 Free";
  content: "\f058";
  font-weight: 900;
  margin-right: 8px;
  color: #073829;
}
.list_check li:not(:last-child) {
  margin-bottom: 4px;
  border-bottom: 1px solid #ccc;
}

.list-inline2 {
  text-align: center;
  margin: 10px auto;
}
.list-inline2 li {
  display: inline-block;
  padding: 4px 15px;
  background: #fefefe;
  border: 1px solid #dddddd;
  font-weight: 600;
  border-radius: 30px;
}
.list-inline2 li:not(:last-child) {
  margin-right: 8px;
}
@media all and (max-width: 639px) {
  .list-inline2 {
    display: grid;
    grid-template-columns: repeat(2, 1fr);
    gap: 10px;
  }
  .list-inline2 li:not(:last-child) {
    margin-right: 0px;
  }
}

.list-inline li {
  display: inline-block;
  padding: 3px;
}
.list-inline li:not(:last-of-type):after {
  content: "/";
  margin: 0 5px;
  color: #073829;
  font-weight: normal;
}
@media all and (max-width: 639px) {
  .list-inline li {
    display: block;
    padding: 0;
  }
  .list-inline li:before {
    content: "-";
    color: #073829;
  }
  .list-inline li:not(:last-of-type):after {
    display: none;
  }
}

.ol-list {
  counter-reset: number;
  list-style: none;
  padding: 5px;
}
.ol-list.white li {
  color: #fff;
}
.ol-list.white li:before {
  color: #fff;
  border-left: #f2f2f2;
  border-top: #f2f2f2;
}
.ol-list.type2 {
  display: flex;
  flex-wrap: wrap;
}
.ol-list.type2 > li {
  width: 48%;
  border-bottom: 1px solid #aaa;
}
.ol-list.type2 > li:nth-child(2n) {
  margin-left: 4%;
}
@media all and (max-width: 639px) {
  .ol-list.type2 > li {
    width: 100%;
  }
  .ol-list.type2 > li:nth-child(2n) {
    margin-left: 0%;
  }
}
.ol-list.type2 > li:before {
  counter-increment: number;
  content: counter(number);
  background: rgba(7, 56, 41, 0.1);
  display: inline-block;
  width: 2em;
  height: 2em;
  text-align: center;
  font-family: "YakuHanJP", Lato, "游ゴシック Medium", "游ゴシック体", "Yu Gothic Medium", YuGothic, "ヒラギノ角ゴ ProN", "Hiragino Kaku Gothic ProN", "メイリオ", Meiryo, "ＭＳ Ｐゴシック", "MS PGothic", sans-serif;
  font-size: 2rem;
  color: #073829;
  margin-right: 20px;
  border-left: 1px solid #073829;
  border-top: 1px solid #073829;
  border-radius: 0%;
}
.ol-list.type1 {
  display: flex;
  flex-wrap: wrap;
}
.ol-list.type1 > li {
  width: 48%;
}
.ol-list.type1 > li:nth-child(2n) {
  margin-left: 4%;
}
.ol-list li {
  line-height: 1.8em;
  padding: 0 0 8px 2.5em;
  margin-bottom: 5px;
  border-bottom: 1px solid #ccc;
  position: relative;
}
.ol-list li span {
  font-weight: normal;
  padding: 10px;
  line-height: 1.6;
  font-size: 80%;
}
.ol-list li:before {
  counter-increment: number;
  content: counter(number);
  background: rgba(7, 56, 41, 0.6);
  color: #073829;
  position: absolute;
  top: 0;
  left: 0;
  width: 30px;
  height: 30px;
  text-align: center;
  font-family: "YakuHanJP", Lato, "游ゴシック Medium", "游ゴシック体", "Yu Gothic Medium", YuGothic, "ヒラギノ角ゴ ProN", "Hiragino Kaku Gothic ProN", "メイリオ", Meiryo, "ＭＳ Ｐゴシック", "MS PGothic", sans-serif;
  color: #fff;
  margin-right: 10px;
  border-radius: 100%;
}
@media all and (max-width: 639px) {
  .ol-list li span {
    font-size: 0.9em;
  }
}

.list_disc {
  margin: 15px 0;
}
.list_disc.black li:before {
  content: "●";
  color: #aaa;
}
.list_disc.sub li:before {
  content: "●";
  color: #68482A;
}
.list_disc li {
  position: relative;
  line-height: 1.8em;
  padding-left: 1.5em;
  margin-bottom: 5px;
  border-bottom: 1px solid #ccc;
}
.list_disc li:last-of-type {
  margin-bottom: 0;
}
.list_disc li:before {
  content: "●";
  color: #073829;
  position: absolute;
  top: 0;
  left: 0;
}

.list-btn {
  display: flex;
  flex-wrap: wrap;
}
.list-btn li {
  width: 32%;
  margin: 0 1.995% 10px 0;
}
.list-btn li a {
  display: block;
  background: #0083de;
  font-weight: 600;
  padding: 20px 3px;
  text-align: center;
  width: 100%;
  height: 100%;
  line-height: 1.5;
  font-size: 1.8rem;
  letter-spacing: 0;
  color: #fff;
}
.list-btn li a:after {
  font-family: "Font Awesome 5 Free";
  content: "\f358";
  font-weight: 900;
  margin-left: 5px;
}
.list-btn li:nth-child(2) a {
  background: #68482A;
}
.list-btn li:nth-child(3) a {
  background: #8fb8c9;
}
.list-btn li:nth-child(3n) {
  margin-right: 0;
}
@media all and (max-width: 639px) {
  .list-btn li {
    width: 90%;
    margin: 0 auto 10px;
  }
  .list-btn li a {
    font-size: 1.2rem;
  }
  .list-btn li:nth-child(3n) {
    margin-right: auto;
  }
}
.list-btn.type1 {
  max-width: 1000px;
  margin: 0 auto 20px;
  justify-content: center;
}
.list-btn.type1 li a {
  background: #1fa33a;
  border: 1px solid #010b08;
}
.list-btn.type1 li a:hover {
  background: #27ce49;
}
.list-btn.type1 li a:before {
  font-family: "Font Awesome 5 Free";
  content: "\f13a";
  font-weight: 900;
  margin-right: 5px;
}

.list-archive-wrapp {
  display: flex;
  flex-wrap: wrap;
}
.list-archive-wrapp .list-archivebox {
  width: 48%;
}
.list-archive-wrapp .list-archivebox .mtitle_sub {
  margin-top: 0;
}
@media all and (max-width: 1100px) {
  .list-archive-wrapp .list-archivebox {
    width: 100%;
  }
  .list-archive-wrapp .list-archivebox:last-child {
    margin-top: 40px;
  }
}

.list-archive li {
  width: 100%;
  font-size: 1.4rem;
  padding-bottom: 2px;
  margin-bottom: 10px;
}
.list-archive li .date {
  display: inline-block;
  font-size: 1.2rem;
  color: #fff;
  background-color: #68482A;
  padding: 4px 6px;
  margin: 0 20px;
  width: 100px;
  text-align: center;
}
@media all and (max-width: 639px) {
  .list-archive li .date {
    display: block;
  }
}
@media all and (max-width: 639px) {
  .list-archive li .link {
    display: block;
    margin: 0 20px;
  }
}
.list-archive li a:hover {
  border-bottom: 1px solid #073829;
}

.list2 {
  display: flex;
  flex-wrap: wrap;
  max-width: 1600px;
  margin-left: auto;
  margin-right: auto;
}
.list2.gap {
  gap: 10px 10px;
}
.list2.gap > li,
.list2.gap .child {
  width: calc(50% - 10px);
}
@media all and (max-width: 639px) {
  .list2.gap > li,
.list2.gap .child {
    width: 100%;
  }
}
.list2.type1 > li,
.list2.type1 .child {
  background: #fefefe;
  padding: 15px;
}
@media all and (max-width: 639px) {
  .list2.type2 > li {
    width: 100%;
    margin: 0 auto 0;
  }
  .list2.type2 > li:nth-child(2) {
    margin-top: 30px;
  }
}
.list2 > li,
.list2 .child {
  width: 50%;
  position: relative;
}
.list2 > li .mtitle_circle,
.list2 .child .mtitle_circle {
  position: absolute;
  top: -20px;
  left: -20px;
}
.list2 > li:nth-child(2n),
.list2 .child:nth-child(2n) {
  /* margin-left: 4%; */
}
@media all and (max-width: 639px) {
  .list2 > li:nth-child(2n),
.list2 .child:nth-child(2n) {
    margin-left: auto;
  }
}
@media all and (max-width: 639px) {
  .list2 > li,
.list2 .child {
    width: 100%;
    margin: 25px auto 0;
  }
}
.list2 .child2 {
  width: 34%;
  margin-top: 50px;
}
.list2 .child2:nth-child(2n) {
  margin-left: 4%;
}
@media all and (max-width: 639px) {
  .list2 .child2:nth-child(2n) {
    margin-left: auto;
  }
}
@media all and (max-width: 639px) {
  .list2 .child2 {
    width: 100%;
    margin: 25px auto 0;
  }
}

.list3 {
  display: flex;
  flex-wrap: wrap;
  justify-content: center;
}
.list3 > li {
  width: 30% !important;
  position: relative;
  margin: 1%;
}
@media all and (max-width: 896px) {
  .list3 > li {
    width: 100% !important;
    margin: 0 auto 20px;
  }
}
@media all and (max-width: 639px) {
  .list3.res_none {
    display: flex !important;
  }
  .list3.res_none > li {
    width: 31% !important;
  }
}

.list4 {
  display: flex;
  flex-wrap: wrap;
}
.list4 li {
  width: 24%;
  margin: 0 1.3333333333% 25px 0;
  position: relative;
}
.list4 li:nth-child(4n) {
  margin-right: 0;
}
.list4 li .mtitle_circle {
  position: absolute;
  top: -20px;
  left: -20px;
}

.list5 {
  display: flex;
  flex-wrap: wrap;
  justify-content: center;
}
.list5 li {
  width: 19%;
  margin: 0.5%;
  position: relative;
}
@media all and (max-width: 639px) {
  .list5 li {
    width: 49%;
  }
}

.list_kome > li {
  position: relative;
  line-height: 1.8em;
  padding-left: 1.5em;
  margin-bottom: 5px;
}
.list_kome > li:last-of-type {
  margin-bottom: 0;
}
.list_kome > li:before {
  content: "※";
  position: absolute;
  top: 0;
  left: 0;
}

.list_num li {
  margin-bottom: 10px;
}
.list_num li .num {
  color: #fff;
  background-color: #073829;
  font-size: 2rem;
  padding: 4px 10px;
}
.list_num li .txt {
  padding-left: 10px;
}
.list_num.type2 li {
  font-weight: bold;
}
.list_num.type2 li .num {
  background-color: #256cd6;
}

.list_link_btn01 {
  display: flex;
  margin: 10px auto;
  transition: all 0.3s 0s ease;
  max-width: 900px;
  font-weight: bold;
  align-items: center;
  text-align: center;
  justify-content: center;
  flex-wrap: wrap;
  gap: 10px 10px;
}
@media all and (max-width: 639px) {
  .list_link_btn01 {
    display: grid;
    grid-template-columns: repeat(2, 1fr);
  }
}
.list_link_btn01 li {
  padding: 3px 35px 3px 25px;
  font-size: 1.4rem;
  font-weight: normal;
  display: table-cell;
  position: relative;
  background-color: #fff;
  color: #073829;
  border: 1px solid #073829;
  border-radius: 30px;
}
.list_link_btn01 li:after {
  font-family: "Font Awesome 5 Free";
  content: "\f105";
  font-weight: 900;
  position: absolute;
  top: 0;
  right: 15px;
  height: 100%;
  display: grid;
  place-items: center;
  transition: all 0.3s 0s ease;
  color: #073829;
}
.list_link_btn01 li:after:after {
  right: 10px;
  color: #fff;
}
@media all and (max-width: 639px) {
  .list_link_btn01 li {
    width: 100%;
    padding: 5px 5px 5px 5px;
    display: block;
    font-size: 0.9rem;
  }
}
.list_link_btn01 li a {
  position: absolute;
  width: 100%;
  height: 100%;
  top: 0;
  left: 0;
  z-index: 1;
}
.list_link_btn01 li:hover {
  background-color: #073829;
  color: #fff;
}
.list_link_btn01 li:hover:after {
  right: 10px;
  color: #fff;
}
.list_link_btn01.type1 {
  margin: 0px auto;
  display: block;
  text-align: left;
}
.list_link_btn01.type1 li {
  border: 0px;
  border-radius: 0;
  border-bottom: 1px dotted #aaa;
  display: block;
  padding: 5px 2px;
}
.list_link_btn01.type1 li:before {
  content: "●";
  margin-right: 5px;
  color: #68482A;
}

.list_link_btn02 {
  margin: 10px auto;
}
.list_link_btn02 li {
  padding: 8px 0;
  font-size: 1.5rem;
  font-weight: normal;
  display: table-cell;
  position: relative;
  background-color: #e9b9af;
  color: #073829;
  text-align: center;
}
.list_link_btn02 li:first-child {
  display: none;
}
@media all and (max-width: 639px) {
  .list_link_btn02 li {
    width: 100%;
    padding: 5px 5px 5px 5px;
    display: block;
    font-size: 1.2rem;
  }
  .list_link_btn02 li:first-child {
    display: block;
  }
}
.list_link_btn02 li a {
  position: absolute;
  width: 100%;
  height: 100%;
  top: 0;
  left: 0;
  z-index: 1;
}
.list_link_btn02 li:hover {
  background-color: #073829;
  color: #fff;
}
.list_link_btn02 li:hover:after {
  right: 10px;
  color: #fff;
}
.list_link_btn02.type1 {
  margin: 0px auto;
  display: block;
  text-align: left;
}
.list_link_btn02.type1 li {
  border: 0px;
  border-radius: 0;
  border-bottom: 1px dotted #aaa;
  display: block;
  padding: 5px 2px;
}
.list_link_btn02.type1 li:before {
  content: "●";
  margin-right: 5px;
  color: #68482A;
}

.list_check3.type1 {
  display: flex;
  flex-wrap: wrap;
}
.list_check3.type1 li {
  padding: 4px 12px;
  width: 49%;
  border-radius: 10px;
  font-size: 1.2rem;
  background-color: #f2f2f2;
  margin-right: 1%;
}
.list_check3.type1 li:nth-child(4n) {
  margin-right: 0;
}
@media all and (max-width: 639px) {
  .list_check3.type1 li {
    width: 100%;
    margin: 0 auto 5px;
    margin-right: 0;
  }
  .list_check3.type1 li:nth-child(4n) {
    margin-right: 0;
  }
}
.list_check3 li {
  padding: 8px;
  font-weight: 700;
  margin-bottom: 5px;
}
.list_check3 li span {
  font-weight: normal;
  font-size: 0.9em;
  display: block;
  padding: 10px;
  background: rgba(246, 240, 223, 0.2);
  margin-top: 10px;
}
.list_check3 li a {
  color: #073829;
  border-bottom: 1px dotted #073829;
}
.list_check3 li:before {
  font-family: "Font Awesome 5 Free";
  content: "\f054";
  font-weight: 900;
  margin-right: 10px;
  color: #073829;
}
@media all and (max-width: 639px) {
  .list_check3 li {
    width: 98%;
    margin: 0 auto 10px;
    font-size: 1.2rem;
  }
}

.flow_tr {
  display: grid;
  max-width: 90%;
  grid-template-columns: repeat(17, 1fr);
  gap: 2%;
  margin: 30px auto;
}
@media all and (max-width: 896px) {
  .flow_tr {
    display: block;
    max-width: 100%;
  }
}
.flow_tr li {
  position: relative;
  max-height: 260px;
}
.flow_tr li .figure {
  padding: 10px 5px;
  border-radius: 3px;
  -ms-writing-mode: tb-rl;
  writing-mode: vertical-rl;
  margin: 0 auto;
  color: #fff;
  background-color: rgba(7, 56, 41, 0.7);
  overflow: hidden;
  font-weight: bold;
  line-height: 1.2;
  font-size: 1.4rem;
  height: 100%;
}
.flow_tr li .figure img {
  width: 100%;
  height: 100%;
  -o-object-fit: cover;
     object-fit: cover;
}
@media all and (max-width: 896px) {
  .flow_tr li .figure {
    font-size: 1.2rem;
    -ms-writing-mode: inherit;
    writing-mode: inherit;
    text-align: center;
  }
}
.flow_tr li .txt {
  font-size: 1.2rem;
  margin-top: 10px;
}
.flow_tr li:after {
  font-family: "Font Awesome 5 Free";
  content: "\f105";
  font-weight: 900;
  position: absolute;
  top: 0;
  bottom: 0;
  right: -37%;
  margin: auto 0;
  display: grid;
  place-items: center;
  color: #68482A;
  font-size: 1.8rem;
}
@media all and (max-width: 896px) {
  .flow_tr li:after {
    font-family: "Font Awesome 5 Free";
    content: "\f107";
    font-weight: 900;
    top: 25px;
    right: 0;
    left: 0;
    font-size: 2rem;
  }
}
.flow_tr li:first-child .figure {
  background-color: #073829;
}
.flow_tr li:last-child .figure {
  background-color: #073829;
}
.flow_tr li:last-child:after {
  content: none;
}
@media all and (max-width: 896px) {
  .flow_tr li {
    margin-bottom: 21px;
  }
}

.cursol_icon {
  position: relative;
}
.cursol_icon:after {
  font-family: "Font Awesome 5 Free";
  content: "\f0da";
  font-weight: 900;
  position: absolute;
  top: 35%;
  right: -44px;
  margin: auto;
  display: grid;
  place-items: center;
  color: #073829;
  font-size: 6rem;
}
@media all and (max-width: 896px) {
  .cursol_icon:after {
    right: -44px;
  }
}

.flow_circle {
  display: grid;
  max-width: 90%;
  grid-template-columns: repeat(4, 1fr);
  gap: 6%;
  margin: 30px auto;
}
@media all and (max-width: 896px) {
  .flow_circle {
    grid-template-columns: repeat(3, 1fr);
    max-width: 100%;
    margin: 60px auto;
  }
}
@media all and (max-width: 639px) {
  .flow_circle {
    grid-template-columns: repeat(2, 1fr);
    gap: 20px 6%;
  }
}
.flow_circle li {
  position: relative;
}
@media all and (max-width: 639px) {
  .flow_circle li {
    width: 90%;
  }
}
.flow_circle li .ttl {
  text-align: center;
  margin: 20px auto 0;
  font-weight: 600;
  position: relative;
  font-size: 1.2rem;
  background: #fff;
  border: 1px solid #68482A;
  border-bottom: 3px solid #68482A;
  padding: 6px 4px;
  border-radius: 40px;
}
.flow_circle li .ttl:before {
  position: absolute;
  content: "";
  left: 50%;
  top: -40px;
  width: 1px;
  height: 35px;
  background: #68482A;
}
@media all and (max-width: 639px) {
  .flow_circle li .ttl {
    font-size: 1.1rem;
  }
}
.flow_circle li .figure {
  width: 160px;
  height: 160px;
  margin: 0 auto;
  color: #fff;
  border-radius: 50%;
  background-color: rgba(7, 56, 41, 0);
  border: 2px solid #073829;
  overflow: hidden;
  display: grid;
  place-items: center;
  text-align: center;
  font-weight: bold;
  line-height: 1.2;
  font-size: 1.6rem;
}
.flow_circle li .figure img {
  width: 100%;
  height: 100%;
  -o-object-fit: cover;
     object-fit: cover;
}
@media all and (max-width: 896px) {
  .flow_circle li .figure {
    height: 19vw;
  }
}
@media all and (max-width: 639px) {
  .flow_circle li .figure {
    font-size: 1.2rem;
    width: 90%;
    height: 33vw;
  }
}
.flow_circle li .txt {
  font-size: 1.2rem;
  margin-top: 10px;
}
.flow_circle li:after {
  font-family: "Font Awesome 5 Free";
  content: "\f105";
  font-weight: 900;
  position: absolute;
  top: 54px;
  right: -25%;
  margin: auto 0;
  display: grid;
  place-items: center;
  color: #68482A;
  font-size: 3rem;
}
@media all and (max-width: 896px) {
  .flow_circle li:after {
    right: -15%;
  }
}
.flow_circle li:nth-child(1n) .figure {
  background-color: #15a97c;
}
.flow_circle li:nth-child(2n) .figure {
  background-color: #12936b;
}
.flow_circle li:nth-child(3n) .figure {
  background-color: #0d654a;
}
.flow_circle li:nth-child(4n) .figure {
  background-color: #0c5c44;
}
.flow_circle li:nth-child(5n) .figure {
  background-color: #0a4f3a;
}
.flow_circle li:nth-child(6n) .figure {
  background-color: #084130;
}
.flow_circle li:last-child:after {
  content: none;
}

.flow-dl .flow-inner {
  padding: 8px;
}
.flow-dl .flow-inner:not(:last-of-type) {
  margin-bottom: 5px;
  border-bottom: solid 1px #aaa;
}
.flow-dl .flow-inner dt {
  font-size: 1.6rem;
  font-weight: 600;
  color: #0083de;
}
.flow-dl .flow-inner dt .eng {
  font-family: "Noto Serif JP", "YakuHanMP", "Noto Serif JP", "游明朝 Medium", "Yu Mincho", YuMincho, "Hiragino Mincho ProN", HGS明朝E, serif;
  font-weight: 400;
  letter-spacing: 0;
  text-transform: lowercase !important;
  font-size: 2.5rem;
  color: #8fb8c9;
  margin-right: 8px;
}
.flow-dl .flow-inner dt .eng:first-letter {
  text-transform: uppercase;
}
.flow-dl .flow-inner dd {
  margin-top: 5px;
  padding-left: 40px;
}
@media all and (max-width: 639px) {
  .flow-dl .flow-inner {
    padding: 6px;
  }
  .flow-dl .flow-inner dt {
    font-size: 1.25rem;
  }
  .flow-dl .flow-inner dt .eng {
    font-size: 1.7rem;
  }
  .flow-dl .flow-inner dd {
    padding-left: 30px;
  }
}

.faq-list {
  max-width: 1500px;
  margin: 30px auto;
  overflow: hidden;
}
.faq-list li {
  margin-bottom: 50px;
}
.faq-list li .q-area {
  font-size: 2rem;
  position: relative;
}
.faq-list li .q-area:before {
  position: absolute;
  content: "";
  width: 100%;
  height: 1px;
  background-color: #073829;
  bottom: 0;
}
.faq-list li .q-area span {
  font-size: 3rem;
  padding-right: 10px;
  color: #073829;
}
@media all and (max-width: 639px) {
  .faq-list li .q-area {
    font-size: 1.7rem;
  }
  .faq-list li .q-area span {
    font-size: 2rem;
    line-height: 2rem;
  }
}
.faq-list li .a-area {
  position: relative;
  max-width: 90%;
  margin: 40px 0 0 auto;
  background: #f2f2f2;
  padding: 10px;
  border-radius: 10px;
}
.faq-list li .a-area span {
  font-size: 5rem;
  padding-right: 10px;
  position: absolute;
  top: -30px;
  left: -50px;
  color: #d81e1e;
  font-family: "Noto Serif JP", "YakuHanMP", "Noto Serif JP", "游明朝 Medium", "Yu Mincho", YuMincho, "Hiragino Mincho ProN", HGS明朝E, serif;
  font-weight: 400;
  letter-spacing: 0;
  text-transform: lowercase !important;
}
.faq-list li .a-area span:first-letter {
  text-transform: uppercase;
}
@media all and (max-width: 639px) {
  .faq-list li .a-area {
    max-width: 85%;
  }
  .faq-list li .a-area span {
    font-size: 2rem;
    line-height: 2rem;
    top: 0px;
    left: -35px;
  }
}

.qa-list.type_none dt:before,
.qa-list.type_none dd:before {
  display: none;
}
.qa-list.type_none dt,
.qa-list.type_none dd {
  padding: 20px 20px 20px 20px;
}
@media all and (max-width: 639px) {
  .qa-list.type_none dt,
.qa-list.type_none dd {
    padding: 16px 32px 16px 16px;
  }
}
.qa-list dl {
  position: relative;
  margin: 15px 0 0;
  cursor: pointer;
  border: 1px solid #aaa;
  overflow: hidden;
  background: #fff;
}
.qa-list dl:first-child {
  margin-top: 0;
}
.qa-list dl:after {
  position: absolute;
  top: 27px;
  right: 26px;
  display: block;
  width: 7px;
  height: 7px;
  margin: auto;
  content: "";
  transform: rotate(135deg);
  border-top: 2px solid #000;
  border-right: 2px solid #000;
}
.qa-list.open::after {
  transform: rotate(-45deg);
}
.qa-list dt {
  position: relative;
  margin: 0;
  padding: 20px 20px 20px 60px;
  font-weight: bold;
  background: #f2f2f2;
}
.qa-list dt:before {
  font-size: 22px;
  line-height: 1;
  position: absolute;
  top: 20px;
  left: 20px;
  display: block;
  content: "Q.";
  color: #073829;
}
.qa-list dd {
  position: relative;
  margin: 0;
  padding: 20px 20px 20px 60px;
}
.qa-list dd:before {
  font-size: 22px;
  line-height: 1;
  position: absolute;
  left: 20px;
  display: block;
  content: "A.";
  font-weight: bold;
  color: #d81e1e;
}
.qa-list dd p {
  margin: 30px 0 0;
}
.qa-list dd p:first-child {
  margin-top: 0;
}
@media all and (max-width: 896px) {
  .qa-list dl {
    margin: 10px 0 0;
  }
  .qa-list dl:after {
    top: 20px;
    right: 20px;
    width: 7px;
    height: 7px;
  }
  .qa-list dl dt {
    padding: 16px 26px 16px 40px;
    font-size: 14px;
  }
  .qa-list dl dt:before {
    font-size: 14px;
    top: 20px;
    left: 15px;
  }
  .qa-list dl dd {
    margin: 0;
    padding: 16px 16px 16px 40px;
    font-size: 14px;
  }
  .qa-list dl dd:before {
    font-size: 14px;
    left: 15px;
    margin-top: 5px;
  }
  .qa-list dl dd p {
    margin: 30px 0 0;
  }
  .qa-list dl dd p:first-child {
    margin-top: 0;
  }
}

.list_step > li {
  display: grid;
  place-items: center;
  width: 100%;
  background-color: #073829;
  color: #fff;
  position: relative;
  padding: 20px;
}
.list_step > li a {
  position: absolute;
  width: 100%;
  height: 100%;
  top: 0;
  left: 0;
  z-index: 1;
}
.list_step > li a:hover {
  background-color: rgba(255, 255, 255, 0.4);
}
.list_step > li:nth-child(2n) {
  background-color: rgba(7, 56, 41, 0.9);
}
.list_step > li:nth-child(3n) {
  background-color: rgba(7, 56, 41, 0.8);
}
.list_step > li:nth-child(4n) {
  background-color: rgba(7, 56, 41, 0.7);
}
.list_step > li:nth-child(5n) {
  background-color: rgba(7, 56, 41, 0.6);
}
.list_step > li .num {
  font-size: 3rem;
  line-height: 3rem;
  font-weight: 500;
  text-transform: uppercase;
  text-align: center;
  padding-bottom: 10px;
  position: relative;
}
.list_step > li .num:before {
  content: "";
  position: absolute;
  bottom: -3px;
  width: 30px;
  border-bottom: 2px solid #ccc;
}
.list_step > li .ttl {
  margin-top: 20px;
  font-size: 2rem;
  line-height: 1.2;
  text-align: center;
}
.list_step > li .txt {
  text-align: center;
}
@media all and (max-width: 639px) {
  .list_step > li {
    width: 100%;
  }
  .list_step > li .ttl {
    font-size: 1.3rem;
  }
}

.faq-dl .faq-inner {
  padding: 10px;
  margin-bottom: 20px;
}
.faq-dl .faq-inner:not(:last-of-type) {
  margin-bottom: 35px;
  padding-bottom: 20px;
  border-bottom: 3px solid #eee;
}
.faq-dl .faq-inner dt,
.faq-dl .faq-inner dd {
  position: relative;
  padding: 10px 10px 10px 55px;
}
.faq-dl .faq-inner dt:before,
.faq-dl .faq-inner dd:before {
  position: absolute;
  content: "";
  width: 45px;
  height: 45px;
  line-height: 45px;
  text-align: center;
  left: 0;
  top: 0;
  font-family: "Noto Serif JP", "YakuHanMP", "Noto Serif JP", "游明朝 Medium", "Yu Mincho", YuMincho, "Hiragino Mincho ProN", HGS明朝E, serif;
  font-weight: 400;
  letter-spacing: 0;
  text-transform: lowercase !important;
}
.faq-dl .faq-inner dt:before:first-letter,
.faq-dl .faq-inner dd:before:first-letter {
  text-transform: uppercase;
}
.faq-dl .faq-inner dt {
  margin-bottom: 10px;
  font-weight: 600;
}
.faq-dl .faq-inner dt:before {
  content: "Q";
  color: #073829;
  font-size: 3rem;
  background: rgba(7, 56, 41, 0.2);
}
.faq-dl .faq-inner dd:before {
  content: "A";
  color: #ff6a49;
  font-size: 3rem;
  background: rgba(255, 255, 89, 0.2);
}

.dl_list {
  overflow: hidden;
  font-size: 1.4rem;
  margin: 20px 0;
}
.dl_list dt {
  float: left;
  width: 9em;
  padding: 5px;
  line-height: 1.3;
  color: #fff;
  text-align: center;
  border: 1px solid #073829;
  border-radius: 30px;
  background: #073829;
  font-size: 1.3rem;
}
@media all and (max-width: 639px) {
  .dl_list dt {
    font-size: 1.2rem;
  }
}
.dl_list dd {
  padding: 0 0 12px 10.2em;
  line-height: 1.6;
  border-bottom: 1px dotted #dddddd;
  margin: 0 0 10px;
}
.dl_list dd a {
  color: #333;
  background-image: linear-gradient(to right, #073829, #1fa33a);
  padding-bottom: 0.25em;
  background-position: 100% 100%;
  background-size: 0% 1px;
  background-repeat: no-repeat;
  transition: background-size 0.5s cubic-bezier(0.165, 0.84, 0.44, 1);
  font-weight: 700;
}
.dl_list dd a:hover {
  background-position: 0 100%;
  background-size: 100% 1px;
}
.dl_list dd:last-child {
  margin: 0;
  border-bottom: none;
}
@media all and (max-width: 639px) {
  .dl_list dt {
    float: none;
  }
  .dl_list dd {
    padding: 8px 5px;
  }
}

.dl_news {
  border-top: solid 1px #aaa;
  display: flex;
  flex-wrap: wrap;
  line-height: 1.6;
}
.dl_news dt {
  padding: 16px 0px;
  border-bottom: solid 1px #aaa;
  color: #073829;
  width: 25%;
}
.dl_news dt span {
  display: inline-block;
  padding: 0 8px;
  border: #073829 1px solid;
  margin: 0 16px;
  color: #073829;
}
.dl_news dd {
  width: 75%;
  padding: 16px 0px;
  border-bottom: solid 1px #aaa;
}
.dl_news dd:first-child {
  border-top: solid 1px #aaa;
}

.price-dl dt {
  background: #f0e7cb;
  padding: 14px 20px;
  color: #333;
  border-top: 1px solid #68482A;
  border-bottom: 1px solid #68482A;
}
.price-dl dd {
  padding: 20px;
  margin-bottom: 25px;
}

.time-list {
  max-width: 480px;
}
.time-list li {
  display: flex;
  position: relative;
}
.time-list li .txtarea {
  order: 1;
  padding: 0px 40px 30px 40px;
}
.time-list li .txtarea:before {
  content: "";
  position: absolute;
  left: 118px;
  top: 0;
  height: 100%;
  width: 2px;
  background-color: #d3d3d3;
}
.time-list li .txtarea:last-child:before {
  display: none;
}
.time-list li .txtarea:after {
  content: "";
  position: absolute;
  left: 110px;
  top: 0;
  width: 20px;
  height: 20px;
  background-color: #073829;
  z-index: 1;
  border: 2px solid #073829;
  border-radius: 50%;
}
.time-list li .ttl {
  font-size: 1.4rem;
  line-height: 1.4;
}
.time-list li .time {
  flex: 0 0 100px;
  text-align: end;
  min-width: 0;
  overflow-wrap: break-word;
  padding-bottom: 1rem;
  color: #95c51a;
  font-weight: bold;
  font-size: 1.5rem;
  line-height: 1.5rem;
}

@media all and (max-width: 1100px) {
  .time-list {
    padding-left: 0;
  }
  .time-list li .txtarea {
    order: 1;
    padding: 0px 0px 30px 40px;
    text-align: left;
  }
  .time-list li .txtarea:before {
    content: "";
    position: absolute;
    left: 88px;
  }
  .time-list li .txtarea:last-child:before {
    display: none;
  }
  .time-list li .txtarea:after {
    content: "";
    position: absolute;
    left: 79px;
  }
  .time-list li .time {
    flex: 0 0 70px;
  }
}
@media all and (max-width: 639px) {
  .time-list {
    padding-left: 0;
  }
  .time-list li .txtarea {
    order: 1;
    padding: 0px 0px 30px 40px;
    text-align: left;
  }
  .time-list li .txtarea:before {
    content: "";
    position: absolute;
    left: 88px;
  }
  .time-list li .txtarea:last-child:before {
    display: none;
  }
  .time-list li .txtarea:after {
    content: "";
    position: absolute;
    left: 79px;
  }
  .time-list li .time {
    flex: 0 0 72px;
    font-size: 1.3rem;
  }
}
.yearly_list > li {
  position: relative;
  background-color: #fff;
  box-shadow: rgba(170, 170, 170, 0.1) 0 0 2px 2px;
}
.yearly_list > li .num {
  position: absolute;
  top: -10px;
  left: -8px;
  width: 60px;
  height: 60px;
  color: #fff;
  font-size: 2rem;
  z-index: 1;
  letter-spacing: -1px;
  border-radius: 50%;
  display: grid;
  place-items: center;
  font-weight: normal;
  background: #f38382;
}
.yearly_list > li .num b {
  font-size: 1.3rem;
  letter-spacing: 1px;
  font-weight: normal;
}
.yearly_list > li .num.type1 {
  background: #ea9570;
}
.yearly_list > li .num.type2 {
  background: #ebcc6f;
}
.yearly_list > li .num.type3 {
  background: #bdc770;
}
.yearly_list > li .photo {
  width: 100%;
  height: 130px;
  overflow: hidden;
}
.yearly_list > li .photo img {
  width: 100%;
  height: 100%;
  -o-object-fit: cover;
     object-fit: cover;
}
.yearly_list > li .txtarea {
  position: relative;
  margin-top: 0px;
  padding: 10px 20px 10px 60px;
}
.yearly_list > li .txtarea .ttl {
  position: relative;
  text-align: left;
  padding-top: 5px;
  margin-top: 5px;
  border-top: 1px dotted #ddd;
}
.yearly_list > li .txtarea .ttl:first-child {
  padding-top: 0;
  margin-top: 0;
  border-top: none;
}
.yearly_list > li .txtarea .ttl i {
  padding-right: 5px;
  color: #2e962e;
}
.yearly_list > li .txtarea .txt {
  margin-top: 30px;
  text-align: center;
}

.flow-list {
  padding-left: 120px;
  position: relative;
  margin: 0 auto;
  max-width: 1500px;
}
.flow-list:before {
  content: "";
  width: 4px;
  height: 100%;
  background: #bbbbbb;
  margin-left: -8px;
  display: block;
  position: absolute;
  top: 0;
  left: 120px;
}
@media all and (max-width: 639px) {
  .flow-list:before {
    left: 74px;
  }
}
.flow-list > li {
  position: relative;
}
.flow-list > li:not(:last-child) {
  margin-bottom: 70px;
}
.flow-list > li .icon {
  font-size: 3rem;
  color: #fff;
  background: #073829;
  border-radius: 5px;
  padding: 8px 20px 4px;
  display: block;
  position: absolute;
  top: 5px;
  left: -120px;
  z-index: 100;
  width: 100%;
  max-width: 74px;
  line-height: 1;
}
.flow-list > li .icon span {
  font-size: 1.2rem;
  display: block;
}
@media all and (max-width: 639px) {
  .flow-list > li .icon {
    font-size: 2rem;
    padding: 8px 10px;
  }
}
.flow-list > li .icon.bgLRextend {
  overflow: inherit;
}
.flow-list > li .icon.bgLRextend:before {
  top: 0;
  left: 0;
}
.flow-list > li .icon::after {
  content: "";
  border-style: solid;
  border-width: 5px 0 5px 10px;
  border-color: transparent transparent transparent #073829;
  position: absolute;
  top: 50%;
  left: 100%;
  transform: translateY(-50%);
}
.flow-list > li .txtarea {
  padding-left: 70px;
  position: relative;
}
.flow-list > li .txtarea img {
  border: 1px solid #aaa;
  box-shadow: rgba(170, 170, 170, 0.2) 1px 1px 2px 2px;
}
@media all and (max-width: 639px) {
  .flow-list > li .txtarea {
    padding-left: 0px;
    margin-right: 10px;
  }
}
.flow-list > li .txtarea:before, .flow-list > li .txtarea:after {
  content: "";
  display: block;
  position: absolute;
  top: 35px;
}
.flow-list > li .txtarea:before {
  width: 7px;
  height: 7px;
  margin-top: -3px;
  background: #073829;
  border-radius: 50%;
  left: -9px;
}
@media all and (max-width: 639px) {
  .flow-list > li .txtarea:before {
    left: -55px;
  }
}
.flow-list > li .txtarea:after {
  width: 50px;
  border-bottom: 1px dashed #073829;
  position: absolute;
  left: 5px;
}
@media all and (max-width: 639px) {
  .flow-list > li .txtarea:after {
    width: 20px;
    left: -40px;
  }
}
.flow-list > li .txtarea .txtarea {
  margin-bottom: 40px;
}
.flow-list > li .txtarea .ttl {
  font-size: 2rem;
  color: #073829;
  margin-bottom: 10px;
  font-weight: bold;
}
@media all and (max-width: 639px) {
  .flow-list > li .txtarea .ttl {
    font-size: 1.4rem;
    margin: 10px 0;
  }
}
.flow-list > li .txtarea .txt {
  font-size: 1.5rem;
  color: #333;
}
@media all and (max-width: 639px) {
  .flow-list > li .txtarea .txt {
    margin-top: 10px;
    font-size: 1.2rem;
  }
}

.voice {
  position: relative;
}
.voice.type1 li .flow_item .left .thm {
  background-color: #073829;
  background-image: none !important;
}
.voice.type1 li .flow_item .left .thm i {
  font-size: 3vw;
  padding-top: 15px !important;
  color: rgba(255, 255, 255, 0.8);
}
@media all and (max-width: 639px) {
  .voice.type1 li .flow_item .left .thm i {
    font-size: 10vw;
    padding-top: 20px;
  }
}
.voice.type1 li .flow_item .left .item_main {
  font-weight: bold;
}
.voice li {
  margin: 0 auto;
  padding: 0;
  /*   &:nth-child(2n) {
    padding-left: 10%;

    @include for-size(phone-only) {
      padding-left: 0%;
    }
  } */
}
@media all and (max-width: 639px) {
  .voice li {
    align-items: center;
    justify-content: center;
  }
}
.voice li .flow_item {
  width: 100%;
  position: relative;
  margin-bottom: 20px;
}
.voice li .flow_item .left {
  width: 80px;
  position: absolute;
  left: 0;
  display: block;
  /* @include for-size(phone-only) {
    width: 100%;
    position: relative;
    margin: auto;
  } */
}
.voice li .flow_item .left .thm {
  width: 80px;
  display: block;
  text-align: center;
  height: 80px;
  border-radius: 50%;
  margin-bottom: 15px;
  overflow: hidden;
  background-image: linear-gradient(to top, #18c08d 0%, #27e4aa 1%, #54eabc 100%);
}
@media all and (max-width: 639px) {
  .voice li .flow_item .left .thm {
    margin: 0 auto 20px;
  }
}
.voice li .flow_item .left .thm img {
  width: 100%;
  height: 100%;
  -o-object-fit: cover;
     object-fit: cover;
}
.voice li .flow_item .left .thm i {
  font-size: 4vw;
  padding-top: 10px;
  color: rgba(255, 255, 255, 0.6);
}
@media all and (max-width: 639px) {
  .voice li .flow_item .left .thm i {
    font-size: 10vw;
    padding-top: 20px;
  }
}
.voice li .flow_item .right {
  padding-left: 100px;
  padding-top: 0px;
  /* @include for-size(phone-only) {
    padding-left: 0;
    padding-top: 0;
  } */
}
.voice li .flow_item .right .item_read {
  font-size: 1.1rem;
  line-height: 1.5em;
  color: #073829;
  margin-bottom: 15px;
  font-weight: 900;
  border: 1px solid #073829;
  padding: 5px 25px;
  display: inline-block;
  border-radius: 20px;
}
@media all and (max-width: 639px) {
  .voice li .flow_item .right .item_read {
    text-align: center;
  }
}
.voice li .flow_item .right .item_read span {
  color: #073829;
}
.voice li .flow_item .right .item_main {
  font-weight: 500;
}
.voice li .flow_item .right .item_main a {
  text-decoration: underline;
  color: #68482A;
}

.menu-list {
  margin: 0 1% 0;
  width: 48%;
  display: inline-table;
}
.menu-list:nth-child(2n) {
  margin-right: 0%;
}
@media all and (max-width: 639px) {
  .menu-list:nth-child(2n) {
    margin-left: 0;
  }
}
@media all and (max-width: 639px) {
  .menu-list {
    width: 100%;
    margin: 0 auto 0;
  }
}
.menu-list li {
  display: flex;
  align-items: center;
  flex-wrap: wrap;
  padding: 8px 4px;
}
.menu-list li::before {
  background: radial-gradient(#aaa 20%, transparent 0) center center/8px 8px;
  content: "";
  display: inline-block;
  flex: 1;
  height: 4px;
  margin: 0 1.2em;
}
@media all and (max-width: 639px) {
  .menu-list li::before {
    margin: 0 5px;
  }
}
.menu-list li p {
  display: inline-block;
  line-height: 1.5;
}
.menu-list li .left {
  order: -1;
  max-width: 65%;
  letter-spacing: 0.1rem;
  font-weight: 600;
  position: relative;
}
.menu-list li .left:before {
  font-family: "Font Awesome 5 Free";
  content: "\f219";
  font-weight: 900;
  color: #073829;
  margin-right: 3px;
}
.menu-list li .left span {
  font-size: 90%;
  font-weight: normal;
}
@media all and (max-width: 639px) {
  .menu-list li .left {
    max-width: 100%;
  }
}
.menu-list li .right {
  max-width: 55%;
  text-align: right;
  color: #073829;
  font-size: 1.1em;
}

.about-list li {
  background-color: #f2f2f2;
  padding: 20px;
  text-align: center;
  border-radius: 20px;
}
.about-list .figure {
  text-align: center;
}
.about-list .numbox {
  position: relative;
  display: table;
  margin: 0 auto;
  padding-bottom: 10px;
  width: 100%;
  border-bottom: 1px solid #073829;
}
.about-list .num {
  font-size: 10rem;
  color: #073829;
  display: table-cell;
  line-height: 1;
}
.about-list .ttl {
  padding-left: 10px;
  display: table-cell;
  color: #000;
  font-weight: bold;
  font-size: 2.8rem;
  line-height: 1;
  vertical-align: bottom;
  text-align: left;
}
.about-list .ttl span {
  font-size: 1.8rem;
}
.about-list .detail-num {
  font-size: 2rem;
  color: #073829;
  font-weight: bold;
}
.about-list .detail-num span {
  font-size: 10rem;
  line-height: 1;
  color: #073829;
  text-shadow: 2px 2px 0 #222, -2px -2px 0 #222, -1px 1px 0 #222, 1px -1px 0 #222, 0px 1px 0 #222, 0 -1px 0 #222, -1px 0 0 #222, 1px 0 0 #222;
}
.about-list .maintxt {
  text-align: center;
  font-weight: bold;
}
.about-list .txt {
  margin-top: 10px;
  text-align: left;
}
@media all and (max-width: 896px) {
  .about-list .num {
    font-size: 8rem;
    display: table-cell;
    line-height: 1;
  }
  .about-list .ttl {
    font-size: 2rem;
    vertical-align: bottom;
    text-align: left;
  }
  .about-list .ttl span {
    font-size: 1.6rem;
  }
  .about-list .detail-num {
    font-size: 2rem;
  }
  .about-list .detail-num span {
    font-size: 7rem;
  }
}
@media all and (max-width: 639px) {
  .about-list .numbox {
    position: relative;
    display: table;
    margin: 0 auto;
    text-align: center;
  }
  .about-list .num {
    font-size: 6rem;
    display: table-cell;
    line-height: 1;
  }
  .about-list .ttl {
    font-size: 1.8rem;
    vertical-align: bottom;
    text-align: left;
  }
  .about-list .ttl span {
    font-size: 1.4rem;
  }
  .about-list .detail-num {
    font-size: 1.8rem;
    font-weight: bold;
  }
  .about-list .detail-num span {
    font-size: 6rem;
    line-height: 1;
    color: #073829;
  }
}

.cov li {
  border-radius: 20px;
  background-color: #f2f2f2;
  text-align: center;
  font-weight: bold;
  color: #073829;
  padding: 20px 0;
}

.item_list {
  display: block;
  padding: 10px;
  margin-bottom: 10px;
  display: flex;
  position: relative;
}
.item_list.border {
  border: 1px solid #aaa;
}
.item_list.border:before {
  position: absolute;
  font-family: "Font Awesome 5 Free";
  content: "\f105";
  font-weight: 900;
  right: 14px;
  top: 35%;
  width: 50px;
  height: 50px;
  border-radius: 50%;
  display: grid;
  place-items: center;
  color: #073829;
  border: 1px solid #aaa;
  font-size: 2rem;
  background-color: #fff;
  z-index: 999;
  transition: 0.5s;
}
@media all and (max-width: 639px) {
  .item_list.border:before {
    width: 30px;
    height: 30px;
    font-size: 1.3rem;
  }
}
.item_list.border:hover:before {
  right: 2px;
  background-color: #073829;
  border: 1px solid #073829;
  color: #fff;
}
@media all and (max-width: 639px) {
  .item_list {
    padding: 5px;
    margin-bottom: 20px;
  }
}
.item_list.a-center {
  align-items: center;
}
.item_list.j-center {
  justify-content: center;
}
.item_list > a {
  position: absolute;
  width: 100%;
  height: 100%;
  top: 0;
  left: 0;
  z-index: 10;
}
.item_list > a:hover {
  background-color: rgba(255, 255, 255, 0.4);
}
.item_list .item_list_ttl {
  margin-bottom: 5px;
}
@media all and (max-width: 639px) {
  .item_list .item_list_ttl {
    font-size: 1.2rem;
  }
}
.item_list .item_list_txt {
  font-size: 90%;
}
.item_list .item_list_img {
  width: 300px;
  height: auto;
}
@media all and (max-width: 639px) {
  .item_list .item_list_img {
    width: 260px;
    height: auto;
  }
}
.item_list .item_list_img.type_r {
  width: 200px;
  height: 140px;
  border-radius: 50%;
  overflow: hidden;
}
@media all and (max-width: 639px) {
  .item_list .item_list_img.type_r {
    height: 120px;
  }
}
.item_list .item_list_img.type_r img {
  width: 100%;
  height: 100%;
  -o-object-fit: cover;
     object-fit: cover;
}
.item_list .item_list_detail {
  width: 100%;
  margin: 0;
  padding: 10px 20px;
  position: relative;
}

.point_list_ttl li {
  position: relative;
  font-size: 1.1rem;
  line-height: 1.2;
  transform: skewX(-10deg);
  margin-bottom: 45px;
}
.point_list_ttl li:before {
  content: "";
  position: absolute;
  bottom: 0;
  right: 0;
  margin: 0 0 0 auto;
  width: 75%;
  height: 1px;
  background-color: rgba(7, 56, 41, 0.3);
}
.point_list_ttl li:nth-child(2n) {
  margin-left: 80px;
}
.point_list_ttl li:nth-child(3n) {
  margin-left: 160px;
}
.point_list_ttl li:nth-child(4n) {
  margin-left: 240px;
}
.point_list_ttl li:nth-child(5n) {
  margin-left: 320px;
}
.point_list_ttl li > .sub {
  display: block;
  font-size: 8rem;
  font-weight: 400;
  line-height: 0.7;
  color: rgba(7, 56, 41, 0.3);
  font-family: "Noto Serif JP", "YakuHanMP", "Noto Serif JP", "游明朝 Medium", "Yu Mincho", YuMincho, "Hiragino Mincho ProN", HGS明朝E, serif;
  font-weight: 400;
  letter-spacing: 0;
  text-transform: lowercase !important;
}
.point_list_ttl li > .sub:first-letter {
  text-transform: uppercase;
}
.point_list_ttl li > .main {
  position: absolute;
  bottom: -35px;
  left: 0;
  z-index: 1;
  display: block;
  padding: 0.8rem 1rem;
  font-size: 2.2rem;
  font-weight: 700;
  color: #555;
  letter-spacing: 0;
  color: #073829;
}
@media all and (max-width: 896px) {
  .point_list_ttl {
    display: grid;
    grid-template-columns: repeat(2, 1fr);
  }
  .point_list_ttl li {
    margin-bottom: 20px;
  }
  .point_list_ttl li:nth-child(2n) {
    margin-left: 0px;
  }
  .point_list_ttl li:nth-child(3n) {
    margin-left: 0px;
  }
  .point_list_ttl li:nth-child(4n) {
    margin-left: 0px;
  }
  .point_list_ttl li:nth-child(5n) {
    margin-left: 0px;
  }
  .point_list_ttl li > .sub {
    font-size: 4rem;
  }
  .point_list_ttl li > .main {
    font-size: 1.2rem;
    letter-spacing: 0;
  }
}

.category_tab {
  position: relative;
  display: flex;
  text-align: center;
  justify-content: space-around;
  width: 100%;
  gap: 0 0;
  margin-bottom: 20px;
  overflow: hidden;
  background: #fff;
  box-shadow: rgba(85, 85, 85, 0.1) 0 0 2px 2px;
}
.category_tab li {
  position: relative;
  flex: 1;
  border-right: 1px solid #eee;
  color: #888;
  font-weight: bold;
  padding: 10px 10px;
  cursor: pointer;
  font-size: 1.4rem;
}
.category_tab li a {
  color: #888;
}
.category_tab li:hover {
  background: #0d654a;
  color: #fff;
}
.category_tab li:hover a {
  color: #fff;
}
.category_tab li:last-child {
  margin-right: 0px;
  border-right: 0px solid #aaa;
}
.category_tab li.active {
  background: #073829;
  color: #fff;
}
.category_tab li.active a {
  color: #fff;
}
.category_tab li.active:before {
  position: absolute;
  bottom: -3px;
  left: 0;
  width: 100%;
  height: 3px;
  content: "";
  background: #fff;
}
@media all and (max-width: 639px) {
  .category_tab li {
    font-size: 1.2rem;
    padding: 5px 5px;
  }
}

.panel {
  display: none;
}
@media all and (max-width: 896px) {
  .panel {
    margin-bottom: 30px;
  }
}
.panel.show {
  display: block;
}

.tabbtn01 {
  overflow: hidden;
  position: relative;
  /*  border-top: 1px solid #fff;
  border-bottom: 1px solid #fff; */
  background-color: #073829;
}
.tabbtn01:before {
  background-color: rgba(255, 255, 255, 0.3);
  content: "";
  display: block;
  transform: rotate(48deg);
  position: absolute;
  top: -125px;
  right: -160px;
  width: 300px;
  height: 280px;
}
.tabbtn01 .actab {
  position: relative;
  overflow: hidden;
  width: 100%;
  margin-bottom: 1px;
  color: #1b2538;
}
.tabbtn01 .actab > input {
  position: absolute;
  opacity: 0;
}
.tabbtn01 .actab label {
  font-weight: bold;
  font-size: 3rem;
  text-align: center;
  color: #fff;
  line-height: 1.2;
  position: relative;
  display: block;
  margin: 0 0 0 0;
  padding: 1em 2em 1em 1em;
  cursor: pointer;
}
@media all and (max-width: 639px) {
  .tabbtn01 .actab label {
    font-size: 1.8rem;
  }
}
.tabbtn01 .actab label span {
  font-size: 1.6rem;
  font-weight: normal;
}
@media all and (max-width: 639px) {
  .tabbtn01 .actab label span {
    font-size: 1.1rem;
  }
}
.tabbtn01 .actab label:hover {
  color: #fff;
}
.tabbtn01 .actab .content {
  overflow: hidden;
  max-height: 0;
  transition: max-height 0.5s ease;
}
.tabbtn01 .actab .content .bx {
  padding: 0 20px;
}
@media all and (max-width: 639px) {
  .tabbtn01 .actab .content .bx {
    padding: 0;
  }
}
.tabbtn01 .actab input:checked ~ label {
  color: #fff;
}
.tabbtn01 .actab input:checked ~ .content {
  max-height: 300em;
}
.tabbtn01 .actab label::after {
  line-height: 1.6;
  position: absolute;
  top: 50%;
  right: 0;
  display: block;
  width: 3em;
  margin-top: -20.5px;
  transition: all 0.5s ease;
  text-align: center;
}
.tabbtn01 .actab input[type=checkbox] + label::after {
  content: "＋";
}
.tabbtn01 .actab input[type=checkbox]:checked + label::after {
  transform: rotateX(180deg);
  content: "－";
}

.tabbtn02 {
  background-color: #073829;
  overflow: hidden;
  position: relative;
}
.tabbtn02:before {
  background-color: rgba(255, 255, 255, 0.3);
  content: "";
  display: block;
  transform: rotate(50deg);
  position: absolute;
  top: -120px;
  right: -150px;
  width: 300px;
  height: 280px;
}
.tabbtn02 .actab {
  position: relative;
  overflow: hidden;
  width: 100%;
}
.tabbtn02 .actab > input {
  position: absolute;
  opacity: 0;
}
.tabbtn02 .actab label {
  font-weight: bold;
  font-size: 3rem;
  text-align: center;
  color: #fff;
  line-height: 1.6;
  position: relative;
  display: block;
  margin: 0 0 0 0;
  padding: 1em 2em 1em 1em;
  cursor: pointer;
}
@media all and (max-width: 639px) {
  .tabbtn02 .actab label {
    font-size: 1.8rem;
  }
}
.tabbtn02 .actab label span {
  font-size: 1.6rem;
}
@media all and (max-width: 639px) {
  .tabbtn02 .actab label span {
    font-size: 1.2rem;
  }
}
.tabbtn02 .actab label:hover {
  color: #fff;
}
.tabbtn02 .actab .content {
  overflow: hidden;
  max-height: 0;
  transition: max-height 0.5s ease;
}
.tabbtn02 .actab input:checked ~ label {
  color: #fff;
}
.tabbtn02 .actab input:checked ~ .content {
  max-height: 10000em;
}
.tabbtn02 .actab label::after {
  line-height: 1.6;
  position: absolute;
  top: 50%;
  right: 0;
  display: block;
  width: 3em;
  margin-top: -20.5px;
  transition: all 0.5s ease;
  text-align: center;
}
.tabbtn02 .actab input[type=checkbox] + label::after {
  content: "＋";
}
.tabbtn02 .actab input[type=checkbox]:checked + label::after {
  transform: rotateX(180deg);
  content: "－";
}

img.white {
  filter: brightness(0) invert(1);
}

.cover_svg {
  position: relative;
  width: 100%;
  height: 100%;
  overflow: hidden;
}
.cover_svg:before {
  content: "";
  position: absolute;
  left: 0;
  top: -2px;
  margin: 0 0 auto;
  width: 100%;
  height: 100%;
  background: url(../img/svg/cover_triangle_top.svg) top no-repeat;
  z-index: 1;
}
.cover_svg:after {
  content: "";
  position: absolute;
  left: 0;
  bottom: -2px;
  margin: auto 0 0;
  width: 100%;
  height: 100%;
  background: url(../img/svg/cover_triangle_bottom.svg) bottom no-repeat;
  z-index: 1;
}
.cover_svg.type_b:before {
  background: none;
}
.cover_svg #u-firstview {
  height: calc(100vh - 0px) !important;
}
@media all and (max-width: 639px) {
  .cover_svg #u-firstview {
    height: calc(90vh - 100px) !important;
  }
}

.picture_mask {
  height: 350px;
  text-align: center;
  margin: 0 auto;
  position: relative;
}
.picture_mask:before {
  position: absolute;
  content: "";
  left: 53%;
  top: 55%;
  transform: translate(-50%, -50%);
  width: 100%;
  height: 100%;
  background: url(../images/japanese/picture_mask.png) no-repeat center/contain;
  opacity: 0.6;
}
.picture_mask img {
  width: 100%;
  height: 100%;
  -o-object-fit: cover;
     object-fit: cover;
  -webkit-mask-image: url(../images/japanese/picture_mask.png);
  mask-image: url(../images/japanese/picture_mask.png);
  -webkit-mask-size: contain;
          mask-size: contain;
  -webkit-mask-repeat: no-repeat;
          mask-repeat: no-repeat;
  -webkit-mask-position: center;
          mask-position: center;
  display: block;
}

.mask_wave {
  margin: 30px 0;
  -webkit-mask-image: url(../img/svg/mask_wave.svg);
  mask-image: url(../img/svg/mask_wave.svg);
  -webkit-mask-repeat: repeat-x;
  mask-repeat: repeat-x;
}
@media all and (max-width: 896px) {
  .mask_wave {
    margin: 10px 0;
    padding: 30px 0;
    -webkit-mask-size: cover;
    mask-size: cover;
  }
}

.picture_mask_slash {
  margin: -5% 0 -5%;
  z-index: 2;
  max-width: 50%;
  width: 100%;
  height: 100%;
  overflow: hidden;
  -webkit-clip-path: polygon(35% 0, 100% 0, 100% 100%, 0 100%);
  clip-path: polygon(35% 0, 100% 0, 100% 100%, 0 100%);
}
.picture_mask_slash.reverse {
  -webkit-clip-path: polygon(0 0, 75% 0, 100% 100%, 0% 100%);
  clip-path: polygon(0 0, 75% 0, 100% 100%, 0% 100%);
}
.picture_mask_slash img {
  width: 100%;
  height: 100%;
  -o-object-fit: cover;
     object-fit: cover;
}
@media all and (max-width: 1100px) {
  .picture_mask_slash {
    max-width: 50% !important;
    margin: -5% 0 -5%;
  }
}
@media all and (max-width: 896px) {
  .picture_mask_slash {
    max-width: 50% !important;
    margin: -5% 0 -5%;
  }
}
@media all and (max-width: 639px) {
  .picture_mask_slash {
    -webkit-clip-path: none;
    clip-path: none;
    left: 0;
    right: 0;
    margin: 15px auto;
    max-width: 100% !important;
  }
  .picture_mask_slash.reverse {
    -webkit-clip-path: none;
    clip-path: none;
  }
}

.opacity {
  opacity: 0.2;
}

.picture_dodot {
  position: relative;
}
.picture_dodot:before {
  content: "";
  position: absolute;
  bottom: -20px;
  right: -20px;
  width: 100%;
  height: 100%;
  background-image: radial-gradient(#073829 30%, rgba(0, 0, 0, 0) 31%), radial-gradient(#073829 30%, rgba(0, 0, 0, 0) 31%);
  background-size: 6px 6px;
  background-position: 0 0, 3px 3px;
  z-index: -2;
}

.picture_trapezium {
  -webkit-clip-path: polygon(20% 0%, 80% 16%, 80% 98%, 20% 84%);
  clip-path: polygon(0% 0%, 100% 16%, 100% 98%, 0% 84%);
  overflow: hidden;
  position: relative;
}

.picture_arrow {
  -webkit-clip-path: polygon(95% 0, 100% 50%, 95% 100%, 0% 100%, 5% 50%, 0% 0%);
  clip-path: polygon(95% 0, 100% 50%, 95% 100%, 0% 100%, 5% 50%, 0% 0%);
  overflow: hidden;
  position: relative;
}

@media all and (max-width: 639px) {
  .picture_radius {
    width: 100%;
    margin: 0 auto 30px;
  }
}
.picture_radius img {
  border-radius: 20px;
}
.picture_radius.right img {
  border-radius: 0 20px 20px 0;
}
@media all and (max-width: 639px) {
  .picture_radius.right img {
    border-radius: 0 0 0 0;
  }
}
.picture_radius.left img {
  border-radius: 20px 0 0 20px;
}
@media all and (max-width: 639px) {
  .picture_radius.left img {
    border-radius: 0 0 0 0;
  }
}

.picture_3set {
  max-width: 100%;
  margin: 0 auto 20px;
  position: relative;
}
.picture_3set a {
  position: absolute;
  width: 100%;
  height: 100%;
  top: 0;
  left: 0;
  z-index: 1;
}
.picture_3set a:hover {
  background-color: rgba(255, 255, 255, 0.4);
}
.picture_3set .photo01 {
  position: absolute;
  bottom: 12%;
  right: -10%;
  max-width: 35%;
  max-height: 16%;
  box-shadow: rgba(17, 17, 17, 0.1) 0 0 3px 3px;
  z-index: 2;
}
.picture_3set .photo01 a {
  height: 220%;
}
.picture_3set .photo01 img {
  width: 100%;
  height: 100%;
  -o-object-fit: cover;
     object-fit: cover;
}
.picture_3set .photo02 {
  position: absolute;
  bottom: 12%;
  right: 30%;
  max-width: 35%;
  max-height: 16%;
  box-shadow: rgba(17, 17, 17, 0.1) 0 0 3px 3px;
  z-index: 3;
}
.picture_3set .photo02 a {
  height: 220%;
}
.picture_3set .photo02 img {
  width: 100%;
  height: 100%;
  -o-object-fit: cover;
     object-fit: cover;
}

.picture {
  width: 100%;
  height: 300px;
  position: relative;
}
.picture.radius {
  border-radius: 20px;
  overflow: hidden;
}
.picture.contain img {
  -o-object-fit: contain;
     object-fit: contain;
}
.picture.contain_mini {
  height: 100px;
  margin-bottom: 20px;
}
.picture.contain_mini img {
  -o-object-fit: contain;
     object-fit: contain;
}
@media all and (max-width: 639px) {
  .picture {
    height: 150px;
  }
}
.picture a {
  position: absolute;
  width: 100%;
  height: 100%;
  top: 0;
  left: 0;
  z-index: 1;
}
.picture a:hover {
  background-color: rgba(255, 255, 255, 0.4);
}
.picture img {
  width: 100%;
  height: 100%;
  -o-object-fit: cover;
     object-fit: cover;
}

.picture_01 {
  position: relative;
}
.picture_01 img {
  width: 100%;
  height: 100%;
  -o-object-fit: cover;
     object-fit: cover;
}
.picture_01.center {
  margin-left: auto;
  margin-right: auto;
  text-align: center;
}
.picture_01.right {
  text-align: right;
}
.picture_01.right:after {
  right: -30px;
  left: inherit;
  bottom: -30px;
}
@media all and (max-width: 639px) {
  .picture_01.right:after {
    right: -10px;
    bottom: -10px;
    opacity: 0.4;
  }
}
.picture_01:after {
  content: "";
  background-color: #073829;
  display: block;
  position: absolute;
  right: 0px;
  bottom: -30px;
  left: -30px;
  width: calc(100% - 30px);
  height: calc(100% - 30px);
  z-index: -1;
}
@media all and (max-width: 639px) {
  .picture_01:after {
    bottom: -10px;
    left: -10px;
    opacity: 0.4;
  }
}
@media all and (max-width: 639px) {
  .picture_01 {
    width: 90%;
    margin: 0 auto;
  }
}

.name {
  width: 200px;
  margin: -20px auto;
  position: absolute;
  z-index: 2;
  background: #68482A;
  color: #fff;
  font-weight: 600;
  text-align: center;
  padding: 15px 6px;
  box-shadow: 0 0 8px rgba(51, 51, 51, 0.05);
  line-height: 1.5;
  font-size: 1.6rem;
  bottom: 0;
  filter: drop-shadow(6px 5px 1px rgba(0, 0, 0, 0.6));
}
.name .small {
  font-size: 0.8em;
}

.grid_photo01 {
  width: 95%;
  margin: 0 auto;
  display: grid;
  grid-template-columns: 20% 54% 20%;
  grid-template-rows: 60% 68% 20%;
  grid-column-gap: 3%;
  grid-row-gap: 3%;
}
.grid_photo01 div {
  width: 100%;
  height: 100%;
}
.grid_photo01 div img {
  width: 100%;
  height: 100%;
  -o-object-fit: cover;
     object-fit: cover;
}
.grid_photo01 .div1 {
  grid-area: 1/1/2/2;
}
.grid_photo01 .div2 {
  grid-area: 1/2/3/3;
}
.grid_photo01 .div3 {
  grid-area: 1/3/2/4;
}
.grid_photo01 .div4 {
  grid-area: 2/1/3/2;
}
.grid_photo01 .div5 {
  grid-area: 2/3/3/4;
}

.grid_photo02 {
  width: 100%;
  margin: 0 auto;
  display: grid;
  grid-template-columns: 0px 1fr;
  grid-template-rows: 15vw;
}
.grid_photo02 div {
  width: 100%;
  height: 100%;
}
.grid_photo02 div img {
  width: 100%;
  height: 100%;
  -o-object-fit: cover;
     object-fit: cover;
}

.photo_s {
  position: relative;
  width: 100%;
  height: 300px;
  margin-top: 20px;
}
@media all and (max-width: 896px) {
  .photo_s {
    margin-bottom: 80px;
  }
}
.photo_s .p1 {
  position: absolute;
  width: 340px;
  height: 227px;
  top: 50px;
  left: 0;
}
.photo_s .p1 img {
  width: 100%;
  -o-object-fit: cover;
     object-fit: cover;
}
.photo_s .p2 {
  position: absolute;
  width: 238px;
  height: 161px;
  top: 0;
  right: 20px;
}
.photo_s .p2 img {
  width: 100%;
  -o-object-fit: cover;
     object-fit: cover;
}
@media all and (max-width: 1100px) {
  .photo_s {
    padding-bottom: 18%;
    height: auto;
  }
  .photo_s .p1 {
    width: 50%;
  }
  .photo_s .p2 {
    width: 35%;
  }
}
@media all and (max-width: 639px) {
  .photo_s {
    padding-bottom: 54%;
  }
  .photo_s .p1 {
    width: 55%;
  }
  .photo_s .p2 {
    width: 40%;
    right: 0px;
  }
}

.pagelink_box01 > li {
  overflow: hidden;
  position: relative;
}
.pagelink_box01 > li a {
  position: absolute;
  width: 100%;
  height: 100%;
  top: 0;
  left: 0;
  z-index: 10;
}
.pagelink_box01 > li:after {
  content: "";
  border: 1px solid #fff;
  width: 93%;
  height: 93%;
  margin: auto;
  position: absolute;
  z-index: 1;
  top: 0;
  bottom: 0;
  right: 0;
  left: 0;
}
.pagelink_box01 > li:before {
  background-color: rgba(255, 255, 255, 0.8);
  content: "";
  display: block;
  transform: rotate(45deg);
  position: absolute;
  bottom: -25px;
  right: -25px;
  width: 50px;
  height: 50px;
  z-index: 10;
}
.pagelink_box01 > li .txtarea {
  display: none;
  position: absolute;
  top: 15%;
  left: 0;
  right: 0;
  margin: 0 auto;
  text-align: center;
  color: #333;
  display: flex;
  flex-direction: column;
  justify-content: center;
}
.pagelink_box01 > li .txtarea .icon {
  margin-bottom: 20px;
  position: relative;
}
.pagelink_box01 > li .txtarea .icon img {
  width: 60px;
  filter: brightness(0) invert(1);
}
.pagelink_box01 > li .txtarea .icon:before {
  content: "";
  position: absolute;
  left: 0;
  right: 0;
  border-bottom: 2px solid #fff;
  width: 60px;
  margin: 0 auto;
  bottom: -15px;
}
.pagelink_box01 > li .txtarea .ttl {
  align-self: center;
  font-size: 2.8rem;
  color: #fff;
}
.pagelink_box01 > li .txtarea .ttl span {
  font-size: 1.4rem;
  display: block;
}
@media all and (max-width: 639px) {
  .pagelink_box01 > li .txtarea .ttl {
    font-size: 1.8rem;
  }
  .pagelink_box01 > li .txtarea .ttl span {
    font-size: 1.2rem;
  }
}
.pagelink_box01 > li .txtarea .ttl.tb-rl {
  font-size: 3.5rem;
  -ms-writing-mode: tb-rl;
  writing-mode: vertical-rl;
}
@media all and (max-width: 639px) {
  .pagelink_box01 > li .txtarea .ttl {
    -ms-writing-mode: lr-tb;
    writing-mode: lr-tb;
    font-size: 2rem;
  }
}
.pagelink_box01 > li .txtarea .txt {
  font-size: 1.2rem;
  text-align: left;
  width: 80%;
  margin: 20px auto 20px;
  color: white;
}
@media all and (max-width: 639px) {
  .pagelink_box01 > li .txtarea .txt {
    font-size: 1.1rem;
    width: 80%;
    margin: 0 auto;
  }
}
.pagelink_box01 > li .more {
  margin-top: 10px;
  position: absolute;
  bottom: 10%;
  right: 0;
  left: 0;
  font-size: 1.6rem;
  color: #fff;
  text-align: center;
  z-index: 1;
  opacity: 1 !important;
}
.pagelink_box01 > li .more span {
  border: 1px solid #fff;
  padding: 6px 40px;
  color: #fff;
}
.pagelink_box01 > li .photo {
  position: relative;
  overflow: hidden;
}
.pagelink_box01 > li .photo:before {
  position: absolute;
  content: "";
  width: 100%;
  height: 100%;
  top: 0;
  left: 0;
  background-color: #073829;
  transition: all 0.3s 0s ease;
}
.pagelink_box01 > li .photo img {
  width: 100%;
  height: 400px;
  -o-object-fit: cover;
     object-fit: cover;
}
@media all and (max-width: 639px) {
  .pagelink_box01 > li .photo img {
    height: 300px;
  }
}
.pagelink_box01 > li:nth-child(even) .photo:before {
  background-color: #68482a;
}
.pagelink_box01 > li:hover .more span {
  background-color: #073829;
}
.pagelink_box01 > li:hover .photo {
  overflow: hidden;
}
.pagelink_box01 > li:hover .photo:before {
  transition: all 0.8s 0s ease;
  background-color: rgba(7, 56, 41, 0);
}
.pagelink_box01 > li:hover .photo img {
  transition: 0.8s;
  z-index: -1;
}
.pagelink_box01.type1 > li .txtarea {
  top: 0;
  bottom: 0;
  margin: 0;
}
.pagelink_box01.type1 > li .txtarea .ttl {
  font-weight: bold;
}
.pagelink_box01.type1 > li .photo {
  width: 100%;
  height: 600px;
}
@media all and (max-width: 639px) {
  .pagelink_box01.type1 > li .photo {
    height: 400px;
  }
}
.pagelink_box01.type1 > li .photo:before {
  background-color: rgba(17, 17, 17, 0.4);
}
.pagelink_box01.type1 > li .photo img {
  width: 100%;
  height: 100%;
  -o-object-fit: cover;
     object-fit: cover;
  transition: 0.4s;
}
.pagelink_box01.type1 > li:nth-child(even) .photo:before {
  background-color: rgba(17, 17, 17, 0.6);
}
.pagelink_box01.type1 > li:hover .more span {
  background-color: #073829;
}
.pagelink_box01.type1 > li:hover .photo:before {
  background-color: rgba(7, 56, 41, 0);
}
.pagelink_box01.type1 > li:hover .photo img {
  transition: 0.4s;
  transform: scale(1.1);
  z-index: -1;
}

.pagelink_box02 > li {
  overflow: hidden;
  position: relative;
  background-color: #073829;
}
.pagelink_box02 > li a {
  position: absolute;
  width: 100%;
  height: 100%;
  top: 0;
  left: 0;
  z-index: 10;
}
.pagelink_box02 > li a:hover {
  background-color: rgba(255, 255, 255, 0.4);
}
.pagelink_box02 > li:after {
  content: "";
  border: 1px solid #fff;
  width: 93%;
  height: 95%;
  margin: auto;
  position: absolute;
  z-index: 1;
  top: 0;
  bottom: 0;
  right: 0;
  left: 0;
}
.pagelink_box02 > li:before {
  background-color: rgba(255, 255, 255, 0.8);
  content: "";
  display: block;
  transform: rotate(45deg);
  position: absolute;
  bottom: -25px;
  right: -25px;
  width: 50px;
  height: 50px;
  z-index: 10;
}
.pagelink_box02 > li .txtarea {
  position: relative;
  height: auto;
  background-color: rgba(7, 56, 41, 0.8);
  top: 0;
  bottom: 0;
  left: 0;
  right: 0;
  margin: 0 auto;
  padding: 20px 0 90px;
  text-align: center;
  display: flex;
  flex-direction: column;
  justify-content: center;
  transition: 0.5s;
}
.pagelink_box02 > li .txtarea .icon {
  margin-bottom: 20px;
  position: relative;
}
.pagelink_box02 > li .txtarea .icon img {
  width: 60px;
  filter: brightness(0) invert(1);
}
.pagelink_box02 > li .txtarea .icon:before {
  content: "";
  position: absolute;
  border-bottom: 2px solid #eee;
  width: 60px;
  bottom: -15px;
}
.pagelink_box02 > li .txtarea .ttl {
  align-self: center;
  font-size: 2.2rem;
  color: #fff;
}
.pagelink_box02 > li .txtarea .ttl.tb-rl {
  font-size: 3.5rem;
  -ms-writing-mode: tb-rl;
  writing-mode: vertical-rl;
}
@media all and (max-width: 639px) {
  .pagelink_box02 > li .txtarea .ttl {
    -ms-writing-mode: lr-tb;
    writing-mode: lr-tb;
    font-size: 2rem;
  }
}
.pagelink_box02 > li .txtarea .txt {
  font-size: 1.2rem;
  text-align: left;
  width: 80%;
  margin: 20px auto 20px;
  color: white;
}
@media all and (max-width: 639px) {
  .pagelink_box02 > li .txtarea .txt {
    font-size: 1.1rem;
    width: 80%;
    margin: 0 auto;
  }
}
.pagelink_box02 > li .more {
  margin-top: 10px;
  position: absolute;
  bottom: 10%;
  right: 0;
  left: 0;
  font-size: 1.2rem;
  color: #fff;
  text-align: center;
  z-index: 1;
  opacity: 1 !important;
  transition: 0.5s;
}
.pagelink_box02 > li .more span {
  border: 1px solid #fff;
  border-radius: 30px;
  padding: 6px 40px;
  color: #fff;
}
.pagelink_box02 > li .photo {
  position: relative;
  overflow: hidden;
  width: 100%;
  height: 20vw;
  /* 
       &:before {
         position: absolute;
         content: "";
         width: 100%;
         height: 100%;
         top: 0;
         left: 0;
         background-color: rgba($base_color, 1);
         transition: all 0.3s 0s ease;
       }
  */
}
@media all and (max-width: 639px) {
  .pagelink_box02 > li .photo {
    height: 50vw;
  }
}
.pagelink_box02 > li .photo img {
  width: 100%;
  height: 100%;
  -o-object-fit: cover;
     object-fit: cover;
}
@media all and (max-width: 639px) {
  .pagelink_box02 > li .photo img {
    height: 300px;
  }
}
.pagelink_box02 > li:nth-child(even) .photo:before {
  background-color: #68482a;
}
.pagelink_box02 > li:hover {
  transition: 0.5s;
}
.pagelink_box02 > li:hover .txtarea {
  background-color: #073829;
  transition: 0.5s;
}
.pagelink_box02 > li:hover .more span {
  background-color: #fff;
  color: #073829;
  transition: 0.3s;
}
.pagelink_box02 > li:hover .photo {
  overflow: hidden;
}
.pagelink_box02 > li:hover .photo:before {
  transition: all 0.8s 0s ease;
  background-color: rgba(7, 56, 41, 0);
}
.pagelink_box03 > li {
  overflow: hidden;
  position: relative;
  background-color: #f2f2f2;
  /* &:after {
    content: "";
    border: 1px solid #fff;
    width: 93%;
    height: 95%;
    margin: auto;
    position: absolute;
    z-index: 1;
    top: 0;
    bottom: 0;
    right: 0;
    left: 0;
  } */
}
.pagelink_box03 > li:nth-child(even) {
  background-color: rgba(242, 242, 242, 0.8);
}
.pagelink_box03 > li a {
  position: absolute;
  width: 100%;
  height: 100%;
  top: 0;
  left: 0;
  z-index: 10;
}
.pagelink_box03 > li a:hover {
  background-color: rgba(255, 255, 255, 0.4);
}
.pagelink_box03 > li:before {
  background-color: #073829;
  content: "";
  display: block;
  transform: rotate(45deg);
  position: absolute;
  bottom: -25px;
  right: -25px;
  width: 50px;
  height: 50px;
  z-index: 10;
}
.pagelink_box03 > li .txtarea {
  position: relative;
  height: auto;
  top: 0;
  bottom: 0;
  left: 0;
  right: 0;
  margin: 0 auto;
  padding: 30px 0;
  text-align: center;
  display: flex;
  flex-direction: column;
  justify-content: center;
  transition: 0.5s;
}
.pagelink_box03 > li .txtarea .num {
  position: absolute;
  bottom: 0;
  left: 0;
  font-size: 7vw;
  color: rgba(7, 56, 41, 0.1);
  line-height: 0.6;
  z-index: 0;
  font-family: "Noto Serif JP", "YakuHanMP", "Noto Serif JP", "游明朝 Medium", "Yu Mincho", YuMincho, "Hiragino Mincho ProN", HGS明朝E, serif;
  font-weight: 400;
  letter-spacing: 0;
  text-transform: lowercase !important;
}
.pagelink_box03 > li .txtarea .num:first-letter {
  text-transform: uppercase;
}
@media all and (max-width: 639px) {
  .pagelink_box03 > li .txtarea .num {
    font-size: 8rem;
  }
}
.pagelink_box03 > li .txtarea .icon {
  margin-bottom: 40px;
  position: relative;
}
.pagelink_box03 > li .txtarea .icon img {
  width: 60px;
  filter: brightness(0) invert(1);
}
.pagelink_box03 > li .txtarea .icon:before {
  content: "";
  position: absolute;
  border-bottom: 2px solid #eee;
  width: 60px;
  bottom: -15px;
}
.pagelink_box03 > li .txtarea .ttl {
  align-self: center;
  font-size: 1.8rem;
  color: #555;
  z-index: 1;
}
.pagelink_box03 > li .txtarea .ttl span {
  font-size: 1.4rem;
}
.pagelink_box03 > li .txtarea .ttl.tb-rl {
  font-size: 3.5rem;
  -ms-writing-mode: tb-rl;
  writing-mode: vertical-rl;
}
@media all and (max-width: 639px) {
  .pagelink_box03 > li .txtarea .ttl {
    -ms-writing-mode: lr-tb;
    writing-mode: lr-tb;
    font-size: 1.2rem;
  }
}
.pagelink_box03 > li .txtarea .txt {
  font-size: 1.2rem;
  text-align: left;
  width: 80%;
  margin: 20px auto 20px;
  color: white;
}
@media all and (max-width: 639px) {
  .pagelink_box03 > li .txtarea .txt {
    font-size: 1.1rem;
    width: 80%;
    margin: 0 auto;
  }
}
.pagelink_box03 > li .more {
  margin-top: 10px;
  position: absolute;
  bottom: 10%;
  right: 0;
  left: 0;
  font-size: 1.2rem;
  color: #fff;
  text-align: center;
  z-index: 1;
  opacity: 1 !important;
  transition: 0.5s;
}
.pagelink_box03 > li .more span {
  border: 1px solid #fff;
  border-radius: 30px;
  padding: 6px 40px;
  color: #fff;
}
.pagelink_box03 > li .photo {
  position: relative;
  overflow: hidden;
  width: 100%;
  height: 20vw;
  /* 
       &:before {
         position: absolute;
         content: "";
         width: 100%;
         height: 100%;
         top: 0;
         left: 0;
         background-color: rgba($base_color, 1);
         transition: all 0.3s 0s ease;
       }
  */
}
@media all and (max-width: 639px) {
  .pagelink_box03 > li .photo {
    height: 50vw;
  }
}
.pagelink_box03 > li .photo img {
  width: 100%;
  height: 100%;
  -o-object-fit: cover;
     object-fit: cover;
}
@media all and (max-width: 639px) {
  .pagelink_box03 > li .photo img {
    height: 300px;
  }
}
.pagelink_box03 > li:hover {
  transition: 0.5s;
}
.pagelink_box03 > li:hover .txtarea {
  background-color: #073829;
  transition: 0.5s;
}
.pagelink_box03 > li:hover .more span {
  background-color: #fff;
  color: #073829;
  transition: 0.3s;
}
.pagelink_box03 > li:hover .photo {
  overflow: hidden;
}
.pagelink_box03 > li:hover .photo:before {
  transition: all 0.8s 0s ease;
  background-color: rgba(7, 56, 41, 0);
}

.vertical-content {
  margin-left: 100px;
}
.vertical-content.type1 {
  margin-left: 180px;
}

@media all and (max-width: 639px) {
  .vertical-content.type1 {
    margin-left: 0;
  }
}
@media all and (max-width: 639px) {
  .vertical-content {
    margin-left: 0;
  }
}
.icon-list-wrap {
  display: flex;
  justify-content: space-between;
  align-items: center;
}

@media all and (max-width: 896px) {
  .icon-list-wrap {
    flex-direction: column;
  }
}
.icon-list_dental {
  display: flex;
  flex-wrap: wrap;
  justify-content: center;
  align-items: flex-start;
  position: relative;
  z-index: 2;
  width: 100%;
}
.icon-list_dental li {
  width: 24%;
  border: solid 2px rgba(204, 204, 204, 0.7);
  margin-bottom: 30px;
  border-radius: 8px;
  margin-right: 1.3333333333%;
}
.icon-list_dental li:nth-child(4n) {
  margin-right: 0;
}
.icon-list_dental li a {
  display: block;
  text-align: center;
  font-weight: 600;
  height: 100%;
  transition: all 0.2s cubic-bezier(0.26, 0.06, 0, 1);
  position: relative;
  padding: 12px 0;
}
.icon-list_dental li a img {
  width: 70px;
}
.icon-list_dental li a:before {
  position: absolute;
  content: "";
  width: 100%;
  height: 100%;
  left: 50%;
  top: 50%;
  transform: translate(-50%, -50%) scale(1);
  background-image: linear-gradient(70deg, rgba(7, 56, 41, 0.2), #fff, #fff, rgba(7, 56, 41, 0.2));
  opacity: 0.7;
  border-radius: 8px;
  z-index: -1;
  transition: all 0.2s cubic-bezier(0.26, 0.06, 0, 1);
}
.icon-list_dental li a .svg {
  transition: all 0.2s;
  transform: scale(1);
}
.icon-list_dental li a:hover {
  color: #073829;
}
.icon-list_dental li a:hover .svg {
  transition: all 0.2s;
  transform: scale(1.2);
}
.icon-list_dental li a:hover:before {
  opacity: 0.9;
  transform: translate(-50%, -50%) scale(0.9);
}
.icon-list_dental.type1 {
  display: blcok;
  width: 25%;
}
.icon-list_dental.type1 li {
  width: 100%;
}
.icon-list_dental.type1 li a {
  padding: 0 0 15px;
}
.icon-list_dental.type1 li a img {
  width: 100%;
}
.icon-list_dental.type2 {
  width: 100%;
}
.icon-list_dental.type2 li {
  width: 19%;
  margin-right: 1.25%;
}
.icon-list_dental.type2 li:nth-child(4n) {
  margin-right: 1.25%;
}
.icon-list_dental.type2 li:nth-child(5n) {
  margin-right: 0;
}

@media all and (max-width: 896px) {
  .icon-list_dental {
    width: 100%;
  }
}
@media all and (max-width: 639px) {
  .icon-list_dental li {
    width: 48%;
    margin-right: 4%;
  }
  .icon-list_dental li:nth-child(2n) {
    margin-right: 0;
  }
}
@media all and (max-width: 896px) {
  .icon-list.type1 {
    display: flex;
    flex-wrap: wrap;
    justify-content: space-between;
    width: 100%;
  }
  .icon-list.type1 li {
    width: 48%;
  }
}
@media all and (max-width: 639px) {
  .icon-list.type2 li {
    width: 48%;
    margin-right: 4%;
  }
  .icon-list.type2 li:nth-child(5n) {
    margin-right: 4%;
  }
  .icon-list.type2 li:nth-child(2n) {
    margin-right: 0;
  }
}
.pagelink_photo.rhombus {
  margin-top: 200px;
}
.pagelink_photo.rhombus li .txtarea {
  top: 15%;
  bottom: inherit;
}
.pagelink_photo.rhombus li .more {
  bottom: 30%;
}
.pagelink_photo.rhombus li .photo {
  transform: skewY(20.25deg);
  transform-origin: top right;
  -webkit-transform: skewY(20.25deg);
  -webkit-transform-origin: top right;
}
.pagelink_photo.rhombus li .photo img {
  position: absolute;
  top: -40%;
  height: 140%;
  transform: skewY(-20.25deg);
  transform-origin: top right;
  -webkit-transform: skewY(-20.25deg);
  -webkit-transform-origin: top right;
}
.pagelink_photo.rhombus li:hover .photo {
  overflow: hidden;
}
.pagelink_photo.rhombus li:hover .photo:before {
  transition: 0.5s;
  position: absolute;
  content: "";
  width: 100%;
  height: 100%;
  z-index: 5;
}
.pagelink_photo.rhombus li:hover .photo img {
  transition: 0.8s;
  transform: skewY(-20.25deg) scale(1.2);
  transform-origin: top right;
  -webkit-transform: skewY(-20.25deg) scale(1.2);
  -webkit-transform-origin: top right;
}
.pagelink_photo.rhombus li:nth-child(2n) .photo {
  top: -184px;
  transform: skewY(-20.25deg);
  transform-origin: bottom right;
  -webkit-transform: skewY(-20.25deg);
  -webkit-transform-origin: bottom right;
}
@media screen and (max-width: 1500px) {
  .pagelink_photo.rhombus li:nth-child(2n) .photo {
    top: -12.3vw;
  }
}
.pagelink_photo.rhombus li:nth-child(2n) .photo img {
  position: absolute;
  top: 0%;
  height: 135%;
  transform: skewY(20.25deg);
  transform-origin: bottom right;
  -webkit-transform: skewY(20.25deg);
  -webkit-transform-origin: bottom right;
}
.pagelink_photo.rhombus li:nth-child(2n):hover .photo img {
  transition: 0.8s;
  transform: skewY(20.25deg) scale(1.2);
  transform-origin: bottom right;
  -webkit-transform: skewY(20.25deg) scale(1.2);
  -webkit-transform-origin: bottom right;
}
@media all and (max-width: 896px) {
  .pagelink_photo.rhombus li .txtarea {
    top: 5%;
  }
  .pagelink_photo.rhombus li .photo {
    height: 400px;
  }
  .pagelink_photo.rhombus li .photo img {
    top: -45%;
    height: 145%;
  }
  .pagelink_photo.rhombus li .more {
    bottom: 45%;
  }
  .pagelink_photo.rhombus li:nth-child(2n) .photo {
    top: -31.2vw;
  }
}
.pagelink_photo.elegant.type_white li .txtarea .ttl {
  color: #111;
  text-shadow: 0px 0px 5px #fff, 0px 0px 5px #fff, 0px 0px 10px #fff, 0px 0px 10px #fff, 0px 0px 15px #fff, 0px 0px 15px;
}
.pagelink_photo.elegant.type_white li .txtarea .sub-txtarea {
  color: #111;
  text-shadow: 0px 0px 5px #fff, 0px 0px 5px #fff, 0px 0px 10px #fff, 0px 0px 10px #fff, 0px 0px 15px #fff, 0px 0px 15px;
}
.pagelink_photo.elegant.type_white li .photo:before {
  background: rgba(255, 255, 255, 0.8);
  background: linear-gradient(113deg, white 0%, rgba(255, 255, 255, 0.8) 100%);
}
.pagelink_photo.elegant.type_white li .photo:after {
  background: rgba(255, 255, 255, 0.8);
}
.pagelink_photo.elegant li .photo {
  height: 600px;
}
.pagelink_photo.elegant li .txtarea {
  width: 100%;
  max-width: 550px;
  margin: 80px 0 0 auto;
  justify-content: flex-start;
  display: block;
}
.pagelink_photo.elegant li .txtarea .ttl {
  font-size: 1.6rem;
  text-align: center;
  line-height: 1.6;
  border-bottom: 1px solid #fff;
  margin: 20px 10% 0;
  padding: 15px 0;
  text-shadow: 0px 0px 5px #111, 0px 0px 5px #111, 0px 0px 10px #111, 0px 0px 10px #111, 0px 0px 15px #111, 0px 0px 15px;
}
.pagelink_photo.elegant li .txtarea .ttl b {
  font-size: 3.8rem;
}
@media all and (max-width: 639px) {
  .pagelink_photo.elegant li .txtarea .ttl b {
    font-size: 2.6rem;
  }
}
.pagelink_photo.elegant li .txtarea .ttl:before {
  display: none;
}
.pagelink_photo.elegant li .txtarea .sub-txtarea {
  padding: 0;
  margin: 20px 10% 0;
  text-shadow: 0px 0px 5px #111, 0px 0px 5px #111, 0px 0px 10px #111, 0px 0px 10px #111, 0px 0px 15px #111, 0px 0px 15px;
}
.pagelink_photo.elegant li .photo:before {
  content: "";
  background: rgba(17, 17, 17, 0.8);
  background: linear-gradient(113deg, #111111 0%, rgba(17, 17, 17, 0.8) 100%);
}
.pagelink_photo.elegant li .decotxt01 {
  width: 100%;
  max-width: 495px;
  padding: 5px 20px;
  margin: 0 0 0 auto;
  background: #073829;
  font-size: 3rem;
  color: #fff;
  text-align: center;
  font-family: "Noto Serif JP", "YakuHanMP", "Noto Serif JP", "游明朝 Medium", "Yu Mincho", YuMincho, "Hiragino Mincho ProN", HGS明朝E, serif;
  font-weight: 400;
  letter-spacing: 0;
  text-transform: lowercase !important;
}
.pagelink_photo.elegant li .decotxt01:first-letter {
  text-transform: uppercase;
}
@media all and (max-width: 639px) {
  .pagelink_photo.elegant li .decotxt01 {
    font-size: 1.4rem;
  }
}
.pagelink_photo.elegant li .decotxt02 {
  position: absolute;
  bottom: -25px;
  right: 0;
  font-size: 12rem;
  color: #fff;
  opacity: 0.8;
  font-family: "Noto Serif JP", "YakuHanMP", "Noto Serif JP", "游明朝 Medium", "Yu Mincho", YuMincho, "Hiragino Mincho ProN", HGS明朝E, serif;
  font-weight: 400;
  letter-spacing: 0;
  text-transform: lowercase !important;
}
.pagelink_photo.elegant li .decotxt02:first-letter {
  text-transform: uppercase;
}
.pagelink_photo.elegant li .decotxt02::first-letter {
  color: #073829;
}
@media all and (max-width: 639px) {
  .pagelink_photo.elegant li .decotxt02 {
    font-size: 7rem;
  }
}
.pagelink_photo.elegant li .more {
  margin-top: 0px;
  position: absolute;
  font-size: 1.4rem;
  text-align: center;
  opacity: 1;
}
.pagelink_photo.elegant li .more span {
  border: 1px solid #073829;
  background: #073829;
  padding: 8px 0px;
  width: 100%;
  max-width: 250px;
  color: #fff;
  display: block;
  border-radius: 0px;
  margin: 0 10% 0 auto;
  position: relative;
}
.pagelink_photo.elegant li .more span:after {
  font-family: "Font Awesome 5 Free";
  content: "\f105";
  font-weight: 900;
  font-weight: 900;
  position: absolute;
  top: 0;
  right: 15px;
  height: 100%;
  display: grid;
  place-items: center;
  transition: all 0.3s 0s ease;
  color: #fff;
}
.pagelink_photo.elegant li:hover .more span {
  background: #fff;
  color: #333;
}
.pagelink_photo.elegant li:hover .more span:after {
  right: 10px;
  color: #333;
}
.pagelink_photo.elegant li:nth-child(2n) .txtarea {
  margin: 80px auto 0 0;
}
.pagelink_photo.elegant li:nth-child(2n) .decotxt01 {
  margin: 0 auto 0 0;
  background: #68482A;
}
.pagelink_photo.elegant li:nth-child(2n) .decotxt02 {
  left: 0;
}
.pagelink_photo.elegant li:nth-child(2n) .more span {
  margin: 0 auto 0 10%;
}
.pagelink_photo.elegant li.center .txtarea {
  width: 100%;
  max-width: 550px;
  margin: 80px auto 0;
}
.pagelink_photo.elegant li.center .decotxt01 {
  margin: 0 auto 0;
  max-width: 450px;
  background: #563b23;
}
.pagelink_photo.elegant li.center .decotxt02 {
  position: absolute;
  left: 0;
  right: 0;
  margin: 0 auto;
  text-align: center;
}
.pagelink_photo.elegant li.center .more span {
  margin: 0 auto 0;
}
.pagelink_photo li {
  position: relative;
  margin-bottom: 50px;
  margin: 0 0;
}
@media all and (max-width: 639px) {
  .pagelink_photo li {
    padding: 0px 0;
  }
}
.pagelink_photo li a {
  position: absolute;
  width: 100%;
  height: 100%;
  top: 0;
  left: 0;
  z-index: 190;
}
.pagelink_photo li .photo {
  position: relative;
  width: 100%;
  height: 550px;
  overflow: hidden;
}
.pagelink_photo li .photo:before {
  position: absolute;
  content: "";
  width: 100%;
  height: 0%;
  background: rgba(7, 56, 41, 0.8);
  background: linear-gradient(113deg, #073829 0%, rgba(104, 72, 42, 0.8) 100%);
  z-index: 100;
  bottom: 0;
  opacity: 0.7;
  transition: 0.8s;
}
.pagelink_photo li .photo:after {
  position: absolute;
  content: "";
  width: 100%;
  height: 100%;
  background: #000;
  z-index: 11;
  top: 0;
  bottom: 0;
  opacity: 0.6;
  transition: 0.8s;
  z-index: 1;
}
.pagelink_photo li .photo img {
  width: 100%;
  height: 100%;
  position: absolute;
  -o-object-fit: cover;
     object-fit: cover;
  transition: 0.8s;
}
@media all and (max-width: 1100px) {
  .pagelink_photo li .photo img {
    height: 850px;
  }
}
.pagelink_photo li .num {
  position: absolute;
  font-family: "Noto Serif JP", "YakuHanMP", "Noto Serif JP", "游明朝 Medium", "Yu Mincho", YuMincho, "Hiragino Mincho ProN", HGS明朝E, serif;
  font-weight: 400;
  letter-spacing: 0;
  text-transform: lowercase !important;
  left: 0;
  right: 0;
  margin: 0 auto;
  line-height: 11rem;
  top: 36%;
  font-size: 16rem;
  text-align: center;
  color: #fff;
  opacity: 0.6;
}
.pagelink_photo li .num:first-letter {
  text-transform: uppercase;
}
.pagelink_photo li .txtarea {
  position: absolute;
  width: 100%;
  height: auto;
  margin: auto;
  display: flex;
  justify-content: center;
  align-items: center;
  flex-direction: column;
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
  z-index: 110;
}
.pagelink_photo li .eng {
  font-family: "Noto Serif JP", "YakuHanMP", "Noto Serif JP", "游明朝 Medium", "Yu Mincho", YuMincho, "Hiragino Mincho ProN", HGS明朝E, serif;
  font-weight: 400;
  letter-spacing: 0;
  text-transform: lowercase !important;
  left: 0;
  right: 0;
  margin: 0 auto;
  line-height: 1;
  top: 0%;
  font-size: 5.8rem;
  text-align: center;
  color: #fff;
  opacity: 0.6;
}
.pagelink_photo li .eng:first-letter {
  text-transform: uppercase;
}
@media all and (max-width: 639px) {
  .pagelink_photo li .eng {
    font-size: 3rem;
  }
}
.pagelink_photo li .ttl {
  padding: 0 20px;
  color: #fff;
  font-size: 3.2rem;
  text-align: center;
  font-weight: bold;
  position: relative;
}
.pagelink_photo li .ttl:before {
  content: "";
  position: absolute;
  border-bottom: 1px solid #fff;
  max-width: 260px;
  margin: 0 auto;
  left: 0;
  right: 0;
  bottom: -15px;
}
.pagelink_photo li .sub-txtarea {
  display: block;
  color: #fff;
  padding: 20px 10% 0;
}
.pagelink_photo li .more {
  margin-top: 10px;
  position: absolute;
  bottom: 10%;
  right: 0;
  left: 0;
  font-size: 1.4rem;
  color: #fff;
  text-align: center;
  z-index: 110;
  opacity: 1;
}
.pagelink_photo li .more span {
  border: 1px solid #fff;
  padding: 3px 20px;
  color: #fff;
  border-radius: 50px;
}
.pagelink_photo li:hover .photo {
  overflow: hidden;
}
.pagelink_photo li:hover .photo:before {
  transition: 0.5s;
  position: absolute;
  content: "";
  width: 100%;
  height: 100%;
  z-index: 100;
}
.pagelink_photo li:hover .photo img {
  transition: 0.8s;
  transform: rotate(5deg) scale(1.2);
}
@media all and (max-width: 1367px) {
  .pagelink_photo li .num {
    font-size: 12rem;
    line-height: 8rem;
  }
}
@media all and (max-width: 1100px) {
  .pagelink_photo li .num {
    top: 26%;
  }
  .pagelink_photo li .sub-txt span {
    font-size: 1.6rem;
  }
  .pagelink_photo li .sub-min-txt {
    font-size: 1.2rem;
  }
}
@media all and (max-width: 639px) {
  .pagelink_photo li {
    width: 100%;
    height: 100%;
    padding: 0px 0;
    margin-bottom: 6px;
  }
  .pagelink_photo li .num {
    line-height: 6rem;
    top: 23%;
    font-size: 8rem;
  }
  .pagelink_photo li .ttl {
    font-size: 2rem;
  }
  .pagelink_photo li .sub-txt {
    bottom: 10%;
  }
  .pagelink_photo li .sub-txt span {
    padding: 2px 20px;
    font-size: 1rem;
  }
  .pagelink_photo li .sub-min-txt {
    font-size: 1.2rem;
  }
  .pagelink_photo li .txtarea .sub-min-txt {
    font-size: 1rem !important;
  }
}

.svg {
  display: flex;
  place-items: center;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  width: 120px;
  height: 120px;
  border-radius: 100%;
  position: relative;
  background-color: #073829;
  border: 1px solid #fff;
  fill: #fff;
}
.svg.center {
  margin: 0 auto;
}
.svg.type1 {
  background-color: transparent;
  border: 0px solid #fff;
}
.svg.type1 svg {
  fill: #073829;
}
.svg .ttl {
  color: #fff;
  font-size: 1.6rem;
  line-height: 1;
  padding: 5px 0;
  margin-top: 8px;
  font-weight: bold;
}
.svg img {
  width: 60px;
  height: 60px;
  filter: brightness(0) invert(1);
}
@media all and (max-width: 639px) {
  .svg img {
    width: 30px;
    height: 30px;
  }
}
.svg svg {
  width: 60px;
  height: 60px;
  fill: #fff;
}
@media all and (max-width: 639px) {
  .svg svg {
    width: 30px;
    height: 30px;
  }
}
@media all and (max-width: 639px) {
  .svg {
    width: 80px;
    height: 80px;
  }
  .svg .ttl {
    font-size: 1.1rem;
  }
}

.gallery.insta {
  display: grid;
  grid-template-columns: repeat(6, 1fr);
  gap: 3px 3px;
}
.gallery.insta p {
  display: none;
}
@media all and (max-width: 896px) {
  .gallery.insta {
    grid-template-columns: repeat(3, 1fr);
  }
}
@media all and (max-width: 639px) {
  .gallery.insta {
    grid-template-columns: repeat(3, 1fr);
  }
}
.gallery.insta figure {
  background: rgba(255, 255, 255, 0.2);
  display: block;
  text-align: center;
  padding: 0px;
  width: 100%;
  height: 14vw;
  overflow: hidden;
}
@media all and (max-width: 896px) {
  .gallery.insta figure {
    height: 28vw;
  }
}
@media all and (max-width: 639px) {
  .gallery.insta figure {
    height: 29vw;
  }
}
.gallery.insta figure img {
  width: 100%;
  height: 100%;
  -o-object-fit: cover;
     object-fit: cover;
  transition: all 0.4s ease;
}
.gallery.type1 figure {
  border: 10px solid #eee;
}
.gallery.type1 p {
  margin-top: -32px;
  position: relative;
  margin-left: auto;
  width: 90%;
  background-color: #eee;
  padding: 10px 0;
}
.gallery li {
  position: relative;
}
.gallery li a {
  position: absolute;
  width: 100%;
  height: 100%;
  top: 0;
  left: 0;
  z-index: 1;
}
.gallery li:hover img {
  opacity: 1;
  transform: scale(1.2);
  transition: all 0.4s ease;
}
.gallery li:hover a {
  background-color: rgba(255, 255, 255, 0.5);
}
.gallery li figure {
  background: rgba(246, 240, 223, 0.2);
  display: block;
  text-align: center;
  padding: 0px;
  width: 100%;
  height: 17vw;
  overflow: hidden;
}
@media all and (max-width: 896px) {
  .gallery li figure {
    height: 23vw;
  }
}
@media all and (max-width: 639px) {
  .gallery li figure {
    height: 33vw;
  }
}
.gallery li figure img {
  width: 100%;
  height: 100%;
  -o-object-fit: cover;
     object-fit: cover;
  transition: all 0.4s ease;
}
.gallery li p {
  font-size: 1.2rem;
  background-color: rgba(104, 72, 42, 0.2);
  font-weight: bold;
  padding: 0px 5px;
  text-align: center;
  margin-top: 5px;
}
@media all and (max-width: 896px) {
  .gallery li p {
    font-size: 12px;
  }
}

.gallerybox {
  position: relative;
  padding: 0px 0;
  margin: 60px 0;
}
.gallerybox .gallerybox_wrap {
  position: absolute;
  width: 40%;
  height: 100%;
  left: 0;
  top: 0;
  bottom: 0;
  margin: 0 auto 0 0;
  z-index: 5;
  display: flex;
  align-items: center;
  justify-content: center;
}
@media all and (max-width: 896px) {
  .gallerybox .gallerybox_wrap {
    width: 50%;
  }
}
.gallerybox .gallerybox_wrap .inner {
  width: 60%;
  height: auto;
  margin: auto;
}
.gallerybox .gallerybox_wrap .inner .bnr {
  text-align: center;
}
@media all and (max-width: 639px) {
  .gallerybox .gallerybox_wrap .inner .bnr img {
    width: 130px;
  }
}
@media all and (max-width: 896px) {
  .gallerybox .gallerybox_wrap .inner {
    width: 80%;
  }
}
@media all and (max-width: 639px) {
  .gallerybox .gallerybox_wrap .inner {
    padding: 30px 0;
  }
}
@media all and (max-width: 639px) {
  .gallerybox .gallerybox_wrap {
    width: 90%;
    height: 90%;
    margin: auto;
    left: 0;
    right: 0;
    background-color: rgba(255, 255, 255, 0.8);
  }
}
.gallerybox.type1 {
  background-color: #073829;
}
.gallerybox.type1 img {
  opacity: 0.3;
}
.gallerybox.type2 .gallerybox_wrap {
  width: 100%;
  max-width: 100%;
  height: 100%;
  left: 0;
  right: 0;
  top: 0;
  bottom: 0;
  margin: auto;
}
.gallerybox.type2 .gallerybox_wrap .inner {
  width: 100%;
  display: grid;
  place-items: center;
}

.blog_wrap {
  background-color: #f9f9f9;
}

.column {
  width: 100%;
  height: 100%;
  max-width: 1180px;
  margin: 0 auto;
  padding: 40px 0;
  display: flex;
  justify-content: space-between;
  gap: 0 40px;
}
@media screen and (max-width: 1200px) {
  .column {
    max-width: 1160px;
    padding: 40px 20px;
    overflow: hidden;
  }
}
.column .mainwrap {
  width: 72%;
}
.column .mainwrap section {
  margin-bottom: 80px;
}
.column .sidewrap {
  width: 28%;
}
.column .sidewrap .child {
  background: #fff;
  padding: 8px;
  margin-bottom: 40px;
}
.column .sidewrap .ttl {
  text-align: center;
  padding: 8px 0;
  margin-bottom: 20px;
  position: relative;
}
.column .sidewrap .ttl:before {
  content: "";
  position: absolute;
  background-color: #073829;
  width: 80px;
  height: 2px;
  margin: 0 auto;
  bottom: 0;
  left: 0;
  right: 0;
}
.column .sidewrap .sticky {
  top: 40px;
  position: -webkit-sticky;
  position: sticky;
  z-index: 1;
}
@media all and (max-width: 896px) {
  .column .sidewrap .sticky {
    position: static;
  }
}
@media all and (max-width: 1100px) {
  .column {
    padding: 32px 0;
    width: 100%;
    max-width: 780px;
    margin: 0 auto 32px;
    display: block;
  }
  .column .mainwrap {
    width: 100%;
  }
  .column .sidewrap {
    width: 100%;
    padding: 0 0 0;
  }
}

@media all and (max-width: 639px) {
  .column {
    width: 100%;
    margin-bottom: 30px;
    display: block;
  }
  .column .mainwrap {
    width: 100%;
    margin: 0 auto 20px;
  }
  .column .sidewrap {
    width: 100%;
    position: static;
    margin: 0 auto 32px;
    height: auto;
    padding: 0;
  }
}
.smenu {
  background-color: #e4e4e4;
}
.smenu li {
  font-weight: bold;
  font-size: 12px;
  border-bottom: 1px solid #fff;
}
.smenu a {
  padding: 10px 0px;
  text-indent: 1em;
  display: block;
  zoom: 1;
  text-decoration: none;
  cursor: pointer;
}
.smenu a:hover {
  text-decoration: none;
  background: #eee;
}
.smenu a:before {
  font-family: "Font Awesome 5 Free";
  content: "\f0da";
  margin-right: 5px;
}
.smenu a:link, .smenu a:visited {
  color: #333;
}

.menulist li {
  font-weight: normal;
  border-top: 1px solid #fff;
  padding: 5px 20px;
  background-color: #073829;
  background-color: #0d654a;
  cursor: pointer;
  position: relative;
}
.menulist li:hover {
  z-index: 1;
  transition: 0.3s;
  background-color: #094633;
}
.menulist li:before {
  position: absolute;
  top: 0;
  left: 0px;
  width: 2em;
  height: 100%;
  display: grid;
  place-items: center;
  font-family: "Font Awesome 5 Free";
  font-family: "Font Awesome 5 Free";
  content: "\f0da";
  font-weight: 900;
  color: #fff;
  z-index: 1;
}
.menulist a {
  display: block;
  zoom: 1;
  color: #fff;
}
@media all and (max-width: 639px) {
  .menulist {
    display: grid;
    grid-template-columns: repeat(2, 1fr);
  }
  .menulist li {
    line-height: 1.2;
    padding: 8px 8px 8px 20px;
    border-right: 1px solid #fff;
    font-size: 1.1rem;
  }
  .menulist li:nth-child(2n) {
    border-right: 0px solid #fff;
  }
}

.menulist_ttl {
  font-size: 1.8rem;
  font-weight: normal;
  text-align: center;
  padding: 16px 0;
  background-color: #073829;
  font-weight: bold;
  color: #fff;
}
.menulist_ttl:before {
  font-family: "Font Awesome 5 Free";
  content: "\f0ca";
  font-weight: 900;
  margin-right: 5px;
}
@media all and (max-width: 639px) {
  .menulist_ttl {
    font-size: 1.4rem;
    padding: 4px 0;
  }
}

.pages {
  text-align: center;
  margin-top: 30px;
}
.pages .page_next,
.pages .page_prev {
  display: inline-block;
  margin: 0 20px;
}
.pages .page_next a,
.pages .page_prev a {
  color: #073829;
  padding: 4px 5px;
  background: #fff;
  font-size: 12px;
}

#main .ttl,
.mainwrap .ttl,
.list-area .ttl {
  font-size: 2.2rem;
  margin: 50px auto;
  padding: 10px 0px;
  text-align: center;
  position: relative;
}
#main .ttl:before,
.mainwrap .ttl:before,
.list-area .ttl:before {
  content: "";
  position: absolute;
  background-color: #073829;
  width: 80px;
  height: 2px;
  margin: 0 auto;
  bottom: 0;
  left: 0;
  right: 0;
}
#main .blog_list,
.mainwrap .blog_list,
.list-area .blog_list {
  display: block;
}
#main .blog_list.type1 > li,
.mainwrap .blog_list.type1 > li,
.list-area .blog_list.type1 > li {
  padding: 30px 10px;
  border-bottom: 3px solid #eee;
}
#main .blog_list > li,
.mainwrap .blog_list > li,
.list-area .blog_list > li {
  padding: 10px;
  margin-bottom: 10px;
  display: flex;
  border: 1px solid #eee;
  background-color: #fff;
}
#main .blog_list > li .blog_ttl,
.mainwrap .blog_list > li .blog_ttl,
.list-area .blog_list > li .blog_ttl {
  margin-bottom: 5px;
}
@media all and (max-width: 639px) {
  #main .blog_list > li .blog_ttl,
.mainwrap .blog_list > li .blog_ttl,
.list-area .blog_list > li .blog_ttl {
    font-size: 1.2rem;
  }
}
#main .blog_list > li .blog_txt,
.mainwrap .blog_list > li .blog_txt,
.list-area .blog_list > li .blog_txt {
  display: -webkit-box;
  -webkit-box-orient: vertical;
  -webkit-line-clamp: 2;
}
#main .blog_list > li .blog_img,
.mainwrap .blog_list > li .blog_img,
.list-area .blog_list > li .blog_img {
  width: 300px;
  height: 160px;
}
@media all and (max-width: 639px) {
  #main .blog_list > li .blog_img,
.mainwrap .blog_list > li .blog_img,
.list-area .blog_list > li .blog_img {
    width: 180px;
    height: 100px;
  }
}
#main .blog_list > li .blog_detail,
.mainwrap .blog_list > li .blog_detail,
.list-area .blog_list > li .blog_detail {
  background: transparent;
  width: 100%;
  margin: 0;
  padding: 10px 20px;
  position: relative;
}

.sidewrap .blog_list,
#side .blog_list {
  display: block;
}
.sidewrap .blog_list > li,
#side .blog_list > li {
  padding: 10px;
  margin-bottom: 10px;
  background-color: #fff;
  display: flex;
  position: relative;
}
.sidewrap .blog_list > li:before,
#side .blog_list > li:before {
  position: absolute;
  top: 0;
  left: 0;
  background-color: #073829;
  color: #fff;
  width: 25px;
  height: 25px;
  display: grid;
  place-items: center;
  z-index: 1;
}
.sidewrap .blog_list > li:nth-child(1n):before,
#side .blog_list > li:nth-child(1n):before {
  content: "1";
}
.sidewrap .blog_list > li:nth-child(2n):before,
#side .blog_list > li:nth-child(2n):before {
  content: "2";
}
.sidewrap .blog_list > li:nth-child(3n):before,
#side .blog_list > li:nth-child(3n):before {
  content: "3";
}
.sidewrap .blog_list > li .blog_ttl,
#side .blog_list > li .blog_ttl {
  font-size: 1.4rem;
  margin-bottom: 0;
}
@media all and (max-width: 639px) {
  .sidewrap .blog_list > li .blog_ttl,
#side .blog_list > li .blog_ttl {
    font-size: 1.2rem;
  }
}
.sidewrap .blog_list > li .blog_txt,
#side .blog_list > li .blog_txt {
  display: none;
}
.sidewrap .blog_list > li .blog_category,
.sidewrap .blog_list > li .blog_date,
#side .blog_list > li .blog_category,
#side .blog_list > li .blog_date {
  font-size: 1.1rem;
  padding: 0;
}
.sidewrap .blog_list > li .blog_img,
#side .blog_list > li .blog_img {
  width: 80px;
  height: 80px;
}
.sidewrap .blog_list > li .blog_detail,
#side .blog_list > li .blog_detail {
  background: transparent;
  width: 100%;
  margin: 0;
  padding: 0px 10px;
  position: relative;
  flex: 1;
}

.profile_wrap {
  padding: 30px;
}
.profile_wrap figure {
  border-radius: 50%;
  text-align: center;
  margin: 0 auto 20px;
  width: 100px;
  height: 100px;
  overflow: hidden;
  border: 1px solid #ccc;
  display: grid;
  place-items: center;
}
.profile_wrap figure img {
  width: 80%;
  height: 80%;
  -o-object-fit: contain;
     object-fit: contain;
  -o-object-position: center center;
     object-position: center center;
}
.profile_wrap .subtxt {
  text-align: center;
  font-size: 1.2rem;
}
.profile_wrap .blog_name {
  text-align: center;
  font-size: 1.8rem;
  margin: 0 0 25px;
  position: relative;
}
.profile_wrap .blog_name:before {
  content: "";
  position: absolute;
  background-color: #073829;
  width: 80px;
  height: 2px;
  margin: 0 auto;
  bottom: -12px;
  left: 0;
  right: 0;
}
.profile_wrap p {
  font-size: 90%;
}

.blog_about {
  position: relative;
  width: 100%;
  height: 100%;
  overflow: hidden;
  padding: 50px 0;
}
.blog_about:before {
  content: "";
  position: absolute;
  width: 100%;
  height: 100%;
  background-repeat: no-repeat;
  background-size: cover;
  background-position: center center;
  z-index: -2;
  top: 0;
  left: 0;
}
.blog_about.type1:before {
  background-image: url(../images/img_dneko/bg01.jpg);
}
.blog_about figure {
  border-radius: 50%;
  text-align: center;
  margin: 10px auto;
  width: 100px;
  height: 100px;
  overflow: hidden;
  border: 1px solid #ccc;
  display: grid;
  place-items: center;
}
.blog_about figure img {
  width: 80%;
  height: 80%;
  -o-object-fit: contain;
     object-fit: contain;
  -o-object-position: center center;
     object-position: center center;
}
.blog_about .mtext1 {
  margin: 20px 0;
}

.blog_article {
  padding: 50px 40px;
  background-color: #fff;
  min-height: 500px;
  position: relative;
}
.blog_article p {
  line-height: 2.2;
}
.blog_article h1 {
  font-size: 2.2rem;
  margin: 20px 0;
  font-weight: bold;
}
.blog_article .blog_date {
  line-height: 1.3;
  color: #aaa;
  display: block;
}
.blog_article .thumbnail {
  margin: 0 -40px;
}
.blog_article .thumbnail img {
  width: 100%;
  height: auto;
}
@media all and (max-width: 639px) {
  .blog_article .thumbnail {
    margin: 0 -20px;
  }
}
.blog_article h2 {
  font-size: 2.2rem;
  margin: 50px 0;
  padding: 10px 0px;
  font-weight: bold;
  position: relative;
  border-bottom: 1px solid #aaa;
}
.blog_article h2:before {
  position: absolute;
  content: "";
  width: 10px;
  height: 55px;
  background-color: #073829;
  top: 0;
  left: -40px;
}
.blog_article h3 {
  font-size: 2.2rem;
  margin: 20px 0;
  font-weight: bold;
}
.blog_article h3:before {
  font-family: "Font Awesome 5 Free";
  content: "O";
  font-weight: 900;
  color: #073829;
  margin-right: 8px;
}
.blog_article .blog_category {
  color: #fff;
  display: inline-block;
  position: absolute;
  top: 0;
  left: 10px;
  margin: 0 0 0 0;
  text-align: center;
  z-index: 1;
  font-size: 90%;
}
.blog_article .blog_category:before {
  content: "";
  width: calc(100% + 20px);
  height: 100%;
  position: absolute;
  left: -10px;
  background-color: #073829;
  z-index: -1;
}
.blog_article .blog_date {
  display: block;
  font-size: 90%;
}
@media all and (max-width: 639px) {
  .blog_article {
    padding: 50px 20px;
  }
  .blog_article h2:before {
    width: 5px;
    height: 55px;
    left: -20px;
  }
}

.category_nav {
  border: 1px solid #dddddd;
}
.category_nav li a {
  display: block;
  padding: 15px;
  border-bottom: 1px dotted #dddddd;
  background-color: #ffffff;
}
.category_nav li a:before {
  font-family: "Font Awesome 5 Free";
  content: "\f0a9";
  font-weight: 900;
  margin-right: 5px;
}
.category_nav li a:hover {
  background: #f2f2f2;
}
.category_nav li:last-child a {
  border-bottom: none;
}

.blog_main_list {
  display: grid;
  grid-template-columns: repeat(2, 1fr);
  gap: 30px 30px;
}
.blog_main_list > li {
  width: 100%;
  margin: 0 auto;
  border: 1px solid #f2f2f2;
  background-color: #fff;
  position: relative;
  transition: 0.2s;
  position: relative;
}
.blog_main_list > li:hover .blog_img img {
  opacity: 1;
  transform: scale(1.2);
}
.blog_main_list > li:hover .blog_ttl {
  transition: 0.2s;
}
.blog_main_list > li > a {
  position: absolute;
  width: 100%;
  height: 100%;
  top: 0;
  left: 0;
  z-index: 10;
}
.blog_main_list > li .blog_detail {
  padding: 20px;
}
.blog_main_list > li .blog_detail .blog_category,
.blog_main_list > li .blog_detail .blog_txt {
  display: none;
}
.blog_main_list > li .blog_detail .blog_date {
  font-size: 1.2rem;
  color: #888;
}
.blog_main_list > li .blog_detail .blog_date:before {
  font-family: "Font Awesome 5 Free";
  content: "\f017";
  font-weight: 900;
  margin-right: 5px;
  color: #aaa;
}
.blog_main_list > li .blog_ttl {
  font-size: 2rem;
  margin: 5px 0;
  line-height: 1;
  font-weight: bold;
  transition: 0.2s;
  color: #073829;
}
@media all and (max-width: 639px) {
  .blog_main_list > li .blog_ttl {
    font-size: 1.4rem;
  }
}
.blog_main_list > li .blog_img {
  width: 100%;
  height: 200px;
  overflow: hidden;
  position: relative;
  z-index: 0;
}
.blog_main_list > li .blog_img img {
  width: 100%;
  height: 100%;
  -o-object-fit: cover;
     object-fit: cover;
  transition: all 0.4s ease;
}
@media all and (max-width: 896px) {
  .blog_main_list > li .blog_img {
    height: 200px;
  }
}
@media all and (max-width: 639px) {
  .blog_main_list {
    grid-template-columns: repeat(1, 1fr);
    gap: 0px 0px;
  }
}

.blog_list {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 10px 10px;
}
.blog_list > li {
  width: 100%;
  margin: 0 auto;
  position: relative;
  padding: 15px 10px;
  transition: 0.2s;
  position: relative;
}
.blog_list > li:hover .blog_img img {
  opacity: 1;
  transform: scale(1.2);
}
.blog_list > li:hover .blog_ttl {
  color: #073829;
  transition: 0.2s;
}
.blog_list > li > a {
  position: absolute;
  width: 100%;
  height: 100%;
  top: 0;
  left: 0;
  z-index: 10;
}
.blog_list > li .blog_detail {
  background-color: #fff;
  width: calc(100% - 50px);
  margin: -60px 0 0 auto;
  padding: 20px;
  z-index: 1;
  position: relative;
}
.blog_list > li .blog_ttl {
  font-size: 1.8rem;
  line-height: 1.6;
  font-weight: bold;
  transition: 0.2s;
}
@media all and (max-width: 639px) {
  .blog_list > li .blog_ttl {
    font-size: 1.4rem;
  }
}
.blog_list > li .blog_txt {
  line-height: 1.5;
  font-size: 1.2rem;
  display: -webkit-box;
  -webkit-box-orient: vertical;
  -webkit-line-clamp: 2;
  overflow: hidden;
  display: none;
}
@media all and (max-width: 639px) {
  .blog_list > li .blog_txt {
    font-size: 12px;
  }
}
.blog_list > li .blog_img {
  width: 100%;
  height: 260px;
  overflow: hidden;
  position: relative;
  z-index: 0;
}
.blog_list > li .blog_img img {
  width: 100%;
  height: 100%;
  -o-object-fit: cover;
     object-fit: cover;
  transition: all 0.4s ease;
}
.blog_list > li .blog_category {
  line-height: 1.3;
  color: #073829;
  padding: 5px 0;
}
@media all and (max-width: 896px) {
  .blog_list > li .blog_img {
    height: 200px;
  }
}
@media all and (max-width: 639px) {
  .blog_list {
    grid-template-columns: repeat(1, 1fr);
    gap: 0px 0px;
  }
}

.recommended_list {
  display: grid;
  grid-template-columns: repeat(2, 1fr);
  gap: 30px 30px;
}
.recommended_list > li {
  width: 100%;
  margin: 0 auto;
  border: 1px solid #f2f2f2;
  padding: 20px;
  position: relative;
  transition: 0.2s;
  position: relative;
}
.recommended_list > li:hover .blog_img img {
  opacity: 1;
  transform: scale(1.2);
}
.recommended_list > li:hover .blog_ttl {
  transition: 0.2s;
}
.recommended_list > li > a {
  position: absolute;
  width: 100%;
  height: 100%;
  top: 0;
  left: 0;
  z-index: 10;
}
.recommended_list > li .blog_detail .blog_category,
.recommended_list > li .blog_detail .blog_txt,
.recommended_list > li .blog_detail .blog_date {
  display: none;
}
.recommended_list > li .blog_ttl {
  font-size: 1.6rem;
  margin: 15px 0 0;
  line-height: 1;
  font-weight: bold;
  transition: 0.2s;
  color: #073829;
}
@media all and (max-width: 639px) {
  .recommended_list > li .blog_ttl {
    font-size: 1.4rem;
  }
}
.recommended_list > li .blog_img {
  width: 100%;
  height: 200px;
  overflow: hidden;
  position: relative;
  z-index: 0;
}
.recommended_list > li .blog_img img {
  width: 100%;
  height: 100%;
  -o-object-fit: cover;
     object-fit: cover;
  transition: all 0.4s ease;
}
@media all and (max-width: 896px) {
  .recommended_list > li .blog_img {
    height: 200px;
  }
}
@media all and (max-width: 639px) {
  .recommended_list {
    grid-template-columns: repeat(1, 1fr);
    gap: 0px 0px;
  }
}

.blog_month ul {
  display: flex;
  flex-wrap: wrap;
}
.blog_month ul li {
  width: 49%;
  margin-bottom: 5px;
}
.blog_month ul li:nth-child(2n) {
  margin-left: 2%;
}
.blog_month ul li a {
  display: block;
  width: 100%;
  color: #333;
  font-size: 12px;
  padding: 4px 0;
  text-align: center;
  letter-spacing: 0;
  background: #fff;
  border: 1px solid #eee;
}
.blog_month ul li a:hover {
  color: #073829;
}

.blog_category_list ul {
  display: flex;
  flex-wrap: wrap;
  flex-direction: column;
  gap: 5px 0px;
}
.blog_category_list ul li {
  width: 100%;
}
.blog_category_list ul li a {
  color: #333;
  font-size: 1.2rem;
  display: block;
  width: 100%;
  padding: 5px;
  text-align: left;
  letter-spacing: 0;
  background: #fff;
  border-bottom: 1px solid #eee;
  position: relative;
  transition: all 0.2s ease-in;
}
.blog_category_list ul li a:after {
  font-family: "Font Awesome 5 Free";
  content: "\f105";
  font-weight: 900;
  position: absolute;
  right: 8px;
  top: 0;
  bottom: 0;
  display: grid;
  place-items: center;
  transition: all 0.1s ease-in;
}
.blog_category_list ul li a:hover {
  color: #073829;
  background-color: rgba(242, 242, 242, 0.8);
}
.blog_category_list ul li a:hover:after {
  right: 4px;
}

.tagcloud a {
  display: inline-block;
  margin: 5px 5px 5px 0;
  padding: 2px 8px;
  border-radius: 15px;
  background: #f4f4f4;
  color: #666;
  font-size: 12px !important;
  font-weight: bold;
}
.tagcloud a:hover {
  opacity: 0.6;
}

.topic-box {
  display: table;
  margin: 60px auto;
  width: 100%;
}
.topic-box .ttl-area {
  display: table-cell;
  width: 25%;
  vertical-align: middle;
  padding: 0px 40px;
}
.topic-box .ttl-area.type1 {
  vertical-align: inherit;
}
.topic-box .ttl-area.sticky {
  vertical-align: top;
  position: -webkit-sticky;
  position: sticky;
}
.topic-box .ttl-area .mtitle {
  text-align: right;
}
.topic-box .ttl-area.type1 {
  background-color: #fff;
}
.topic-box .ttl-area.type1 .mtitle .eng,
.topic-box .ttl-area.type1 .mtitle .ja {
  color: #fff;
}
.topic-box .list-area {
  display: table-cell;
  width: 75%;
  padding: 0px 60px;
}
@media all and (max-width: 896px) {
  .topic-box {
    display: block;
  }
  .topic-box .ttl-area {
    display: block;
    width: 100%;
    padding: 20px 0px;
  }
  .topic-box .ttl-area .mtitle {
    text-align: center;
    margin-bottom: 0px;
  }
  .topic-box .list-area {
    display: block;
    width: 100%;
    padding: 40px 30px;
  }
}
@media all and (max-width: 639px) {
  .topic-box {
    display: block;
    padding: 40px 0;
  }
  .topic-box .ttl-area {
    display: block;
    width: 100%;
    padding: 10px 0 10px;
  }
  .topic-box .list-area {
    padding: 20px 20px;
  }
}

.blog_header {
  display: flex;
  justify-content: space-between;
  padding: 10px;
  align-items: center;
}
.blog_header .logo_area figure {
  width: 300px;
  height: 75px;
  position: relative;
  /* @include atag;
  a {
      background: #111, 0.5;
      &:hover {
          background: #111, 0.5;
      }
  } */
}
.blog_header .logo_area figure img {
  width: 100%;
  height: 100%;
  -o-object-fit: contain;
     object-fit: contain;
  -o-object-position: top left;
     object-position: top left;
}
.blog_header .nav_area .nav_wrap ul {
  display: flex;
}
.blog_header .nav_area .nav_wrap ul li {
  font-weight: bold;
  padding: 5px 10px;
}
.blog_header .nav_area .contact_wrap {
  display: flex;
  justify-content: flex-end;
  align-items: center;
}
.blog_header .nav_area .contact_wrap .txtbtn,
.blog_header .nav_area .contact_wrap .linkbtn {
  line-height: 1.2;
  margin: 0 10px;
  font-weight: bold;
  transition: 0.3s;
  text-align: center;
}
.blog_header .nav_area .contact_wrap .txtbtn a,
.blog_header .nav_area .contact_wrap .linkbtn a {
  padding: 8px 25px;
}
.blog_header .nav_area .contact_wrap .txtbtn a:hover,
.blog_header .nav_area .contact_wrap .linkbtn a:hover {
  opacity: 0.6;
}
.blog_header .nav_area .contact_wrap .txtbtn span,
.blog_header .nav_area .contact_wrap .linkbtn span {
  font-size: 1.2rem;
  display: block;
  color: #888;
}
.blog_header .nav_area .contact_wrap .txtbtn a {
  font-size: 2rem;
}
.blog_header .nav_area .contact_wrap .linkbtn a {
  font-size: 1.8rem;
  background-color: #073829;
  color: #fff;
}
.blog_header .nav_area .contact_wrap .linkbtn.sub a {
  background-color: #68482A;
}
.blog_header .nav_area .contact_wrap .linkbtn.circle {
  margin: 0 5px;
}
.blog_header .nav_area .contact_wrap .linkbtn.circle a {
  border-radius: 50%;
  padding: 0;
  width: 45px;
  height: 45px;
  display: grid;
  place-items: center;
}
.blog_header .nav_area .contact_wrap .linkbtn.radius a {
  border-radius: 20px;
}
@media all and (max-width: 1100px) {
  .blog_header {
    display: block;
    text-align: center;
  }
  .blog_header .logo_area figure {
    margin: 0 auto;
  }
  .blog_header .logo_area figure img {
    -o-object-position: center center;
       object-position: center center;
  }
  .blog_header .nav_area .contact_wrap {
    display: none;
  }
  .blog_header .nav_area .nav_wrap {
    margin: 10px auto 0;
  }
  .blog_header .nav_area .nav_wrap ul {
    justify-content: center;
  }
}
@media all and (max-width: 896px) {
  .blog_header {
    padding: 10px 5px 5px;
  }
  .blog_header .logo_area figure {
    height: 40px;
  }
  .blog_header .nav_area .nav_wrap {
    margin: 5px auto 0;
  }
  .blog_header .nav_area .nav_wrap ul {
    overflow-y: scroll;
    font-size: 1.3rem;
    flex-wrap: nowrap;
    gap: 1em;
    margin: 0;
    overflow-x: auto;
    white-space: nowrap;
  }
}
@media all and (max-width: 639px) {
  .blog_header .nav_area .nav_wrap ul {
    overflow-y: scroll;
    font-size: 1.3rem;
    flex-wrap: nowrap;
    gap: 1em;
    justify-content: flex-start;
    margin: 0;
    overflow-x: auto;
    white-space: nowrap;
  }
  .blog_header .nav_area .nav_wrap ul li {
    padding: 5px 5px;
  }
}

.blog_footer {
  max-width: 1180px;
  margin: 0 auto;
  padding: 120px 0;
  position: relative;
  z-index: 2;
}
@media screen and (max-width: 1200px) {
  .blog_footer {
    width: 100%;
    max-width: 1160px;
    padding: 60px 20px;
  }
}
@media all and (max-width: 896px) {
  .blog_footer {
    width: 100%;
    max-width: 780px;
  }
}
.blog_footer .ttl {
  padding: 8px 0;
  margin-bottom: 20px;
  position: relative;
  border-bottom: #aaa 1px solid;
}

.blog_copyright {
  background-color: #f2f2f2;
  text-align: center;
  margin: 0 auto 0;
  padding: 24px 0px 24px;
  font-size: 1.4rem;
  position: relative;
  z-index: 2;
  color: #555;
}
.blog_copyright .logo_area {
  height: 60px;
  margin: 0 0 10px;
}
.blog_copyright .logo_area img {
  width: 100%;
  height: 100%;
  -o-object-fit: contain;
     object-fit: contain;
}
.blog_copyright small {
  margin-top: 10px;
}
@media all and (max-width: 896px) {
  .blog_copyright {
    font-size: 12px;
    margin-top: 0;
    padding: 20px 0 80px;
  }
}

.calendar_head {
  color: #fefefe;
  background: #999;
  text-align: center;
  padding: 4px;
}

.calendar-box {
  display: flex;
  justify-content: space-between;
  flex-wrap: wrap;
  font-size: 0.9em;
}
.calendar-box.j-center {
  justify-content: center;
}
.calendar-box.j-center div.calendar {
  width: 100%;
}
@media all and (max-width: 639px) {
  .calendar-box.j-center div.calendar {
    margin-bottom: 0px;
  }
}
.calendar-box .loading {
  width: 100%;
  max-height: 250px;
  display: block;
  place-items: center;
}
.calendar-box .loading .spinner-loader {
  display: block;
  margin: 0 auto;
}
.calendar-box div.calendar {
  width: 49%;
}
@media all and (max-width: 639px) {
  .calendar-box div.calendar {
    width: 100%;
    margin-bottom: 10px;
  }
}
.calendar-box table {
  width: 100%;
  text-align: center;
  background-color: #fff;
}
.calendar-box table th,
.calendar-box table td {
  width: 14.28%;
  font-weight: normal;
  padding: 5px;
  height: 45px;
  font-size: 1.3rem;
  color: #555;
  background-color: #f2f2f2;
}
@media all and (max-width: 639px) {
  .calendar-box table th,
.calendar-box table td {
    height: 40px;
    font-size: 1.2rem;
  }
}
.calendar-box table th {
  background: #f2f2f2;
  vertical-align: middle;
  font-weight: 600;
  text-align: center;
}
.calendar-box table td {
  background: #fefefe;
}
.calendar-box th.sun,
.calendar-box td.sun {
  color: #d81e1e;
}
.calendar-box th.sat,
.calendar-box td.sat {
  color: #0083de;
}
.calendar-box .item-td {
  background: #18c08d;
}
.calendar-box .item-td .days {
  color: #333;
}
.calendar-box .item {
  font-size: 1.1rem;
  text-align: center;
  color: rgba(104, 72, 42, 0.8);
  background-color: rgba(104, 72, 42, 0.1);
}
.calendar-box p {
  text-align: center;
  font-size: 1.4rem;
  margin: 5px auto;
}
.calendar-box p .off {
  color: rgba(216, 30, 30, 0.2);
}

.calendar-arrow {
  display: flex;
  flex-wrap: wrap;
  justify-content: space-between;
  text-align: center;
  margin-bottom: 5px;
  font-size: 1.3rem;
}
.calendar-arrow a {
  display: block;
  background: #eee;
  padding: 5px 8px;
  cursor: pointer;
}
.calendar-arrow a:link, .calendar-arrow a:visited {
  color: #333;
}
.calendar-arrow a:first-of-type {
  margin-right: 5px;
}
.calendar-arrow a.arrow-before:before {
  font-family: "Font Awesome 5 Free";
  content: "\f0d9";
  font-weight: 900;
  margin-right: 5px;
}
.calendar-arrow a.arrow-after:after {
  font-family: "Font Awesome 5 Free";
  content: "\f0da";
  font-weight: 900;
  margin-left: 5px;
}

.calendar_arrow .arrow-after {
  float: right;
  background: #073829;
  color: #fff;
  padding: 0 10px;
}

.calendar_arrow .arrow-before {
  float: left;
  background: #073829;
  color: #fff;
  padding: 0 10px;
}

.calendar_info .off {
  color: rgba(216, 30, 30, 0.2);
}
.calendar_info .yotei1 {
  color: rgba(216, 30, 30, 0.2);
}
.calendar_info .yotei2 {
  color: rgba(255, 255, 89, 0.2);
}
.calendar_info .yotei3 {
  color: rgba(0, 131, 222, 0.2);
}

.calendar-box td.calendar .item1,
.calendar-box td.calendar .item2,
.calendar-box td.calendar .item3 {
  display: none;
}
.calendar-box td.calendar.off {
  background-color: rgba(216, 30, 30, 0.2) !important;
}
.calendar-box td.calendar.yotei1 {
  background-color: rgba(216, 30, 30, 0.2) !important;
}
.calendar-box td.calendar.yotei2 {
  background-color: rgba(255, 255, 89, 0.2) !important;
}
.calendar-box td.calendar.yotei3 {
  background-color: rgba(0, 131, 222, 0.2) !important;
}
.calendar-box td.calendar.holiday {
  background-color: rgba(216, 30, 30, 0.2) !important;
}
.calendar-box td.calendar.kara {
  background: none !important;
}

.product_detail_wrap {
  display: flex;
  justify-content: space-between;
}
.product_detail_wrap .images {
  width: 49%;
}
.product_detail_wrap .images .photo {
  text-align: center;
  background-color: #f2f2f2;
  width: 100%;
  height: 280px;
}
.product_detail_wrap .images .photo img {
  width: 100%;
  height: 100%;
  -o-object-fit: contain;
     object-fit: contain;
}
.product_detail_wrap .detail {
  width: 49%;
}
@media all and (max-width: 639px) {
  .product_detail_wrap {
    display: block;
  }
  .product_detail_wrap .images {
    width: 100%;
  }
  .product_detail_wrap .detail {
    width: 100%;
  }
}

.price_area .price {
  font-size: 3rem;
  color: #073829;
  font-weight: bold;
}
.price_area .price.sub {
  color: #68482A;
}
.price_area .price span {
  font-size: 1.6rem;
  color: #333;
  font-weight: bold;
}
@media all and (max-width: 639px) {
  .price_area .price {
    /* font-size: 1.5rem;
    span {
      font-size: 1rem;
    } */
  }
}
.price_area .detail {
  font-size: 80%;
}

.total_bx {
  text-align: center;
  background-color: #fff;
  border: 2px solid #073829;
  padding: 16px 0;
  margin-bottom: 16px;
  margin-top: 50px;
}
.total_bx.sub {
  border: 2px solid #68482A;
}
.total_bx.sub input#total {
  color: #68482A;
}
.total_bx input#total {
  border: 0px solid #fff;
  font-size: 2.3rem;
  width: 8em;
  color: #073829;
  background: #fff;
  text-align: right;
}

.price_select {
  position: relative;
  width: 100px;
  height: auto;
  padding: 5px 10px 5px 5px;
  margin: 10px 0;
  border: 1px solid #ccc;
  border-radius: 5px;
  background: #ffffff;
  /* 
  &:after {
    font-family: "Font Awesome 5 Free";
    content: "\f105";
    font-weight: 900;
    position: absolute;
    display: grid;
    top: 0;
    bottom: 0;
    right: 10%;
    place-items: center;
    color: #fff;
    z-index: 1;
    transition: 0.3s;
  } */
}

.comment {
  font-size: 1.4rem;
  letter-spacing: 0;
  padding: 0 5px;
  color: #333;
}
@media all and (max-width: 639px) {
  .comment {
    font-size: 12px;
  }
}

.slide_list {
  position: relative;
}
.slide_list .ribbon {
  position: absolute;
  top: -59px;
  right: -95px;
  width: 300px;
  height: 308px;
  overflow: hidden;
  z-index: 1;
}
@media all and (max-width: 639px) {
  .slide_list .ribbon {
    transform: scale(0.7);
    top: -88px;
    right: -111px;
  }
}
.slide_list .ribbon span {
  display: inline-block;
  position: absolute;
  padding: 7px 0;
  left: -12px;
  top: 89px;
  width: 260px;
  text-align: center;
  font-size: 18px;
  line-height: 16px;
  background: #68482A;
  color: #fff;
  letter-spacing: 0.05em;
  transform: rotate(32deg);
  box-shadow: 0 2px 5px rgba(0, 0, 0, 0.2);
}
.slide_list .ribbon span:before, .slide_list .ribbon span:after {
  position: absolute;
  content: "";
  border-top: 10px solid #442f1b;
  bottom: -10px;
  z-index: -1;
}
.slide_list .ribbon span:before {
  border-left: 6px solid transparent;
  border-right: 17px solid transparent;
  left: 0px;
}
.slide_list .ribbon span:after {
  border-left: 6px solid transparent;
  border-right: 12px solid transparent;
  right: 0px;
}
.slide_list .mtitle_slide_list {
  position: absolute;
  z-index: 100;
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
  background: white;
  width: 300px;
  height: 300px;
  margin: auto;
  display: flex;
  text-align: center;
  align-items: center;
  flex-direction: column;
  justify-content: center;
}
.slide_list .mtitle_slide_list .eng {
  font-family: "Josefin Sans", sans-serif;
  font-size: 3.8rem;
  color: #073829;
}
.slide_list .mtitle_slide_list .ja {
  font-size: 1.8rem;
}
.slide_list li {
  margin-right: 1%;
  width: 500px;
  height: auto;
  position: relative;
}
@media all and (max-width: 639px) {
  .slide_list li {
    width: 280px;
    height: auto;
  }
}
.slide_list li a {
  position: absolute;
  width: 100%;
  height: 100%;
  top: 0;
  left: 0;
  z-index: 1;
}
.slide_list li:hover img {
  opacity: 1;
  transform: scale(1.2);
  transition: all 0.4s ease;
}
.slide_list li:hover a {
  background-color: rgba(255, 255, 255, 0.5);
}
.slide_list li figure {
  background: rgba(246, 240, 223, 0.2);
  display: block;
  text-align: center;
  padding: 0px;
  width: 100%;
  height: 52vh;
  overflow: hidden;
}
@media all and (max-width: 639px) {
  .slide_list li figure {
    height: 30vh;
  }
}
.slide_list li figure img {
  width: 100%;
  height: 100%;
  -o-object-fit: cover;
     object-fit: cover;
  transition: all 0.4s ease;
}
.slide_list li p {
  display: none;
  font-size: 1.2rem;
  background-color: rgba(104, 72, 42, 0.2);
  font-weight: bold;
  padding: 2px 5px;
  text-align: center;
  margin-top: 0px;
}
@media all and (max-width: 896px) {
  .slide_list li p {
    font-size: 12px;
  }
}

.main_content {
  width: calc(100% - 200px);
  margin: 0 0 0 auto;
}
@media screen and (max-width: 1589px) {
  .main_content {
    width: calc(100% - 300px);
  }
}
@media all and (max-width: 1100px) {
  .main_content {
    width: calc(100% - 350px);
  }
}
@media all and (max-width: 896px) {
  .main_content {
    width: 100%;
  }
}

.side_header_bg {
  position: relative;
}
.side_header_bg:before {
  content: "";
  position: absolute;
  width: 100%;
  background-image: url(../leaf/side_header_bg.png);
  background-position: bottom center;
  background-size: 100%;
  background-repeat: no-repeat;
  top: inherit;
  bottom: 0;
  right: 0;
  left: 0;
  width: 100%;
  height: 100%;
  z-index: -1;
  mix-blend-mode: multiply;
}

#side_header {
  position: fixed;
  top: 0;
  left: 0;
  padding: 50px 20px;
  background-color: #073829;
  z-index: 100;
  height: 100vh;
  width: 300px;
  filter: drop-shadow(0px 0px 10px rgba(48, 48, 48, 0.2));
  /*
  &:before {
      position: absolute;
      content: "";
      width: 50px;
      height: 100%;
      //background: url(../img/nav-bg.png) repeat-y;
      background-size: 50px 700px;
      right: -30px;
      top: 0;
  } */
}
#side_header .logo {
  text-align: center;
}
#side_header.type_w {
  background-color: #fff;
  filter: drop-shadow(0px 0px 10px rgba(48, 48, 48, 0));
}
#side_header.fix {
  position: fixed;
}
#side_header #side_header_nav {
  margin-top: 40px;
}
#side_header #side_header_nav.type_tr {
  margin-top: 80px;
  margin-bottom: 100px;
}
#side_header #side_header_nav.type_tr ul.globalNav {
  display: flex;
  justify-content: center;
}
#side_header #side_header_nav.type_tr ul.globalNav > li {
  -ms-writing-mode: tb-rl;
  writing-mode: vertical-rl;
  text-orientation: mixed;
  border-bottom: 0px solid #ddd;
  margin: 0;
}
#side_header #side_header_nav.type_tr ul.globalNav > li > a {
  color: #333;
  padding: 10px;
  display: block;
  font-weight: bold;
  position: relative;
  font-size: 1.4rem;
}
#side_header #side_header_nav.type_tr ul.globalNav > li > a:before {
  content: none;
}
#side_header #side_header_nav.type_tr ul.globalNav > li > a:hover {
  color: #073829;
  background-color: rgba(7, 56, 41, 0.1);
}
#side_header #side_header_nav.type_tr ul.globalNav > li span {
  display: block;
  color: #333;
}
#side_header #side_header_nav.type1 ul > li {
  border-bottom: 0px solid #ddd;
}
#side_header #side_header_nav.type1 ul > li > a {
  color: #fff;
  background-color: #010b08;
}
#side_header #side_header_nav.type1 ul > li > a:before {
  border-left: 6px solid #fff;
}
#side_header #side_header_nav.type1 ul > li > a:hover {
  color: #fff;
  background-color: black;
}
#side_header #side_header_nav ul.globalNav > li {
  margin-bottom: 10px;
  border-bottom: 1px solid #ddd;
}
#side_header #side_header_nav ul.globalNav > li > a {
  color: #555;
  display: block;
  font-weight: bold;
  position: relative;
  padding: 10px 0px 10px 25px;
  font-size: 1.4rem;
}
#side_header #side_header_nav ul.globalNav > li > a:before {
  position: absolute;
  content: "";
  width: 0;
  height: 0;
  left: 5px;
  top: 38%;
  border-left: 6px solid #073829;
  border-top: 6px solid transparent;
  border-bottom: 6px solid transparent;
}
#side_header #side_header_nav ul.globalNav > li > a:hover {
  color: #073829;
  background-color: rgba(7, 56, 41, 0.1);
}
#side_header #side_header_nav ul.globalNav > li span {
  display: block;
  color: #333;
}
#side_header #side_header_nav .dropdown {
  display: none;
  margin-top: 10px;
}
#side_header #side_header_nav .dropdown .dropdown-li {
  border-right: 0;
  margin: 0 0 5px;
}
#side_header #side_header_nav .dropdown .dropdown-li a {
  display: block;
  padding: 8px 8px;
  color: #333;
  font-size: 1.3rem;
  background: #f2f2f2;
}
#side_header #side_header_nav .dropdown .dropdown-li a:hover {
  background: rgba(170, 170, 170, 0.4);
}
#side_header #side_header_nav .dropdown .dropdown-li.foot_only {
  display: none;
}
@media all and (max-width: 896px) {
  #side_header #side_header_nav {
    display: none;
  }
}
#side_header .pagesub_nav {
  background-color: #fff;
  padding: 10px 20px;
  margin-bottom: 40px;
  text-align: center;
}
#side_header .pagesub_nav li {
  padding-top: 5px;
  margin-bottom: 5px;
  border-top: 1px solid #073829;
}
#side_header .pagesub_nav li:first-child {
  border-top: none;
}
#side_header .pagesub_nav li a {
  color: #363636;
  font-weight: bold;
  font-size: 1.4rem;
}
#side_header .pagesub_nav li a:hover {
  color: #073829;
}
#side_header .pagesub_nav li span {
  display: block;
  color: #333;
}
@media all and (max-width: 1100px) {
  #side_header {
    padding: 50px 20px;
  }
  #side_header:before {
    background-size: 30px 480px;
    right: -30px;
  }
  #side_header #logo {
    width: 200px;
  }
}
@media all and (max-width: 896px) {
  #side_header {
    background: none;
    position: absolute;
    max-width: auto;
    left: 0;
    right: inherit;
    margin: 0 auto;
    top: 0;
    padding: 5px;
    width: 100%;
    height: 65px;
  }
  #side_header.fix {
    position: absolute;
  }
  #side_header .head_tel,
#side_header .head_mail {
    display: none;
  }
  #side_header .logo {
    position: absolute;
    top: 5px;
    left: 0;
    right: 0;
    margin: 0 auto;
  }
  #side_header .logo img {
    height: 60px;
    -o-object-fit: contain;
       object-fit: contain;
  }
  #side_header:before {
    display: none;
  }
}

.head_tel {
  text-align: center;
  margin-bottom: 5px;
  font-size: 1.1rem;
}
.head_tel span {
  display: block;
}
.head_tel a {
  font-size: 2.8rem;
  font-family: "Noto Serif JP", "YakuHanMP", "Noto Serif JP", "游明朝 Medium", "Yu Mincho", YuMincho, "Hiragino Mincho ProN", HGS明朝E, serif;
  font-weight: 400;
  letter-spacing: 0;
  text-transform: lowercase !important;
}
.head_tel a:first-letter {
  text-transform: uppercase;
}
.head_tel a:before {
  font-family: "Font Awesome 5 Free";
  content: "\f879";
  font-weight: 900;
  margin-right: 5px;
}
.head_tel.white {
  color: #fff;
}
.head_tel.white a {
  color: #fff;
}

.head_mail {
  margin: 0 8px;
  background-color: #073829;
  border: 1px solid #073829;
  padding: 10px 20px;
  text-align: center;
}
.head_mail.white {
  border: 1px solid #fff;
  box-shadow: rgba(17, 17, 17, 0.1) 0 0 3px 3px;
  margin: 10px 0px;
}
.head_mail a {
  color: #fff;
  position: relative;
  /* &:before {
    @include awesome($mail);
    margin-right: 5px;
  } */
}
.head_mail a span {
  display: block;
  font-size: 1.6rem;
  margin-bottom: -5px;
}
.head_mail:hover {
  background-color: #fff;
  border: 1px solid #073829;
}
.head_mail:hover a {
  color: #073829;
}

.form-contents dl dt:not(.pattern-exclusion) span.required::before,.form-contents .submit-btn{
  background: #363636!important;
  border:1px solid #363636!important;
}
.form-contents :not(.pattern-exclusion) button:hover {
  color: #363636!important;
  background: #fff!important;
  border: solid 2px #363636!important;
}
.form-contents .submit-btn:hover::before {
      background-color: #363636!important;
}
.form-contents dl dt:not(.pattern-exclusion) span.optional::before {
  padding: 5px 8px;
  margin-right: 5px;
  font-size: 11px;
  border-radius: 20px;
  position: relative;
  top: -2px;
}
.form-contents dl dt:not(.pattern-exclusion) span.optional::before {
  content: '任意';
  color: #fff!important;
  background: #999!important;
}


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