@charset "UTF-8";
/* ==========================================================================
Reset
========================================================================== */
/*
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;
}

* {
  box-sizing: border-box;
}

body {
  line-height: 1;
}

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

nav ul {
  list-style: none;
}

blockquote, q {
  quotes: none;
}

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;
}

/* ==========================================================================
Rules
========================================================================== */
/* ==========================================================================
use＆nameSpace
========================================================================== */
/* ==========================================================================
Settings
========================================================================== */
/* ==========================================================================
breakPoint
========================================================================== */
/* ==========================================================================
_wapSettings
========================================================================== */
/* ==========================================================================
_widthSettings
========================================================================== */
/* ==========================================================================
_heightSettings
========================================================================== */
/* ==========================================================================
_positionSettings
========================================================================== */
/* ==========================================================================
borderRadius
========================================================================== */
/* ==========================================================================
_marginSettings
========================================================================== */
/* ==========================================================================
_paddingSettings
========================================================================== */
/* ==========================================================================
fonts
========================================================================== */
/* ==========================================================================
_lineHeight
========================================================================== */
/* ==========================================================================
_letterspace
========================================================================== */
/* ==========================================================================
ボタンタイプ
========================================================================== */
/* ==========================================================================
Rules
========================================================================== */
#page_top {
  animation: cloak-in 0.75s;
}

body {
  -webkit-font-smoothing: antialiased;
  opacity: 0;
  animation: fadeIn 0.5s ease forwards;
  animation-delay: 0.25s;
}

@keyframes fadeIn {
  to {
    opacity: 1;
  }
}
body img {
  display: block;
  max-width: 100%;
  height: auto;
}
@media screen and (max-width: 767px) {
  body img {
    width: 100%;
  }
}

ul,
li,
dd,
dt,
dh {
  list-style: none;
}

svg {
  display: block;
}

.tj {
  text-indent: -9999px;
  text-align: left;
  overflow: hidden;
  display: block;
  font-size: 0.1em;
}

.wapper {
  width: 1300px;
  margin-left: auto;
  margin-right: auto;
}
@media screen and (max-width: 1299px) {
  .wapper {
    width: 98%;
  }
}
@media screen and (max-width: 767px) {
  .wapper {
    width: 100%;
  }
}

.pc_only {
  display: block;
}
@media screen and (max-width: 767px) {
  .pc_only {
    display: none;
  }
}

.sp_only {
  display: none;
}
@media screen and (max-width: 767px) {
  .sp_only {
    display: block;
  }
}

.pc_order_0 {
  order: 0;
}
@media screen and (max-width: 767px) {
  .pc_order_0 {
    order: unset;
  }
}

.fw_0 {
  font-weight: 0;
}

.pc_order_1 {
  order: 1;
}
@media screen and (max-width: 767px) {
  .pc_order_1 {
    order: unset;
  }
}

.fw_100 {
  font-weight: 100;
}

.pc_order_2 {
  order: 2;
}
@media screen and (max-width: 767px) {
  .pc_order_2 {
    order: unset;
  }
}

.fw_200 {
  font-weight: 200;
}

.pc_order_3 {
  order: 3;
}
@media screen and (max-width: 767px) {
  .pc_order_3 {
    order: unset;
  }
}

.fw_300 {
  font-weight: 300;
}

.pc_order_4 {
  order: 4;
}
@media screen and (max-width: 767px) {
  .pc_order_4 {
    order: unset;
  }
}

.fw_400 {
  font-weight: 400;
}

.pc_order_5 {
  order: 5;
}
@media screen and (max-width: 767px) {
  .pc_order_5 {
    order: unset;
  }
}

.fw_500 {
  font-weight: 500;
}

.pc_order_6 {
  order: 6;
}
@media screen and (max-width: 767px) {
  .pc_order_6 {
    order: unset;
  }
}

.fw_600 {
  font-weight: 600;
}

.pc_order_7 {
  order: 7;
}
@media screen and (max-width: 767px) {
  .pc_order_7 {
    order: unset;
  }
}

.fw_700 {
  font-weight: 700;
}

.pc_order_8 {
  order: 8;
}
@media screen and (max-width: 767px) {
  .pc_order_8 {
    order: unset;
  }
}

.fw_800 {
  font-weight: 800;
}

.pc_order_9 {
  order: 9;
}
@media screen and (max-width: 767px) {
  .pc_order_9 {
    order: unset;
  }
}

.fw_900 {
  font-weight: 900;
}

.pc_order_10 {
  order: 10;
}
@media screen and (max-width: 767px) {
  .pc_order_10 {
    order: unset;
  }
}

.fw_1000 {
  font-weight: 1000;
}

.pc_order_11 {
  order: 11;
}
@media screen and (max-width: 767px) {
  .pc_order_11 {
    order: unset;
  }
}

.fw_1100 {
  font-weight: 1100;
}

.pc_order_12 {
  order: 12;
}
@media screen and (max-width: 767px) {
  .pc_order_12 {
    order: unset;
  }
}

.fw_1200 {
  font-weight: 1200;
}

.ovhidden {
  overflow: hidden;
}

a {
  transition-duration: 0.5s;
}
a:hover {
  opacity: 0.6;
}

.d_flex {
  display: flex;
}

.d_block {
  display: block;
}

.d_none {
  display: none;
}

.d_contents {
  display: contents;
}

.d_inline {
  display: inline;
}

.d_grid {
  display: grid;
}

.d_inlineBlock {
  display: inline-block;
}

.d_inlineFlex {
  display: inline-flex;
}

.d_inlineTable {
  display: inline-table;
}

/* ==========================================================================
justify-content
========================================================================== */
.j_between {
  justify-content: space-between;
}

.j_start {
  justify-content: flex-start;
}

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

.j_center {
  justify-content: center;
}

.j_around {
  justify-content: space-around;
}

.j_baseline {
  justify-content: space-baseline;
}

.j_firstBaseline {
  justify-content: first baseline;
}

.j_firstBaseline {
  justify-content: last baseline;
}

.j_left {
  justify-content: left;
}

.j_right {
  justify-content: right;
}

.j_safe {
  justify-content: safe;
}

/* ==========================================================================
align-items
========================================================================== */
.ali_baseline {
  align-items: baseline;
}

.ali_center {
  align-items: center;
}

.ali_end {
  align-items: flex-end;
}

.ali_start {
  align-items: flex-start;
}

.ali_stretch {
  align-items: stretch;
}

.ali_unset {
  align-items: unset;
}

/* ==========================================================================
align-content
========================================================================== */
.alc_center {
  align-content: center;
}

.alc_end {
  align-content: flex-end;
}

.alc_around {
  align-content: space-around;
}

.alc_between {
  align-content: space-between;
}

.alc_stretch {
  align-content: stretch;
}

.alc_unset {
  align-content: unset;
}

/* ==========================================================================
row
========================================================================== */
.row {
  flex-flow: row wrap;
}

/* ==========================================================================
use＆nameSpace
========================================================================== */
/* ==========================================================================
use＆nameSpace
========================================================================== */
/* ==========================================================================
Library
========================================================================== */
body {
  font-family: "Zen Kaku Gothic New", sans-serif;
  color: #323232;
  font-weight: 500;
}
body img {
  max-width: 100%;
  height: auto;
  display: block;
}

body input,
body textarea,
body button {
  font-family: "Zen Kaku Gothic New", sans-serif;
  font-weight: 500;
}
body h1,
body h2,
body h3,
body h4,
body h5,
body h6,
body p {
  line-height: 1;
  font-weight: 500;
}

.onest {
  font-family: "Onest", sans-serif;
}

#mintyou,
.mintyou,
.mincho {
  font-family: "Shippori Mincho B1", serif;
}

.t_center {
  text-align: center;
}

.text_justify {
  text-align: justify;
  text-justify: inter-ideograph;
}

.txtnonrow {
  white-space: nowrap;
}

.tj {
  text-indent: -9999px;
  text-align: left;
  overflow: hidden;
  display: block;
  font-size: 0.1em;
}

.undernone {
  text-decoration: none;
}

.undernone {
  text-decoration: none;
}

/* ==========================================================================
Common
========================================================================== */
/* ==========================================================================
Layout
========================================================================== */
/* ==========================================================================
use＆nameSpace
========================================================================== */
/* ==========================================================================
use＆nameSpace
========================================================================== */
/* ==========================================================================
LAYOUT
========================================================================== */
.headerPc {
  width: 100%;
  position: absolute;
  z-index: 2;
}

.headerPcSta {
  position: sticky;
  width: 100%;
  z-index: 999;
}

.btnLogoHeaderPcWap {
  width: 12.29vw;
  margin: 0vw 0vw 0vw 0.6494791667vw;
  transform: translateY(0.2vw);
}

/*nav*/
.navLogoHeaderPc {
  width: 42.7vw;
  margin: auto;
}
@media screen and (max-width: 1500px) {
  .navLogoHeaderPc {
    width: 55.7vw;
  }
}

.ulNavLogoHeaderPc {
  justify-content: space-between;
  align-items: center;
}

.btnNavLogoHeaderPc {
  padding: 0.9vw 0 0 0;
  align-items: center;
  text-decoration: none;
  color: #25272F;
  position: relative;
}
.btnNavLogoHeaderPc:hover {
  opacity: 1;
}

.txtNavLogoHeaderPc {
  font-size: 14px;
  line-height: normal;
  letter-spacing: 0em;
  text-indent: 0em;
}
@media screen and (max-width: 1299px) {
  .txtNavLogoHeaderPc {
    font-size: 1.077752117vw;
  }
}

.picNavLogoHeaderPc {
  margin-left: auto;
  margin-right: auto;
  opacity: 0;
  transition-duration: 0.5s;
  margin: 0.25vw auto 0 auto;
}

.btnNavLogoHeaderPc:hover .picNavLogoHeaderPc {
  opacity: 1;
}

/*tel*/
.telMenuHeaderPc {
  width: 12.29vw;
  align-items: center;
  aspect-ratio: 236/70;
}
@media screen and (max-width: 1299px) {
  .telMenuHeaderPc {
    width: 15.29vw;
    align-items: center;
    aspect-ratio: 236/70;
  }
}

.telHeaderPc {
  margin: 0vw 4.40625vw 0vw 0vw;
  width: 7.89vw;
}
@media screen and (max-width: 1299px) {
  .telHeaderPc {
    margin: 0vw 4.40625vw 0vw 0vw;
    width: 9.89vw;
  }
}

/*menu*/
.menuHeaderPc {
  width: 3.64vw;
  background: #25272F;
  position: fixed;
  z-index: 999;
  right: 0;
  top: 0;
  aspect-ratio: 1/1;
  display: flex;
  align-items: center;
  cursor: pointer;
  transition-duration: 0.5s;
}
@media screen and (max-width: 1299px) {
  .menuHeaderPc {
    width: 4.54vw;
  }
}

.menuHeaderPc.on {
  background: unset;
}

.menuHeaderPcIn {
  width: 1.56vw;
  margin: auto;
  position: relative;
  aspect-ratio: 38/27;
}

.brdMenuHeaderPcIn {
  width: 100%;
  height: 1px;
  background: #FFF;
  position: absolute;
  transition-duration: 0.5s;
}

.brdMenuHeaderPcIn01 {
  top: 0;
}

.brdMenuHeaderPcIn02 {
  top: 50%;
  opacity: 1;
}

.brdMenuHeaderPcIn03 {
  top: 100%;
}

.menuHeaderPc.on .brdMenuHeaderPcIn01 {
  transform: rotate(45deg);
  top: 50%;
}
.menuHeaderPc.on .brdMenuHeaderPcIn02 {
  opacity: 0;
}
.menuHeaderPc.on .brdMenuHeaderPcIn03 {
  transform: rotate(-45deg);
  top: 50%;
}

/* ==========================================================================
use＆nameSpace
========================================================================== */
/* ==========================================================================
use＆nameSpace
========================================================================== */
/* ==========================================================================
LAYOUT
========================================================================== */
.btnLogoHeaderSp {
  width: 51.5%;
  padding-top: 4px;
  padding-bottom: 3px;
  padding-left: 6px;
  padding-right: 0px;
}
@media screen and (max-width: 1299px) {
  .btnLogoHeaderSp {
    padding: 1.06% 0% 0.8% 1.6%;
  }
}

.btnContactMenuHeaderSp {
  width: 128px;
}
@media screen and (max-width: 1299px) {
  .btnContactMenuHeaderSp {
    width: 34.13%;
  }
}

/*menu*/
.btnContactHeader {
  width: 71px;
  line-height: normal;
  letter-spacing: 0em;
  text-indent: 0em;
  border-radius: 30px;
  /* CSS3草案 */
  -webkit-border-radius: 30px;
  /* Safari,Google Chrome用 */
  -moz-border-radius: 30px;
  /* Firefox用 */
  aspect-ratio: 71/37;
  text-decoration: none;
  color: #FFF;
}
@media screen and (max-width: 1299px) {
  .btnContactHeader {
    width: 55.46%;
  }
}
@media screen and (max-width: 767px) {
  .btnContactHeader {
    font-size: 3.2vw;
  }
}

.menuHeaderSp {
  width: 50px;
  background: #25272F;
  position: fixed;
  z-index: 999;
  right: 0;
  top: 0;
  aspect-ratio: 1/1;
  display: flex;
  align-items: center;
}
@media screen and (max-width: 1299px) {
  .menuHeaderSp {
    width: 13.33%;
  }
}
.menuHeaderSp.on {
  background: unset;
}

.menuHeaderSpIn {
  width: 22px;
  margin: auto;
  position: relative;
  aspect-ratio: 38/27;
}
@media screen and (max-width: 1299px) {
  .menuHeaderSpIn {
    width: 44%;
  }
}

.brdMenuHeaderSpIn {
  width: 100%;
  height: 1px;
  background: #FFF;
  position: absolute;
  transition-duration: 0.5s;
}

.brdMenuHeaderSpIn01 {
  top: 0;
}

.brdMenuHeaderSpIn02 {
  top: 50%;
}

.brdMenuHeaderSpIn03 {
  top: 100%;
}

.menuHeaderSp.on .brdMenuHeaderSpIn01 {
  top: 50%;
  transform: rotate(45deg);
}
.menuHeaderSp.on .brdMenuHeaderSpIn02 {
  opacity: 0;
}
.menuHeaderSp.on .brdMenuHeaderSpIn03 {
  top: 50%;
  transform: rotate(-45deg);
}

/* ==========================================================================
use＆nameSpace
========================================================================== */
/* ==========================================================================
use＆nameSpace
========================================================================== */
/* ==========================================================================
LAYOUT
========================================================================== */
.bgTriggerHeaderPc {
  position: fixed;
  z-index: 9999;
  right: -100%;
  top: 0;
  width: 100%;
  height: 100vh;
  cursor: pointer;
}

.mainTrigerHeaderPc {
  padding-top: 0px;
  padding-bottom: 79px;
  padding-left: 0px;
  padding-right: 0px;
  width: 802px;
  background: rgba(37, 39, 47, 0.9);
  overflow: scroll;
  -ms-overflow-style: none;
  scrollbar-width: none;
  height: 100vh;
  position: fixed;
  top: 0;
  right: -100%;
  z-index: 9999;
}
@media screen and (max-width: 1299px) {
  .mainTrigerHeaderPc {
    padding: 0% 0% 4.11% 0%;
  }
}
@media screen and (max-width: 1299px) {
  .mainTrigerHeaderPc {
    width: 41.77%;
  }
}
.mainTrigerHeaderPc::-webkit-scrollbar {
  display: none;
}

.mainTrigerHeaderPcWap {
  padding-top: 74px;
  padding-bottom: 79px;
  padding-left: 0px;
  padding-right: 0px;
}
@media screen and (max-width: 1299px) {
  .mainTrigerHeaderPcWap {
    padding: 9.22% 0% 9.85% 0%;
  }
}

.mainTrigerHeaderImgWapPc {
  width: 73.24px;
  margin: -1% 0 0 0;
}
@media screen and (max-width: 1299px) {
  .mainTrigerHeaderImgWapPc {
    width: 9.13%;
  }
}
.mainTrigerHeaderImgWapPc img {
  width: auto;
  height: 91.5vh;
  display: block;
  margin: 0 0 0 auto;
}

.mainTrigerHeaderPcCtn {
  width: 574px;
  margin-top: 0px;
  margin-bottom: 0px;
  margin-left: auto;
  margin-right: 35px;
}
@media screen and (max-width: 1299px) {
  .mainTrigerHeaderPcCtn {
    width: 71.57%;
  }
}
@media screen and (max-width: 1299px) {
  .mainTrigerHeaderPcCtn {
    margin-top: 0%;
    margin-bottom: 0%;
    margin-left: auto;
    margin-right: 4.36%;
  }
}

.navMainTrigerHeaderPcCtn {
  width: 524px;
  margin: 4.2% 0 0 auto;
}
@media screen and (max-width: 1299px) {
  .navMainTrigerHeaderPcCtn {
    width: 91.6%;
  }
}

.ulMainTrigerHeaderPcCtn {
  flex-flow: row wrap;
}

.liMainTrigerHeaderPcCtn {
  width: 100%;
  margin-top: 0px;
  margin-bottom: 34px;
  margin-left: 0px;
  margin-right: 0px;
}
@media screen and (max-width: 1299px) {
  .liMainTrigerHeaderPcCtn {
    margin: 0% 0% 6.48% 0%;
  }
}

.btnMainTrigerHeaderPcCtn {
  text-decoration: none;
  color: #FFF;
  transition-duration: 0.5s;
}
.btnMainTrigerHeaderPcCtn:hover {
  color: #DB2E21;
}

.txtMainTrigerHeaderPcCtn {
  font-size: 18px;
  line-height: normal;
  letter-spacing: 0.05em;
  text-indent: -0.05em;
}
@media screen and (max-width: 1299px) {
  .txtMainTrigerHeaderPcCtn {
    font-size: 1.3856812933vw;
  }
}

.picMainTrigerHeaderPcCtn {
  margin-top: 0px;
  margin-bottom: 0px;
  margin-left: 16px;
  margin-right: auto;
  transition-duration: 0.5s;
  opacity: 0;
}
@media screen and (max-width: 1299px) and (max-width: 1299px) {
  .picMainTrigerHeaderPcCtn {
    margin-top: 0%;
    margin-bottom: 0%;
    margin-left: 3.05%;
    margin-right: auto;
  }
}

.btnMainTrigerHeaderPcCtn:hover .picMainTrigerHeaderPcCtn {
  opacity: 1;
}

/*nav*/
.ctaNavsTrigerHeaderImgWapPc {
  margin-top: 56px;
  margin-bottom: 0px;
  margin-left: 0px;
  margin-right: 0px;
}
@media screen and (max-width: 1299px) {
  .ctaNavsTrigerHeaderImgWapPc {
    margin: 9.79% 0% 0% 0%;
  }
}

.liNavsTrigerHeaderCtaPc {
  width: 272px;
}
@media screen and (max-width: 1299px) {
  .liNavsTrigerHeaderCtaPc {
    width: 47.55%;
  }
}

/*sns*/
.snsNavsTrigerHeader {
  margin-top: 56px;
  margin-bottom: 0px;
  margin-left: auto;
  margin-right: auto;
  width: 199px;
}
@media screen and (max-width: 1299px) {
  .snsNavsTrigerHeader {
    margin-top: 9.79%;
    margin-bottom: 0%;
    margin-left: auto;
    margin-right: auto;
  }
}
@media screen and (max-width: 1299px) {
  .snsNavsTrigerHeader {
    width: 34.79%;
  }
}

.ulSnsNavsTrigerHeader {
  justify-content: space-between;
}

.liSnsNavsTrigerHeader {
  width: 40px;
  margin-top: 0px;
  margin-bottom: 0px;
  margin-left: 0px;
  margin-right: 0px;
}
@media screen and (max-width: 1299px) {
  .liSnsNavsTrigerHeader {
    width: 20.1%;
  }
}
@media screen and (max-width: 1299px) {
  .liSnsNavsTrigerHeader {
    margin: 0% 0% 0% 0%;
  }
}
.liSnsNavsTrigerHeader:last-child {
  margin: 0;
}

/* ==========================================================================
use＆nameSpace
========================================================================== */
/* ==========================================================================
use＆nameSpace
========================================================================== */
/* ==========================================================================
LAYOUT
========================================================================== */
.bgTriggerHeaderSp {
  position: fixed;
  z-index: 9;
  right: -100%;
  top: 0;
  width: 100%;
}

.mainTrigerHeaderSp {
  padding-top: 0px;
  padding-bottom: 33px;
  padding-left: 0px;
  padding-right: 0px;
  width: 100%;
  background: rgba(37, 39, 47, 0.9);
  overflow: scroll;
  -ms-overflow-style: none;
  scrollbar-width: none;
  height: 100vh;
  position: fixed;
  top: 0;
  right: -100%;
  z-index: 99;
}
@media screen and (max-width: 1299px) {
  .mainTrigerHeaderSp {
    padding: 0% 0% 8.8% 0%;
  }
}
.mainTrigerHeaderSp::-webkit-scrollbar {
  display: none;
}

.mainTrigerHeaderSpWap {
  padding: 14.5% 0% 0% 0%;
}

.mainTrigerHeaderImgWapSp {
  margin: 6% 0 0 0;
}

.mainTrigerHeaderSpCtn {
  width: 72%;
  margin: 0% 0% 0% auto;
}

.navMainTrigerHeaderSpCtn {
  width: 272px;
  margin: 0 0 0 auto;
}
@media screen and (max-width: 1299px) {
  .navMainTrigerHeaderSpCtn {
    width: 100%;
  }
}

.ulMainTrigerHeaderSpCtn {
  flex-flow: row wrap;
}

.liMainTrigerHeaderSpCtn {
  width: 100%;
  margin: 0% 0% 8.5% 0%;
}
.liMainTrigerHeaderSpCtn:last-child {
  margin: 0 0 0 0;
}

.btnMainTrigerHeaderSpCtn {
  text-decoration: none;
  color: #FFF;
  transition-duration: 0.5s;
}
.btnMainTrigerHeaderSpCtn:hover {
  color: #DB2E21;
}

.ctaNavsTrigerHeaderImgWapSp {
  margin: 9% 0 0 0;
}

.txtMainTrigerHeaderSpCtn {
  line-height: normal;
  letter-spacing: 0em;
  text-indent: 0em;
}
@media screen and (max-width: 767px) {
  .txtMainTrigerHeaderSpCtn {
    font-size: 4.2666666667vw;
  }
}

.picMainTrigerHeaderSpCtn {
  width: 27px;
  margin-top: 0px;
  margin-bottom: 0px;
  margin-left: 11px;
  margin-right: auto;
  transition-duration: 0.5s;
  opacity: 0;
}
@media screen and (max-width: 1299px) {
  .picMainTrigerHeaderSpCtn {
    width: 9.92%;
  }
}
@media screen and (max-width: 1299px) and (max-width: 1299px) {
  .picMainTrigerHeaderSpCtn {
    margin-top: 0%;
    margin-bottom: 0%;
    margin-left: 4.04%;
    margin-right: auto;
  }
}

.btnMainTrigerHeaderSpCtn:hover .picMainTrigerHeaderSpCtn {
  opacity: 1;
}

/*cta*/
.ulNavsTrigerHeaderImgWapSp {
  margin: 2.7% 0% 0% 0%;
  flex-flow: row wrap;
}

.liNavsTrigerHeaderCtaSp {
  width: 100%;
}
.liNavsTrigerHeaderCtaSp:nth-child(n+2) {
  margin: 7% 0% 0% 0%;
}

.btnNavsTrigerHeaderCtaSp {
  display: block;
}

/*sns*/
@media screen and (max-width: 767px) {
  .snsNavsTrigerHeader {
    margin-top: 14.13%;
    margin-bottom: 0%;
    margin-left: auto;
    margin-right: auto;
    width: 179px;
  }
}
@media screen and (max-width: 767px) and (max-width: 1299px) {
  .snsNavsTrigerHeader {
    width: 65.8%;
  }
}

@media screen and (max-width: 767px) {
  .liSnsNavsTrigerHeader {
    width: 33px;
    margin-top: 0px;
    margin-bottom: 0px;
    margin-left: 0px;
    margin-right: 39px;
  }
}
@media screen and (max-width: 767px) and (max-width: 1299px) {
  .liSnsNavsTrigerHeader {
    width: 18.43%;
  }
}
@media screen and (max-width: 767px) and (max-width: 1299px) {
  .liSnsNavsTrigerHeader {
    margin: 0% 14.33% 0% 0%;
  }
}
@media screen and (max-width: 767px) {
  .liSnsNavsTrigerHeader::last-child {
    margin: 0;
  }
}

/* ==========================================================================
Layout
========================================================================== */
/*
To change this license header, choose License Headers in Project Properties.
To change this template file, choose Tools | Templates
and open the template in the editor.
*/
/*
    Created on : 2022/09/08, 15:33:59
    Author     : SPG-1105
*/
/*
To change this license header, choose License Headers in Project Properties.
To change this template file, choose Tools | Templates
and open the template in the editor.
*/
/*
    Created on : 2022/09/08, 15:34:06
    Author     : SPG-1105
*/
.bg_F2F2F2 {
  background: #F2F2F2;
}

.bg_fff {
  background: #fff;
}

.bg_DB2E21 {
  background: #DB2E21;
}

.bg_666 {
  background: #666;
}

.bg_25272F {
  background: #25272F;
}

.bg_59 {
  background: rgba(59, 61, 68, 0.7);
}

.bg_37 {
  background: rgba(37, 39, 47, 0.9);
}

.bg_38414E {
  background: #38414E;
}

.cl_25272F {
  color: #25272F;
}

.cl_fff {
  color: #fff;
}

.cl_A2A3A6 {
  color: #A2A3A6;
}

.cl_666 {
  color: #666;
}

.cl_000 {
  color: #000;
}

.cl_ACA5A5 {
  color: #ACA5A5;
}

.cl_DB2E21 {
  color: #DB2E21;
}

/* ==========================================================================
use＆nameSpace
========================================================================== */
/* ==========================================================================
use＆nameSpace
========================================================================== */
/* ==========================================================================
LAYOUT
========================================================================== */
.breadcrumbListWap {
  margin-top: 36px;
  margin-bottom: 0px;
  margin-left: auto;
  margin-right: auto;
}
@media screen and (max-width: 1299px) {
  .breadcrumbListWap {
    margin-top: 1.87%;
    margin-bottom: 0%;
    margin-left: auto;
    margin-right: auto;
  }
}
@media screen and (max-width: 767px) {
  .breadcrumbListWap {
    margin-top: 1.93%;
    margin-bottom: 0%;
    margin-left: auto;
    margin-right: auto;
    width: 93.6%;
  }
}

.breadcrumbList {
  width: 1300px;
  margin: auto;
  font-size: 10px;
  line-height: normal;
  letter-spacing: 0em;
  text-indent: 0em;
  display: flex;
  justify-content: flex-start;
  align-items: center;
  flex-flow: row wrap;
}
@media screen and (max-width: 1299px) {
  .breadcrumbList {
    width: 100%;
  }
}
@media screen and (max-width: 1299px) {
  .breadcrumbList {
    font-size: 0.7698229407vw;
  }
}
@media screen and (max-width: 767px) {
  .breadcrumbList {
    line-height: normal;
    letter-spacing: 0em;
    text-indent: 0em;
  }
}
@media screen and (max-width: 767px) and (max-width: 767px) {
  .breadcrumbList {
    font-size: 2.6666666667vw;
  }
}

.breadcrumbList a {
  text-decoration: none;
  color: #4A4545;
}

.breadcrumbList .breadbrder {
  height: 1px;
  background: #666;
  margin-top: 0px;
  margin-bottom: 0px;
  margin-left: 5px;
  margin-right: 5px;
  width: 33px;
}
@media screen and (max-width: 1299px) {
  .breadcrumbList .breadbrder {
    margin: 0% 0.4% 0% 0.4%;
  }
}
@media screen and (max-width: 1299px) {
  .breadcrumbList .breadbrder {
    width: 2.64%;
  }
}
@media screen and (max-width: 767px) {
  .breadcrumbList .breadbrder {
    margin-top: 0px;
    margin-bottom: 0px;
    margin-left: 5px;
    margin-right: 5px;
    width: 33px;
  }
}
@media screen and (max-width: 767px) and (max-width: 1299px) {
  .breadcrumbList .breadbrder {
    margin: 0% 1.42% 0% 1.42%;
  }
}
@media screen and (max-width: 767px) and (max-width: 1299px) {
  .breadcrumbList .breadbrder {
    width: 9.4%;
  }
}

/* ==========================================================================
Layout
========================================================================== */
/* ==========================================================================
use＆nameSpace
========================================================================== */
/* ==========================================================================
use＆nameSpace
========================================================================== */
/* ==========================================================================
LAYOUT
========================================================================== */
.indexFv {
  position: relative;
  overflow-x: clip;
  display: flex;
  align-items: center;
}
@media screen and (max-width: 767px) {
  .indexFv {
    display: block;
  }
}

.mainIndexVideo {
  position: relative;
  overflow: hidden;
  width: 100%;
  height: 100svh;
  display: flex;
  align-items: center;
}
@media screen and (max-width: 767px) {
  .mainIndexVideo {
    display: block;
  }
}

.indexFv video {
  width: 100%;
  height: 100%;
  position: absolute;
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
  margin: auto;
  object-fit: cover;
  object-position: center;
  z-index: 1;
}

.secMainIndexVideo {
  position: absolute;
  z-index: 9;
  width: 44.69vw;
  left: 9.9vw;
  margin: auto;
}
@media screen and (max-width: 767px) {
  .secMainIndexVideo {
    width: 336px;
    left: 5%;
    top: 28.5%;
  }
}
@media screen and (max-width: 767px) and (max-width: 1299px) {
  .secMainIndexVideo {
    width: 89.6%;
  }
}

.h1MainIndexVideo {
  font-size: 0.9375vw;
  line-height: normal;
  letter-spacing: 0.05em;
  text-indent: -0.05em;
}
@media screen and (max-width: 767px) {
  .h1MainIndexVideo {
    line-height: 1.3333333333;
    letter-spacing: 0em;
    text-indent: 0em;
  }
}
@media screen and (max-width: 767px) and (max-width: 767px) {
  .h1MainIndexVideo {
    font-size: 3.2vw;
  }
}
@media screen and (max-width: 767px) {
  .h1MainIndexVideo::before {
    display: block;
    width: 0;
    height: 0;
    margin-top: calc((1 - 1.3333333333) * 0.5em);
    content: "";
  }
  .h1MainIndexVideo::after {
    display: block;
    width: 0;
    height: 0;
    margin-bottom: calc((1 - 1.3333333333) * 0.5em);
    content: "";
  }
}

.h2MainIndexVideo {
  margin: 0.3vw 0vw 0 0vw;
  font-size: 3.3333333333vw;
  line-height: 1.25;
  letter-spacing: 0.1em;
  text-indent: 0em;
  transform: translate(-0.5vw, 0);
}
@media screen and (max-width: 767px) {
  .h2MainIndexVideo {
    margin-top: 5.13%;
    margin-bottom: 0%;
    margin-left: auto;
    margin-right: auto;
    line-height: 1.6071428571;
    letter-spacing: 0em;
    text-indent: 0em;
  }
}
@media screen and (max-width: 767px) and (max-width: 767px) {
  .h2MainIndexVideo {
    font-size: 7.4666666667vw;
  }
}
@media screen and (max-width: 767px) {
  .h2MainIndexVideo::before {
    display: block;
    width: 0;
    height: 0;
    margin-top: calc((1 - 1.6071428571) * 0.5em);
    content: "";
  }
  .h2MainIndexVideo::after {
    display: block;
    width: 0;
    height: 0;
    margin-bottom: calc((1 - 1.6071428571) * 0.5em);
    content: "";
  }
}

.btnMainIndexVideoWap {
  margin: 2.2vw 0vw 0vw 0vw;
  width: 14.16vw;
}
@media screen and (max-width: 767px) {
  .btnMainIndexVideoWap {
    margin: 9.5% 0% 0% 0%;
    width: 180px;
  }
}
@media screen and (max-width: 767px) and (max-width: 1299px) {
  .btnMainIndexVideoWap {
    width: 53.57%;
  }
}

.btnMainIndexVideo {
  background-color: #DB2E21;
  width: 100%;
  border-radius: 30px;
  /* CSS3草案 */
  -webkit-border-radius: 30px;
  /* Safari,Google Chrome用 */
  -moz-border-radius: 30px;
  /* Firefox用 */
  aspect-ratio: 272/60;
  text-decoration: none;
  color: #FFF;
}
@media screen and (max-width: 767px) {
  .btnMainIndexVideo {
    aspect-ratio: 180/45;
  }
}
.btnMainIndexVideo:hover {
  opacity: 1;
  background-color: #A42117;
  transform: scale(1.1);
}

.secMainIndexVideoInner {
  width: 13.12vw;
  margin: auto;
  background: url(../img/index/arrowBtnMainIndexVideo.svg) no-repeat right center;
  background-size: auto 30%;
}
@media screen and (max-width: 767px) {
  .secMainIndexVideoInner {
    width: 160px;
  }
}
@media screen and (max-width: 767px) and (max-width: 1299px) {
  .secMainIndexVideoInner {
    width: 88.88%;
  }
}

.h3MainIndexVideo {
  font-size: 0.9375vw;
  line-height: normal;
  letter-spacing: 0.05em;
  text-indent: -0.05em;
}
@media screen and (max-width: 767px) {
  .h3MainIndexVideo {
    line-height: normal;
    letter-spacing: 0em;
    text-indent: 0em;
  }
}
@media screen and (max-width: 767px) and (max-width: 767px) {
  .h3MainIndexVideo {
    font-size: 3.2vw;
  }
}

.txtMainIndexVideo {
  font-size: 0.625vw;
  line-height: normal;
  letter-spacing: 0em;
  text-indent: 0em;
}
@media screen and (max-width: 767px) {
  .txtMainIndexVideo {
    line-height: normal;
    letter-spacing: 0em;
    text-indent: 0em;
  }
}
@media screen and (max-width: 767px) and (max-width: 767px) {
  .txtMainIndexVideo {
    font-size: 2.6666666667vw;
  }
}

/*スクロール*/
.movePicMainIndexDronScroll {
  position: absolute;
  z-index: 2;
  right: 1vw;
  aspect-ratio: 17/399;
  width: 0.575vw;
}
@media screen and (max-width: 767px) {
  .movePicMainIndexDronScroll {
    width: 2.25%;
    top: 41.5%;
    right: 2.2vw;
    aspect-ratio: 13/336;
  }
}

.movePicMainIndexDronScrollBox {
  margin-top: 0.3645833333vw;
  margin-bottom: 0vw;
  margin-left: auto;
  margin-right: auto;
  position: relative;
  width: 1px;
  aspect-ratio: 1/127;
  overflow: hidden;
}
@media screen and (max-width: 767px) {
  .movePicMainIndexDronScrollBox {
    margin-top: 1.9vw;
    margin-bottom: 0%;
    margin-left: auto;
    margin-right: auto;
    aspect-ratio: 1/127;
  }
}

.movePicMainIndexDronScrollInner {
  background: #FFF;
  width: 100%;
  height: 100%;
  display: block;
  position: absolute;
  animation: growBar 2s ease-in-out infinite;
}

@keyframes growBar {
  0% {
    height: 16px;
  }
  100% {
    height: 100%;
  }
}
/*動く文字部分*/
.picMainIndexDronWap {
  width: 13.17vw;
  position: absolute;
  top: 83%;
  right: 5%;
  z-index: 9;
  animation: fuwafuwa 2s infinite;
}
@media screen and (max-width: 767px) {
  .picMainIndexDronWap {
    width: 95px;
    top: 91%;
    right: 0%;
  }
}
@media screen and (max-width: 767px) and (max-width: 1299px) {
  .picMainIndexDronWap {
    width: 25.33%;
  }
}

@keyframes fuwafuwa {
  0% {
    transform: translateY(0px);
  }
  50% {
    transform: translateY(-30px);
  }
  100% {
    transform: translateY(0px);
  }
}
/*文字*/
.movePicMainIndexDronMove {
  position: absolute;
  bottom: 0%;
  left: 0;
  margin: auto;
  z-index: 9;
  width: 100%;
}
@media screen and (max-width: 1299px) {
  .movePicMainIndexDronMove {
    bottom: 0;
    left: 5.5%;
  }
}
@media screen and (max-width: 767px) {
  .movePicMainIndexDronMove {
    width: 85%;
    margin: auto;
    bottom: 0;
    left: 5vw;
  }
}

.mojipoyospan {
  font-size: 10.4166666667vw;
  line-height: 1;
  letter-spacing: 0.1em;
  text-indent: -0.1em;
  display: flex;
  overflow: hidden;
  color: #DB2E21;
  font-weight: bold;
  flex-flow: row wrap;
}
@media screen and (max-width: 767px) {
  .mojipoyospan {
    letter-spacing: 0.1em;
    text-indent: -0.1em;
    margin: 0 auto 0 0;
  }
}
@media screen and (max-width: 767px) and (max-width: 767px) {
  .mojipoyospan {
    font-size: 20vw;
  }
}

.mojipoyospan {
  opacity: 0;
}
.mojipoyospan > span {
  opacity: 0;
  transform: translateY(50%);
  margin: 0 0.5% 0 0;
  display: inline-block;
}
.mojipoyospan.active {
  opacity: 1;
}
.mojipoyospan.active > span:nth-child(1) {
  -webkit-animation: bound 0.6s cubic-bezier(0.33, 1, 0.68, 1) 0.05s forwards alternate;
  animation: bound 0.6s cubic-bezier(0.33, 1, 0.68, 1) 0.05s forwards alternate;
}
.mojipoyospan.active > span:nth-child(2) {
  -webkit-animation: bound 0.6s cubic-bezier(0.33, 1, 0.68, 1) 0.1s forwards alternate;
  animation: bound 0.6s cubic-bezier(0.33, 1, 0.68, 1) 0.1s forwards alternate;
}
.mojipoyospan.active > span:nth-child(3) {
  -webkit-animation: bound 0.6s cubic-bezier(0.33, 1, 0.68, 1) 0.15s forwards alternate;
  animation: bound 0.6s cubic-bezier(0.33, 1, 0.68, 1) 0.15s forwards alternate;
}
.mojipoyospan.active > span:nth-child(4) {
  -webkit-animation: bound 0.6s cubic-bezier(0.33, 1, 0.68, 1) 0.2s forwards alternate;
  animation: bound 0.6s cubic-bezier(0.33, 1, 0.68, 1) 0.2s forwards alternate;
}
.mojipoyospan.active > span:nth-child(5) {
  -webkit-animation: bound 0.6s cubic-bezier(0.33, 1, 0.68, 1) 0.25s forwards alternate;
  animation: bound 0.6s cubic-bezier(0.33, 1, 0.68, 1) 0.25s forwards alternate;
}
.mojipoyospan.active > span:nth-child(6) {
  -webkit-animation: bound 0.6s cubic-bezier(0.33, 1, 0.68, 1) 0.3s forwards alternate;
  animation: bound 0.6s cubic-bezier(0.33, 1, 0.68, 1) 0.3s forwards alternate;
}
.mojipoyospan.active > span:nth-child(7) {
  -webkit-animation: bound 0.6s cubic-bezier(0.33, 1, 0.68, 1) 0.35s forwards alternate;
  animation: bound 0.6s cubic-bezier(0.33, 1, 0.68, 1) 0.35s forwards alternate;
}
.mojipoyospan.active > span:nth-child(8) {
  -webkit-animation: bound 0.6s cubic-bezier(0.33, 1, 0.68, 1) 0.4s forwards alternate;
  animation: bound 0.6s cubic-bezier(0.33, 1, 0.68, 1) 0.4s forwards alternate;
}
.mojipoyospan.active > span:nth-child(9) {
  -webkit-animation: bound 0.6s cubic-bezier(0.33, 1, 0.68, 1) 0.45s forwards alternate;
  animation: bound 0.6s cubic-bezier(0.33, 1, 0.68, 1) 0.45s forwards alternate;
}
.mojipoyospan.active > span:nth-child(10) {
  -webkit-animation: bound 0.6s cubic-bezier(0.33, 1, 0.68, 1) 0.5s forwards alternate;
  animation: bound 0.6s cubic-bezier(0.33, 1, 0.68, 1) 0.5s forwards alternate;
}
.mojipoyospan.active > span:nth-child(11) {
  -webkit-animation: bound 0.6s cubic-bezier(0.33, 1, 0.68, 1) 0.55s forwards alternate;
  animation: bound 0.6s cubic-bezier(0.33, 1, 0.68, 1) 0.55s forwards alternate;
}
.mojipoyospan.active > span:nth-child(12) {
  -webkit-animation: bound 0.6s cubic-bezier(0.33, 1, 0.68, 1) 0.6s forwards alternate;
  animation: bound 0.6s cubic-bezier(0.33, 1, 0.68, 1) 0.6s forwards alternate;
}
.mojipoyospan.active > span:nth-child(13) {
  -webkit-animation: bound 0.6s cubic-bezier(0.33, 1, 0.68, 1) 0.65s forwards alternate;
  animation: bound 0.6s cubic-bezier(0.33, 1, 0.68, 1) 0.65s forwards alternate;
}
.mojipoyospan.active > span:nth-child(14) {
  -webkit-animation: bound 0.6s cubic-bezier(0.33, 1, 0.68, 1) 0.7s forwards alternate;
  animation: bound 0.6s cubic-bezier(0.33, 1, 0.68, 1) 0.7s forwards alternate;
}
.mojipoyospan.active > span:nth-child(15) {
  -webkit-animation: bound 0.6s cubic-bezier(0.33, 1, 0.68, 1) 0.75s forwards alternate;
  animation: bound 0.6s cubic-bezier(0.33, 1, 0.68, 1) 0.75s forwards alternate;
}
.mojipoyospan.active > span:nth-child(16) {
  -webkit-animation: bound 0.6s cubic-bezier(0.33, 1, 0.68, 1) 0.8s forwards alternate;
  animation: bound 0.6s cubic-bezier(0.33, 1, 0.68, 1) 0.8s forwards alternate;
}
.mojipoyospan.active > span:nth-child(17) {
  -webkit-animation: bound 0.6s cubic-bezier(0.33, 1, 0.68, 1) 0.85s forwards alternate;
  animation: bound 0.6s cubic-bezier(0.33, 1, 0.68, 1) 0.85s forwards alternate;
}
.mojipoyospan.active > span:nth-child(18) {
  -webkit-animation: bound 0.6s cubic-bezier(0.33, 1, 0.68, 1) 0.9s forwards alternate;
  animation: bound 0.6s cubic-bezier(0.33, 1, 0.68, 1) 0.9s forwards alternate;
}
.mojipoyospan.active > span:nth-child(19) {
  -webkit-animation: bound 0.6s cubic-bezier(0.33, 1, 0.68, 1) 0.95s forwards alternate;
  animation: bound 0.6s cubic-bezier(0.33, 1, 0.68, 1) 0.95s forwards alternate;
}
.mojipoyospan.active > span:nth-child(20) {
  -webkit-animation: bound 0.6s cubic-bezier(0.33, 1, 0.68, 1) 1s forwards alternate;
  animation: bound 0.6s cubic-bezier(0.33, 1, 0.68, 1) 1s forwards alternate;
}
.mojipoyospan.active > span:nth-child(21) {
  -webkit-animation: bound 0.6s cubic-bezier(0.33, 1, 0.68, 1) 1.05s forwards alternate;
  animation: bound 0.6s cubic-bezier(0.33, 1, 0.68, 1) 1.05s forwards alternate;
}
.mojipoyospan.active > span:nth-child(22) {
  -webkit-animation: bound 0.6s cubic-bezier(0.33, 1, 0.68, 1) 1.1s forwards alternate;
  animation: bound 0.6s cubic-bezier(0.33, 1, 0.68, 1) 1.1s forwards alternate;
}
.mojipoyospan.active > span:nth-child(23) {
  -webkit-animation: bound 0.6s cubic-bezier(0.33, 1, 0.68, 1) 1.15s forwards alternate;
  animation: bound 0.6s cubic-bezier(0.33, 1, 0.68, 1) 1.15s forwards alternate;
}
.mojipoyospan.active > span:nth-child(24) {
  -webkit-animation: bound 0.6s cubic-bezier(0.33, 1, 0.68, 1) 1.2s forwards alternate;
  animation: bound 0.6s cubic-bezier(0.33, 1, 0.68, 1) 1.2s forwards alternate;
}
.mojipoyospan.active > span:nth-child(25) {
  -webkit-animation: bound 0.6s cubic-bezier(0.33, 1, 0.68, 1) 1.25s forwards alternate;
  animation: bound 0.6s cubic-bezier(0.33, 1, 0.68, 1) 1.25s forwards alternate;
}
.mojipoyospan.active > span:nth-child(26) {
  -webkit-animation: bound 0.6s cubic-bezier(0.33, 1, 0.68, 1) 1.3s forwards alternate;
  animation: bound 0.6s cubic-bezier(0.33, 1, 0.68, 1) 1.3s forwards alternate;
}
.mojipoyospan.active > span:nth-child(27) {
  -webkit-animation: bound 0.6s cubic-bezier(0.33, 1, 0.68, 1) 1.35s forwards alternate;
  animation: bound 0.6s cubic-bezier(0.33, 1, 0.68, 1) 1.35s forwards alternate;
}
.mojipoyospan.active > span:nth-child(28) {
  -webkit-animation: bound 0.6s cubic-bezier(0.33, 1, 0.68, 1) 1.4s forwards alternate;
  animation: bound 0.6s cubic-bezier(0.33, 1, 0.68, 1) 1.4s forwards alternate;
}
.mojipoyospan.active > span:nth-child(29) {
  -webkit-animation: bound 0.6s cubic-bezier(0.33, 1, 0.68, 1) 1.45s forwards alternate;
  animation: bound 0.6s cubic-bezier(0.33, 1, 0.68, 1) 1.45s forwards alternate;
}
.mojipoyospan.active > span:nth-child(30) {
  -webkit-animation: bound 0.6s cubic-bezier(0.33, 1, 0.68, 1) 1.5s forwards alternate;
  animation: bound 0.6s cubic-bezier(0.33, 1, 0.68, 1) 1.5s forwards alternate;
}
.mojipoyospan.active > span:nth-child(31) {
  -webkit-animation: bound 0.6s cubic-bezier(0.33, 1, 0.68, 1) 1.55s forwards alternate;
  animation: bound 0.6s cubic-bezier(0.33, 1, 0.68, 1) 1.55s forwards alternate;
}
.mojipoyospan.active > span:nth-child(32) {
  -webkit-animation: bound 0.6s cubic-bezier(0.33, 1, 0.68, 1) 1.6s forwards alternate;
  animation: bound 0.6s cubic-bezier(0.33, 1, 0.68, 1) 1.6s forwards alternate;
}
.mojipoyospan.active > span:nth-child(33) {
  -webkit-animation: bound 0.6s cubic-bezier(0.33, 1, 0.68, 1) 1.65s forwards alternate;
  animation: bound 0.6s cubic-bezier(0.33, 1, 0.68, 1) 1.65s forwards alternate;
}
.mojipoyospan.active > span:nth-child(34) {
  -webkit-animation: bound 0.6s cubic-bezier(0.33, 1, 0.68, 1) 1.7s forwards alternate;
  animation: bound 0.6s cubic-bezier(0.33, 1, 0.68, 1) 1.7s forwards alternate;
}
.mojipoyospan.active > span:nth-child(35) {
  -webkit-animation: bound 0.6s cubic-bezier(0.33, 1, 0.68, 1) 1.75s forwards alternate;
  animation: bound 0.6s cubic-bezier(0.33, 1, 0.68, 1) 1.75s forwards alternate;
}
.mojipoyospan.active > span:nth-child(36) {
  -webkit-animation: bound 0.6s cubic-bezier(0.33, 1, 0.68, 1) 1.8s forwards alternate;
  animation: bound 0.6s cubic-bezier(0.33, 1, 0.68, 1) 1.8s forwards alternate;
}
.mojipoyospan.active > span:nth-child(37) {
  -webkit-animation: bound 0.6s cubic-bezier(0.33, 1, 0.68, 1) 1.85s forwards alternate;
  animation: bound 0.6s cubic-bezier(0.33, 1, 0.68, 1) 1.85s forwards alternate;
}
.mojipoyospan.active > span:nth-child(38) {
  -webkit-animation: bound 0.6s cubic-bezier(0.33, 1, 0.68, 1) 1.9s forwards alternate;
  animation: bound 0.6s cubic-bezier(0.33, 1, 0.68, 1) 1.9s forwards alternate;
}
.mojipoyospan.active > span:nth-child(39) {
  -webkit-animation: bound 0.6s cubic-bezier(0.33, 1, 0.68, 1) 1.95s forwards alternate;
  animation: bound 0.6s cubic-bezier(0.33, 1, 0.68, 1) 1.95s forwards alternate;
}
.mojipoyospan.active > span:nth-child(40) {
  -webkit-animation: bound 0.6s cubic-bezier(0.33, 1, 0.68, 1) 2s forwards alternate;
  animation: bound 0.6s cubic-bezier(0.33, 1, 0.68, 1) 2s forwards alternate;
}
.mojipoyospan.active > span:nth-child(41) {
  -webkit-animation: bound 0.6s cubic-bezier(0.33, 1, 0.68, 1) 2.05s forwards alternate;
  animation: bound 0.6s cubic-bezier(0.33, 1, 0.68, 1) 2.05s forwards alternate;
}
.mojipoyospan.active > span:nth-child(42) {
  -webkit-animation: bound 0.6s cubic-bezier(0.33, 1, 0.68, 1) 2.1s forwards alternate;
  animation: bound 0.6s cubic-bezier(0.33, 1, 0.68, 1) 2.1s forwards alternate;
}
.mojipoyospan.active > span:nth-child(43) {
  -webkit-animation: bound 0.6s cubic-bezier(0.33, 1, 0.68, 1) 2.15s forwards alternate;
  animation: bound 0.6s cubic-bezier(0.33, 1, 0.68, 1) 2.15s forwards alternate;
}
.mojipoyospan.active > span:nth-child(44) {
  -webkit-animation: bound 0.6s cubic-bezier(0.33, 1, 0.68, 1) 2.2s forwards alternate;
  animation: bound 0.6s cubic-bezier(0.33, 1, 0.68, 1) 2.2s forwards alternate;
}
.mojipoyospan.active > span:nth-child(45) {
  -webkit-animation: bound 0.6s cubic-bezier(0.33, 1, 0.68, 1) 2.25s forwards alternate;
  animation: bound 0.6s cubic-bezier(0.33, 1, 0.68, 1) 2.25s forwards alternate;
}
.mojipoyospan.active > span:nth-child(46) {
  -webkit-animation: bound 0.6s cubic-bezier(0.33, 1, 0.68, 1) 2.3s forwards alternate;
  animation: bound 0.6s cubic-bezier(0.33, 1, 0.68, 1) 2.3s forwards alternate;
}
.mojipoyospan.active > span:nth-child(47) {
  -webkit-animation: bound 0.6s cubic-bezier(0.33, 1, 0.68, 1) 2.35s forwards alternate;
  animation: bound 0.6s cubic-bezier(0.33, 1, 0.68, 1) 2.35s forwards alternate;
}
.mojipoyospan.active > span:nth-child(48) {
  -webkit-animation: bound 0.6s cubic-bezier(0.33, 1, 0.68, 1) 2.4s forwards alternate;
  animation: bound 0.6s cubic-bezier(0.33, 1, 0.68, 1) 2.4s forwards alternate;
}
.mojipoyospan.active > span:nth-child(49) {
  -webkit-animation: bound 0.6s cubic-bezier(0.33, 1, 0.68, 1) 2.45s forwards alternate;
  animation: bound 0.6s cubic-bezier(0.33, 1, 0.68, 1) 2.45s forwards alternate;
}
.mojipoyospan.active > span:nth-child(50) {
  -webkit-animation: bound 0.6s cubic-bezier(0.33, 1, 0.68, 1) 2.5s forwards alternate;
  animation: bound 0.6s cubic-bezier(0.33, 1, 0.68, 1) 2.5s forwards alternate;
}

@-webkit-keyframes bound {
  0% {
    opacity: 0;
    transform: translateY(50%);
  }
  70% {
    opacity: 1;
    transform: translateY(0%);
  }
  to {
    opacity: 1;
    transform: none;
  }
}
@keyframes bound {
  0% {
    opacity: 0;
    transform: translateY(50%);
  }
  70% {
    opacity: 1;
    transform: translateY(0%);
  }
  to {
    opacity: 1;
    transform: none;
  }
}
/* ==========================================================================
use＆nameSpace
========================================================================== */
/* ==========================================================================
use＆nameSpace
========================================================================== */
/* ==========================================================================
LAYOUT
========================================================================== */
.indexTopics {
  padding-top: 13px;
  padding-bottom: 17px;
  padding-left: 0px;
  padding-right: 0px;
}
@media screen and (max-width: 1299px) {
  .indexTopics {
    padding: 0.67% 0% 0.88% 0%;
  }
}
@media screen and (max-width: 767px) {
  .indexTopics {
    padding: 3% 0% 3.66% 0%;
  }
}

@media screen and (max-width: 767px) {
  .indexTopicsWap {
    width: 340px;
  }
}
@media screen and (max-width: 767px) and (max-width: 1299px) {
  .indexTopicsWap {
    width: 90.66%;
  }
}

@media screen and (max-width: 767px) {
  .indexTopicsFx {
    flex-flow: row wrap;
  }
}

.indexTopicsTitile {
  width: 425px;
}
@media screen and (max-width: 1299px) {
  .indexTopicsTitile {
    width: 32.69%;
  }
}
@media screen and (max-width: 767px) {
  .indexTopicsTitile {
    width: 100%;
  }
}

.secIndexTopicsTitile {
  width: 378px;
  align-items: baseline;
}
@media screen and (max-width: 1299px) {
  .secIndexTopicsTitile {
    width: 88.94%;
  }
}
@media screen and (max-width: 767px) {
  .secIndexTopicsTitile {
    width: 100%;
  }
}

.h2IndexTopicsTitile {
  font-size: 36px;
  line-height: normal;
  letter-spacing: 0.1em;
  text-indent: -0.1em;
}
@media screen and (max-width: 1299px) {
  .h2IndexTopicsTitile {
    font-size: 2.7713625866vw;
  }
}
@media screen and (max-width: 767px) {
  .h2IndexTopicsTitile {
    line-height: normal;
    letter-spacing: 0.1em;
    text-indent: -0.1em;
  }
}
@media screen and (max-width: 767px) and (max-width: 767px) {
  .h2IndexTopicsTitile {
    font-size: 6.6666666667vw;
  }
}

.txtIndexTopicsTitile {
  margin-top: 0px;
  margin-bottom: 0px;
  margin-left: 13px;
  margin-right: 0px;
  font-size: 16px;
  line-height: normal;
  letter-spacing: 0.1em;
  text-indent: -0.1em;
}
@media screen and (max-width: 1299px) {
  .txtIndexTopicsTitile {
    margin: 0% 0% 0% 3.43%;
  }
}
@media screen and (max-width: 1299px) {
  .txtIndexTopicsTitile {
    font-size: 1.2317167052vw;
  }
}
@media screen and (max-width: 767px) {
  .txtIndexTopicsTitile {
    margin: 0% 0% 0% 3.94%;
    line-height: normal;
    letter-spacing: 0.1em;
    text-indent: -0.1em;
  }
}
@media screen and (max-width: 767px) and (max-width: 767px) {
  .txtIndexTopicsTitile {
    font-size: 3.7333333333vw;
  }
}

.btnIndexTopicsTitile {
  width: 45px;
  cursor: pointer;
}
@media screen and (max-width: 1299px) {
  .btnIndexTopicsTitile {
    width: 10.58%;
  }
}
@media screen and (max-width: 767px) {
  .btnIndexTopicsTitile {
    width: 45px;
  }
}
@media screen and (max-width: 767px) and (max-width: 1299px) {
  .btnIndexTopicsTitile {
    width: 13.23%;
  }
}

.btnIndexTopicsTitile.off .off {
  display: block;
}
.btnIndexTopicsTitile.off .on {
  display: none;
}

.btnIndexTopicsTitile.on .off {
  display: none;
}
.btnIndexTopicsTitile.on .on {
  display: block;
}

/**/
.navIndexTopics {
  width: 917px;
  margin-top: 0px;
  margin-bottom: 0px;
  margin-left: 32px;
  margin-right: auto;
}
@media screen and (max-width: 1299px) {
  .navIndexTopics {
    width: 70.53%;
  }
}
@media screen and (max-width: 1299px) and (max-width: 1299px) {
  .navIndexTopics {
    margin-top: 0%;
    margin-bottom: 0%;
    margin-left: 2.46%;
    margin-right: auto;
  }
}
@media screen and (max-width: 767px) {
  .navIndexTopics {
    width: 100%;
    margin-top: 0px;
    margin-bottom: 0px;
    margin-left: auto;
    margin-right: auto;
  }
}
@media screen and (max-width: 767px) and (max-width: 1299px) {
  .navIndexTopics {
    margin-top: 0%;
    margin-bottom: 0%;
    margin-left: auto;
    margin-right: auto;
  }
}

.readmoneIndexTopics {
  display: none;
}

.readmoneIndexTopics .trigerliNavIndexTopics {
  border-top: 1px solid #CCCCCE;
}

.topTrigerliNavIndexTopics {
  padding-top: 20px;
  padding-bottom: 20px;
  padding-left: 0px;
  padding-right: 0px;
  width: 843px;
  flex-flow: row wrap;
  cursor: pointer;
}
@media screen and (max-width: 1299px) {
  .topTrigerliNavIndexTopics {
    padding: 2.18% 0% 2.18% 0%;
  }
}
@media screen and (max-width: 1299px) {
  .topTrigerliNavIndexTopics {
    width: 91.93%;
  }
}
@media screen and (max-width: 767px) {
  .topTrigerliNavIndexTopics {
    padding-top: 13px;
    padding-bottom: 13px;
    padding-left: 0px;
    padding-right: 0px;
    width: 100%;
  }
}
@media screen and (max-width: 767px) and (max-width: 1299px) {
  .topTrigerliNavIndexTopics {
    padding: 3.82% 0% 3.82% 0%;
  }
}

.trigerliNavIndexTopics.off .brdTopTrigerliNavIndexTopicsOff {
  display: block;
}
.trigerliNavIndexTopics.off .brdTopTrigerliNavIndexTopicsOn {
  display: none;
}
.trigerliNavIndexTopics.on .brdTopTrigerliNavIndexTopicsOff {
  display: none;
}
.trigerliNavIndexTopics.on .brdTopTrigerliNavIndexTopicsOn {
  display: block;
}

.timeTrigerliNavIndexTopics {
  font-size: 14px;
  line-height: normal;
  letter-spacing: 0.05em;
  text-indent: -0.05em;
  width: 102px;
}
@media screen and (max-width: 1299px) {
  .timeTrigerliNavIndexTopics {
    font-size: 1.077752117vw;
  }
}
@media screen and (max-width: 1299px) {
  .timeTrigerliNavIndexTopics {
    width: 12.09%;
  }
}
@media screen and (max-width: 767px) {
  .timeTrigerliNavIndexTopics {
    line-height: normal;
    letter-spacing: 0em;
    text-indent: 0em;
    width: 100%;
  }
}
@media screen and (max-width: 767px) and (max-width: 767px) {
  .timeTrigerliNavIndexTopics {
    font-size: 3.7333333333vw;
  }
}

.h3TrigerliNavIndexTopics {
  font-size: 14px;
  line-height: normal;
  letter-spacing: 0em;
  text-indent: 0em;
  width: 699px;
  font-weight: 500;
}
@media screen and (max-width: 1299px) {
  .h3TrigerliNavIndexTopics {
    font-size: 1.077752117vw;
  }
}
@media screen and (max-width: 1299px) {
  .h3TrigerliNavIndexTopics {
    width: 82.91%;
  }
}
@media screen and (max-width: 767px) {
  .h3TrigerliNavIndexTopics {
    margin-top: 10px;
    margin-bottom: 0px;
    margin-left: 0px;
    margin-right: 0px;
    line-height: normal;
    letter-spacing: 0em;
    text-indent: 0em;
    width: 312px;
  }
}
@media screen and (max-width: 767px) and (max-width: 1299px) {
  .h3TrigerliNavIndexTopics {
    margin: 2.94% 0% 0% 0%;
  }
}
@media screen and (max-width: 767px) and (max-width: 767px) {
  .h3TrigerliNavIndexTopics {
    font-size: 3.7333333333vw;
  }
}
@media screen and (max-width: 767px) and (max-width: 1299px) {
  .h3TrigerliNavIndexTopics {
    width: 91.76%;
  }
}

.btnTopTrigerliNavIndexTopics {
  width: 20px;
  aspect-ratio: 1/1;
  display: flex;
  align-items: center;
}
@media screen and (max-width: 1299px) {
  .btnTopTrigerliNavIndexTopics {
    width: 2.37%;
  }
}
@media screen and (max-width: 767px) {
  .btnTopTrigerliNavIndexTopics {
    width: 20px;
    margin: 0 0 0 auto;
  }
}
@media screen and (max-width: 767px) and (max-width: 1299px) {
  .btnTopTrigerliNavIndexTopics {
    width: 5.88%;
  }
}

.btnTrigerliNavIndexTopicsLxn {
  display: none;
}

.btnTrigerliNavIndexTopics {
  width: 843px;
}
@media screen and (max-width: 1299px) {
  .btnTrigerliNavIndexTopics {
    width: 91.93%;
  }
}
@media screen and (max-width: 767px) {
  .btnTrigerliNavIndexTopics {
    width: 100%;
  }
}

.timeTrigerliNavIndexTopics {
  width: 103px;
}
@media screen and (max-width: 1299px) {
  .timeTrigerliNavIndexTopics {
    width: 12.21%;
  }
}
@media screen and (max-width: 767px) {
  .timeTrigerliNavIndexTopics {
    display: none;
  }
}

.cntTrigerliNavIndexTopics {
  padding-top: 0px;
  padding-bottom: 25px;
  padding-left: 0px;
  padding-right: 0px;
  width: 699px;
}
@media screen and (max-width: 1299px) {
  .cntTrigerliNavIndexTopics {
    padding: 0% 0% 2.96% 0%;
  }
}
@media screen and (max-width: 1299px) {
  .cntTrigerliNavIndexTopics {
    width: 82.91%;
  }
}
@media screen and (max-width: 767px) {
  .cntTrigerliNavIndexTopics {
    padding-top: 0px;
    padding-bottom: 25px;
    padding-left: 0px;
    padding-right: 0px;
    width: 312px;
  }
}
@media screen and (max-width: 767px) and (max-width: 1299px) {
  .cntTrigerliNavIndexTopics {
    padding: 0% 0% 7.35% 0%;
  }
}
@media screen and (max-width: 767px) and (max-width: 1299px) {
  .cntTrigerliNavIndexTopics {
    width: 91.76%;
  }
}
.cntTrigerliNavIndexTopics img {
  max-width: 100%;
  width: auto;
}
.cntTrigerliNavIndexTopics h1 + img,
.cntTrigerliNavIndexTopics h2 + img,
.cntTrigerliNavIndexTopics h3 + img,
.cntTrigerliNavIndexTopics h4 + img,
.cntTrigerliNavIndexTopics h5 + img,
.cntTrigerliNavIndexTopics p + img,
.cntTrigerliNavIndexTopics ul + img,
.cntTrigerliNavIndexTopics ol + img,
.cntTrigerliNavIndexTopics aside + img {
  margin-top: 45px;
  margin-bottom: 0px;
  margin-left: 0px;
  margin-right: 0px;
}
@media screen and (max-width: 1299px) {
  .cntTrigerliNavIndexTopics h1 + img,
  .cntTrigerliNavIndexTopics h2 + img,
  .cntTrigerliNavIndexTopics h3 + img,
  .cntTrigerliNavIndexTopics h4 + img,
  .cntTrigerliNavIndexTopics h5 + img,
  .cntTrigerliNavIndexTopics p + img,
  .cntTrigerliNavIndexTopics ul + img,
  .cntTrigerliNavIndexTopics ol + img,
  .cntTrigerliNavIndexTopics aside + img {
    margin: 6.26% 0% 0% 0%;
  }
}
@media screen and (max-width: 767px) {
  .cntTrigerliNavIndexTopics h1 + img,
  .cntTrigerliNavIndexTopics h2 + img,
  .cntTrigerliNavIndexTopics h3 + img,
  .cntTrigerliNavIndexTopics h4 + img,
  .cntTrigerliNavIndexTopics h5 + img,
  .cntTrigerliNavIndexTopics p + img,
  .cntTrigerliNavIndexTopics ul + img,
  .cntTrigerliNavIndexTopics ol + img,
  .cntTrigerliNavIndexTopics aside + img {
    margin-top: 11.63%;
  }
}
.cntTrigerliNavIndexTopics h1 + h1,
.cntTrigerliNavIndexTopics h2 + h1,
.cntTrigerliNavIndexTopics h3 + h1,
.cntTrigerliNavIndexTopics h4 + h1,
.cntTrigerliNavIndexTopics h5 + h1,
.cntTrigerliNavIndexTopics p + h1,
.cntTrigerliNavIndexTopics ul + h1,
.cntTrigerliNavIndexTopics ol + h1,
.cntTrigerliNavIndexTopics img + h1,
.cntTrigerliNavIndexTopics aside + h1 {
  margin-top: 46px;
  margin-bottom: 0px;
  margin-left: auto;
  margin-right: auto;
}
@media screen and (max-width: 1299px) {
  .cntTrigerliNavIndexTopics h1 + h1,
  .cntTrigerliNavIndexTopics h2 + h1,
  .cntTrigerliNavIndexTopics h3 + h1,
  .cntTrigerliNavIndexTopics h4 + h1,
  .cntTrigerliNavIndexTopics h5 + h1,
  .cntTrigerliNavIndexTopics p + h1,
  .cntTrigerliNavIndexTopics ul + h1,
  .cntTrigerliNavIndexTopics ol + h1,
  .cntTrigerliNavIndexTopics img + h1,
  .cntTrigerliNavIndexTopics aside + h1 {
    margin-top: 5.67%;
    margin-bottom: 0%;
    margin-left: auto;
    margin-right: auto;
  }
}
@media screen and (max-width: 767px) {
  .cntTrigerliNavIndexTopics h1 + h1,
  .cntTrigerliNavIndexTopics h2 + h1,
  .cntTrigerliNavIndexTopics h3 + h1,
  .cntTrigerliNavIndexTopics h4 + h1,
  .cntTrigerliNavIndexTopics h5 + h1,
  .cntTrigerliNavIndexTopics p + h1,
  .cntTrigerliNavIndexTopics ul + h1,
  .cntTrigerliNavIndexTopics ol + h1,
  .cntTrigerliNavIndexTopics img + h1,
  .cntTrigerliNavIndexTopics aside + h1 {
    margin-top: 8.5%;
    margin-bottom: 0%;
    margin-left: auto;
    margin-right: auto;
  }
}
.cntTrigerliNavIndexTopics p {
  font-size: 14px;
  line-height: normal;
  letter-spacing: 0em;
  text-indent: 0em;
  font-weight: 400;
}
@media screen and (max-width: 1299px) {
  .cntTrigerliNavIndexTopics p {
    font-size: 1.077752117vw;
  }
}
@media screen and (max-width: 767px) {
  .cntTrigerliNavIndexTopics p {
    line-height: normal;
    letter-spacing: 0em;
    text-indent: 0em;
  }
}
@media screen and (max-width: 767px) and (max-width: 767px) {
  .cntTrigerliNavIndexTopics p {
    font-size: 3.7333333333vw;
  }
}
.cntTrigerliNavIndexTopics h1 + p,
.cntTrigerliNavIndexTopics h2 + p,
.cntTrigerliNavIndexTopics h3 + p,
.cntTrigerliNavIndexTopics h4 + p,
.cntTrigerliNavIndexTopics h5 + p,
.cntTrigerliNavIndexTopics p + p,
.cntTrigerliNavIndexTopics ul + p,
.cntTrigerliNavIndexTopics ol + p,
.cntTrigerliNavIndexTopics img + p,
.cntTrigerliNavIndexTopics aside + p {
  margin-top: 12px;
  margin-bottom: 0px;
  margin-left: auto;
  margin-right: auto;
}
@media screen and (max-width: 1299px) {
  .cntTrigerliNavIndexTopics h1 + p,
  .cntTrigerliNavIndexTopics h2 + p,
  .cntTrigerliNavIndexTopics h3 + p,
  .cntTrigerliNavIndexTopics h4 + p,
  .cntTrigerliNavIndexTopics h5 + p,
  .cntTrigerliNavIndexTopics p + p,
  .cntTrigerliNavIndexTopics ul + p,
  .cntTrigerliNavIndexTopics ol + p,
  .cntTrigerliNavIndexTopics img + p,
  .cntTrigerliNavIndexTopics aside + p {
    margin-top: 1.68%;
    margin-bottom: 0%;
    margin-left: auto;
    margin-right: auto;
  }
}
@media screen and (max-width: 767px) {
  .cntTrigerliNavIndexTopics h1 + p,
  .cntTrigerliNavIndexTopics h2 + p,
  .cntTrigerliNavIndexTopics h3 + p,
  .cntTrigerliNavIndexTopics h4 + p,
  .cntTrigerliNavIndexTopics h5 + p,
  .cntTrigerliNavIndexTopics p + p,
  .cntTrigerliNavIndexTopics ul + p,
  .cntTrigerliNavIndexTopics ol + p,
  .cntTrigerliNavIndexTopics img + p,
  .cntTrigerliNavIndexTopics aside + p {
    margin-top: 8px;
    margin-bottom: 0px;
    margin-left: auto;
    margin-right: auto;
  }
}
@media screen and (max-width: 767px) and (max-width: 1299px) {
  .cntTrigerliNavIndexTopics h1 + p,
  .cntTrigerliNavIndexTopics h2 + p,
  .cntTrigerliNavIndexTopics h3 + p,
  .cntTrigerliNavIndexTopics h4 + p,
  .cntTrigerliNavIndexTopics h5 + p,
  .cntTrigerliNavIndexTopics p + p,
  .cntTrigerliNavIndexTopics ul + p,
  .cntTrigerliNavIndexTopics ol + p,
  .cntTrigerliNavIndexTopics img + p,
  .cntTrigerliNavIndexTopics aside + p {
    margin-top: 2.42%;
    margin-bottom: 0%;
    margin-left: auto;
    margin-right: auto;
  }
}
.cntTrigerliNavIndexTopics .ulAsideRelatedArticlesBlog {
  margin-top: 12px;
  margin-bottom: 0px;
  margin-left: auto;
  margin-right: auto;
  padding: 0;
  width: 659px;
}
@media screen and (max-width: 1299px) {
  .cntTrigerliNavIndexTopics .ulAsideRelatedArticlesBlog {
    margin-top: 1.67%;
    margin-bottom: 0%;
    margin-left: auto;
    margin-right: auto;
  }
}
@media screen and (max-width: 1299px) {
  .cntTrigerliNavIndexTopics .ulAsideRelatedArticlesBlog {
    width: 91.78%;
  }
}
@media screen and (max-width: 767px) {
  .cntTrigerliNavIndexTopics .ulAsideRelatedArticlesBlog {
    margin-top: 7px;
    margin-bottom: 0px;
    margin-left: auto;
    margin-right: auto;
    width: 300px;
  }
}
@media screen and (max-width: 767px) and (max-width: 1299px) {
  .cntTrigerliNavIndexTopics .ulAsideRelatedArticlesBlog {
    margin-top: 2.12%;
    margin-bottom: 0%;
    margin-left: auto;
    margin-right: auto;
  }
}
@media screen and (max-width: 767px) and (max-width: 1299px) {
  .cntTrigerliNavIndexTopics .ulAsideRelatedArticlesBlog {
    width: 90.9%;
  }
}

.btnTopTrigerliNavIndexTopics {
  width: 20px;
}
@media screen and (max-width: 1299px) {
  .btnTopTrigerliNavIndexTopics {
    width: 2.37%;
  }
}
@media screen and (max-width: 767px) {
  .btnTopTrigerliNavIndexTopics {
    width: 20px;
  }
}
@media screen and (max-width: 767px) and (max-width: 1299px) {
  .btnTopTrigerliNavIndexTopics {
    width: 5.88%;
  }
}

.topTrigerliNavIndexTopics.on .brdTopTrigerliNavIndexTopicsOff {
  display: none;
}
.topTrigerliNavIndexTopics.on .brdTopTrigerliNavIndexTopicsOn {
  display: block;
}

.topTrigerliNavIndexTopics.off .brdTopTrigerliNavIndexTopicsOff {
  display: block;
}
.topTrigerliNavIndexTopics.off .brdTopTrigerliNavIndexTopicsOn {
  display: none;
}

/* ==========================================================================
use＆nameSpace
========================================================================== */
/* ==========================================================================
use＆nameSpace
========================================================================== */
/* ==========================================================================
LAYOUT
========================================================================== */
.indexKikaku {
  padding-top: 156px;
  padding-bottom: 152px;
  padding-left: 0px;
  padding-right: 0px;
}
@media screen and (max-width: 1299px) {
  .indexKikaku {
    padding: 8.12% 0% 7.91% 0%;
  }
}
@media screen and (max-width: 767px) {
  .indexKikaku {
    padding-top: 78px;
    padding-bottom: 48px;
    padding-left: 0px;
    padding-right: 0px;
  }
}
@media screen and (max-width: 767px) and (max-width: 1299px) {
  .indexKikaku {
    padding: 20.8% 0% 12.8% 0%;
  }
}

.bgindexKikaku {
  background: url(../img/index/bgindexKikakuPc.png) no-repeat center top;
  background-size: cover;
}
@media screen and (max-width: 767px) {
  .bgindexKikaku {
    background: url(../img/index/bgindexKikakuSp.png) no-repeat center top;
    background-size: cover;
  }
}

@media screen and (max-width: 767px) {
  .indexKikakuWap {
    width: 340px;
    margin: auto;
  }
}
@media screen and (max-width: 767px) and (max-width: 1299px) {
  .indexKikakuWap {
    width: 90.66%;
  }
}

.secIndexKikakuTop {
  width: 492px;
}
@media screen and (max-width: 1299px) {
  .secIndexKikakuTop {
    width: 37.84%;
  }
}
@media screen and (max-width: 767px) {
  .secIndexKikakuTop {
    width: 100%;
  }
}

.h2IndexKikakuTop {
  font-size: 32px;
  line-height: normal;
  letter-spacing: 0.1em;
  text-indent: -0.1em;
}
@media screen and (max-width: 1299px) {
  .h2IndexKikakuTop {
    font-size: 2.4634334103vw;
  }
}
@media screen and (max-width: 767px) {
  .h2IndexKikakuTop {
    line-height: normal;
    letter-spacing: 0.05em;
    text-indent: -0.05em;
  }
}
@media screen and (max-width: 767px) and (max-width: 767px) {
  .h2IndexKikakuTop {
    font-size: 5.3333333333vw;
  }
}

.txtPicIndexKikakuTop {
  margin-top: 20px;
  margin-bottom: 0px;
  margin-left: -2px;
  margin-right: 0px;
}
@media screen and (max-width: 1299px) {
  .txtPicIndexKikakuTop {
    margin: 4.06% 0% 0% -0.41%;
  }
}
@media screen and (max-width: 767px) {
  .txtPicIndexKikakuTop {
    margin-top: 1px;
    margin-bottom: 0px;
    margin-left: auto;
    margin-right: auto;
  }
}
@media screen and (max-width: 767px) and (max-width: 1299px) {
  .txtPicIndexKikakuTop {
    margin-top: 0.29%;
    margin-bottom: 0%;
    margin-left: auto;
    margin-right: auto;
  }
}

.txtIndexKikakuTop {
  margin-top: 32px;
  margin-bottom: 0px;
  margin-left: 0px;
  margin-right: 0px;
  font-size: 20px;
  line-height: 1.5;
  letter-spacing: 0.05em;
  text-indent: -0.05em;
}
@media screen and (max-width: 1299px) {
  .txtIndexKikakuTop {
    margin: 6.5% 0% 0% 0%;
  }
}
@media screen and (max-width: 1299px) {
  .txtIndexKikakuTop {
    font-size: 1.5396458814vw;
  }
}
.txtIndexKikakuTop::before {
  display: block;
  width: 0;
  height: 0;
  margin-top: calc((1 - 1.5) * 0.5em);
  content: "";
}
.txtIndexKikakuTop::after {
  display: block;
  width: 0;
  height: 0;
  margin-bottom: calc((1 - 1.5) * 0.5em);
  content: "";
}
@media screen and (max-width: 767px) {
  .txtIndexKikakuTop {
    margin-top: 5.52%;
    margin-bottom: 0%;
    margin-left: auto;
    margin-right: auto;
    line-height: 1.3888888889;
    letter-spacing: 0.05em;
    text-indent: -0.05em;
  }
}
@media screen and (max-width: 767px) and (max-width: 767px) {
  .txtIndexKikakuTop {
    font-size: 4.8vw;
  }
}
@media screen and (max-width: 767px) {
  .txtIndexKikakuTop::before {
    display: block;
    width: 0;
    height: 0;
    margin-top: calc((1 - 1.3888888889) * 0.5em);
    content: "";
  }
  .txtIndexKikakuTop::after {
    display: block;
    width: 0;
    height: 0;
    margin-bottom: calc((1 - 1.3888888889) * 0.5em);
    content: "";
  }
}

.readIndexKikakuTop {
  width: 607px;
  margin: 0.1% 0 0 0;
}
@media screen and (max-width: 1299px) {
  .readIndexKikakuTop {
    width: 46.69%;
  }
}
@media screen and (max-width: 767px) {
  .readIndexKikakuTop {
    margin-top: 11.5%;
    margin-bottom: 0%;
    margin-left: auto;
    margin-right: auto;
    width: 100%;
  }
}

.txtReadIndexKikakuTop {
  font-size: 15px;
  line-height: 2.7;
  letter-spacing: 0em;
  text-indent: 0em;
}
@media screen and (max-width: 1299px) {
  .txtReadIndexKikakuTop {
    font-size: 1.1547344111vw;
  }
}
@media screen and (max-width: 767px) {
  .txtReadIndexKikakuTop {
    line-height: 1.8333333333;
    letter-spacing: 0em;
    text-indent: 0em;
  }
}
@media screen and (max-width: 767px) and (max-width: 767px) {
  .txtReadIndexKikakuTop {
    font-size: 3.2vw;
  }
}
@media screen and (max-width: 767px) {
  .txtReadIndexKikakuTop::before {
    display: block;
    width: 0;
    height: 0;
    margin-top: calc((1 - 1.8333333333) * 0.5em);
    content: "";
  }
  .txtReadIndexKikakuTop::after {
    display: block;
    width: 0;
    height: 0;
    margin-bottom: calc((1 - 1.8333333333) * 0.5em);
    content: "";
  }
}

.txtReadIndexKikakuTop02 {
  margin-top: 34px;
  margin-bottom: 0px;
  margin-left: 0px;
  margin-right: 0px;
  font-size: 15px;
  line-height: 2.6666666667;
  letter-spacing: 0em;
  text-indent: 0em;
}
@media screen and (max-width: 1299px) {
  .txtReadIndexKikakuTop02 {
    margin: 5.63% 0% 0% 0%;
  }
}
@media screen and (max-width: 1299px) {
  .txtReadIndexKikakuTop02 {
    font-size: 1.1547344111vw;
  }
}
.txtReadIndexKikakuTop02::before {
  display: block;
  width: 0;
  height: 0;
  margin-top: calc((1 - 2.6666666667) * 0.5em);
  content: "";
}
.txtReadIndexKikakuTop02::after {
  display: block;
  width: 0;
  height: 0;
  margin-bottom: calc((1 - 2.6666666667) * 0.5em);
  content: "";
}
@media screen and (max-width: 767px) {
  .txtReadIndexKikakuTop02 {
    margin-top: 3.5%;
    margin-bottom: 0%;
    margin-left: auto;
    margin-right: auto;
    line-height: 1.8333333333;
    letter-spacing: 0em;
    text-indent: 0em;
  }
}
@media screen and (max-width: 767px) and (max-width: 767px) {
  .txtReadIndexKikakuTop02 {
    font-size: 3.2vw;
  }
}
@media screen and (max-width: 767px) {
  .txtReadIndexKikakuTop02::before {
    display: block;
    width: 0;
    height: 0;
    margin-top: calc((1 - 1.8333333333) * 0.5em);
    content: "";
  }
  .txtReadIndexKikakuTop02::after {
    display: block;
    width: 0;
    height: 0;
    margin-bottom: calc((1 - 1.8333333333) * 0.5em);
    content: "";
  }
}

.txt18ReadIndexKikakuTop {
  font-size: 18px;
  line-height: normal;
  letter-spacing: 0em;
  text-indent: 0em;
}
@media screen and (max-width: 1299px) {
  .txt18ReadIndexKikakuTop {
    font-size: 1.3856812933vw;
  }
}
@media screen and (max-width: 767px) {
  .txt18ReadIndexKikakuTop {
    line-height: 1.375;
    letter-spacing: 0em;
    text-indent: 0em;
  }
}
@media screen and (max-width: 767px) and (max-width: 767px) {
  .txt18ReadIndexKikakuTop {
    font-size: 4.2666666667vw;
  }
}
@media screen and (max-width: 767px) {
  .txt18ReadIndexKikakuTop::before {
    display: block;
    width: 0;
    height: 0;
    margin-top: calc((1 - 1.375) * 0.5em);
    content: "";
  }
  .txt18ReadIndexKikakuTop::after {
    display: block;
    width: 0;
    height: 0;
    margin-bottom: calc((1 - 1.375) * 0.5em);
    content: "";
  }
}

.h4ReadIndexKikakuTop {
  margin-top: 24px;
  margin-bottom: 0px;
  margin-left: 0px;
  margin-right: 0px;
  font-size: 20px;
  line-height: normal;
  letter-spacing: 0em;
  text-indent: 0em;
}
@media screen and (max-width: 1299px) {
  .h4ReadIndexKikakuTop {
    margin: 3.98% 0% 0% 0%;
  }
}
@media screen and (max-width: 1299px) {
  .h4ReadIndexKikakuTop {
    font-size: 1.5396458814vw;
  }
}
@media screen and (max-width: 767px) {
  .h4ReadIndexKikakuTop {
    margin-top: 3.41%;
    margin-bottom: 0%;
    margin-left: auto;
    margin-right: auto;
    line-height: normal;
    letter-spacing: 0em;
    text-indent: 0em;
  }
}
@media screen and (max-width: 767px) and (max-width: 767px) {
  .h4ReadIndexKikakuTop {
    font-size: 4.2666666667vw;
  }
}

.h5ReadIndexKikakuTop {
  margin-top: 12px;
  margin-bottom: 0px;
  margin-left: 0px;
  margin-right: 0px;
  font-size: 14px;
  line-height: normal;
  letter-spacing: 0em;
  text-indent: 0em;
}
@media screen and (max-width: 1299px) {
  .h5ReadIndexKikakuTop {
    margin: 1.99% 0% 0% 0%;
  }
}
@media screen and (max-width: 1299px) {
  .h5ReadIndexKikakuTop {
    font-size: 1.077752117vw;
  }
}
@media screen and (max-width: 767px) {
  .h5ReadIndexKikakuTop {
    margin-top: 8px;
    margin-bottom: 0px;
    margin-left: auto;
    margin-right: auto;
    line-height: normal;
    letter-spacing: 0em;
    text-indent: 0em;
  }
}
@media screen and (max-width: 767px) and (max-width: 1299px) {
  .h5ReadIndexKikakuTop {
    margin-top: 2.35%;
    margin-bottom: 0%;
    margin-left: auto;
    margin-right: auto;
  }
}
@media screen and (max-width: 767px) and (max-width: 767px) {
  .h5ReadIndexKikakuTop {
    font-size: 3.2vw;
  }
}

.txtLastReadIndexKikakuTop {
  margin-top: 7px;
  margin-bottom: 0px;
  margin-left: 0px;
  margin-right: 0px;
  font-size: 14px;
  line-height: normal;
  letter-spacing: 0em;
  text-indent: 0em;
}
@media screen and (max-width: 1299px) {
  .txtLastReadIndexKikakuTop {
    margin: 1.16% 0% 0% 0%;
  }
}
@media screen and (max-width: 1299px) {
  .txtLastReadIndexKikakuTop {
    font-size: 1.077752117vw;
  }
}
@media screen and (max-width: 767px) {
  .txtLastReadIndexKikakuTop {
    margin-top: 1.5%;
    margin-bottom: 0%;
    margin-left: auto;
    margin-right: auto;
    line-height: normal;
    letter-spacing: 0em;
    text-indent: 0em;
  }
}
@media screen and (max-width: 767px) and (max-width: 767px) {
  .txtLastReadIndexKikakuTop {
    font-size: 3.2vw;
  }
}

.ulIndexKikaku {
  margin-top: 33px;
  margin-bottom: 0px;
  margin-left: auto;
  margin-right: auto;
}
@media screen and (max-width: 1299px) {
  .ulIndexKikaku {
    margin-top: 2.53%;
    margin-bottom: 0%;
    margin-left: auto;
    margin-right: auto;
  }
}
@media screen and (max-width: 767px) {
  .ulIndexKikaku {
    margin-top: 35px;
    margin-bottom: 0px;
    margin-left: auto;
    margin-right: auto;
  }
}
@media screen and (max-width: 767px) and (max-width: 1299px) {
  .ulIndexKikaku {
    margin-top: 10.29%;
    margin-bottom: 0%;
    margin-left: auto;
    margin-right: auto;
  }
}

.liIndexKikaku {
  width: 234px;
}
@media screen and (max-width: 1299px) {
  .liIndexKikaku {
    width: 18%;
  }
}
@media screen and (max-width: 767px) {
  .liIndexKikaku {
    width: 160px;
  }
}
@media screen and (max-width: 767px) and (max-width: 1299px) {
  .liIndexKikaku {
    width: 47.05%;
  }
}
@media screen and (max-width: 767px) {
  .liIndexKikaku:nth-child(n+3) {
    margin-top: 17px;
    margin-bottom: 0px;
    margin-left: 0px;
    margin-right: 0px;
  }
}
@media screen and (max-width: 767px) and (max-width: 1299px) {
  .liIndexKikaku:nth-child(n+3) {
    margin: 5% 0% 0% 0%;
  }
}

/*cta*/
.btnIndexKikakuWap {
  margin-top: 31px;
  margin-bottom: 0px;
  margin-left: auto;
  margin-right: auto;
  width: 272px;
}
@media screen and (max-width: 1299px) {
  .btnIndexKikakuWap {
    margin-top: 2.38%;
    margin-bottom: 0%;
    margin-left: auto;
    margin-right: auto;
  }
}
@media screen and (max-width: 1299px) {
  .btnIndexKikakuWap {
    width: 20.92%;
  }
}
@media screen and (max-width: 767px) {
  .btnIndexKikakuWap {
    margin-top: 24px;
    margin-bottom: 0px;
    margin-left: auto;
    margin-right: auto;
    width: 272px;
  }
}
@media screen and (max-width: 767px) and (max-width: 1299px) {
  .btnIndexKikakuWap {
    margin-top: 7.05%;
    margin-bottom: 0%;
    margin-left: auto;
    margin-right: auto;
  }
}
@media screen and (max-width: 767px) and (max-width: 1299px) {
  .btnIndexKikakuWap {
    width: 80%;
  }
}

.btnIndexKikaku {
  border-radius: 30px;
  /* CSS3草案 */
  -webkit-border-radius: 30px;
  /* Safari,Google Chrome用 */
  -moz-border-radius: 30px;
  /* Firefox用 */
  width: 100%;
  aspect-ratio: 272/60;
  text-decoration: none;
  background: #DB2E21;
}
.btnIndexKikaku:hover {
  opacity: 1;
  background-color: #A42117;
  transform: scale(1.1);
}

.secIndexKikaku {
  background: url(../img/index/arrowBtnIndexKikaku.svg) no-repeat 98% center;
  background-size: auto 30%;
  transform: translateX(2%);
}

.secIndexKikaku {
  width: 252px;
  margin: auto;
}
@media screen and (max-width: 1299px) {
  .secIndexKikaku {
    width: 92.64%;
  }
}
@media screen and (max-width: 767px) {
  .secIndexKikaku {
    width: 252px;
  }
}
@media screen and (max-width: 767px) and (max-width: 1299px) {
  .secIndexKikaku {
    width: 92.64%;
  }
}

.h3IndexKikaku {
  font-size: 18px;
  line-height: normal;
  letter-spacing: 0.05em;
  text-indent: -0.05em;
}
@media screen and (max-width: 1299px) {
  .h3IndexKikaku {
    font-size: 1.3856812933vw;
  }
}
@media screen and (max-width: 767px) {
  .h3IndexKikaku {
    line-height: normal;
    letter-spacing: 0.05em;
    text-indent: -0.05em;
  }
}
@media screen and (max-width: 767px) and (max-width: 767px) {
  .h3IndexKikaku {
    font-size: 4.8vw;
  }
}

.txtIndexKikaku {
  font-size: 12px;
  line-height: normal;
  letter-spacing: 0em;
  text-indent: 0em;
  transform: translate(-1%, -5%);
}
@media screen and (max-width: 1299px) {
  .txtIndexKikaku {
    font-size: 0.9237875289vw;
  }
}
@media screen and (max-width: 767px) {
  .txtIndexKikaku {
    line-height: normal;
    letter-spacing: 0em;
    text-indent: 0em;
  }
}
@media screen and (max-width: 767px) and (max-width: 767px) {
  .txtIndexKikaku {
    font-size: 3.2vw;
  }
}

/* ==========================================================================
use＆nameSpace
========================================================================== */
/* ==========================================================================
use＆nameSpace
========================================================================== */
/* ==========================================================================
LAYOUT
========================================================================== */
.indexWorks {
  padding-top: 123px;
  padding-bottom: 0px;
  padding-left: 0px;
  padding-right: 0px;
}
@media screen and (max-width: 1299px) {
  .indexWorks {
    padding: 6.4% 0% 0% 0%;
  }
}
@media screen and (max-width: 767px) {
  .indexWorks {
    padding-top: 54px;
    padding-bottom: 0px;
    padding-left: 0px;
    padding-right: 0px;
  }
}
@media screen and (max-width: 767px) and (max-width: 1299px) {
  .indexWorks {
    padding: 14.4% 0% 0% 0%;
  }
}

@media screen and (max-width: 767px) {
  .indexWorksWap {
    width: 340px;
    margin: auto;
  }
}
@media screen and (max-width: 767px) and (max-width: 1299px) {
  .indexWorksWap {
    width: 90.66%;
  }
}

.titleIndexWorks {
  align-items: baseline;
}

.h2TitleIndexWorks {
  font-size: 36px;
  line-height: normal;
  letter-spacing: 0.1em;
  text-indent: -0.1em;
}
@media screen and (max-width: 1299px) {
  .h2TitleIndexWorks {
    font-size: 2.7713625866vw;
  }
}
@media screen and (max-width: 767px) {
  .h2TitleIndexWorks {
    line-height: normal;
    letter-spacing: 0.1em;
    text-indent: -0.1em;
  }
}
@media screen and (max-width: 767px) and (max-width: 767px) {
  .h2TitleIndexWorks {
    font-size: 6.6666666667vw;
  }
}

.txtTitleIndexWorks {
  margin-top: 0px;
  margin-bottom: 0px;
  margin-left: 14px;
  margin-right: auto;
  font-size: 16px;
  line-height: normal;
  letter-spacing: 0.1em;
  text-indent: -0.1em;
  transform: translateY(-5%);
}
@media screen and (max-width: 1299px) and (max-width: 1299px) {
  .txtTitleIndexWorks {
    margin-top: 0%;
    margin-bottom: 0%;
    margin-left: 1.07%;
    margin-right: auto;
  }
}
@media screen and (max-width: 1299px) {
  .txtTitleIndexWorks {
    font-size: 1.2317167052vw;
  }
}
@media screen and (max-width: 767px) {
  .txtTitleIndexWorks {
    margin-top: 0px;
    margin-bottom: 0px;
    margin-left: 10px;
    margin-right: 0px;
    line-height: normal;
    letter-spacing: 0.1em;
    text-indent: -0.1em;
  }
}
@media screen and (max-width: 767px) and (max-width: 1299px) {
  .txtTitleIndexWorks {
    margin: 0% 0% 0% 2.94%;
  }
}
@media screen and (max-width: 767px) and (max-width: 767px) {
  .txtTitleIndexWorks {
    font-size: 3.7333333333vw;
  }
}

.h3TitleIndexWorks {
  margin-top: 28px;
  margin-bottom: 0px;
  margin-left: auto;
  margin-right: auto;
  font-size: 32px;
  line-height: 1.59375;
  letter-spacing: 0.05em;
  text-indent: -0.05em;
}
@media screen and (max-width: 1299px) {
  .h3TitleIndexWorks {
    margin-top: 2.15%;
    margin-bottom: 0%;
    margin-left: auto;
    margin-right: auto;
  }
}
@media screen and (max-width: 1299px) {
  .h3TitleIndexWorks {
    font-size: 2.4634334103vw;
  }
}
.h3TitleIndexWorks::before {
  display: block;
  width: 0;
  height: 0;
  margin-top: calc((1 - 1.59375) * 0.5em);
  content: "";
}
.h3TitleIndexWorks::after {
  display: block;
  width: 0;
  height: 0;
  margin-bottom: calc((1 - 1.59375) * 0.5em);
  content: "";
}
@media screen and (max-width: 767px) {
  .h3TitleIndexWorks {
    margin-top: 14px;
    margin-bottom: 0px;
    margin-left: auto;
    margin-right: auto;
    line-height: 1.5;
    letter-spacing: 0.05em;
    text-indent: -0.05em;
  }
}
@media screen and (max-width: 767px) and (max-width: 1299px) {
  .h3TitleIndexWorks {
    margin-top: 4.11%;
    margin-bottom: 0%;
    margin-left: auto;
    margin-right: auto;
  }
}
@media screen and (max-width: 767px) and (max-width: 767px) {
  .h3TitleIndexWorks {
    font-size: 5.3333333333vw;
  }
}
@media screen and (max-width: 767px) {
  .h3TitleIndexWorks::before {
    display: block;
    width: 0;
    height: 0;
    margin-top: calc((1 - 1.5) * 0.5em);
    content: "";
  }
  .h3TitleIndexWorks::after {
    display: block;
    width: 0;
    height: 0;
    margin-bottom: calc((1 - 1.5) * 0.5em);
    content: "";
  }
}

.ulIndexWorks {
  margin-top: 35px;
  margin-bottom: 0px;
  margin-left: auto;
  margin-right: auto;
}
@media screen and (max-width: 1299px) {
  .ulIndexWorks {
    margin-top: 2.69%;
    margin-bottom: 0%;
    margin-left: auto;
    margin-right: auto;
  }
}
@media screen and (max-width: 767px) {
  .ulIndexWorks {
    margin-top: 4.82%;
    margin-bottom: 0%;
    margin-left: auto;
    margin-right: auto;
  }
}

.liIndexWorks {
  width: 308px;
  margin-top: 0px;
  margin-bottom: 23px;
  margin-left: 0px;
  margin-right: 22px;
  display: flex;
  flex-flow: row wrap;
  align-items: flex-start;
}
@media screen and (max-width: 1299px) {
  .liIndexWorks {
    width: 23.69%;
  }
}
@media screen and (max-width: 1299px) {
  .liIndexWorks {
    margin: 0% 1.69% 1.76% 0%;
  }
}
@media screen and (max-width: 767px) {
  .liIndexWorks {
    width: 100%;
    margin-top: 0px;
    margin-bottom: 20px;
    margin-left: auto;
    margin-right: auto;
  }
}
@media screen and (max-width: 767px) and (max-width: 1299px) {
  .liIndexWorks {
    margin-top: 0%;
    margin-bottom: 5.88%;
    margin-left: auto;
    margin-right: auto;
  }
}
.liIndexWorks:nth-child(4n) {
  margin-right: 0;
}
@media screen and (max-width: 767px) {
  .liIndexWorks:nth-child(4n) {
    margin-top: 0px;
    margin-bottom: 20px;
    margin-left: auto;
    margin-right: auto;
  }
}
@media screen and (max-width: 767px) and (max-width: 1299px) {
  .liIndexWorks:nth-child(4n) {
    margin-top: 0%;
    margin-bottom: 5.88%;
    margin-left: auto;
    margin-right: auto;
  }
}

.thumbsIndexWorks {
  border-radius: 6px;
  /* CSS3草案 */
  -webkit-border-radius: 6px;
  /* Safari,Google Chrome用 */
  -moz-border-radius: 6px;
  /* Firefox用 */
  overflow: hidden;
  aspect-ratio: 308/173;
  position: relative;
}
@media screen and (max-width: 767px) {
  .thumbsIndexWorks {
    aspect-ratio: 181/102;
    width: 181px;
  }
}
@media screen and (max-width: 767px) and (max-width: 1299px) {
  .thumbsIndexWorks {
    width: 53.23%;
  }
}

.thumbsIndexWorksIn {
  cursor: pointer;
}
@media screen and (max-width: 767px) {
  .thumbsIndexWorksIn {
    height: 100%;
  }
}
.thumbsIndexWorksIn img {
  width: 100%;
  height: auto;
  margin: auto;
  object-fit: cover;
}

.thumbsIndexWorksBtn {
  position: absolute;
  bottom: 6%;
  right: 3%;
  width: 30px;
  z-index: 1;
  cursor: pointer;
}
@media screen and (max-width: 1299px) {
  .thumbsIndexWorksBtn {
    width: 9.74%;
  }
}
@media screen and (max-width: 767px) {
  .thumbsIndexWorksBtn {
    width: 9.7%;
    bottom: 7%;
    right: 3.3%;
  }
}

.logoNameCopoIndexWorks {
  margin-top: 11px;
  margin-bottom: 0px;
  margin-left: auto;
  margin-right: auto;
  flex-flow: row wrap;
}
@media screen and (max-width: 1299px) {
  .logoNameCopoIndexWorks {
    margin-top: 3.57%;
    margin-bottom: 0%;
    margin-left: auto;
    margin-right: auto;
  }
}
@media screen and (max-width: 767px) {
  .logoNameCopoIndexWorks {
    margin-top: 1.2%;
    margin-bottom: 0%;
    margin-left: auto;
    margin-right: 0%;
    width: 44.5%;
  }
}

.logoNameIndexWorks {
  width: 100%;
}

.logoNameIndexWorksFx {
  width: 214px;
}
@media screen and (max-width: 1299px) {
  .logoNameIndexWorksFx {
    width: 69.48%;
  }
}
@media screen and (max-width: 767px) {
  .logoNameIndexWorksFx {
    width: 149px;
  }
}
@media screen and (max-width: 767px) and (max-width: 1299px) {
  .logoNameIndexWorksFx {
    width: 100%;
  }
}

@media screen and (max-width: 767px) {
  .logoNameIndexWorks {
    flex-flow: row wrap;
  }
}

.logoIndexWorks {
  width: 40px;
}
@media screen and (max-width: 1299px) {
  .logoIndexWorks {
    width: 18.6%;
  }
}
@media screen and (max-width: 767px) {
  .logoIndexWorks {
    width: 30px;
  }
}
@media screen and (max-width: 767px) and (max-width: 1299px) {
  .logoIndexWorks {
    width: 20.13%;
  }
}

.txtCopoNameIndexWorks {
  width: 163px;
  font-size: 12px;
  line-height: normal;
  letter-spacing: 0em;
  text-indent: 0em;
}
@media screen and (max-width: 1299px) {
  .txtCopoNameIndexWorks {
    width: 75.81%;
  }
}
@media screen and (max-width: 1299px) {
  .txtCopoNameIndexWorks {
    font-size: 0.9237875289vw;
  }
}
@media screen and (max-width: 767px) {
  .txtCopoNameIndexWorks {
    width: 74.85%;
    line-height: normal;
    letter-spacing: 0em;
    text-indent: 0em;
  }
}
@media screen and (max-width: 767px) and (max-width: 767px) {
  .txtCopoNameIndexWorks {
    font-size: 2.6666666667vw;
  }
}

.btnCopoNameIndexWorks {
  width: 94px;
  border-radius: 20px;
  /* CSS3草案 */
  -webkit-border-radius: 20px;
  /* Safari,Google Chrome用 */
  -moz-border-radius: 20px;
  /* Firefox用 */
  font-size: 10px;
  line-height: normal;
  letter-spacing: 0em;
  text-indent: 0em;
  text-decoration: none;
  aspect-ratio: 93/20;
}
@media screen and (max-width: 1299px) {
  .btnCopoNameIndexWorks {
    width: 30.51%;
  }
}
@media screen and (max-width: 1299px) {
  .btnCopoNameIndexWorks {
    font-size: 0.7698229407vw;
  }
}
@media screen and (max-width: 767px) {
  .btnCopoNameIndexWorks {
    margin-top: 6%;
    margin-bottom: 0%;
    margin-left: 0%;
    margin-right: auto;
    width: 92px;
    line-height: normal;
    letter-spacing: 0.1em;
    text-indent: -0.1em;
  }
}
@media screen and (max-width: 767px) and (max-width: 1299px) {
  .btnCopoNameIndexWorks {
    width: 61.74%;
  }
}
@media screen and (max-width: 767px) and (max-width: 767px) {
  .btnCopoNameIndexWorks {
    font-size: 2.6666666667vw;
  }
}

.iconBtnCopoNameIndexWorks {
  width: 81px;
  margin: auto;
  background: url(../img/index/iconBtnCopoNameIndexWorks.svg) no-repeat center right;
  background-size: auto 30%;
}
@media screen and (max-width: 1299px) {
  .iconBtnCopoNameIndexWorks {
    width: 87.09%;
  }
}
@media screen and (max-width: 767px) {
  .iconBtnCopoNameIndexWorks {
    width: 81px;
  }
}
@media screen and (max-width: 767px) and (max-width: 1299px) {
  .iconBtnCopoNameIndexWorks {
    width: 88.04%;
  }
}

.txtMainIndexWorksLoop {
  margin-top: 4px;
  margin-bottom: 0px;
  margin-left: auto;
  margin-right: auto;
  font-size: 14px;
  line-height: normal;
  letter-spacing: 0em;
  text-indent: 0em;
  text-decoration: none;
}
@media screen and (max-width: 1299px) {
  .txtMainIndexWorksLoop {
    margin-top: 1.29%;
    margin-bottom: 0%;
    margin-left: auto;
    margin-right: auto;
  }
}
@media screen and (max-width: 1299px) {
  .txtMainIndexWorksLoop {
    font-size: 1.077752117vw;
  }
}
@media screen and (max-width: 767px) {
  .txtMainIndexWorksLoop {
    margin-top: 4px;
    margin-bottom: 0px;
    margin-left: auto;
    margin-right: auto;
    line-height: normal;
    letter-spacing: 0em;
    text-indent: 0em;
  }
}
@media screen and (max-width: 767px) and (max-width: 1299px) {
  .txtMainIndexWorksLoop {
    margin-top: 2.68%;
    margin-bottom: 0%;
    margin-left: auto;
    margin-right: auto;
  }
}
@media screen and (max-width: 767px) and (max-width: 767px) {
  .txtMainIndexWorksLoop {
    font-size: 3.2vw;
  }
}
.txtMainIndexWorksLoop:hover {
  text-decoration: underline;
  opacity: 1;
}

.btnMoreViewIndexWorksLxn {
  margin-top: 54px;
  margin-bottom: 0px;
  margin-left: auto;
  margin-right: auto;
  width: 185px;
}
@media screen and (max-width: 1299px) {
  .btnMoreViewIndexWorksLxn {
    margin-top: 4.15%;
    margin-bottom: 0%;
    margin-left: auto;
    margin-right: auto;
  }
}
@media screen and (max-width: 1299px) {
  .btnMoreViewIndexWorksLxn {
    width: 14.23%;
  }
}
@media screen and (max-width: 767px) {
  .btnMoreViewIndexWorksLxn {
    margin-top: 41px;
    margin-bottom: 0px;
    margin-left: auto;
    margin-right: auto;
    width: 185px;
  }
}
@media screen and (max-width: 767px) and (max-width: 1299px) {
  .btnMoreViewIndexWorksLxn {
    margin-top: 12.05%;
    margin-bottom: 0%;
    margin-left: auto;
    margin-right: auto;
  }
}
@media screen and (max-width: 767px) and (max-width: 1299px) {
  .btnMoreViewIndexWorksLxn {
    width: 54.41%;
  }
}

.btnMoreViewIndexWorks {
  border-radius: 30px;
  /* CSS3草案 */
  -webkit-border-radius: 30px;
  /* Safari,Google Chrome用 */
  -moz-border-radius: 30px;
  /* Firefox用 */
  font-size: 12px;
  line-height: normal;
  letter-spacing: 0.1em;
  text-indent: -0.1em;
  aspect-ratio: 185/41;
  width: 100%;
  text-decoration: none;
  color: #FFF;
}
@media screen and (max-width: 1299px) {
  .btnMoreViewIndexWorks {
    font-size: 0.9237875289vw;
  }
}
@media screen and (max-width: 767px) {
  .btnMoreViewIndexWorks {
    line-height: normal;
    letter-spacing: 0.1em;
    text-indent: -0.1em;
    aspect-ratio: 185/41;
  }
}
@media screen and (max-width: 767px) and (max-width: 767px) {
  .btnMoreViewIndexWorks {
    font-size: 3.2vw;
  }
}

.txtBtnMoreViewIndexWorks {
  width: 165px;
  margin: auto;
  background: url(../img/index/txtBtnMoreViewIndexWorks.svg) no-repeat center right;
  background-size: auto 60%;
}
@media screen and (max-width: 1299px) {
  .txtBtnMoreViewIndexWorks {
    width: 89.18%;
  }
}
@media screen and (max-width: 767px) {
  .txtBtnMoreViewIndexWorks {
    width: 165px;
  }
}
@media screen and (max-width: 767px) and (max-width: 1299px) {
  .txtBtnMoreViewIndexWorks {
    width: 89.18%;
  }
}

/*LightBox*/
.bg_59Works {
  position: fixed;
  top: 0;
  width: 100%;
  height: 100vh;
  background: rgba(0, 0, 0, 0.6);
  display: none;
  z-index: 998;
  cursor: pointer;
}

.lighatWorksWap {
  position: fixed;
  top: 0%;
  right: 0;
  left: 0;
  bottom: 0;
  margin: auto;
  display: block;
  z-index: 999;
  inset: 0;
  margin: auto;
  display: flex;
  align-items: center;
  display: none;
}
@media screen and (max-width: 767px) {
  .lighatWorksWap {
    width: 340px;
  }
}
@media screen and (max-width: 767px) and (max-width: 1299px) {
  .lighatWorksWap {
    width: 90.66%;
  }
}

.lighatWorksLxn {
  width: 1000px;
  padding-top: 40px;
  padding-bottom: 23px;
  padding-left: 0px;
  padding-right: 0px;
  border-radius: 10px;
  /* CSS3草案 */
  -webkit-border-radius: 10px;
  /* Safari,Google Chrome用 */
  -moz-border-radius: 10px;
  /* Firefox用 */
  margin: auto;
}
@media screen and (max-width: 1299px) {
  .lighatWorksLxn {
    width: 76.92%;
  }
}
@media screen and (max-width: 1299px) {
  .lighatWorksLxn {
    padding: 6.83% 0% 3.93% 0%;
  }
}
@media screen and (max-width: 767px) {
  .lighatWorksLxn {
    width: 340px;
    padding-top: 40px;
    padding-bottom: 10px;
    padding-left: 0px;
    padding-right: 0px;
  }
}
@media screen and (max-width: 767px) and (max-width: 1299px) {
  .lighatWorksLxn {
    width: 100%;
  }
}
@media screen and (max-width: 767px) and (max-width: 1299px) {
  .lighatWorksLxn {
    padding: 11.76% 0% 2.94% 0%;
  }
}

.lighatWorksBox {
  width: 939px;
  margin: auto;
}
@media screen and (max-width: 1299px) {
  .lighatWorksBox {
    width: 93.9%;
  }
}
@media screen and (max-width: 767px) {
  .lighatWorksBox {
    width: 329px;
  }
}
@media screen and (max-width: 767px) and (max-width: 1299px) {
  .lighatWorksBox {
    width: 96.76%;
  }
}

.closelightbox {
  width: 23.04px;
  margin: 0 0 0 auto;
  cursor: pointer;
}
@media screen and (max-width: 1299px) {
  .closelightbox {
    width: 2.45%;
  }
}
@media screen and (max-width: 767px) {
  .closelightbox {
    width: 10.56px;
  }
}
@media screen and (max-width: 767px) and (max-width: 1299px) {
  .closelightbox {
    width: 3.2%;
  }
}
.closelightbox svg {
  width: 100%;
  height: auto;
  display: block;
}

.lighatWorksBoxIframe {
  position: relative;
  overflow: hidden;
  aspect-ratio: 543/310;
  margin-top: 18px;
  margin-bottom: 0px;
  margin-left: auto;
  margin-right: auto;
}
@media screen and (max-width: 1299px) {
  .lighatWorksBoxIframe {
    margin-top: 1.91%;
    margin-bottom: 0%;
    margin-left: auto;
    margin-right: auto;
  }
}
@media screen and (max-width: 767px) {
  .lighatWorksBoxIframe {
    margin-top: 8px;
    margin-bottom: 0px;
    margin-left: auto;
    margin-right: auto;
  }
}
@media screen and (max-width: 767px) and (max-width: 1299px) {
  .lighatWorksBoxIframe {
    margin-top: 2.43%;
    margin-bottom: 0%;
    margin-left: auto;
    margin-right: auto;
  }
}
.lighatWorksBoxIframe iframe {
  position: absolute;
  top: 0;
  right: 0;
  left: 0;
  bottom: 0;
  margin: auto;
  width: 100%;
  height: 100%;
}
.lighatWorksBoxIframe video {
  position: absolute;
  top: 0;
  right: 0;
  left: 0;
  bottom: 0;
  margin: auto;
  width: 100%;
  height: 100%;
}

.btnLighatWorksBox {
  margin-top: 10px;
  margin-bottom: 0px;
  margin-left: auto;
  margin-right: auto;
  width: 185px;
}
@media screen and (max-width: 1299px) {
  .btnLighatWorksBox {
    margin-top: 1.06%;
    margin-bottom: 0%;
    margin-left: auto;
    margin-right: auto;
  }
}
@media screen and (max-width: 1299px) {
  .btnLighatWorksBox {
    width: 19.7%;
  }
}
@media screen and (max-width: 767px) {
  .btnLighatWorksBox {
    width: 158px;
  }
}
@media screen and (max-width: 767px) and (max-width: 1299px) {
  .btnLighatWorksBox {
    width: 48.02%;
  }
}

.btnLighatWorksBoxIn {
  border-radius: 30px;
  /* CSS3草案 */
  -webkit-border-radius: 30px;
  /* Safari,Google Chrome用 */
  -moz-border-radius: 30px;
  /* Firefox用 */
  font-size: 12px;
  line-height: normal;
  letter-spacing: 0.1em;
  text-indent: -0.1em;
  aspect-ratio: 185/41;
  width: 100%;
  text-decoration: none;
  color: #FFF;
}
@media screen and (max-width: 1299px) {
  .btnLighatWorksBoxIn {
    font-size: 0.9237875289vw;
  }
}
@media screen and (max-width: 767px) {
  .btnLighatWorksBoxIn {
    aspect-ratio: 158/35;
    line-height: normal;
    letter-spacing: 0.1em;
    text-indent: -0.1em;
  }
}
@media screen and (max-width: 767px) and (max-width: 767px) {
  .btnLighatWorksBoxIn {
    font-size: 2.6666666667vw;
  }
}

.iconBtnLighatWorksBox {
  width: 157px;
  margin: auto;
  background: url(../img/index/iconBtnCopoNameIndexWorks.svg) no-repeat center right;
  background-size: auto 30%;
}
@media screen and (max-width: 1299px) {
  .iconBtnLighatWorksBox {
    width: 84.86%;
  }
}

/* ==========================================================================
use＆nameSpace
========================================================================== */
/* ==========================================================================
use＆nameSpace
========================================================================== */
/* ==========================================================================
LAYOUT
========================================================================== */
.indexSponsor {
  padding-top: 68px;
  padding-bottom: 0px;
  padding-left: 0px;
  padding-right: 0px;
}
@media screen and (max-width: 1299px) {
  .indexSponsor {
    padding: 3.54% 0% 0% 0%;
  }
}
@media screen and (max-width: 767px) {
  .indexSponsor {
    padding-top: 40px;
    padding-bottom: 0px;
    padding-left: 0px;
    padding-right: 0px;
  }
}
@media screen and (max-width: 767px) and (max-width: 1299px) {
  .indexSponsor {
    padding: 10.66% 0% 0% 0%;
  }
}

.indexSponsorWap {
  width: 88.43vw;
  margin: auto;
}
@media screen and (max-width: 767px) {
  .indexSponsorWap {
    width: 375px;
  }
}
@media screen and (max-width: 767px) and (max-width: 1299px) {
  .indexSponsorWap {
    width: 100%;
  }
}

.h2IndexSponsor {
  font-size: 24px;
  line-height: normal;
  letter-spacing: 0em;
  text-indent: 0em;
}
@media screen and (max-width: 1299px) {
  .h2IndexSponsor {
    font-size: 1.8475750577vw;
  }
}
@media screen and (max-width: 767px) {
  .h2IndexSponsor {
    line-height: normal;
    letter-spacing: 0em;
    text-indent: 0em;
  }
}
@media screen and (max-width: 767px) and (max-width: 767px) {
  .h2IndexSponsor {
    font-size: 6.4vw;
  }
}

.loopSlide01 {
  margin-top: 21px;
  margin-bottom: 0px;
  margin-left: auto;
  margin-right: auto;
  height: 78px;
  width: 100%;
  overflow: hidden;
  display: flex;
}
@media screen and (max-width: 1299px) {
  .loopSlide01 {
    margin-top: 1.23%;
    margin-bottom: 0%;
    margin-left: auto;
    margin-right: auto;
  }
}
@media screen and (max-width: 767px) {
  .loopSlide01 {
    margin-top: 0px;
    margin-bottom: 0px;
    margin-left: auto;
    margin-right: auto;
    height: 51px;
  }
}
@media screen and (max-width: 767px) and (max-width: 1299px) {
  .loopSlide01 {
    margin-top: 0%;
    margin-bottom: 0%;
    margin-left: auto;
    margin-right: auto;
  }
}

.loopSlide01 img {
  width: auto;
  height: 100%;
  max-width: unset;
  animation: slide1 120s -60s linear infinite;
}

@keyframes slide1 {
  0% {
    transform: translateX(0%);
  }
  100% {
    transform: translateX(-100%);
  }
}
/* ==========================================================================
use＆nameSpace
========================================================================== */
/* ==========================================================================
use＆nameSpace
========================================================================== */
/* ==========================================================================
LAYOUT
========================================================================== */
.indexBlog {
  padding-top: 59px;
  padding-bottom: 115px;
  padding-left: 0px;
  padding-right: 0px;
  position: relative;
}
@media screen and (max-width: 1299px) {
  .indexBlog {
    padding: 3.07% 0% 5.98% 0%;
  }
}
@media screen and (max-width: 767px) {
  .indexBlog {
    padding: 15.4% 0% 28% 0%;
  }
}

@media screen and (max-width: 767px) {
  .indexBlogWap {
    width: 340px;
  }
}
@media screen and (max-width: 767px) and (max-width: 1299px) {
  .indexBlogWap {
    width: 90.66%;
  }
}

@media screen and (max-width: 767px) {
  .titleIndexBlogLxn {
    flex-flow: row wrap;
  }
}

.titleIndexBlog {
  margin-top: 19px;
  margin-bottom: 0px;
  margin-left: 0px;
  margin-right: 0px;
  width: 177px;
  align-items: baseline;
}
@media screen and (max-width: 1299px) {
  .titleIndexBlog {
    margin: 1.46% 0% 0% 0%;
  }
}
@media screen and (max-width: 1299px) {
  .titleIndexBlog {
    width: 13.61%;
  }
}
@media screen and (max-width: 767px) {
  .titleIndexBlog {
    margin-top: 9px;
    margin-bottom: 0px;
    margin-left: 0px;
    margin-right: 0px;
    width: 100%;
  }
}
@media screen and (max-width: 767px) and (max-width: 1299px) {
  .titleIndexBlog {
    margin: 2.64% 0% 0% 0%;
  }
}

.h2TitleIndexBlog {
  font-size: 36px;
  line-height: normal;
  letter-spacing: 0.1em;
  text-indent: -0.1em;
}
@media screen and (max-width: 1299px) {
  .h2TitleIndexBlog {
    font-size: 2.7713625866vw;
  }
}
@media screen and (max-width: 767px) {
  .h2TitleIndexBlog {
    line-height: normal;
    letter-spacing: 0.1em;
    text-indent: -0.1em;
  }
}
@media screen and (max-width: 767px) and (max-width: 767px) {
  .h2TitleIndexBlog {
    font-size: 6.6666666667vw;
  }
}

.txtTitleIndexBlog {
  margin-top: 0px;
  margin-bottom: 0px;
  margin-left: 14px;
  margin-right: auto;
  font-size: 16px;
  line-height: normal;
  letter-spacing: 0.1em;
  text-indent: -0.1em;
  transform: translateY(-5%);
}
@media screen and (max-width: 1299px) and (max-width: 1299px) {
  .txtTitleIndexBlog {
    margin-top: 0%;
    margin-bottom: 0%;
    margin-left: 1.07%;
    margin-right: auto;
  }
}
@media screen and (max-width: 1299px) {
  .txtTitleIndexBlog {
    font-size: 1.2317167052vw;
  }
}
@media screen and (max-width: 767px) {
  .txtTitleIndexBlog {
    margin-top: 0px;
    margin-bottom: 0px;
    margin-left: 10px;
    margin-right: 0px;
    line-height: normal;
    letter-spacing: 0.1em;
    text-indent: -0.1em;
  }
}
@media screen and (max-width: 767px) and (max-width: 1299px) {
  .txtTitleIndexBlog {
    margin: 0% 0% 0% 2.94%;
  }
}
@media screen and (max-width: 767px) and (max-width: 767px) {
  .txtTitleIndexBlog {
    font-size: 3.7333333333vw;
  }
}

.txtTitleIndexBlog02 {
  margin-top: 20px;
  margin-bottom: 0px;
  margin-left: 33px;
  margin-right: auto;
  font-size: 14px;
  line-height: normal;
  letter-spacing: 0em;
  text-indent: 0em;
}
@media screen and (max-width: 1299px) and (max-width: 1299px) {
  .txtTitleIndexBlog02 {
    margin-top: 1.53%;
    margin-bottom: 0%;
    margin-left: 2.53%;
    margin-right: auto;
  }
}
@media screen and (max-width: 1299px) {
  .txtTitleIndexBlog02 {
    font-size: 1.077752117vw;
  }
}
@media screen and (max-width: 767px) {
  .txtTitleIndexBlog02 {
    margin-top: 9px;
    margin-bottom: 0px;
    margin-left: auto;
    margin-right: auto;
    line-height: normal;
    letter-spacing: 0em;
    text-indent: 0em;
  }
}
@media screen and (max-width: 767px) and (max-width: 1299px) {
  .txtTitleIndexBlog02 {
    margin-top: 2.4%;
    margin-bottom: 0%;
    margin-left: auto;
    margin-right: auto;
  }
}
@media screen and (max-width: 767px) and (max-width: 767px) {
  .txtTitleIndexBlog02 {
    font-size: 3.2vw;
  }
}

.ulIndexBlog {
  margin-top: 4px;
  margin-bottom: 0px;
  margin-left: auto;
  margin-right: auto;
}
@media screen and (max-width: 1299px) {
  .ulIndexBlog {
    margin-top: 0.3%;
    margin-bottom: 0%;
    margin-left: auto;
    margin-right: auto;
  }
}
@media screen and (max-width: 767px) {
  .ulIndexBlog {
    margin-top: 6.88%;
    margin-bottom: 0%;
    margin-left: auto;
    margin-right: auto;
    justify-content: space-between;
  }
}

.liIndexBlog {
  width: 308px;
  margin-top: 18px;
  margin-bottom: 0px;
  margin-left: 0px;
  margin-right: 22px;
  display: flex;
  flex-flow: row wrap;
  align-items: flex-start;
}
@media screen and (max-width: 1299px) {
  .liIndexBlog {
    width: 23.69%;
  }
}
@media screen and (max-width: 1299px) {
  .liIndexBlog {
    margin: 1.38% 1.69% 0% 0%;
  }
}
@media screen and (max-width: 767px) {
  .liIndexBlog {
    width: 162px;
    margin: 0;
  }
}
@media screen and (max-width: 767px) and (max-width: 1299px) {
  .liIndexBlog {
    width: 47.64%;
  }
}
@media screen and (max-width: 767px) {
  .liIndexBlog:nth-child(n+3) {
    margin: 4.88% 0% 0% 0%;
  }
}
.liIndexBlog:nth-child(4n) {
  margin-right: 0;
}
@media screen and (max-width: 767px) {
  .liIndexBlog:nth-child(4n) {
    margin: 4.88% 0% 0% 0%;
  }
}

.btnIndexBlog {
  text-decoration: none;
}

.logoIndexBlog {
  width: 100%;
  aspect-ratio: 308/173;
  border-radius: 6px;
  /* CSS3草案 */
  -webkit-border-radius: 6px;
  /* Safari,Google Chrome用 */
  -moz-border-radius: 6px;
  /* Firefox用 */
  overflow: hidden;
}
.logoIndexBlog img {
  object-fit: cover;
  width: 100%;
  height: auto;
}

.h3IndexBlog {
  margin-top: 10px;
  margin-bottom: 0px;
  margin-left: auto;
  margin-right: auto;
  font-size: 14px;
  line-height: normal;
  letter-spacing: 0em;
  text-indent: 0em;
}
@media screen and (max-width: 1299px) {
  .h3IndexBlog {
    margin-top: 3.24%;
    margin-bottom: 0%;
    margin-left: auto;
    margin-right: auto;
  }
}
@media screen and (max-width: 1299px) {
  .h3IndexBlog {
    font-size: 1.077752117vw;
  }
}
@media screen and (max-width: 767px) {
  .h3IndexBlog {
    margin-top: 3px;
    margin-bottom: 0px;
    margin-left: auto;
    margin-right: auto;
    line-height: 1.25;
    letter-spacing: 0em;
    text-indent: 0em;
  }
}
@media screen and (max-width: 767px) and (max-width: 1299px) {
  .h3IndexBlog {
    margin-top: 1.85%;
    margin-bottom: 0%;
    margin-left: auto;
    margin-right: auto;
  }
}
@media screen and (max-width: 767px) and (max-width: 767px) {
  .h3IndexBlog {
    font-size: 3.2vw;
  }
}
@media screen and (max-width: 767px) {
  .h3IndexBlog::before {
    display: block;
    width: 0;
    height: 0;
    margin-top: calc((1 - 1.25) * 0.5em);
    content: "";
  }
  .h3IndexBlog::after {
    display: block;
    width: 0;
    height: 0;
    margin-bottom: calc((1 - 1.25) * 0.5em);
    content: "";
  }
}

.timeCatIndexBlog {
  justify-content: flex-start;
  align-items: baseline;
  flex-flow: row wrap;
  margin: 2% 0 0 0;
}
@media screen and (max-width: 767px) {
  .timeCatIndexBlog {
    margin-top: 6%;
    margin-bottom: 0%;
    margin-left: auto;
    margin-right: auto;
  }
}

.timeIndexBlog {
  margin: 0vw 0.2083333333vw 0.2vw 0vw;
  padding: 0.0520833333vw 0vw 0.0520833333vw 0vw;
  font-size: 10px;
  line-height: normal;
  letter-spacing: 0em;
  text-indent: 0em;
}
@media screen and (max-width: 1299px) {
  .timeIndexBlog {
    font-size: 0.7698229407vw;
  }
}
@media screen and (max-width: 767px) {
  .timeIndexBlog {
    margin: 0 1.8vw 1vw 0;
    padding: 0.2666666667vw 0vw 0.2666666667vw 0vw;
    line-height: 1;
    letter-spacing: 0.05em;
    text-indent: -0.05em;
  }
}
@media screen and (max-width: 767px) and (max-width: 767px) {
  .timeIndexBlog {
    font-size: 2.6666666667vw;
  }
}

.iconIndexBlogNew {
  margin: 0vw 0.2vw 0.3645833333vw 0vw;
  padding: 0.0520833333vw 0.2083333333vw 0.0520833333vw 0.2083333333vw;
  font-size: 10px;
  line-height: 1;
  letter-spacing: 0em;
  text-indent: 0em;
  display: flex;
  align-items: center;
  justify-content: center;
}
@media screen and (max-width: 1299px) {
  .iconIndexBlogNew {
    font-size: 0.7698229407vw;
  }
}
@media screen and (max-width: 767px) {
  .iconIndexBlogNew {
    margin: 0 0.2vw 1vw 0;
    padding: 0.5vw 1.2vw;
    line-height: 1;
    letter-spacing: 0em;
    text-indent: 0em;
  }
}
@media screen and (max-width: 767px) and (max-width: 767px) {
  .iconIndexBlogNew {
    font-size: 2.6666666667vw;
  }
}

.iconIndexBlog {
  font-size: 10px;
  line-height: 1;
  letter-spacing: 0em;
  text-indent: 0em;
  background: #DB2E21;
  margin: 0vw 0.3645833333vw 0.3645833333vw 0vw;
  padding: 0.0520833333vw 0.2083333333vw 0.0520833333vw 0.2083333333vw;
  display: flex;
  align-items: center;
  justify-content: center;
}
@media screen and (max-width: 1299px) {
  .iconIndexBlog {
    font-size: 0.7698229407vw;
  }
}
@media screen and (max-width: 767px) {
  .iconIndexBlog {
    margin: 0 0.2vw 1vw 0;
    padding: 0.5vw 1.2vw;
    line-height: 1;
    letter-spacing: 0em;
    text-indent: 0em;
  }
}
@media screen and (max-width: 767px) and (max-width: 767px) {
  .iconIndexBlog {
    font-size: 2.6666666667vw;
  }
}

/*もっと見る*/
.btnMoreViewIndexBlogLxn {
  margin-top: 47px;
  margin-bottom: 0px;
  margin-left: auto;
  margin-right: auto;
  width: 185px;
}
@media screen and (max-width: 1299px) {
  .btnMoreViewIndexBlogLxn {
    margin-top: 3.61%;
    margin-bottom: 0%;
    margin-left: auto;
    margin-right: auto;
  }
}
@media screen and (max-width: 1299px) {
  .btnMoreViewIndexBlogLxn {
    width: 14.23%;
  }
}
@media screen and (max-width: 767px) {
  .btnMoreViewIndexBlogLxn {
    margin-top: 9.05%;
    margin-bottom: 0%;
    margin-left: auto;
    margin-right: auto;
    width: 185px;
  }
}
@media screen and (max-width: 767px) and (max-width: 1299px) {
  .btnMoreViewIndexBlogLxn {
    width: 54.41%;
  }
}

.btnMoreViewIndexBlog {
  border-radius: 30px;
  /* CSS3草案 */
  -webkit-border-radius: 30px;
  /* Safari,Google Chrome用 */
  -moz-border-radius: 30px;
  /* Firefox用 */
  font-size: 12px;
  line-height: normal;
  letter-spacing: 0.1em;
  text-indent: -0.1em;
  aspect-ratio: 185/41;
  width: 100%;
  text-decoration: none;
  color: #FFF;
}
@media screen and (max-width: 1299px) {
  .btnMoreViewIndexBlog {
    font-size: 0.9237875289vw;
  }
}
@media screen and (max-width: 767px) {
  .btnMoreViewIndexBlog {
    line-height: normal;
    letter-spacing: 0em;
    text-indent: 0em;
    aspect-ratio: 185/41;
  }
}
@media screen and (max-width: 767px) and (max-width: 767px) {
  .btnMoreViewIndexBlog {
    font-size: 3.2vw;
  }
}

.txtBtnMoreViewIndexBlog {
  width: 165px;
  margin: auto;
  background: url(../img/index/txtBtnMoreViewIndexWorks.svg) no-repeat center right;
  background-size: auto 60%;
}
@media screen and (max-width: 1299px) {
  .txtBtnMoreViewIndexBlog {
    width: 89.18%;
  }
}
@media screen and (max-width: 767px) {
  .txtBtnMoreViewIndexBlog {
    width: 165px;
  }
}
@media screen and (max-width: 767px) and (max-width: 1299px) {
  .txtBtnMoreViewIndexBlog {
    width: 89.18%;
  }
}

/*cta*/
.btnIndexBlogLastWap {
  margin-top: 47px;
  margin-bottom: 0px;
  margin-left: auto;
  margin-right: auto;
  width: 272px;
}
@media screen and (max-width: 1299px) {
  .btnIndexBlogLastWap {
    margin-top: 3.61%;
    margin-bottom: 0%;
    margin-left: auto;
    margin-right: auto;
  }
}
@media screen and (max-width: 1299px) {
  .btnIndexBlogLastWap {
    width: 20.92%;
  }
}
@media screen and (max-width: 767px) {
  .btnIndexBlogLastWap {
    margin-top: 12.5%;
    margin-bottom: 0%;
    margin-left: auto;
    margin-right: auto;
    width: 272px;
  }
}
@media screen and (max-width: 767px) and (max-width: 1299px) {
  .btnIndexBlogLastWap {
    width: 80%;
  }
}

.btnIndexBlogLast {
  border-radius: 30px;
  /* CSS3草案 */
  -webkit-border-radius: 30px;
  /* Safari,Google Chrome用 */
  -moz-border-radius: 30px;
  /* Firefox用 */
  width: 100%;
  aspect-ratio: 272/60;
  text-decoration: none;
  background: #DB2E21;
}
.btnIndexBlogLast:hover {
  opacity: 1;
  background-color: #A42117;
  transform: scale(1.1);
}

.secIndexBlogLast {
  background: url(../img/index/arrowBtnIndexKikaku.svg) no-repeat 98% center;
  background-size: auto 30%;
  transform: translateX(2%);
}

.secIndexBlogLast {
  width: 252px;
  margin: auto;
}
@media screen and (max-width: 1299px) {
  .secIndexBlogLast {
    width: 92.64%;
  }
}
@media screen and (max-width: 767px) {
  .secIndexBlogLast {
    width: 252px;
  }
}
@media screen and (max-width: 767px) and (max-width: 1299px) {
  .secIndexBlogLast {
    width: 92.64%;
  }
}

.h3IndexBlogLast {
  font-size: 18px;
  line-height: normal;
  letter-spacing: 0.05em;
  text-indent: -0.05em;
}
@media screen and (max-width: 1299px) {
  .h3IndexBlogLast {
    font-size: 1.3856812933vw;
  }
}
@media screen and (max-width: 767px) {
  .h3IndexBlogLast {
    line-height: normal;
    letter-spacing: 0.05em;
    text-indent: -0.05em;
  }
}
@media screen and (max-width: 767px) and (max-width: 767px) {
  .h3IndexBlogLast {
    font-size: 4.8vw;
  }
}

.txtIndexBlogLast {
  font-size: 12px;
  line-height: normal;
  letter-spacing: 0em;
  text-indent: 0em;
  transform: translate(-1%, -5%);
}
@media screen and (max-width: 1299px) {
  .txtIndexBlogLast {
    font-size: 0.9237875289vw;
  }
}
@media screen and (max-width: 767px) {
  .txtIndexBlogLast {
    line-height: normal;
    letter-spacing: 0em;
    text-indent: 0em;
  }
}
@media screen and (max-width: 767px) and (max-width: 767px) {
  .txtIndexBlogLast {
    font-size: 3.2vw;
  }
}

/*dorone*/
.picMainIndexDronBtmWap {
  width: 253px;
  position: absolute;
  bottom: -3%;
  left: 5%;
  z-index: 1;
  animation: fuwafuwa 2s infinite;
}
@media screen and (max-width: 1299px) {
  .picMainIndexDronBtmWap {
    width: 13.17%;
  }
}
@media screen and (max-width: 767px) {
  .picMainIndexDronBtmWap {
    width: 95px;
  }
}
@media screen and (max-width: 767px) and (max-width: 1299px) {
  .picMainIndexDronBtmWap {
    width: 25.33%;
  }
}

/* ==========================================================================
use＆nameSpace
========================================================================== */
/* ==========================================================================
use＆nameSpace
========================================================================== */
/* ==========================================================================
LAYOUT
========================================================================== */
.indexFeatures {
  padding-top: 123px;
  padding-bottom: 0px;
  padding-left: 0px;
  padding-right: 0px;
}
@media screen and (max-width: 1299px) {
  .indexFeatures {
    padding: 6.4% 0% 0% 0%;
  }
}
@media screen and (max-width: 767px) {
  .indexFeatures {
    padding-top: 96px;
    padding-bottom: 0px;
    padding-left: 0px;
    padding-right: 0px;
  }
}
@media screen and (max-width: 767px) and (max-width: 1299px) {
  .indexFeatures {
    padding: 25.6% 0% 0% 0%;
  }
}

@media screen and (max-width: 767px) {
  .indexFeaturesTopWap {
    width: 335px;
    margin: auto;
  }
}
@media screen and (max-width: 767px) and (max-width: 1299px) {
  .indexFeaturesTopWap {
    width: 89.33%;
  }
}

.titleIndexFeaturesTop {
  width: 270px;
  align-items: baseline;
}
@media screen and (max-width: 1299px) {
  .titleIndexFeaturesTop {
    width: 20.76%;
  }
}
@media screen and (max-width: 767px) {
  .titleIndexFeaturesTop {
    width: 100%;
  }
}

.h2TitleIndexFeaturesTop {
  font-size: 36px;
  line-height: normal;
  letter-spacing: 0.1em;
  text-indent: -0.1em;
}
@media screen and (max-width: 1299px) {
  .h2TitleIndexFeaturesTop {
    font-size: 2.7713625866vw;
  }
}
@media screen and (max-width: 767px) {
  .h2TitleIndexFeaturesTop {
    line-height: normal;
    letter-spacing: 0.1em;
    text-indent: -0.1em;
  }
}
@media screen and (max-width: 767px) and (max-width: 767px) {
  .h2TitleIndexFeaturesTop {
    font-size: 6.6666666667vw;
  }
}

.txtTitleIndexFeaturesTop {
  margin-top: 0px;
  margin-bottom: 0px;
  margin-left: 13px;
  margin-right: auto;
  font-size: 16px;
  line-height: normal;
  letter-spacing: 0.1em;
  text-indent: -0.1em;
  color: #FFF;
}
@media screen and (max-width: 1299px) and (max-width: 1299px) {
  .txtTitleIndexFeaturesTop {
    margin-top: 0%;
    margin-bottom: 0%;
    margin-left: 4.98%;
    margin-right: auto;
  }
}
@media screen and (max-width: 1299px) {
  .txtTitleIndexFeaturesTop {
    font-size: 1.2317167052vw;
  }
}
@media screen and (max-width: 767px) {
  .txtTitleIndexFeaturesTop {
    margin-top: 0px;
    margin-bottom: 0px;
    margin-left: 11px;
    margin-right: auto;
    line-height: normal;
    letter-spacing: 0.1em;
    text-indent: -0.1em;
  }
}
@media screen and (max-width: 767px) and (max-width: 1299px) and (max-width: 1299px) {
  .txtTitleIndexFeaturesTop {
    margin-top: 0%;
    margin-bottom: 0%;
    margin-left: 0.57%;
    margin-right: auto;
  }
}
@media screen and (max-width: 767px) and (max-width: 767px) {
  .txtTitleIndexFeaturesTop {
    font-size: 3.7333333333vw;
  }
}

.h3TitleIndexFeaturesTop {
  margin-top: 16px;
  margin-bottom: 0px;
  margin-left: 0px;
  margin-right: 0px;
  font-size: 48px;
  line-height: normal;
  letter-spacing: 0.05em;
  text-indent: -0.05em;
  color: #FFF;
}
@media screen and (max-width: 1299px) {
  .h3TitleIndexFeaturesTop {
    margin: 1.23% 0% 0% 0%;
  }
}
@media screen and (max-width: 1299px) {
  .h3TitleIndexFeaturesTop {
    font-size: 3.6951501155vw;
  }
}
@media screen and (max-width: 767px) {
  .h3TitleIndexFeaturesTop {
    margin-top: 12px;
    margin-bottom: 0px;
    margin-left: auto;
    margin-right: auto;
    line-height: normal;
    letter-spacing: 0.05em;
    text-indent: -0.05em;
  }
}
@media screen and (max-width: 767px) and (max-width: 1299px) {
  .h3TitleIndexFeaturesTop {
    margin-top: 3.52%;
    margin-bottom: 0%;
    margin-left: auto;
    margin-right: auto;
  }
}
@media screen and (max-width: 767px) and (max-width: 767px) {
  .h3TitleIndexFeaturesTop {
    font-size: 8.5333333333vw;
  }
}

@media screen and (max-width: 767px) {
  .indexFeaturesMain {
    margin-top: 16.8%;
    margin-bottom: 0%;
    margin-left: auto;
    margin-right: auto;
  }
}

@media screen and (max-width: 767px) {
  .indexFeaturesMainFx {
    flex-flow: row wrap;
  }
}

.secIndexFeaturesMain {
  width: 610px;
}
@media screen and (max-width: 1299px) {
  .secIndexFeaturesMain {
    width: 46.92%;
  }
}
@media screen and (max-width: 767px) {
  .secIndexFeaturesMain {
    width: 340px;
    margin: auto;
  }
}
@media screen and (max-width: 767px) and (max-width: 1299px) {
  .secIndexFeaturesMain {
    width: 90.66%;
  }
}

.secIndexFeaturesMainIn {
  width: 534px;
  transform: translateY(-18%);
}
@media screen and (max-width: 1299px) {
  .secIndexFeaturesMainIn {
    width: 87.54%;
  }
}
@media screen and (max-width: 1299px) {
  .secIndexFeaturesMainIn {
    transform: translateY(0%);
  }
}
@media screen and (max-width: 767px) {
  .secIndexFeaturesMainIn {
    width: 100%;
  }
}

.h4IndexFeaturesMain {
  font-size: 12px;
  line-height: normal;
  letter-spacing: 0.2em;
  text-indent: -0.2em;
}
@media screen and (max-width: 1299px) {
  .h4IndexFeaturesMain {
    font-size: 0.9237875289vw;
  }
}
@media screen and (max-width: 767px) {
  .h4IndexFeaturesMain {
    line-height: normal;
    letter-spacing: 0.2em;
    text-indent: -0.2em;
  }
}
@media screen and (max-width: 767px) and (max-width: 767px) {
  .h4IndexFeaturesMain {
    font-size: 3.2vw;
  }
}

.h5IndexFeaturesMain {
  margin-top: 8px;
  margin-bottom: 0px;
  margin-left: 0px;
  margin-right: 0px;
  font-size: 24px;
  line-height: 1.6666666667;
  letter-spacing: 0.1em;
  text-indent: -0.1em;
}
@media screen and (max-width: 1299px) {
  .h5IndexFeaturesMain {
    margin: 1.49% 0% 0% 0%;
  }
}
@media screen and (max-width: 1299px) {
  .h5IndexFeaturesMain {
    font-size: 1.8475750577vw;
  }
}
.h5IndexFeaturesMain::before {
  display: block;
  width: 0;
  height: 0;
  margin-top: calc((1 - 1.6666666667) * 0.5em);
  content: "";
}
.h5IndexFeaturesMain::after {
  display: block;
  width: 0;
  height: 0;
  margin-bottom: calc((1 - 1.6666666667) * 0.5em);
  content: "";
}
@media screen and (max-width: 767px) {
  .h5IndexFeaturesMain {
    margin-top: 2.52%;
    margin-bottom: 0%;
    margin-left: auto;
    margin-right: auto;
    line-height: normal;
    letter-spacing: 0em;
    text-indent: 0em;
  }
}
@media screen and (max-width: 767px) and (max-width: 767px) {
  .h5IndexFeaturesMain {
    font-size: 5.3333333333vw;
  }
}

.txtIndexFeaturesMain {
  margin-top: 20px;
  margin-bottom: 0px;
  margin-left: 0px;
  margin-right: 0px;
  font-size: 14px;
  line-height: 2;
  letter-spacing: 0em;
  text-indent: 0em;
}
@media screen and (max-width: 1299px) {
  .txtIndexFeaturesMain {
    margin: 3.74% 0% 0% 0%;
  }
}
@media screen and (max-width: 1299px) {
  .txtIndexFeaturesMain {
    font-size: 1.077752117vw;
  }
}
.txtIndexFeaturesMain::before {
  display: block;
  width: 0;
  height: 0;
  margin-top: calc((1 - 2) * 0.5em);
  content: "";
}
.txtIndexFeaturesMain::after {
  display: block;
  width: 0;
  height: 0;
  margin-bottom: calc((1 - 2) * 0.5em);
  content: "";
}
@media screen and (max-width: 767px) {
  .txtIndexFeaturesMain {
    margin-top: 6.41%;
    margin-bottom: 0%;
    margin-left: auto;
    margin-right: auto;
    line-height: 1.5714285714;
    letter-spacing: 0em;
    text-indent: 0em;
  }
}
@media screen and (max-width: 767px) and (max-width: 767px) {
  .txtIndexFeaturesMain {
    font-size: 3.7333333333vw;
  }
}
@media screen and (max-width: 767px) {
  .txtIndexFeaturesMain::before {
    display: block;
    width: 0;
    height: 0;
    margin-top: calc((1 - 1.5714285714) * 0.5em);
    content: "";
  }
  .txtIndexFeaturesMain::after {
    display: block;
    width: 0;
    height: 0;
    margin-bottom: calc((1 - 1.5714285714) * 0.5em);
    content: "";
  }
}

/*右*/
.moveIndexFeaturesMainlxn {
  width: 708px;
  position: relative;
  aspect-ratio: 708/612;
}
@media screen and (max-width: 1299px) {
  .moveIndexFeaturesMainlxn {
    width: 54.46%;
  }
}
@media screen and (max-width: 1300px) {
  .moveIndexFeaturesMainlxn {
    width: 58.76vw;
  }
}
@media screen and (max-width: 767px) {
  .moveIndexFeaturesMainlxn {
    margin-top: 30px;
    margin-bottom: 0px;
    margin-left: auto;
    margin-right: auto;
    width: 100%;
    aspect-ratio: 375/211;
  }
}
@media screen and (max-width: 767px) and (max-width: 1299px) {
  .moveIndexFeaturesMainlxn {
    margin-top: 8%;
    margin-bottom: 0%;
    margin-left: auto;
    margin-right: auto;
  }
}

.moveIndexFeaturesMainlxn01 {
  margin-left: auto;
}
@media screen and (max-width: 767px) {
  .moveIndexFeaturesMainlxn01 {
    margin: 8% auto 0 auto;
  }
}

.moveIndexFeaturesMainBox {
  position: absolute;
  top: 0;
  right: 0;
  left: 0;
  bottom: 0;
  margin: auto;
  width: 55.63vw;
  height: 100%;
  margin: auto;
}
@media screen and (max-width: 767px) {
  .moveIndexFeaturesMainBox {
    width: 100vw;
  }
}

.moveIndexFeaturesMainBox video {
  position: absolute;
  height: 100%;
  width: 100%;
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
  margin: auto;
  object-fit: cover;
}

/*02*/
@media screen and (max-width: 767px) {
  .indexFeaturesMain02 {
    margin-top: 48px;
    margin-bottom: 0px;
    margin-left: auto;
    margin-right: auto;
  }
}
@media screen and (max-width: 767px) and (max-width: 1299px) {
  .indexFeaturesMain02 {
    margin-top: 12.8%;
    margin-bottom: 0%;
    margin-left: auto;
    margin-right: auto;
  }
}

.secIndexFeaturesMainIn02 {
  margin: 0 0 0 auto;
}

.moveIndexFeaturesMainlxn02 {
  margin-right: auto;
}
@media screen and (max-width: 767px) {
  .moveIndexFeaturesMainlxn02 {
    margin: 8% auto 0 auto;
  }
}

.moveIndexFeaturesMainlxn02 .moveIndexFeaturesMainBox {
  right: 0;
  left: unset;
}

/* ==========================================================================
use＆nameSpace
========================================================================== */
/* ==========================================================================
use＆nameSpace
========================================================================== */
/* ==========================================================================
LAYOUT
========================================================================== */
.indexDiffarent {
  padding-top: 66px;
  padding-bottom: 0px;
  padding-left: 0px;
  padding-right: 0px;
}
@media screen and (max-width: 1299px) {
  .indexDiffarent {
    padding: 3.43% 0% 0% 0%;
  }
}
@media screen and (max-width: 767px) {
  .indexDiffarent {
    padding-top: 72px;
    padding-bottom: 0px;
    padding-left: 0px;
    padding-right: 0px;
  }
}
@media screen and (max-width: 767px) and (max-width: 1299px) {
  .indexDiffarent {
    padding: 19.2% 0% 0% 0%;
  }
}

@media screen and (max-width: 767px) {
  .indexDiffarentWap {
    width: 340px;
  }
}
@media screen and (max-width: 767px) and (max-width: 1299px) {
  .indexDiffarentWap {
    width: 90.66%;
  }
}

.secindexDiffarent {
  width: 1043px;
  margin: auto;
}
@media screen and (max-width: 1299px) {
  .secindexDiffarent {
    width: 80.23%;
  }
}
@media screen and (max-width: 767px) {
  .secindexDiffarent {
    width: 100%;
  }
}

.h2IndexDiffarent {
  padding-top: 15px;
  padding-bottom: 16px;
  padding-left: 0px;
  padding-right: 0px;
  font-size: 20px;
  line-height: normal;
  letter-spacing: 0.1em;
  text-indent: -0.1em;
  text-align: center;
}
@media screen and (max-width: 1299px) {
  .h2IndexDiffarent {
    padding: 1.43% 0% 1.53% 0%;
  }
}
@media screen and (max-width: 1299px) {
  .h2IndexDiffarent {
    font-size: 1.5396458814vw;
  }
}
@media screen and (max-width: 767px) {
  .h2IndexDiffarent {
    padding-top: 10px;
    padding-bottom: 10px;
    padding-left: 0px;
    padding-right: 0px;
    line-height: normal;
    letter-spacing: 0em;
    text-indent: 0em;
  }
}
@media screen and (max-width: 767px) and (max-width: 1299px) {
  .h2IndexDiffarent {
    padding: 2.94% 0% 2.94% 0%;
  }
}
@media screen and (max-width: 767px) and (max-width: 767px) {
  .h2IndexDiffarent {
    font-size: 3.7333333333vw;
  }
}

.tableIndexDiffarent {
  margin-top: 10px;
  margin-bottom: 0px;
  margin-left: auto;
  margin-right: auto;
}
@media screen and (max-width: 1299px) {
  .tableIndexDiffarent {
    margin-top: 0.95%;
    margin-bottom: 0%;
    margin-left: auto;
    margin-right: auto;
  }
}
@media screen and (max-width: 767px) {
  .tableIndexDiffarent {
    margin-top: 10px;
    margin-bottom: 0px;
    margin-left: auto;
    margin-right: auto;
  }
}
@media screen and (max-width: 767px) and (max-width: 1299px) {
  .tableIndexDiffarent {
    margin-top: 2.94%;
    margin-bottom: 0%;
    margin-left: auto;
    margin-right: auto;
  }
}

.secTableTitleIndexDiffarent {
  display: flex;
  border-bottom: 1px solid #FFF;
}

.thTableTitleIndexDiffarent {
  width: 185px;
  aspect-ratio: 185/53;
}
@media screen and (max-width: 1299px) {
  .thTableTitleIndexDiffarent {
    width: 17.73%;
  }
}
@media screen and (max-width: 767px) {
  .thTableTitleIndexDiffarent {
    width: 100%;
    aspect-ratio: unset;
  }
}

.detailTableTitleIndexDiffarentFx {
  width: 854px;
  align-items: center;
}
@media screen and (max-width: 1299px) {
  .detailTableTitleIndexDiffarentFx {
    width: 81.87%;
  }
}
@media screen and (max-width: 767px) {
  .detailTableTitleIndexDiffarentFx {
    width: 100%;
  }
}

.h3TableTitleIndexDiffarent {
  padding-top: 18px;
  padding-bottom: 18px;
  padding-left: 0px;
  padding-right: 0px;
  font-size: 18px;
  line-height: normal;
  letter-spacing: 0.1em;
  text-indent: -0.1em;
  width: 50%;
}
@media screen and (max-width: 1299px) {
  .h3TableTitleIndexDiffarent {
    padding: 1.72% 0% 1.72% 0%;
  }
}
@media screen and (max-width: 1299px) {
  .h3TableTitleIndexDiffarent {
    font-size: 1.3856812933vw;
  }
}
@media screen and (max-width: 767px) {
  .h3TableTitleIndexDiffarent {
    padding-top: 8px;
    padding-bottom: 8px;
    padding-left: 0px;
    padding-right: 0px;
    line-height: normal;
    letter-spacing: 0em;
    text-indent: 0em;
  }
}
@media screen and (max-width: 767px) and (max-width: 1299px) {
  .h3TableTitleIndexDiffarent {
    padding: 2.35% 0% 2.35% 0%;
  }
}
@media screen and (max-width: 767px) and (max-width: 767px) {
  .h3TableTitleIndexDiffarent {
    font-size: 3.2vw;
  }
}

.tdTableTitleIndexDiffarentFx {
  border-bottom: 1px solid #FFF;
  align-items: center;
}

.h4TableTitleIndexDiffarent {
  font-size: 14px;
  line-height: normal;
  letter-spacing: 0em;
  text-indent: 0em;
  font-feature-settings: "palt";
  display: flex;
  align-items: center;
}
@media screen and (max-width: 1299px) {
  .h4TableTitleIndexDiffarent {
    font-size: 1.077752117vw;
  }
}
@media screen and (max-width: 767px) {
  .h4TableTitleIndexDiffarent {
    padding-top: 7px;
    padding-bottom: 9px;
    padding-left: 0px;
    padding-right: 0px;
    line-height: normal;
    letter-spacing: 0em;
    text-indent: 0em;
    justify-content: center;
  }
}
@media screen and (max-width: 767px) and (max-width: 1299px) {
  .h4TableTitleIndexDiffarent {
    padding: 2.05% 0% 2.64% 0%;
  }
}
@media screen and (max-width: 767px) and (max-width: 767px) {
  .h4TableTitleIndexDiffarent {
    font-size: 3.2vw;
  }
}

.txtTableTitleIndexDiffarent {
  padding-top: 17px;
  padding-bottom: 16px;
  padding-left: 0px;
  padding-right: 0px;
  font-size: 14px;
  line-height: normal;
  letter-spacing: 0em;
  text-indent: 0em;
  width: 48%;
}
@media screen and (max-width: 1299px) {
  .txtTableTitleIndexDiffarent {
    padding: 1.62% 0% 1.53% 0%;
  }
}
@media screen and (max-width: 1299px) {
  .txtTableTitleIndexDiffarent {
    font-size: 1.077752117vw;
  }
}
@media screen and (max-width: 767px) {
  .txtTableTitleIndexDiffarent {
    padding-top: 0px;
    padding-bottom: 14px;
    padding-left: 0px;
    padding-right: 0px;
    line-height: normal;
    letter-spacing: 0em;
    text-indent: 0em;
  }
}
@media screen and (max-width: 767px) and (max-width: 1299px) {
  .txtTableTitleIndexDiffarent {
    padding: 0% 0% 4.11% 0%;
  }
}
@media screen and (max-width: 767px) and (max-width: 767px) {
  .txtTableTitleIndexDiffarent {
    font-size: 2.6666666667vw;
  }
}

/* ==========================================================================
use＆nameSpace
========================================================================== */
/* ==========================================================================
use＆nameSpace
========================================================================== */
/* ==========================================================================
LAYOUT
========================================================================== */
.indexCase {
  padding-top: 149px;
  padding-bottom: 0px;
  padding-left: 0px;
  padding-right: 0px;
}
@media screen and (max-width: 1299px) {
  .indexCase {
    padding: 7.76% 0% 0% 0%;
  }
}
@media screen and (max-width: 767px) {
  .indexCase {
    padding: 18% 0% 0% 0%;
  }
}

@media screen and (max-width: 767px) {
  .indexCaseWap {
    width: 340px;
    margin: auto;
  }
}
@media screen and (max-width: 767px) and (max-width: 1299px) {
  .indexCaseWap {
    width: 90.66%;
  }
}

.titleIndexCase {
  align-items: baseline;
}

.h2TitleIndexCase {
  font-size: 36px;
  line-height: normal;
  letter-spacing: 0.1em;
  text-indent: -0.1em;
}
@media screen and (max-width: 1299px) {
  .h2TitleIndexCase {
    font-size: 2.7713625866vw;
  }
}
@media screen and (max-width: 767px) {
  .h2TitleIndexCase {
    line-height: normal;
    letter-spacing: 0.1em;
    text-indent: -0.1em;
  }
}
@media screen and (max-width: 767px) and (max-width: 767px) {
  .h2TitleIndexCase {
    font-size: 6.6666666667vw;
  }
}

.txtTitleIndexCase {
  margin-top: 0px;
  margin-bottom: 0px;
  margin-left: 17px;
  margin-right: auto;
  font-size: 16px;
  line-height: normal;
  letter-spacing: 0.1em;
  text-indent: -0.1em;
  transform: translateY(-5%);
}
@media screen and (max-width: 1299px) and (max-width: 1299px) {
  .txtTitleIndexCase {
    margin-top: 0%;
    margin-bottom: 0%;
    margin-left: 1.3%;
    margin-right: auto;
  }
}
@media screen and (max-width: 1299px) {
  .txtTitleIndexCase {
    font-size: 1.2317167052vw;
  }
}
@media screen and (max-width: 767px) {
  .txtTitleIndexCase {
    margin: 0% 0% 0% 3.94%;
    line-height: normal;
    letter-spacing: 0.1em;
    text-indent: -0.1em;
  }
}
@media screen and (max-width: 767px) and (max-width: 767px) {
  .txtTitleIndexCase {
    font-size: 3.7333333333vw;
  }
}

.txtTitleIndexCase02 {
  margin-top: 37px;
  margin-bottom: 0px;
  margin-left: auto;
  margin-right: auto;
  font-size: 32px;
  line-height: 1.59375;
  letter-spacing: 0em;
  text-indent: 0em;
}
@media screen and (max-width: 1299px) {
  .txtTitleIndexCase02 {
    margin-top: 2.84%;
    margin-bottom: 0%;
    margin-left: auto;
    margin-right: auto;
  }
}
@media screen and (max-width: 1299px) {
  .txtTitleIndexCase02 {
    font-size: 2.4634334103vw;
  }
}
.txtTitleIndexCase02::before {
  display: block;
  width: 0;
  height: 0;
  margin-top: calc((1 - 1.59375) * 0.5em);
  content: "";
}
.txtTitleIndexCase02::after {
  display: block;
  width: 0;
  height: 0;
  margin-bottom: calc((1 - 1.59375) * 0.5em);
  content: "";
}
@media screen and (max-width: 767px) {
  .txtTitleIndexCase02 {
    margin-top: 3.64%;
    margin-bottom: 0%;
    margin-left: auto;
    margin-right: auto;
    line-height: 1.5;
    letter-spacing: 0.05em;
    text-indent: -0.05em;
  }
}
@media screen and (max-width: 767px) and (max-width: 767px) {
  .txtTitleIndexCase02 {
    font-size: 5.3333333333vw;
  }
}
@media screen and (max-width: 767px) {
  .txtTitleIndexCase02::before {
    display: block;
    width: 0;
    height: 0;
    margin-top: calc((1 - 1.5) * 0.5em);
    content: "";
  }
  .txtTitleIndexCase02::after {
    display: block;
    width: 0;
    height: 0;
    margin-bottom: calc((1 - 1.5) * 0.5em);
    content: "";
  }
}

.ulIndexCase {
  margin-top: 35px;
  margin-bottom: 0px;
  margin-left: auto;
  margin-right: auto;
}
@media screen and (max-width: 1299px) {
  .ulIndexCase {
    margin-top: 2.69%;
    margin-bottom: 0%;
    margin-left: auto;
    margin-right: auto;
  }
}
@media screen and (max-width: 767px) {
  .ulIndexCase {
    margin-top: 17.69%;
    margin-bottom: 0%;
    margin-left: auto;
    margin-right: auto;
  }
}

.liIndexCase {
  width: 418px;
  display: flex;
  flex-flow: row wrap;
  align-items: flex-start;
}
@media screen and (max-width: 1299px) {
  .liIndexCase {
    width: 32.15%;
  }
}
@media screen and (max-width: 767px) {
  .liIndexCase {
    width: 100%;
  }
  .liIndexCase:nth-child(n+2) {
    margin: 11.5% 0 0 0;
  }
}
.liIndexCase:nth-child(n+4) {
  margin-top: 56px;
  margin-bottom: 0px;
  margin-left: 0px;
  margin-right: 0px;
}
@media screen and (max-width: 1299px) {
  .liIndexCase:nth-child(n+4) {
    margin: 4.3% 0% 0% 0%;
  }
}
@media screen and (max-width: 767px) {
  .liIndexCase:nth-child(n+4) {
    margin: 11.5% 0 0 0;
  }
}

.h3IndexCase {
  margin-top: 18px;
  margin-bottom: 0px;
  margin-left: auto;
  margin-right: auto;
  font-size: 20px;
  line-height: normal;
  letter-spacing: 0.05em;
  text-indent: -0.05em;
}
@media screen and (max-width: 1299px) {
  .h3IndexCase {
    margin-top: 4.3%;
    margin-bottom: 0%;
    margin-left: auto;
    margin-right: auto;
  }
}
@media screen and (max-width: 1299px) {
  .h3IndexCase {
    font-size: 1.5396458814vw;
  }
}
@media screen and (max-width: 767px) {
  .h3IndexCase {
    margin-top: 4%;
    margin-bottom: 0%;
    margin-left: auto;
    margin-right: auto;
    line-height: normal;
    letter-spacing: 0.05em;
    text-indent: -0.05em;
  }
}
@media screen and (max-width: 767px) and (max-width: 767px) {
  .h3IndexCase {
    font-size: 4.8vw;
  }
}

.txtIndexCase {
  margin-top: 13px;
  margin-bottom: 0px;
  margin-left: auto;
  margin-right: auto;
  font-size: 14px;
  line-height: normal;
  letter-spacing: 0em;
  text-indent: 0em;
}
@media screen and (max-width: 1299px) {
  .txtIndexCase {
    margin-top: 3.11%;
    margin-bottom: 0%;
    margin-left: auto;
    margin-right: auto;
  }
}
@media screen and (max-width: 1299px) {
  .txtIndexCase {
    font-size: 1.077752117vw;
  }
}
@media screen and (max-width: 767px) {
  .txtIndexCase {
    margin-top: 3.2%;
    margin-bottom: 0%;
    margin-left: auto;
    margin-right: auto;
    line-height: 1.4;
    letter-spacing: 0em;
    text-indent: 0em;
  }
}
@media screen and (max-width: 767px) and (max-width: 767px) {
  .txtIndexCase {
    font-size: 3.2vw;
  }
}

.txtIndexCase02 {
  margin-top: 15px;
  margin-bottom: 0px;
  margin-left: 0px;
  margin-right: 0px;
  font-size: 12px;
  line-height: normal;
  letter-spacing: 0em;
  text-indent: 0em;
}
@media screen and (max-width: 1299px) {
  .txtIndexCase02 {
    margin: 3.58% 0% 0% 0%;
  }
}
@media screen and (max-width: 1299px) {
  .txtIndexCase02 {
    font-size: 0.9237875289vw;
  }
}
@media screen and (max-width: 767px) {
  .txtIndexCase02 {
    margin: 2.5% 0% 0% 0%;
    line-height: normal;
    letter-spacing: 0em;
    text-indent: 0em;
  }
}
@media screen and (max-width: 767px) and (max-width: 767px) {
  .txtIndexCase02 {
    font-size: 3.2vw;
  }
}

/* ==========================================================================
use＆nameSpace
========================================================================== */
/* ==========================================================================
use＆nameSpace
========================================================================== */
/* ==========================================================================
LAYOUT
========================================================================== */
.indexCta {
  padding-top: 76px;
  padding-bottom: 0px;
  padding-left: 0px;
  padding-right: 0px;
  position: relative;
}
@media screen and (max-width: 1299px) {
  .indexCta {
    padding: 3.95% 0% 0% 0%;
  }
}
@media screen and (max-width: 767px) {
  .indexCta {
    padding-top: 89px;
    padding-bottom: 0px;
    padding-left: 0px;
    padding-right: 0px;
  }
}
@media screen and (max-width: 767px) and (max-width: 1299px) {
  .indexCta {
    padding: 23.73% 0% 0% 0%;
  }
}

@media screen and (max-width: 767px) {
  .indexCtaWap {
    width: 350px;
    margin: auto;
  }
}
@media screen and (max-width: 767px) and (max-width: 1299px) {
  .indexCtaWap {
    width: 93.33%;
  }
}

.h2IndexCtaBx {
  font-size: 24px;
  line-height: normal;
  letter-spacing: 0em;
  text-indent: 0em;
}
@media screen and (max-width: 1299px) {
  .h2IndexCtaBx {
    font-size: 1.8475750577vw;
  }
}
@media screen and (max-width: 767px) {
  .h2IndexCtaBx {
    line-height: normal;
    letter-spacing: 0em;
    text-indent: 0em;
  }
}
@media screen and (max-width: 767px) and (max-width: 767px) {
  .h2IndexCtaBx {
    font-size: 3.7333333333vw;
  }
}

.ulIndexCtaBx {
  margin-top: 21px;
  margin-bottom: 0px;
  margin-left: auto;
  margin-right: auto;
  width: 572px;
}
@media screen and (max-width: 1299px) {
  .ulIndexCtaBx {
    margin-top: 1.61%;
    margin-bottom: 0%;
    margin-left: auto;
    margin-right: auto;
  }
}
@media screen and (max-width: 1299px) {
  .ulIndexCtaBx {
    width: 44%;
  }
}
@media screen and (max-width: 767px) {
  .ulIndexCtaBx {
    margin-top: 19px;
    margin-bottom: 0px;
    margin-left: auto;
    margin-right: auto;
    width: 272px;
  }
}
@media screen and (max-width: 767px) and (max-width: 1299px) {
  .ulIndexCtaBx {
    margin-top: 5.42%;
    margin-bottom: 0%;
    margin-left: auto;
    margin-right: auto;
  }
}
@media screen and (max-width: 767px) and (max-width: 1299px) {
  .ulIndexCtaBx {
    width: 77.71%;
  }
}

.liIndexCtaBx {
  width: 272px;
}
@media screen and (max-width: 1299px) {
  .liIndexCtaBx {
    width: 47.55%;
  }
}
@media screen and (max-width: 767px) {
  .liIndexCtaBx {
    width: 100%;
  }
  .liIndexCtaBx:nth-child(n+2) {
    margin-top: 7.82%;
    margin-bottom: 0%;
    margin-left: auto;
    margin-right: auto;
  }
}

.btnIndexCtaLast {
  border-radius: 30px;
  /* CSS3草案 */
  -webkit-border-radius: 30px;
  /* Safari,Google Chrome用 */
  -moz-border-radius: 30px;
  /* Firefox用 */
  width: 100%;
  aspect-ratio: 272/60;
  text-decoration: none;
  background: #DB2E21;
}
.btnIndexCtaLast:hover {
  opacity: 1;
  background-color: #A42117;
  transform: scale(1.1);
}

.secIndexCtaLast {
  background: url(../img/index/arrowBtnIndexKikaku.svg) no-repeat 98% center;
  background-size: auto 30%;
  transform: translateX(2%);
}

.secIndexCtaLast {
  width: 252px;
  margin: auto;
}
@media screen and (max-width: 1299px) {
  .secIndexCtaLast {
    width: 92.64%;
  }
}
@media screen and (max-width: 767px) {
  .secIndexCtaLast {
    width: 252px;
  }
}
@media screen and (max-width: 767px) and (max-width: 1299px) {
  .secIndexCtaLast {
    width: 92.64%;
  }
}

.h3IndexCtaLast {
  font-size: 18px;
  line-height: normal;
  letter-spacing: 0.05em;
  text-indent: -0.05em;
}
@media screen and (max-width: 1299px) {
  .h3IndexCtaLast {
    font-size: 1.3856812933vw;
  }
}
@media screen and (max-width: 767px) {
  .h3IndexCtaLast {
    line-height: normal;
    letter-spacing: 0.05em;
    text-indent: -0.05em;
  }
}
@media screen and (max-width: 767px) and (max-width: 767px) {
  .h3IndexCtaLast {
    font-size: 4.8vw;
  }
}

.txtIndexCtaLast {
  font-size: 12px;
  line-height: normal;
  letter-spacing: 0em;
  text-indent: 0em;
  transform: translate(-1%, -5%);
}
@media screen and (max-width: 1299px) {
  .txtIndexCtaLast {
    font-size: 0.9237875289vw;
  }
}
@media screen and (max-width: 767px) {
  .txtIndexCtaLast {
    line-height: normal;
    letter-spacing: 0em;
    text-indent: 0em;
  }
}
@media screen and (max-width: 767px) and (max-width: 767px) {
  .txtIndexCtaLast {
    font-size: 3.2vw;
  }
}

/*実例動画*/
.btnIndexCtaLast02 {
  border-radius: 30px;
  /* CSS3草案 */
  -webkit-border-radius: 30px;
  /* Safari,Google Chrome用 */
  -moz-border-radius: 30px;
  /* Firefox用 */
  width: 100%;
  aspect-ratio: 272/60;
  text-decoration: none;
  background-color: #666;
  background-image: url(../img/index/arrowBtnIndexCtaLast02.svg);
  background-repeat: no-repeat;
  background-position: 96% center;
  background-size: auto 20%;
  justify-content: center;
}
.h3IndexCtaLast {
  font-size: 18px;
  line-height: normal;
  letter-spacing: 0.05em;
  text-indent: -0.05em;
}
@media screen and (max-width: 1299px) {
  .h3IndexCtaLast {
    font-size: 1.3856812933vw;
  }
}
@media screen and (max-width: 767px) {
  .h3IndexCtaLast {
    line-height: normal;
    letter-spacing: 0em;
    text-indent: 0em;
  }
}
@media screen and (max-width: 767px) and (max-width: 767px) {
  .h3IndexCtaLast {
    font-size: 4.8vw;
  }
}

/*流れる*/
.indexCta01 {
  margin-top: 110px;
  margin-bottom: 0px;
  margin-left: auto;
  margin-right: auto;
  height: 120px;
  width: 100%;
  overflow: hidden;
  display: flex;
}
@media screen and (max-width: 1299px) {
  .indexCta01 {
    margin-top: 6.47%;
    margin-bottom: 0%;
    margin-left: auto;
    margin-right: auto;
  }
}
@media screen and (max-width: 767px) {
  .indexCta01 {
    margin-top: 26%;
    margin-bottom: 0%;
    margin-left: auto;
    margin-right: auto;
    height: 50px;
  }
}

.indexCta01 img {
  width: auto;
  height: 100%;
  max-width: unset;
  animation: slide1 40s -20s linear infinite;
  margin-top: 0px;
  margin-bottom: 0px;
  margin-left: 0px;
  margin-right: 100px;
}
@media screen and (max-width: 1299px) {
  .indexCta01 img {
    margin: 0% 5.2% 0% 0%;
  }
}

@keyframes slide1 {
  0% {
    transform: translateX(0%);
  }
  100% {
    transform: translateX(-100%);
  }
}
/*dorone*/
.picMainIndexDronLeftBtmWap {
  position: absolute;
  bottom: 10%;
  right: 6%;
  width: 308px;
  z-index: 9;
}
@media screen and (max-width: 1299px) {
  .picMainIndexDronLeftBtmWap {
    width: 16.04%;
  }
}
@media screen and (max-width: 767px) {
  .picMainIndexDronLeftBtmWap {
    width: 25.04%;
    bottom: 11.5%;
    right: 2.5%;
  }
}

/* ==========================================================================
use＆nameSpace
========================================================================== */
/* ==========================================================================
use＆nameSpace
========================================================================== */
/* ==========================================================================
LAYOUT
========================================================================== */
.indexPrice {
  padding-top: 102px;
  padding-bottom: 0px;
  padding-left: 0px;
  padding-right: 0px;
}
@media screen and (max-width: 1299px) {
  .indexPrice {
    padding: 5.31% 0% 0% 0%;
  }
}
@media screen and (max-width: 767px) {
  .indexPrice {
    padding-top: 67px;
    padding-bottom: 0px;
    padding-left: 0px;
    padding-right: 0px;
  }
}
@media screen and (max-width: 767px) and (max-width: 1299px) {
  .indexPrice {
    padding: 17.86% 0% 0% 0%;
  }
}

@media screen and (max-width: 767px) {
  .indexPriceWap {
    width: 340px;
    margin: auto;
  }
}
@media screen and (max-width: 767px) and (max-width: 1299px) {
  .indexPriceWap {
    width: 90.66%;
  }
}

.h2TitleIndexPrice {
  font-size: 36px;
  line-height: normal;
  letter-spacing: 0.1em;
  text-indent: -0.1em;
}
@media screen and (max-width: 1299px) {
  .h2TitleIndexPrice {
    font-size: 2.7713625866vw;
  }
}
@media screen and (max-width: 767px) {
  .h2TitleIndexPrice {
    line-height: normal;
    letter-spacing: 0.1em;
    text-indent: -0.1em;
  }
}
@media screen and (max-width: 767px) and (max-width: 767px) {
  .h2TitleIndexPrice {
    font-size: 6.6666666667vw;
  }
}

.txtTitleIndexPrice {
  font-size: 16px;
  line-height: normal;
  letter-spacing: 0.1em;
  text-indent: -0.1em;
  margin-top: 0px;
  margin-bottom: 0px;
  margin-left: 16px;
  margin-right: 0px;
}
@media screen and (max-width: 1299px) {
  .txtTitleIndexPrice {
    font-size: 1.2317167052vw;
  }
}
@media screen and (max-width: 1299px) {
  .txtTitleIndexPrice {
    margin: 0% 0% 0% 1.23%;
  }
}
@media screen and (max-width: 767px) {
  .txtTitleIndexPrice {
    line-height: normal;
    letter-spacing: 0.1em;
    text-indent: -0.1em;
    margin-top: 0px;
    margin-bottom: 5px;
    margin-left: 9px;
    margin-right: 0px;
  }
}
@media screen and (max-width: 767px) and (max-width: 767px) {
  .txtTitleIndexPrice {
    font-size: 3.7333333333vw;
  }
}
@media screen and (max-width: 767px) and (max-width: 1299px) {
  .txtTitleIndexPrice {
    margin: 0% 0% 1.47% 2.64%;
  }
}

.h3TitleIndexPriceTop {
  margin-top: 21px;
  margin-bottom: 0px;
  margin-left: 0px;
  margin-right: 0px;
  font-size: 32px;
  line-height: normal;
  letter-spacing: 0.1em;
  text-indent: -0.1em;
}
@media screen and (max-width: 1299px) {
  .h3TitleIndexPriceTop {
    margin: 1.61% 0% 0% 0%;
  }
}
@media screen and (max-width: 1299px) {
  .h3TitleIndexPriceTop {
    font-size: 2.4634334103vw;
  }
}
@media screen and (max-width: 767px) {
  .h3TitleIndexPriceTop {
    line-height: normal;
    letter-spacing: 0.05em;
    text-indent: -0.05em;
    margin-top: 9px;
    margin-bottom: 0px;
    margin-left: 0px;
    margin-right: 0px;
  }
}
@media screen and (max-width: 767px) and (max-width: 767px) {
  .h3TitleIndexPriceTop {
    font-size: 5.3333333333vw;
  }
}
@media screen and (max-width: 767px) and (max-width: 1299px) {
  .h3TitleIndexPriceTop {
    margin: 2.64% 0% 0% 0%;
  }
}

.indexPriceMainFx {
  margin-top: 28px;
  margin-bottom: 0px;
  margin-left: 0px;
  margin-right: 0px;
}
@media screen and (max-width: 1299px) {
  .indexPriceMainFx {
    margin: 2.15% 0% 0% 0%;
  }
}
@media screen and (max-width: 767px) {
  .indexPriceMainFx {
    margin-top: 21px;
    margin-bottom: 0px;
    margin-left: 0px;
    margin-right: 0px;
  }
}
@media screen and (max-width: 767px) and (max-width: 1299px) {
  .indexPriceMainFx {
    margin: 6.17% 0% 0% 0%;
  }
}

.indexPriceMain {
  width: 631px;
  padding-top: 31px;
  padding-bottom: 28px;
  padding-left: 0px;
  padding-right: 0px;
  border-radius: 10px;
  /* CSS3草案 */
  -webkit-border-radius: 10px;
  /* Safari,Google Chrome用 */
  -moz-border-radius: 10px;
  /* Firefox用 */
}
@media screen and (max-width: 1299px) {
  .indexPriceMain {
    width: 48.53%;
  }
}
@media screen and (max-width: 1299px) {
  .indexPriceMain {
    padding: 2.38% 0% 2.15% 0%;
  }
}
@media screen and (max-width: 767px) {
  .indexPriceMain {
    width: 340px;
    padding: 5.8% 0% 3% 0%;
    border-radius: 10px;
    /* CSS3草案 */
    -webkit-border-radius: 10px;
    /* Safari,Google Chrome用 */
    -moz-border-radius: 10px;
    /* Firefox用 */
  }
}
@media screen and (max-width: 767px) and (max-width: 1299px) {
  .indexPriceMain {
    width: 100%;
  }
}
@media screen and (max-width: 767px) {
  .indexPriceMain + .indexPriceMain {
    margin: 5.5% 0% 0% 0%;
  }
}

.secIndexPriceMain {
  width: 553px;
  margin: auto;
}
@media screen and (max-width: 1299px) {
  .secIndexPriceMain {
    width: 87.63%;
  }
}
@media screen and (max-width: 767px) {
  .secIndexPriceMain {
    width: 298px;
  }
}
@media screen and (max-width: 767px) and (max-width: 1299px) {
  .secIndexPriceMain {
    width: 87.64%;
  }
}

.indexPriceMainTopFx {
  width: 100%;
}

.secMainIndexPriceTop {
  width: 364px;
}
@media screen and (max-width: 1299px) {
  .secMainIndexPriceTop {
    width: 65.82%;
  }
}
@media screen and (max-width: 767px) {
  .secMainIndexPriceTop {
    width: 188px;
  }
}
@media screen and (max-width: 767px) and (max-width: 1299px) {
  .secMainIndexPriceTop {
    width: 63.08%;
  }
}

.h4MainIndexPriceTop {
  font-size: 12px;
  line-height: normal;
  letter-spacing: 0.15em;
  text-indent: -0.15em;
}
@media screen and (max-width: 1299px) {
  .h4MainIndexPriceTop {
    font-size: 0.9237875289vw;
  }
}
@media screen and (max-width: 767px) {
  .h4MainIndexPriceTop {
    line-height: normal;
    letter-spacing: 0.15em;
    text-indent: -0.15em;
  }
}
@media screen and (max-width: 767px) and (max-width: 767px) {
  .h4MainIndexPriceTop {
    font-size: 2.6666666667vw;
  }
}

.h5MainIndexPriceTop {
  margin-top: 5px;
  margin-bottom: 0px;
  margin-left: auto;
  margin-right: auto;
  font-size: 25px;
  line-height: 1.32;
  letter-spacing: 0em;
  text-indent: 0em;
}
@media screen and (max-width: 1299px) {
  .h5MainIndexPriceTop {
    margin-top: 1.37%;
    margin-bottom: 0%;
    margin-left: auto;
    margin-right: auto;
  }
}
@media screen and (max-width: 1299px) {
  .h5MainIndexPriceTop {
    font-size: 1.9245573518vw;
  }
}
.h5MainIndexPriceTop::before {
  display: block;
  width: 0;
  height: 0;
  margin-top: calc((1 - 1.32) * 0.5em);
  content: "";
}
.h5MainIndexPriceTop::after {
  display: block;
  width: 0;
  height: 0;
  margin-bottom: calc((1 - 1.32) * 0.5em);
  content: "";
}
@media screen and (max-width: 767px) {
  .h5MainIndexPriceTop {
    margin-top: 3px;
    margin-bottom: 0px;
    margin-left: auto;
    margin-right: auto;
    line-height: 1.2857142857;
    letter-spacing: 0em;
    text-indent: 0em;
  }
}
@media screen and (max-width: 767px) and (max-width: 1299px) {
  .h5MainIndexPriceTop {
    margin-top: 1.59%;
    margin-bottom: 0%;
    margin-left: auto;
    margin-right: auto;
  }
}
@media screen and (max-width: 767px) and (max-width: 767px) {
  .h5MainIndexPriceTop {
    font-size: 3.7333333333vw;
  }
}
@media screen and (max-width: 767px) {
  .h5MainIndexPriceTop::before {
    display: block;
    width: 0;
    height: 0;
    margin-top: calc((1 - 1.2857142857) * 0.5em);
    content: "";
  }
  .h5MainIndexPriceTop::after {
    display: block;
    width: 0;
    height: 0;
    margin-bottom: calc((1 - 1.2857142857) * 0.5em);
    content: "";
  }
}

.h6MainIndexPriceTop {
  margin-top: 50px;
  margin-bottom: 0px;
  margin-left: auto;
  margin-right: auto;
  font-size: 14px;
  line-height: normal;
  letter-spacing: 0.05em;
  text-indent: -0.05em;
}
@media screen and (max-width: 1299px) {
  .h6MainIndexPriceTop {
    margin-top: 13.73%;
    margin-bottom: 0%;
    margin-left: auto;
    margin-right: auto;
  }
}
@media screen and (max-width: 1299px) {
  .h6MainIndexPriceTop {
    font-size: 1.077752117vw;
  }
}
@media screen and (max-width: 767px) {
  .h6MainIndexPriceTop {
    margin-top: 5.5%;
    margin-bottom: 0%;
    margin-left: auto;
    margin-right: auto;
    line-height: normal;
    letter-spacing: 0.05em;
    text-indent: -0.05em;
  }
}
@media screen and (max-width: 767px) and (max-width: 767px) {
  .h6MainIndexPriceTop {
    font-size: 2.6666666667vw;
  }
}

.txtMainIndexPriceTopFx {
  margin-top: 4px;
  margin-bottom: 0px;
  margin-left: auto;
  margin-right: auto;
  align-items: baseline;
}
@media screen and (max-width: 1299px) {
  .txtMainIndexPriceTopFx {
    margin-top: 1.09%;
    margin-bottom: 0%;
    margin-left: auto;
    margin-right: auto;
  }
}
@media screen and (max-width: 767px) {
  .txtMainIndexPriceTopFx {
    margin-top: 0.06%;
    margin-bottom: 0%;
    margin-left: auto;
    margin-right: auto;
  }
}

.tainMainIndexPriceTopFx {
  font-size: 25px;
  line-height: normal;
  letter-spacing: 0em;
  text-indent: 0em;
}
@media screen and (max-width: 1299px) {
  .tainMainIndexPriceTopFx {
    font-size: 1.9245573518vw;
  }
}
@media screen and (max-width: 767px) {
  .tainMainIndexPriceTopFx {
    line-height: normal;
    letter-spacing: 0em;
    text-indent: 0em;
  }
}
@media screen and (max-width: 767px) and (max-width: 767px) {
  .tainMainIndexPriceTopFx {
    font-size: 3.7333333333vw;
  }
}

.enMainIndexPriceTopFx {
  font-size: 45px;
  line-height: 0.6666666667;
  letter-spacing: 0.05em;
  text-indent: -0.05em;
}
@media screen and (max-width: 1299px) {
  .enMainIndexPriceTopFx {
    font-size: 3.4642032333vw;
  }
}
.enMainIndexPriceTopFx::before {
  display: block;
  width: 0;
  height: 0;
  margin-top: calc((1 - 0.6666666667) * 0.5em);
  content: "";
}
.enMainIndexPriceTopFx::after {
  display: block;
  width: 0;
  height: 0;
  margin-bottom: calc((1 - 0.6666666667) * 0.5em);
  content: "";
}
@media screen and (max-width: 767px) {
  .enMainIndexPriceTopFx {
    line-height: 0.75;
    letter-spacing: 0.05em;
    text-indent: -0.05em;
  }
}
@media screen and (max-width: 767px) and (max-width: 767px) {
  .enMainIndexPriceTopFx {
    font-size: 6.4vw;
  }
}
@media screen and (max-width: 767px) {
  .enMainIndexPriceTopFx::before {
    display: block;
    width: 0;
    height: 0;
    margin-top: calc((1 - 0.75) * 0.5em);
    content: "";
  }
  .enMainIndexPriceTopFx::after {
    display: block;
    width: 0;
    height: 0;
    margin-bottom: calc((1 - 0.75) * 0.5em);
    content: "";
  }
}

.taxMainIndexPriceTopFx {
  font-size: 14px;
  line-height: 1;
  letter-spacing: 0em;
  text-indent: 0em;
  font-weight: 700;
}
@media screen and (max-width: 1299px) {
  .taxMainIndexPriceTopFx {
    font-size: 1.077752117vw;
  }
}
.taxMainIndexPriceTopFx::before {
  display: block;
  width: 0;
  height: 0;
  margin-top: calc((1 - 1) * 0.5em);
  content: "";
}
.taxMainIndexPriceTopFx::after {
  display: block;
  width: 0;
  height: 0;
  margin-bottom: calc((1 - 1) * 0.5em);
  content: "";
}
@media screen and (max-width: 767px) {
  .taxMainIndexPriceTopFx {
    line-height: 1;
    letter-spacing: 0em;
    text-indent: 0em;
    margin-top: 0px;
    margin-bottom: 6px;
    margin-left: 0px;
    margin-right: 0px;
  }
}
@media screen and (max-width: 767px) and (max-width: 767px) {
  .taxMainIndexPriceTopFx {
    font-size: 2.6666666667vw;
  }
}
@media screen and (max-width: 767px) {
  .taxMainIndexPriceTopFx::before {
    display: block;
    width: 0;
    height: 0;
    margin-top: calc((1 - 1) * 0.5em);
    content: "";
  }
  .taxMainIndexPriceTopFx::after {
    display: block;
    width: 0;
    height: 0;
    margin-bottom: calc((1 - 1) * 0.5em);
    content: "";
  }
}
@media screen and (max-width: 767px) and (max-width: 1299px) {
  .taxMainIndexPriceTopFx {
    margin: 0% 0% 3.19% 0%;
  }
}

.picMainIndexPriceTop {
  width: 195px;
  margin: 1% 0 0 0;
}
@media screen and (max-width: 1299px) {
  .picMainIndexPriceTop {
    width: 35.26%;
  }
}
@media screen and (max-width: 767px) {
  .picMainIndexPriceTop {
    width: 110px;
    margin: 0;
  }
}
@media screen and (max-width: 767px) and (max-width: 1299px) {
  .picMainIndexPriceTop {
    width: 36.91%;
  }
}

.ulIndexPriceMainTop {
  margin-top: 16px;
  margin-bottom: 0px;
  margin-left: auto;
  margin-right: auto;
}
@media screen and (max-width: 1299px) {
  .ulIndexPriceMainTop {
    margin-top: 2.89%;
    margin-bottom: 0%;
    margin-left: auto;
    margin-right: auto;
  }
}
@media screen and (max-width: 767px) {
  .ulIndexPriceMainTop {
    margin-top: 3.5%;
    margin-bottom: 0%;
    margin-left: auto;
    margin-right: auto;
  }
}

.liIndexPriceMainTop {
  font-size: 14px;
  line-height: 1.1428571429;
  letter-spacing: 0em;
  text-indent: 0em;
  aspect-ratio: 105/50;
  border-radius: 6px;
  /* CSS3草案 */
  -webkit-border-radius: 6px;
  /* Safari,Google Chrome用 */
  -moz-border-radius: 6px;
  /* Firefox用 */
  width: 105px;
  text-align: center;
  font-weight: 500;
}
@media screen and (max-width: 1299px) {
  .liIndexPriceMainTop {
    font-size: 1.077752117vw;
  }
}
.liIndexPriceMainTop::before {
  display: block;
  width: 0;
  height: 0;
  margin-top: calc((1 - 1.1428571429) * 0.5em);
  content: "";
}
.liIndexPriceMainTop::after {
  display: block;
  width: 0;
  height: 0;
  margin-bottom: calc((1 - 1.1428571429) * 0.5em);
  content: "";
}
@media screen and (max-width: 1299px) {
  .liIndexPriceMainTop {
    width: 18.98%;
  }
}
@media screen and (max-width: 767px) {
  .liIndexPriceMainTop {
    line-height: 1.2;
    letter-spacing: 0em;
    text-indent: 0em;
    aspect-ratio: 56/40;
    border-radius: 6px;
    /* CSS3草案 */
    -webkit-border-radius: 6px;
    /* Safari,Google Chrome用 */
    -moz-border-radius: 6px;
    /* Firefox用 */
    width: 56px;
    text-align: center;
  }
}
@media screen and (max-width: 767px) and (max-width: 767px) {
  .liIndexPriceMainTop {
    font-size: 2.6666666667vw;
  }
}
@media screen and (max-width: 767px) {
  .liIndexPriceMainTop::before {
    display: block;
    width: 0;
    height: 0;
    margin-top: calc((1 - 1.2) * 0.5em);
    content: "";
  }
  .liIndexPriceMainTop::after {
    display: block;
    width: 0;
    height: 0;
    margin-bottom: calc((1 - 1.2) * 0.5em);
    content: "";
  }
}
@media screen and (max-width: 767px) and (max-width: 1299px) {
  .liIndexPriceMainTop {
    width: 18.79%;
  }
}

.tableIndexPriceMainTop {
  margin-top: 11px;
  margin-bottom: 0px;
  margin-left: auto;
  margin-right: auto;
}
@media screen and (max-width: 1299px) {
  .tableIndexPriceMainTop {
    margin-top: 1.98%;
    margin-bottom: 0%;
    margin-left: auto;
    margin-right: auto;
  }
}
@media screen and (max-width: 767px) {
  .tableIndexPriceMainTop {
    margin-top: 10px;
    margin-bottom: 0px;
    margin-left: auto;
    margin-right: auto;
  }
}
@media screen and (max-width: 767px) and (max-width: 1299px) {
  .tableIndexPriceMainTop {
    margin-top: 3.35%;
    margin-bottom: 0%;
    margin-left: auto;
    margin-right: auto;
  }
}

.thIndexPriceMainTop {
  width: 95px;
  padding-top: 17px;
  padding-bottom: 17px;
  padding-left: 0px;
  padding-right: 0px;
  text-align: left;
  font-size: 14px;
  line-height: normal;
  letter-spacing: 0.05em;
  text-indent: -0.05em;
}
@media screen and (max-width: 1299px) {
  .thIndexPriceMainTop {
    width: 17.17%;
  }
}
@media screen and (max-width: 1299px) {
  .thIndexPriceMainTop {
    padding: 3.07% 0% 3.07% 0%;
  }
}
@media screen and (max-width: 1299px) {
  .thIndexPriceMainTop {
    font-size: 1.077752117vw;
  }
}
@media screen and (max-width: 767px) {
  .thIndexPriceMainTop {
    line-height: normal;
    letter-spacing: 0.05em;
    text-indent: -0.05em;
    width: 51px;
    padding-top: 10px;
    padding-bottom: 10px;
    padding-left: 0px;
    padding-right: 0px;
  }
}
@media screen and (max-width: 767px) and (max-width: 767px) {
  .thIndexPriceMainTop {
    font-size: 2.6666666667vw;
  }
}
@media screen and (max-width: 767px) and (max-width: 1299px) {
  .thIndexPriceMainTop {
    width: 17.11%;
  }
}
@media screen and (max-width: 767px) and (max-width: 1299px) {
  .thIndexPriceMainTop {
    padding: 3.35% 0% 3.35% 0%;
  }
}

.tdIndexPriceMainTop {
  width: 457px;
  padding-top: 17px;
  padding-bottom: 17px;
  padding-left: 0px;
  padding-right: 0px;
  font-size: 14px;
  line-height: normal;
  letter-spacing: 0em;
  text-indent: 0em;
}
@media screen and (max-width: 1299px) {
  .tdIndexPriceMainTop {
    width: 82.64%;
  }
}
@media screen and (max-width: 1299px) {
  .tdIndexPriceMainTop {
    padding: 3.07% 0% 3.07% 0%;
  }
}
@media screen and (max-width: 1299px) {
  .tdIndexPriceMainTop {
    font-size: 1.077752117vw;
  }
}
@media screen and (max-width: 767px) {
  .tdIndexPriceMainTop {
    line-height: normal;
    letter-spacing: 0em;
    text-indent: 0em;
    width: 246px;
    padding-top: 10px;
    padding-bottom: 10px;
    padding-left: 0px;
    padding-right: 0px;
  }
}
@media screen and (max-width: 767px) and (max-width: 767px) {
  .tdIndexPriceMainTop {
    font-size: 2.6666666667vw;
  }
}
@media screen and (max-width: 767px) and (max-width: 1299px) {
  .tdIndexPriceMainTop {
    width: 82.55%;
  }
}
@media screen and (max-width: 767px) and (max-width: 1299px) {
  .tdIndexPriceMainTop {
    padding: 3.35% 0% 3.35% 0%;
  }
}

.h5TdIndexPriceMainTop {
  font-size: 14px;
  line-height: normal;
  letter-spacing: 0em;
  text-indent: 0em;
}
@media screen and (max-width: 1299px) {
  .h5TdIndexPriceMainTop {
    font-size: 1.077752117vw;
  }
}
@media screen and (max-width: 767px) {
  .h5TdIndexPriceMainTop {
    line-height: normal;
    letter-spacing: 0em;
    text-indent: 0em;
  }
}
@media screen and (max-width: 767px) and (max-width: 767px) {
  .h5TdIndexPriceMainTop {
    font-size: 2.6666666667vw;
  }
}

.txtTdIndexPriceMainTop {
  margin-top: 4px;
  margin-bottom: 0px;
  margin-left: auto;
  margin-right: auto;
  font-size: 12px;
  line-height: normal;
  letter-spacing: 0em;
  text-indent: 0em;
}
@media screen and (max-width: 1299px) {
  .txtTdIndexPriceMainTop {
    margin-top: 0.87%;
    margin-bottom: 0%;
    margin-left: auto;
    margin-right: auto;
  }
}
@media screen and (max-width: 1299px) {
  .txtTdIndexPriceMainTop {
    font-size: 0.9237875289vw;
  }
}
@media screen and (max-width: 767px) {
  .txtTdIndexPriceMainTop {
    margin-top: 6px;
    margin-bottom: 0px;
    margin-left: auto;
    margin-right: auto;
    line-height: normal;
    letter-spacing: 0em;
    text-indent: 0em;
  }
}
@media screen and (max-width: 767px) and (max-width: 1299px) {
  .txtTdIndexPriceMainTop {
    margin-top: 2.43%;
    margin-bottom: 0%;
    margin-left: auto;
    margin-right: auto;
  }
}
@media screen and (max-width: 767px) and (max-width: 767px) {
  .txtTdIndexPriceMainTop {
    font-size: 2.6666666667vw;
  }
}

.trIndexPriceMainTop02 td,
.trIndexPriceMainTop02 th {
  border-top: 1px solid #CCCCCE;
}

/* ==========================================================================
use＆nameSpace
========================================================================== */
/* ==========================================================================
use＆nameSpace
========================================================================== */
/* ==========================================================================
LAYOUT
========================================================================== */
.indexOption {
  padding-top: 34px;
  padding-bottom: 0px;
  padding-left: 0px;
  padding-right: 0px;
}
@media screen and (max-width: 1299px) {
  .indexOption {
    padding: 1.77% 0% 0% 0%;
  }
}
@media screen and (max-width: 767px) {
  .indexOption {
    padding-top: 18px;
    padding-bottom: 0px;
    padding-left: 0px;
    padding-right: 0px;
  }
}
@media screen and (max-width: 767px) and (max-width: 1299px) {
  .indexOption {
    padding: 4.8% 0% 0% 0%;
  }
}

.indexOptionWap {
  border: 1px solid #DB2E21;
  background: #fff;
  padding-top: 16px;
  padding-bottom: 14px;
  padding-left: 0px;
  padding-right: 0px;
}
@media screen and (max-width: 1299px) {
  .indexOptionWap {
    padding: 0.83% 0% 0.72% 0%;
  }
}
@media screen and (max-width: 767px) {
  .indexOptionWap {
    padding: 3.2% 0% 2.93% 0%;
    width: 340px;
  }
}
@media screen and (max-width: 767px) and (max-width: 1299px) {
  .indexOptionWap {
    width: 90.66%;
  }
}

.secIndexOption {
  width: 1273px;
  margin: auto;
}
@media screen and (max-width: 1299px) {
  .secIndexOption {
    width: 97.92%;
  }
}
@media screen and (max-width: 767px) {
  .secIndexOption {
    width: 315px;
  }
}
@media screen and (max-width: 767px) and (max-width: 1299px) {
  .secIndexOption {
    width: 92.64%;
  }
}

.titleIndexOption {
  width: 111px;
  border-right: 1px solid #DB2E21;
  aspect-ratio: 111/76;
}
@media screen and (max-width: 1299px) {
  .titleIndexOption {
    width: 8.71%;
  }
}
@media screen and (max-width: 767px) {
  .titleIndexOption {
    border-right: none;
    border-bottom: 1px solid #DB2E21;
    width: 75px;
    padding: 0% 0% 1% 0%;
    margin: auto;
    aspect-ratio: 79/42;
  }
}
@media screen and (max-width: 767px) and (max-width: 1299px) {
  .titleIndexOption {
    width: 23.8%;
  }
}

.h3TitleIndexOption {
  font-size: 18px;
  line-height: normal;
  letter-spacing: 0.1em;
  text-indent: -0.1em;
}
@media screen and (max-width: 1299px) {
  .h3TitleIndexOption {
    font-size: 1.3856812933vw;
  }
}
@media screen and (max-width: 767px) {
  .h3TitleIndexOption {
    line-height: normal;
    letter-spacing: 0.1em;
    text-indent: -0.1em;
  }
}
@media screen and (max-width: 767px) and (max-width: 767px) {
  .h3TitleIndexOption {
    font-size: 4.8vw;
  }
}

.txtTitleIndexOption {
  margin-top: 0px;
  margin-bottom: 0px;
  margin-left: auto;
  margin-right: auto;
  font-size: 14px;
  line-height: normal;
  letter-spacing: 0em;
  text-indent: 0em;
}
@media screen and (max-width: 1299px) {
  .txtTitleIndexOption {
    margin-top: 0%;
    margin-bottom: 0%;
    margin-left: auto;
    margin-right: auto;
  }
}
@media screen and (max-width: 1299px) {
  .txtTitleIndexOption {
    font-size: 1.077752117vw;
  }
}
@media screen and (max-width: 767px) {
  .txtTitleIndexOption {
    line-height: normal;
    letter-spacing: 0em;
    text-indent: 0em;
  }
}
@media screen and (max-width: 767px) and (max-width: 767px) {
  .txtTitleIndexOption {
    font-size: 3.2vw;
  }
}

.ulIndexOption {
  width: 1142px;
}
@media screen and (max-width: 1299px) {
  .ulIndexOption {
    width: 89.7%;
  }
}
@media screen and (max-width: 767px) {
  .ulIndexOption {
    margin-top: 14px;
    margin-bottom: 0px;
    margin-left: auto;
    margin-right: auto;
    width: 315px;
  }
}
@media screen and (max-width: 767px) and (max-width: 1299px) {
  .ulIndexOption {
    margin-top: 4.44%;
    margin-bottom: 0%;
    margin-left: auto;
    margin-right: auto;
  }
}
@media screen and (max-width: 767px) and (max-width: 1299px) {
  .ulIndexOption {
    width: 100%;
  }
}

.liIndexOption {
  width: 118px;
  border-radius: 10px;
  /* CSS3草案 */
  -webkit-border-radius: 10px;
  /* Safari,Google Chrome用 */
  -moz-border-radius: 10px;
  /* Firefox用 */
  font-size: 14px;
  line-height: normal;
  letter-spacing: 0em;
  text-indent: 0em;
  aspect-ratio: 118/72;
}
@media screen and (max-width: 1299px) {
  .liIndexOption {
    width: 10.33%;
  }
}
@media screen and (max-width: 1299px) {
  .liIndexOption {
    font-size: 1.077752117vw;
  }
}
@media screen and (max-width: 767px) {
  .liIndexOption {
    width: 97px;
    border-radius: 6px;
    /* CSS3草案 */
    -webkit-border-radius: 6px;
    /* Safari,Google Chrome用 */
    -moz-border-radius: 6px;
    /* Firefox用 */
    line-height: 1.4;
    letter-spacing: 0em;
    text-indent: 0em;
    aspect-ratio: 97/39;
  }
}
@media screen and (max-width: 767px) and (max-width: 1299px) {
  .liIndexOption {
    width: 30.79%;
  }
}
@media screen and (max-width: 767px) and (max-width: 767px) {
  .liIndexOption {
    font-size: 2.6666666667vw;
  }
}
@media screen and (max-width: 767px) {
  .liIndexOption::before {
    display: block;
    width: 0;
    height: 0;
    margin-top: calc((1 - 1.4) * 0.5em);
    content: "";
  }
  .liIndexOption::after {
    display: block;
    width: 0;
    height: 0;
    margin-bottom: calc((1 - 1.4) * 0.5em);
    content: "";
  }
  .liIndexOption:nth-child(n+4) {
    margin: 3% 0% 0% 0%;
  }
}

/* ==========================================================================
use＆nameSpace
========================================================================== */
/* ==========================================================================
use＆nameSpace
========================================================================== */
/* ==========================================================================
LAYOUT
========================================================================== */
.indexOptionCta {
  padding-top: 38px;
  padding-bottom: 0px;
  padding-left: 0px;
  padding-right: 0px;
}
@media screen and (max-width: 1299px) {
  .indexOptionCta {
    padding: 1.97% 0% 0% 0%;
  }
}
@media screen and (max-width: 767px) {
  .indexOptionCta {
    padding: 5.4% 0% 0% 0%;
  }
}

.h2IndexOptionCta {
  font-size: 18px;
  line-height: normal;
  letter-spacing: 0em;
  text-indent: 0em;
}
@media screen and (max-width: 1299px) {
  .h2IndexOptionCta {
    font-size: 1.3856812933vw;
  }
}
@media screen and (max-width: 767px) {
  .h2IndexOptionCta {
    line-height: normal;
    letter-spacing: 0em;
    text-indent: 0em;
  }
}
@media screen and (max-width: 767px) and (max-width: 767px) {
  .h2IndexOptionCta {
    font-size: 3.7333333333vw;
  }
}

.txtIndexOptionCta {
  margin-top: 17px;
  margin-bottom: 0px;
  margin-left: auto;
  margin-right: auto;
  font-size: 14px;
  line-height: normal;
  letter-spacing: 0em;
  text-indent: 0em;
}
@media screen and (max-width: 1299px) {
  .txtIndexOptionCta {
    margin-top: 1.3%;
    margin-bottom: 0%;
    margin-left: auto;
    margin-right: auto;
  }
}
@media screen and (max-width: 1299px) {
  .txtIndexOptionCta {
    font-size: 1.077752117vw;
  }
}
@media screen and (max-width: 767px) {
  .txtIndexOptionCta {
    margin-top: 2%;
    margin-bottom: 0%;
    margin-left: auto;
    margin-right: auto;
    line-height: normal;
    letter-spacing: 0em;
    text-indent: 0em;
  }
}
@media screen and (max-width: 767px) and (max-width: 767px) {
  .txtIndexOptionCta {
    font-size: 2.6666666667vw;
  }
}

.btnIndexOptionCtaLastWap {
  margin-top: 16px;
  margin-bottom: 0px;
  margin-left: auto;
  margin-right: auto;
  width: 272px;
}
@media screen and (max-width: 1299px) {
  .btnIndexOptionCtaLastWap {
    margin-top: 1.23%;
    margin-bottom: 0%;
    margin-left: auto;
    margin-right: auto;
  }
}
@media screen and (max-width: 1299px) {
  .btnIndexOptionCtaLastWap {
    width: 20.92%;
  }
}
@media screen and (max-width: 767px) {
  .btnIndexOptionCtaLastWap {
    margin-top: 18px;
    margin-bottom: 0px;
    margin-left: auto;
    margin-right: auto;
    width: 272px;
  }
}
@media screen and (max-width: 767px) and (max-width: 1299px) {
  .btnIndexOptionCtaLastWap {
    margin-top: 4.8%;
    margin-bottom: 0%;
    margin-left: auto;
    margin-right: auto;
  }
}
@media screen and (max-width: 767px) and (max-width: 1299px) {
  .btnIndexOptionCtaLastWap {
    width: 72.53%;
  }
}

.btnIndexOptionCtaLast {
  width: 100%;
  border-radius: 60px;
  /* CSS3草案 */
  -webkit-border-radius: 60px;
  /* Safari,Google Chrome用 */
  -moz-border-radius: 60px;
  /* Firefox用 */
  aspect-ratio: 272/60;
  background-color: #DB2E21;
  text-decoration: none;
}
.btnIndexOptionCtaLast:hover {
  opacity: 1;
  background-color: #A42117;
  transform: scale(1.1);
}

.secIndexOptionCtaLast {
  width: 252px;
  margin: auto;
  transform: translateX(2%);
  background-image: url(../img/index/arrowBtnIndexOptionCtaLast.svg);
  background-position: 98% center;
  background-repeat: no-repeat;
  background-size: auto 22%;
}
@media screen and (max-width: 1299px) {
  .secIndexOptionCtaLast {
    width: 92.64%;
  }
}
@media screen and (max-width: 767px) {
  .secIndexOptionCtaLast {
    width: 252px;
  }
}
@media screen and (max-width: 767px) and (max-width: 1299px) {
  .secIndexOptionCtaLast {
    width: 92.64%;
  }
}

.h3IndexOptionCtaLast {
  font-size: 18px;
  line-height: normal;
  letter-spacing: 0.05em;
  text-indent: -0.05em;
}
@media screen and (max-width: 1299px) {
  .h3IndexOptionCtaLast {
    font-size: 1.3856812933vw;
  }
}
@media screen and (max-width: 767px) {
  .h3IndexOptionCtaLast {
    line-height: 1;
    letter-spacing: 0.05em;
    text-indent: -0.05em;
  }
}
@media screen and (max-width: 767px) and (max-width: 767px) {
  .h3IndexOptionCtaLast {
    font-size: 4.8vw;
  }
}

.txtIndexOptionCtaLast {
  font-size: 12px;
  line-height: normal;
  letter-spacing: 0em;
  text-indent: 0em;
  margin-top: 0px;
  margin-bottom: 0px;
  margin-left: auto;
  margin-right: auto;
}
@media screen and (max-width: 1299px) {
  .txtIndexOptionCtaLast {
    font-size: 0.9237875289vw;
  }
}
@media screen and (max-width: 1299px) {
  .txtIndexOptionCtaLast {
    margin-top: 0%;
    margin-bottom: 0%;
    margin-left: auto;
    margin-right: auto;
  }
}
@media screen and (max-width: 767px) {
  .txtIndexOptionCtaLast {
    margin-top: 0px;
    margin-bottom: 0px;
    margin-left: auto;
    margin-right: auto;
    line-height: normal;
    letter-spacing: 0em;
    text-indent: 0em;
  }
}
@media screen and (max-width: 767px) and (max-width: 1299px) {
  .txtIndexOptionCtaLast {
    margin-top: 0%;
    margin-bottom: 0%;
    margin-left: auto;
    margin-right: auto;
  }
}
@media screen and (max-width: 767px) and (max-width: 767px) {
  .txtIndexOptionCtaLast {
    font-size: 3.2vw;
  }
}

/* ==========================================================================
use＆nameSpace
========================================================================== */
/* ==========================================================================
use＆nameSpace
========================================================================== */
/* ==========================================================================
LAYOUT
========================================================================== */
.indexFlow {
  padding-top: 100px;
  padding-bottom: 4px;
  padding-left: 0px;
  padding-right: 0px;
}
@media screen and (max-width: 1299px) {
  .indexFlow {
    padding: 5.2% 0% 0.2% 0%;
  }
}
@media screen and (max-width: 767px) {
  .indexFlow {
    padding: 23.66% 0% 1.06% 0%;
  }
}

@media screen and (max-width: 767px) {
  .indexFlowWap {
    width: 340px;
    margin: auto;
  }
}
@media screen and (max-width: 767px) and (max-width: 1299px) {
  .indexFlowWap {
    width: 90.66%;
  }
}

.h2TitleIndexFlow {
  font-size: 36px;
  line-height: 1;
  letter-spacing: 0.1em;
  text-indent: -0.1em;
}
@media screen and (max-width: 1299px) {
  .h2TitleIndexFlow {
    font-size: 2.7713625866vw;
  }
}
.h2TitleIndexFlow::before {
  display: block;
  width: 0;
  height: 0;
  margin-top: calc((1 - 1) * 0.5em);
  content: "";
}
.h2TitleIndexFlow::after {
  display: block;
  width: 0;
  height: 0;
  margin-bottom: calc((1 - 1) * 0.5em);
  content: "";
}
@media screen and (max-width: 767px) {
  .h2TitleIndexFlow {
    line-height: 1;
    letter-spacing: 0.1em;
    text-indent: -0.1em;
  }
}
@media screen and (max-width: 767px) and (max-width: 767px) {
  .h2TitleIndexFlow {
    font-size: 6.6666666667vw;
  }
}
@media screen and (max-width: 767px) {
  .h2TitleIndexFlow::before {
    display: block;
    width: 0;
    height: 0;
    margin-top: calc((1 - 1) * 0.5em);
    content: "";
  }
  .h2TitleIndexFlow::after {
    display: block;
    width: 0;
    height: 0;
    margin-bottom: calc((1 - 1) * 0.5em);
    content: "";
  }
}

.txtTitleIndexFlow {
  font-size: 16px;
  line-height: normal;
  letter-spacing: 0.1em;
  text-indent: -0.1em;
  margin-top: 0px;
  margin-bottom: 0px;
  margin-left: 16px;
  margin-right: 0px;
}
@media screen and (max-width: 1299px) {
  .txtTitleIndexFlow {
    font-size: 1.2317167052vw;
  }
}
@media screen and (max-width: 1299px) {
  .txtTitleIndexFlow {
    margin: 0% 0% 0% 1.23%;
  }
}
@media screen and (max-width: 767px) {
  .txtTitleIndexFlow {
    line-height: normal;
    letter-spacing: 0.1em;
    text-indent: -0.1em;
    margin-top: 0px;
    margin-bottom: 0px;
    margin-left: 11px;
    margin-right: 0px;
  }
}
@media screen and (max-width: 767px) and (max-width: 767px) {
  .txtTitleIndexFlow {
    font-size: 3.7333333333vw;
  }
}
@media screen and (max-width: 767px) and (max-width: 1299px) {
  .txtTitleIndexFlow {
    margin: 0% 0% 0% 3.23%;
  }
}

.h3TitleIndexFlowTop {
  margin-top: 27px;
  margin-bottom: 0px;
  margin-left: 0px;
  margin-right: 0px;
  font-size: 32px;
  line-height: normal;
  letter-spacing: 0.1em;
  text-indent: -0.1em;
}
@media screen and (max-width: 1299px) {
  .h3TitleIndexFlowTop {
    margin: 2.07% 0% 0% 0%;
  }
}
@media screen and (max-width: 1299px) {
  .h3TitleIndexFlowTop {
    font-size: 2.4634334103vw;
  }
}
@media screen and (max-width: 767px) {
  .h3TitleIndexFlowTop {
    line-height: normal;
    letter-spacing: 0.1em;
    text-indent: -0.1em;
    margin: 3.2% 0% 0% 0%;
  }
}
@media screen and (max-width: 767px) and (max-width: 767px) {
  .h3TitleIndexFlowTop {
    font-size: 5.3333333333vw;
  }
}

.ulIndexFlow {
  margin-top: 41px;
  margin-bottom: 0px;
  margin-left: 0px;
  margin-right: 0px;
}
@media screen and (max-width: 1299px) {
  .ulIndexFlow {
    margin: 3.15% 0% 0% 0%;
  }
}
@media screen and (max-width: 767px) {
  .ulIndexFlow {
    margin-top: 31px;
    margin-bottom: 0px;
    margin-left: 0px;
    margin-right: 0px;
  }
}
@media screen and (max-width: 767px) and (max-width: 1299px) {
  .ulIndexFlow {
    margin: 9.11% 0% 0% 0%;
  }
}

.liIndexFlow {
  width: 415px;
  border-radius: 20px;
  /* CSS3草案 */
  -webkit-border-radius: 20px;
  /* Safari,Google Chrome用 */
  -moz-border-radius: 20px;
  /* Firefox用 */
  padding-top: 23px;
  padding-bottom: 25px;
  padding-left: 0px;
  padding-right: 0px;
  position: relative;
  background: #fff;
}
@media screen and (max-width: 1299px) {
  .liIndexFlow {
    width: 31.92%;
  }
}
@media screen and (max-width: 1299px) {
  .liIndexFlow {
    padding: 1.76% 0% 1.92% 0%;
  }
}
@media screen and (max-width: 767px) {
  .liIndexFlow {
    width: 340px;
    border-radius: 20px;
    /* CSS3草案 */
    -webkit-border-radius: 20px;
    /* Safari,Google Chrome用 */
    -moz-border-radius: 20px;
    /* Firefox用 */
    padding: 5.88% 0% 8.05% 0%;
  }
}
@media screen and (max-width: 767px) and (max-width: 1299px) {
  .liIndexFlow {
    width: 100%;
  }
}
@media screen and (max-width: 767px) {
  .liIndexFlow:nth-child(n+2) {
    margin: 5% 0% 0% 0%;
  }
}

.iconIndexFlow {
  width: 60px;
  position: absolute;
  left: -2.6506024096%;
  top: -4.6428571429%;
}
@media screen and (max-width: 1299px) {
  .iconIndexFlow {
    width: 14.45%;
  }
}
@media screen and (max-width: 767px) {
  .iconIndexFlow {
    width: 48px;
    position: absolute;
    left: -2.6470588235%;
    top: -4.347826087%;
  }
}
@media screen and (max-width: 767px) and (max-width: 1299px) {
  .iconIndexFlow {
    width: 14.11%;
  }
}

.secIndexFlow {
  width: 361px;
  margin: auto;
}
@media screen and (max-width: 1299px) {
  .secIndexFlow {
    width: 86.98%;
  }
}
@media screen and (max-width: 767px) {
  .secIndexFlow {
    width: 301px;
  }
}
@media screen and (max-width: 767px) and (max-width: 1299px) {
  .secIndexFlow {
    width: 88.52%;
  }
}

.h3IndexFlow {
  font-size: 22px;
  line-height: normal;
  letter-spacing: 0em;
  text-indent: 0em;
}
@media screen and (max-width: 1299px) {
  .h3IndexFlow {
    font-size: 1.6936104696vw;
  }
}
@media screen and (max-width: 767px) {
  .h3IndexFlow {
    line-height: normal;
    letter-spacing: 0em;
    text-indent: 0em;
  }
}
@media screen and (max-width: 767px) and (max-width: 767px) {
  .h3IndexFlow {
    font-size: 4.2666666667vw;
  }
}

.picIndexFlow {
  margin-top: 1px;
  margin-bottom: 0px;
  margin-left: 0px;
  margin-right: 0px;
}
@media screen and (max-width: 1299px) {
  .picIndexFlow {
    margin: 0.27% 0% 0% 0%;
  }
}
@media screen and (max-width: 767px) {
  .picIndexFlow {
    width: 301px;
    margin-top: 1px;
    margin-bottom: 0px;
    margin-left: auto;
    margin-right: auto;
  }
}
@media screen and (max-width: 767px) and (max-width: 1299px) {
  .picIndexFlow {
    width: 100%;
  }
}
@media screen and (max-width: 767px) and (max-width: 1299px) {
  .picIndexFlow {
    margin-top: 0.33%;
    margin-bottom: 0%;
    margin-left: auto;
    margin-right: auto;
  }
}

.txtIndexFlow {
  margin-top: 14px;
  margin-bottom: 0px;
  margin-left: 0px;
  margin-right: 0px;
  font-size: 14px;
  line-height: 1.7142857143;
  letter-spacing: 0em;
  text-indent: 0em;
}
@media screen and (max-width: 1299px) {
  .txtIndexFlow {
    margin: 3.87% 0% 0% 0%;
  }
}
@media screen and (max-width: 1299px) {
  .txtIndexFlow {
    font-size: 1.077752117vw;
  }
}
.txtIndexFlow::before {
  display: block;
  width: 0;
  height: 0;
  margin-top: calc((1 - 1.7142857143) * 0.5em);
  content: "";
}
.txtIndexFlow::after {
  display: block;
  width: 0;
  height: 0;
  margin-bottom: calc((1 - 1.7142857143) * 0.5em);
  content: "";
}
@media screen and (max-width: 767px) {
  .txtIndexFlow {
    line-height: 1.6666666667;
    letter-spacing: 0em;
    text-indent: 0em;
    margin-top: 2.5%;
    margin-bottom: 0%;
    margin-left: auto;
    margin-right: auto;
  }
}
@media screen and (max-width: 767px) and (max-width: 767px) {
  .txtIndexFlow {
    font-size: 3.2vw;
  }
}
@media screen and (max-width: 767px) {
  .txtIndexFlow::before {
    display: block;
    width: 0;
    height: 0;
    margin-top: calc((1 - 1.6666666667) * 0.5em);
    content: "";
  }
  .txtIndexFlow::after {
    display: block;
    width: 0;
    height: 0;
    margin-bottom: calc((1 - 1.6666666667) * 0.5em);
    content: "";
  }
}

.txtIndexFlow02 {
  margin-top: 16px;
  margin-bottom: 0px;
  margin-left: 0px;
  margin-right: 0px;
  font-size: 12px;
  line-height: normal;
  letter-spacing: 0em;
  text-indent: 0em;
}
@media screen and (max-width: 1299px) {
  .txtIndexFlow02 {
    margin: 1.23% 0% 0% 0%;
  }
}
@media screen and (max-width: 1299px) {
  .txtIndexFlow02 {
    font-size: 0.9237875289vw;
  }
}
@media screen and (max-width: 767px) {
  .txtIndexFlow02 {
    margin: 2% 0% 0% 0%;
    line-height: normal;
    letter-spacing: 0em;
    text-indent: 0em;
  }
}
@media screen and (max-width: 767px) and (max-width: 767px) {
  .txtIndexFlow02 {
    font-size: 3.2vw;
  }
}

/* ==========================================================================
use＆nameSpace
========================================================================== */
/* ==========================================================================
use＆nameSpace
========================================================================== */
/* ==========================================================================
LAYOUT
========================================================================== */
.indexFlowBnr {
  position: relative;
  padding-top: 67px;
  padding-bottom: 127px;
  padding-left: 0px;
  padding-right: 0px;
}
@media screen and (max-width: 1299px) {
  .indexFlowBnr {
    padding: 3.48% 0% 6.61% 0%;
  }
}
@media screen and (max-width: 767px) {
  .indexFlowBnr {
    padding: 3.46% 0% 24% 0%;
  }
}

.indexFlowBnrLxn {
  width: 877px;
  margin: auto;
  cursor: pointer;
}
@media screen and (max-width: 1299px) {
  .indexFlowBnrLxn {
    width: 67.46%;
  }
}
@media screen and (max-width: 767px) {
  .indexFlowBnrLxn {
    width: 340px;
  }
}
@media screen and (max-width: 767px) and (max-width: 1299px) {
  .indexFlowBnrLxn {
    width: 90.66%;
  }
}

.lastDroneIndex {
  position: absolute;
  width: 320px;
  left: 1.09375%;
  bottom: -35.6741573034%;
  animation: lastDroneIndex 2s infinite;
}
@media screen and (max-width: 1299px) {
  .lastDroneIndex {
    width: 24.61%;
  }
}
@media screen and (max-width: 767px) {
  .lastDroneIndex {
    left: 1.09375%;
    bottom: -35.6741573034%;
    width: 95px;
  }
}
@media screen and (max-width: 767px) and (max-width: 1299px) {
  .lastDroneIndex {
    width: 25.33%;
  }
}

@keyframes lastDroneIndex {
  0% {
    transform: translateY(0px);
  }
  50% {
    transform: translateY(-30px);
  }
  100% {
    transform: translateY(0px);
  }
}
/* ==========================================================================
use＆nameSpace
========================================================================== */
/* ==========================================================================
use＆nameSpace
========================================================================== */
/* ==========================================================================
LAYOUT
========================================================================== */
.indexMerit {
  padding: 9.2708333333vw 0vw 11.8229166667vw 0vw;
  background: url(../img/index/bgIndexMeritPc.png) no-repeat center center;
  background-size: 100% 100%;
}
@media screen and (max-width: 767px) {
  .indexMerit {
    padding: 34.5vw 0vw 30.5vw 0vw;
    background: url(../img/index/bgIndexMeritSp.png) no-repeat center center;
    background-size: 100% auto;
  }
}

.h2IndexMerit {
  font-size: 2.34375vw;
  line-height: normal;
  letter-spacing: 0.1em;
  text-indent: -0.1em;
}
@media screen and (max-width: 767px) {
  .h2IndexMerit {
    line-height: normal;
    letter-spacing: 0.1em;
    text-indent: -0.1em;
  }
}
@media screen and (max-width: 767px) and (max-width: 767px) {
  .h2IndexMerit {
    font-size: 6.4vw;
  }
}

.txtIndexMerit {
  margin-top: 2.2916666667vw;
  margin-bottom: 0vw;
  margin-left: auto;
  margin-right: auto;
  font-size: 0.7291666667vw;
  line-height: 2;
  letter-spacing: 0.05em;
  text-indent: -0.05em;
}
.txtIndexMerit::before {
  display: block;
  width: 0;
  height: 0;
  margin-top: calc((1 - 2) * 0.5em);
  content: "";
}
.txtIndexMerit::after {
  display: block;
  width: 0;
  height: 0;
  margin-bottom: calc((1 - 2) * 0.5em);
  content: "";
}
@media screen and (max-width: 767px) {
  .txtIndexMerit {
    margin-top: 10.533333vw;
    margin-bottom: 0vw;
    margin-left: auto;
    margin-right: auto;
    line-height: 1.8333333333;
    letter-spacing: 0em;
    text-indent: 0em;
    width: 88%;
  }
}
@media screen and (max-width: 767px) and (max-width: 767px) {
  .txtIndexMerit {
    font-size: 3.2vw;
  }
}
@media screen and (max-width: 767px) {
  .txtIndexMerit::before {
    display: block;
    width: 0;
    height: 0;
    margin-top: calc((1 - 1.8333333333) * 0.5em);
    content: "";
  }
  .txtIndexMerit::after {
    display: block;
    width: 0;
    height: 0;
    margin-bottom: calc((1 - 1.8333333333) * 0.5em);
    content: "";
  }
}

.picIndexMerit {
  width: 38.3333333333vw;
  margin-top: 1.3541666667vw;
  margin-bottom: 0vw;
  margin-left: auto;
  margin-right: auto;
}
.picIndexMerit img {
  max-width: 736px;
}
@media screen and (max-width: 767px) {
  .picIndexMerit {
    width: 279px;
    margin-top: 8vw;
    margin-bottom: 0vw;
    margin-left: auto;
    margin-right: auto;
  }
}
@media screen and (max-width: 767px) and (max-width: 1299px) {
  .picIndexMerit {
    width: 74.4%;
  }
}

/* ==========================================================================
use＆nameSpace
========================================================================== */
/* ==========================================================================
use＆nameSpace
========================================================================== */
/* ==========================================================================
LAYOUT
========================================================================== */
.indexFaq {
  padding-top: 74px;
  padding-bottom: 0px;
  padding-left: 0px;
  padding-right: 0px;
}
@media screen and (max-width: 1299px) {
  .indexFaq {
    padding: 3.85% 0% 0% 0%;
  }
}
@media screen and (max-width: 767px) {
  .indexFaq {
    padding-top: 44px;
    padding-bottom: 0px;
    padding-left: 0px;
    padding-right: 0px;
  }
}
@media screen and (max-width: 767px) and (max-width: 1299px) {
  .indexFaq {
    padding: 11.73% 0% 0% 0%;
  }
}

.h2IndexFaq {
  font-size: 32px;
  line-height: normal;
  letter-spacing: 0.1em;
  text-indent: -0.1em;
}
@media screen and (max-width: 1299px) {
  .h2IndexFaq {
    font-size: 2.4634334103vw;
  }
}
@media screen and (max-width: 767px) {
  .h2IndexFaq {
    line-height: normal;
    letter-spacing: 0.05em;
    text-indent: -0.05em;
  }
}
@media screen and (max-width: 767px) and (max-width: 767px) {
  .h2IndexFaq {
    font-size: 4.8vw;
  }
}

.rubyIndexFaq {
  margin-top: 17px;
  margin-bottom: 0px;
  margin-left: auto;
  margin-right: auto;
  font-size: 14px;
  line-height: normal;
  letter-spacing: 0em;
  text-indent: 0em;
}
@media screen and (max-width: 1299px) {
  .rubyIndexFaq {
    margin-top: 1.3%;
    margin-bottom: 0%;
    margin-left: auto;
    margin-right: auto;
  }
}
@media screen and (max-width: 1299px) {
  .rubyIndexFaq {
    font-size: 1.077752117vw;
  }
}
@media screen and (max-width: 767px) {
  .rubyIndexFaq {
    margin-top: 15px;
    margin-bottom: 0px;
    margin-left: auto;
    margin-right: auto;
    line-height: normal;
    letter-spacing: 0.05em;
    text-indent: -0.05em;
  }
}
@media screen and (max-width: 767px) and (max-width: 1299px) {
  .rubyIndexFaq {
    margin-top: 4%;
    margin-bottom: 0%;
    margin-left: auto;
    margin-right: auto;
  }
}
@media screen and (max-width: 767px) and (max-width: 767px) {
  .rubyIndexFaq {
    font-size: 3.2vw;
  }
}

.ulIndexFaq {
  margin-top: 30px;
  margin-bottom: 0px;
  margin-left: auto;
  margin-right: auto;
}
@media screen and (max-width: 1299px) {
  .ulIndexFaq {
    margin-top: 2.3%;
    margin-bottom: 0%;
    margin-left: auto;
    margin-right: auto;
  }
}
@media screen and (max-width: 767px) {
  .ulIndexFaq {
    margin-top: 18px;
    margin-bottom: 0px;
    margin-left: auto;
    margin-right: auto;
    width: 340px;
  }
}
@media screen and (max-width: 767px) and (max-width: 1299px) {
  .ulIndexFaq {
    margin-top: 4.8%;
    margin-bottom: 0%;
    margin-left: auto;
    margin-right: auto;
  }
}
@media screen and (max-width: 767px) and (max-width: 1299px) {
  .ulIndexFaq {
    width: 90.66%;
  }
}

.liIndexFaq {
  background: #fff;
}
.liIndexFaq:nth-child(n+2) {
  margin-top: 5px;
  margin-bottom: 0px;
  margin-left: 0px;
  margin-right: 0px;
}
@media screen and (max-width: 1299px) {
  .liIndexFaq:nth-child(n+2) {
    margin: 0.38% 0% 0% 0%;
  }
}
@media screen and (max-width: 767px) {
  .liIndexFaq:nth-child(n+2) {
    margin: 1.8% 0% 0% 0%;
  }
}

.btnLiIndexFaq {
  padding-top: 28px;
  padding-bottom: 28px;
  padding-left: 25px;
  padding-right: 21px;
  cursor: pointer;
}
@media screen and (max-width: 1299px) {
  .btnLiIndexFaq {
    padding: 2.15% 1.61% 2.15% 1.92%;
  }
}
@media screen and (max-width: 767px) {
  .btnLiIndexFaq {
    align-items: center;
    padding: 4.52% 3.23% 3.82% 3.23%;
  }
}

.h3LiIndexFaq {
  font-size: 16px;
  line-height: normal;
  letter-spacing: 0em;
  text-indent: 0em;
  width: 1220px;
}
@media screen and (max-width: 1299px) {
  .h3LiIndexFaq {
    font-size: 1.2317167052vw;
  }
}
@media screen and (max-width: 1299px) {
  .h3LiIndexFaq {
    width: 97.28%;
  }
}
@media screen and (max-width: 767px) {
  .h3LiIndexFaq {
    line-height: 1.5;
    letter-spacing: 0.05em;
    text-indent: -0.05em;
    width: 289px;
  }
}
@media screen and (max-width: 767px) and (max-width: 767px) {
  .h3LiIndexFaq {
    font-size: 3.2vw;
  }
}
@media screen and (max-width: 767px) {
  .h3LiIndexFaq::before {
    display: block;
    width: 0;
    height: 0;
    margin-top: calc((1 - 1.5) * 0.5em);
    content: "";
  }
  .h3LiIndexFaq::after {
    display: block;
    width: 0;
    height: 0;
    margin-bottom: calc((1 - 1.5) * 0.5em);
    content: "";
  }
}
@media screen and (max-width: 767px) and (max-width: 1299px) {
  .h3LiIndexFaq {
    width: 90.88%;
  }
}

.iconBtnLiIndexFaq {
  width: 18px;
  transition-duration: 0.5s;
  display: flex;
  align-items: center;
}
@media screen and (max-width: 1299px) {
  .iconBtnLiIndexFaq {
    width: 1.43%;
  }
}
@media screen and (max-width: 767px) {
  .iconBtnLiIndexFaq {
    width: 11px;
  }
}
@media screen and (max-width: 767px) and (max-width: 1299px) {
  .iconBtnLiIndexFaq {
    width: 3.45%;
  }
}
.iconBtnLiIndexFaq svg {
  width: 100%;
  height: auto;
  display: block;
}

.btnLiIndexFaq.off .iconBtnLiIndexFaq {
  transform: rotate(0deg);
}

.btnLiIndexFaq.on .iconBtnLiIndexFaq {
  transform: rotate(180deg);
}

.readMoreLiIndexFaq {
  display: none;
  padding-top: 0px;
  padding-bottom: 25px;
  padding-left: 25px;
  padding-right: 21px;
  margin-top: -5px;
  margin-bottom: 0px;
  margin-left: 0px;
  margin-right: 0px;
}
@media screen and (max-width: 1299px) {
  .readMoreLiIndexFaq {
    padding: 0% 1.61% 1.92% 1.92%;
  }
}
@media screen and (max-width: 1299px) {
  .readMoreLiIndexFaq {
    margin: -0.39% 0% 0% 0%;
  }
}
@media screen and (max-width: 767px) {
  .readMoreLiIndexFaq {
    margin-top: 0px;
    margin-bottom: 0px;
    margin-left: 0px;
    margin-right: 0px;
    padding-top: 0px;
    padding-bottom: 12px;
    padding-left: 11px;
    padding-right: 11px;
  }
}
@media screen and (max-width: 767px) and (max-width: 1299px) {
  .readMoreLiIndexFaq {
    margin: 0% 0% 0% 0%;
  }
}
@media screen and (max-width: 767px) and (max-width: 1299px) {
  .readMoreLiIndexFaq {
    padding: 0% 3.23% 3.52% 3.23%;
  }
}

.mainReadMoreLiIndexFaq {
  width: 1220px;
}
@media screen and (max-width: 1299px) {
  .mainReadMoreLiIndexFaq {
    width: 97.28%;
  }
}
@media screen and (max-width: 767px) {
  .mainReadMoreLiIndexFaq {
    width: 289px;
  }
}
@media screen and (max-width: 767px) and (max-width: 1299px) {
  .mainReadMoreLiIndexFaq {
    width: 90.88%;
  }
}
.mainReadMoreLiIndexFaq p {
  font-size: 16px;
  line-height: normal;
  letter-spacing: 0em;
  text-indent: 0em;
  font-weight: 400;
}
@media screen and (max-width: 1299px) {
  .mainReadMoreLiIndexFaq p {
    font-size: 1.2317167052vw;
  }
}
@media screen and (max-width: 767px) {
  .mainReadMoreLiIndexFaq p {
    line-height: 1.6666666667;
    letter-spacing: 0em;
    text-indent: 0em;
  }
}
@media screen and (max-width: 767px) and (max-width: 767px) {
  .mainReadMoreLiIndexFaq p {
    font-size: 3.2vw;
  }
}
@media screen and (max-width: 767px) {
  .mainReadMoreLiIndexFaq p::before {
    display: block;
    width: 0;
    height: 0;
    margin-top: calc((1 - 1.6666666667) * 0.5em);
    content: "";
  }
  .mainReadMoreLiIndexFaq p::after {
    display: block;
    width: 0;
    height: 0;
    margin-bottom: calc((1 - 1.6666666667) * 0.5em);
    content: "";
  }
}

.moreFaq {
  margin-top: 19px;
  margin-bottom: 0px;
  margin-left: auto;
  margin-right: auto;
  font-size: 14px;
  line-height: normal;
  letter-spacing: 0em;
  text-indent: 0em;
}
@media screen and (max-width: 1299px) {
  .moreFaq {
    margin-top: 1.46%;
    margin-bottom: 0%;
    margin-left: auto;
    margin-right: auto;
  }
}
@media screen and (max-width: 1299px) {
  .moreFaq {
    font-size: 1.077752117vw;
  }
}
@media screen and (max-width: 767px) {
  .moreFaq {
    margin-top: 4.46%;
    margin-bottom: 0%;
    margin-left: auto;
    margin-right: auto;
    width: 340px;
    line-height: 1.6666666667;
    letter-spacing: 0em;
    text-indent: 0em;
  }
}
@media screen and (max-width: 767px) and (max-width: 1299px) {
  .moreFaq {
    width: 90.66%;
  }
}
@media screen and (max-width: 767px) and (max-width: 767px) {
  .moreFaq {
    font-size: 3.2vw;
  }
}
@media screen and (max-width: 767px) {
  .moreFaq::before {
    display: block;
    width: 0;
    height: 0;
    margin-top: calc((1 - 1.6666666667) * 0.5em);
    content: "";
  }
  .moreFaq::after {
    display: block;
    width: 0;
    height: 0;
    margin-bottom: calc((1 - 1.6666666667) * 0.5em);
    content: "";
  }
}

/* ==========================================================================
use＆nameSpace
========================================================================== */
/* ==========================================================================
use＆nameSpace
========================================================================== */
/* ==========================================================================
LAYOUT
========================================================================== */
.indexSytyo {
  padding-top: 32px;
  padding-bottom: 43px;
  padding-left: 0px;
  padding-right: 0px;
}
@media screen and (max-width: 1299px) {
  .indexSytyo {
    padding: 1.66% 0% 2.23% 0%;
  }
}
@media screen and (max-width: 767px) {
  .indexSytyo {
    padding: 16% 0% 7.4% 0%;
  }
}

@media screen and (max-width: 767px) {
  .secIndexSytyo {
    width: 345px;
    margin: auto;
  }
}
@media screen and (max-width: 767px) and (max-width: 1299px) {
  .secIndexSytyo {
    width: 92%;
  }
}

.h2IndexSytyo {
  font-size: 24px;
  line-height: normal;
  letter-spacing: 0.05em;
  text-indent: -0.05em;
  padding-top: 0px;
  padding-bottom: 12px;
  padding-left: 0px;
  padding-right: 0px;
  border-bottom: 1px solid #25272F;
}
@media screen and (max-width: 1299px) {
  .h2IndexSytyo {
    font-size: 1.8475750577vw;
  }
}
@media screen and (max-width: 1299px) {
  .h2IndexSytyo {
    padding: 0% 0% 0.92% 0%;
  }
}
@media screen and (max-width: 767px) {
  .h2IndexSytyo {
    line-height: normal;
    letter-spacing: 0.05em;
    text-indent: -0.05em;
    padding-top: 0px;
    padding-bottom: 8px;
    padding-left: 0px;
    padding-right: 0px;
  }
}
@media screen and (max-width: 767px) and (max-width: 767px) {
  .h2IndexSytyo {
    font-size: 4.8vw;
  }
}
@media screen and (max-width: 767px) and (max-width: 1299px) {
  .h2IndexSytyo {
    padding: 0% 0% 2.31% 0%;
  }
}

.h3IndexSytyo {
  margin-top: 21px;
  margin-bottom: 0px;
  margin-left: auto;
  margin-right: auto;
  font-size: 16px;
  line-height: normal;
  letter-spacing: 0em;
  text-indent: 0em;
}
@media screen and (max-width: 1299px) {
  .h3IndexSytyo {
    margin-top: 1.61%;
    margin-bottom: 0%;
    margin-left: auto;
    margin-right: auto;
  }
}
@media screen and (max-width: 1299px) {
  .h3IndexSytyo {
    font-size: 1.2317167052vw;
  }
}
@media screen and (max-width: 767px) {
  .h3IndexSytyo {
    margin-top: 4%;
    margin-bottom: 0%;
    margin-left: auto;
    margin-right: auto;
    line-height: 1;
    letter-spacing: 0em;
    text-indent: 0em;
  }
}
@media screen and (max-width: 767px) and (max-width: 767px) {
  .h3IndexSytyo {
    font-size: 3.7333333333vw;
  }
}
@media screen and (max-width: 767px) {
  .h3IndexSytyo::before {
    display: block;
    width: 0;
    height: 0;
    margin-top: calc((1 - 1) * 0.5em);
    content: "";
  }
  .h3IndexSytyo::after {
    display: block;
    width: 0;
    height: 0;
    margin-bottom: calc((1 - 1) * 0.5em);
    content: "";
  }
}

.txtIndexSytyo {
  margin-top: 5px;
  margin-bottom: 0px;
  margin-left: auto;
  margin-right: auto;
  font-size: 12px;
  line-height: normal;
  letter-spacing: 0em;
  text-indent: 0em;
}
@media screen and (max-width: 1299px) {
  .txtIndexSytyo {
    margin-top: 0.38%;
    margin-bottom: 0%;
    margin-left: auto;
    margin-right: auto;
  }
}
@media screen and (max-width: 1299px) {
  .txtIndexSytyo {
    font-size: 0.9237875289vw;
  }
}
@media screen and (max-width: 767px) {
  .txtIndexSytyo {
    margin-top: 2.5%;
    margin-bottom: 0%;
    margin-left: auto;
    margin-right: auto;
    line-height: 1.4;
    letter-spacing: 0em;
    text-indent: 0em;
  }
}
@media screen and (max-width: 767px) and (max-width: 767px) {
  .txtIndexSytyo {
    font-size: 2.6666666667vw;
  }
}
@media screen and (max-width: 767px) {
  .txtIndexSytyo::before {
    display: block;
    width: 0;
    height: 0;
    margin-top: calc((1 - 1.4) * 0.5em);
    content: "";
  }
  .txtIndexSytyo::after {
    display: block;
    width: 0;
    height: 0;
    margin-bottom: calc((1 - 1.4) * 0.5em);
    content: "";
  }
}

/* ==========================================================================
use＆nameSpace
========================================================================== */
/* ==========================================================================
use＆nameSpace
========================================================================== */
/* ==========================================================================
LAYOUT
========================================================================== */
.indexBtmCta {
  padding-top: 93px;
  padding-bottom: 88px;
  padding-left: 0px;
  padding-right: 0px;
}
@media screen and (max-width: 1299px) {
  .indexBtmCta {
    padding: 4.84% 0% 4.58% 0%;
  }
}
@media screen and (max-width: 767px) {
  .indexBtmCta {
    padding-top: 47px;
    padding-bottom: 53px;
    padding-left: 0px;
    padding-right: 0px;
  }
}
@media screen and (max-width: 767px) and (max-width: 1299px) {
  .indexBtmCta {
    padding: 12.53% 0% 14.13% 0%;
  }
}

.secIndexBtmCta {
  width: 621px;
  margin: auto;
}
@media screen and (max-width: 1299px) {
  .secIndexBtmCta {
    width: 47.76%;
  }
}
@media screen and (max-width: 767px) {
  .secIndexBtmCta {
    width: 91%;
  }
}

.h2IndexBtmCta {
  font-size: 32px;
  line-height: normal;
  letter-spacing: 0.05em;
  text-indent: -0.05em;
}
@media screen and (max-width: 1299px) {
  .h2IndexBtmCta {
    font-size: 2.4634334103vw;
  }
}
@media screen and (max-width: 767px) {
  .h2IndexBtmCta {
    line-height: normal;
    letter-spacing: 0.05em;
    text-indent: -0.05em;
  }
}
@media screen and (max-width: 767px) and (max-width: 767px) {
  .h2IndexBtmCta {
    font-size: 4.8vw;
  }
}

.h3IndexBtmCta {
  margin-top: 25px;
  margin-bottom: 0px;
  margin-left: auto;
  margin-right: auto;
  font-size: 24px;
  line-height: normal;
  letter-spacing: 0em;
  text-indent: 0em;
  aspect-ratio: 621/55;
}
@media screen and (max-width: 1299px) {
  .h3IndexBtmCta {
    margin-top: 4.02%;
    margin-bottom: 0%;
    margin-left: auto;
    margin-right: auto;
  }
}
@media screen and (max-width: 1299px) {
  .h3IndexBtmCta {
    font-size: 1.8475750577vw;
  }
}
@media screen and (max-width: 767px) {
  .h3IndexBtmCta {
    margin-top: 16px;
    margin-bottom: 0px;
    margin-left: auto;
    margin-right: auto;
    line-height: normal;
    letter-spacing: 0.05em;
    text-indent: -0.05em;
    aspect-ratio: 340/35;
  }
}
@media screen and (max-width: 767px) and (max-width: 1299px) {
  .h3IndexBtmCta {
    margin-top: 4.7%;
    margin-bottom: 0%;
    margin-left: auto;
    margin-right: auto;
  }
}
@media screen and (max-width: 767px) and (max-width: 767px) {
  .h3IndexBtmCta {
    font-size: 4.2666666667vw;
  }
}

.txtIndexBtmCta {
  margin-top: 26px;
  margin-bottom: 0px;
  margin-left: auto;
  margin-right: auto;
  font-size: 14px;
  line-height: 1.7142857143;
  letter-spacing: 0.05em;
  text-indent: -0.05em;
}
@media screen and (max-width: 1299px) {
  .txtIndexBtmCta {
    margin-top: 4.18%;
    margin-bottom: 0%;
    margin-left: auto;
    margin-right: auto;
  }
}
@media screen and (max-width: 1299px) {
  .txtIndexBtmCta {
    font-size: 1.077752117vw;
  }
}
.txtIndexBtmCta::before {
  display: block;
  width: 0;
  height: 0;
  margin-top: calc((1 - 1.7142857143) * 0.5em);
  content: "";
}
.txtIndexBtmCta::after {
  display: block;
  width: 0;
  height: 0;
  margin-bottom: calc((1 - 1.7142857143) * 0.5em);
  content: "";
}
@media screen and (max-width: 767px) {
  .txtIndexBtmCta {
    margin-top: 5.7%;
    margin-bottom: 0%;
    margin-left: auto;
    margin-right: auto;
    line-height: 2;
    letter-spacing: 0em;
    text-indent: 0em;
  }
}
@media screen and (max-width: 767px) and (max-width: 767px) {
  .txtIndexBtmCta {
    font-size: 2.6666666667vw;
  }
}
@media screen and (max-width: 767px) {
  .txtIndexBtmCta::before {
    display: block;
    width: 0;
    height: 0;
    margin-top: calc((1 - 2) * 0.5em);
    content: "";
  }
  .txtIndexBtmCta::after {
    display: block;
    width: 0;
    height: 0;
    margin-bottom: calc((1 - 2) * 0.5em);
    content: "";
  }
}

.ctaNavsIndexBtmCta {
  margin-top: 42px;
  margin-bottom: 0px;
  margin-left: auto;
  margin-right: auto;
  width: 572px;
}
@media screen and (max-width: 1299px) {
  .ctaNavsIndexBtmCta {
    margin-top: 6.76%;
    margin-bottom: 0%;
    margin-left: auto;
    margin-right: auto;
  }
}
@media screen and (max-width: 1299px) {
  .ctaNavsIndexBtmCta {
    width: 92.1%;
  }
}
@media screen and (max-width: 767px) {
  .ctaNavsIndexBtmCta {
    margin-top: 8.47%;
    margin-bottom: 0%;
    margin-left: auto;
    margin-right: auto;
    width: 272px;
  }
}
@media screen and (max-width: 767px) and (max-width: 1299px) {
  .ctaNavsIndexBtmCta {
    width: 80%;
  }
}

.liIndexBtmCta {
  width: 272px;
}
@media screen and (max-width: 1299px) {
  .liIndexBtmCta {
    width: 47.55%;
  }
}
@media screen and (max-width: 767px) {
  .liIndexBtmCta {
    width: 100%;
  }
  .liIndexBtmCta:nth-child(2) {
    margin-top: 13px;
    margin-bottom: 0px;
    margin-left: auto;
    margin-right: auto;
  }
}
@media screen and (max-width: 767px) and (max-width: 1299px) {
  .liIndexBtmCta:nth-child(2) {
    margin-top: 3.82%;
    margin-bottom: 0%;
    margin-left: auto;
    margin-right: auto;
  }
}

.btnIndexBtmCta {
  transition-duration: 0.5s;
  display: block;
}
.btnIndexBtmCta img {
  transition-duration: 0.5s;
}
.btnIndexBtmCta:hover {
  opacity: 1;
}
.btnIndexBtmCta:hover img {
  transform: scale(1.1);
}

/* ==========================================================================
use＆nameSpace
========================================================================== */
/* ==========================================================================
use＆nameSpace
========================================================================== */
/* ==========================================================================
LAYOUT
========================================================================== */
.footer {
  padding-top: 30px;
  padding-bottom: 27px;
  padding-left: 0px;
  padding-right: 0px;
}
@media screen and (max-width: 1299px) {
  .footer {
    padding: 1.56% 0% 1.4% 0%;
  }
}
@media screen and (max-width: 767px) {
  .footer {
    padding-top: 30px;
    padding-bottom: 12px;
    padding-left: 0px;
    padding-right: 0px;
  }
}
@media screen and (max-width: 767px) and (max-width: 1299px) {
  .footer {
    padding: 8% 0% 3.2% 0%;
  }
}

.secFooterLogoTop {
  width: 315px;
}
@media screen and (max-width: 1299px) {
  .secFooterLogoTop {
    width: 24.23%;
  }
}
@media screen and (max-width: 767px) {
  .secFooterLogoTop {
    width: 375px;
  }
}
@media screen and (max-width: 767px) and (max-width: 1299px) {
  .secFooterLogoTop {
    width: 100%;
  }
}

.picFooterLogo {
  width: 212px;
}
@media screen and (max-width: 1299px) {
  .picFooterLogo {
    width: 67.3%;
  }
}
@media screen and (max-width: 767px) {
  .picFooterLogo {
    width: 188px;
    margin: auto;
  }
}
@media screen and (max-width: 767px) and (max-width: 1299px) {
  .picFooterLogo {
    width: 50.13%;
  }
}
.picFooterLogo svg {
  display: block;
  width: 100%;
  height: auto;
}

.secFooterMain {
  margin-top: 24px;
  margin-bottom: 0px;
  margin-left: auto;
  margin-right: auto;
}
@media screen and (max-width: 1299px) {
  .secFooterMain {
    margin-top: 7.61%;
    margin-bottom: 0%;
    margin-left: auto;
    margin-right: auto;
  }
}
@media screen and (max-width: 767px) {
  .secFooterMain {
    width: 311px;
    margin-top: 22px;
    margin-bottom: 0px;
    margin-left: auto;
    margin-right: auto;
  }
}
@media screen and (max-width: 767px) and (max-width: 1299px) {
  .secFooterMain {
    width: 82.93%;
  }
}
@media screen and (max-width: 767px) and (max-width: 1299px) {
  .secFooterMain {
    margin-top: 5.86%;
    margin-bottom: 0%;
    margin-left: auto;
    margin-right: auto;
  }
}

.h2FooterMain {
  font-size: 14px;
  line-height: normal;
  letter-spacing: 0em;
  text-indent: 0em;
}
@media screen and (max-width: 1299px) {
  .h2FooterMain {
    font-size: 1.077752117vw;
  }
}
@media screen and (max-width: 767px) {
  .h2FooterMain {
    margin-top: 0px;
    margin-bottom: 0px;
    margin-left: auto;
    margin-right: auto;
    line-height: normal;
    letter-spacing: 0em;
    text-indent: 0em;
    text-align: center;
  }
}
@media screen and (max-width: 767px) and (max-width: 1299px) {
  .h2FooterMain {
    margin-top: 0%;
    margin-bottom: 0%;
    margin-left: auto;
    margin-right: auto;
  }
}
@media screen and (max-width: 767px) and (max-width: 767px) {
  .h2FooterMain {
    font-size: 3.7333333333vw;
  }
}

.txtFooterMain {
  font-size: 12px;
  line-height: normal;
  letter-spacing: 0em;
  text-indent: 0em;
  margin: 2.5% 0 0 0;
}
@media screen and (max-width: 1299px) {
  .txtFooterMain {
    font-size: 0.9237875289vw;
  }
}
@media screen and (max-width: 767px) {
  .txtFooterMain {
    margin-top: 8px;
    margin-bottom: 0px;
    margin-left: auto;
    margin-right: auto;
    line-height: normal;
    letter-spacing: 0em;
    text-indent: 0em;
  }
}
@media screen and (max-width: 767px) and (max-width: 1299px) {
  .txtFooterMain {
    margin-top: 2.57%;
    margin-bottom: 0%;
    margin-left: auto;
    margin-right: auto;
  }
}
@media screen and (max-width: 767px) and (max-width: 767px) {
  .txtFooterMain {
    font-size: 3.2vw;
  }
}

.snsNavsFooterMain {
  margin-top: 21px;
  margin-bottom: 0px;
  margin-left: auto;
  margin-right: auto;
}
@media screen and (max-width: 1299px) {
  .snsNavsFooterMain {
    margin-top: 6.66%;
    margin-bottom: 0%;
    margin-left: auto;
    margin-right: auto;
  }
}
@media screen and (max-width: 767px) {
  .snsNavsFooterMain {
    margin-top: 27px;
    margin-bottom: 0px;
    margin-left: auto;
    margin-right: auto;
  }
}
@media screen and (max-width: 767px) and (max-width: 1299px) {
  .snsNavsFooterMain {
    margin-top: 8.68%;
    margin-bottom: 0%;
    margin-left: auto;
    margin-right: auto;
  }
}

.ulSnsNavsFooterMain {
  width: 145px;
}
@media screen and (max-width: 1299px) {
  .ulSnsNavsFooterMain {
    width: 46.03%;
  }
}
@media screen and (max-width: 767px) {
  .ulSnsNavsFooterMain {
    width: 169px;
    margin: auto;
  }
}
@media screen and (max-width: 767px) and (max-width: 1299px) {
  .ulSnsNavsFooterMain {
    width: 54.34%;
  }
}

.liSnsNavsFooterMain {
  width: 30px;
}
@media screen and (max-width: 1299px) {
  .liSnsNavsFooterMain {
    width: 20.68%;
  }
}
@media screen and (max-width: 767px) {
  .liSnsNavsFooterMain {
    width: 29px;
  }
}
@media screen and (max-width: 767px) and (max-width: 1299px) {
  .liSnsNavsFooterMain {
    width: 17.15%;
  }
}

.pcFooterLink {
  width: 685px;
  margin-top: 21px;
  margin-bottom: 0px;
  margin-left: auto;
  margin-right: auto;
}
@media screen and (max-width: 1299px) {
  .pcFooterLink {
    width: 52.69%;
  }
}
@media screen and (max-width: 1299px) {
  .pcFooterLink {
    margin-top: 1.61%;
    margin-bottom: 0%;
    margin-left: auto;
    margin-right: auto;
  }
}

.liNavFooter {
  width: 25%;
}
.liNavFooter:nth-child(n+5) {
  margin-top: 24px;
  margin-bottom: 0px;
  margin-left: 0px;
  margin-right: 0px;
}
@media screen and (max-width: 1299px) {
  .liNavFooter:nth-child(n+5) {
    margin: 3.5% 0% 0% 0%;
  }
}

.btnNavFooter {
  font-size: 16px;
  line-height: normal;
  letter-spacing: 0.05em;
  text-indent: -0.05em;
  transition-duration: 0.5s;
  text-decoration: none;
  font-weight: 500;
}
@media screen and (max-width: 1299px) {
  .btnNavFooter {
    font-size: 1.2317167052vw;
  }
}
.btnNavFooter .txtMainTrigerFooterPcCtn {
  color: #666;
  transition-duration: 0.5s;
}
.btnNavFooter .picMainTrigerFooterPcCtn {
  width: 27px;
  margin-top: 0px;
  margin-bottom: 0px;
  margin-left: 16px;
  margin-right: 0px;
  opacity: 0;
}
@media screen and (max-width: 1299px) {
  .btnNavFooter .picMainTrigerFooterPcCtn {
    width: 15.76%;
  }
}
@media screen and (max-width: 1299px) {
  .btnNavFooter .picMainTrigerFooterPcCtn {
    margin: 0% 0% 0% 9.34%;
  }
}

.btnNavFooter:hover {
  opacity: 1;
  color: #DB2E21;
}
.btnNavFooter:hover .txtMainTrigerFooterPcCtn {
  color: #DB2E21;
}
.btnNavFooter:hover .picMainTrigerFooterPcCtn {
  opacity: 1;
  transition-duration: 0.5s;
}

.picMainTrigerFooterPcCtnN {
  width: 15px;
  margin-top: 0px;
  margin-bottom: 0px;
  margin-left: 0px;
  margin-right: 0px;
}
@media screen and (max-width: 1299px) {
  .picMainTrigerFooterPcCtnN {
    width: 8.75%;
  }
}
@media screen and (max-width: 1299px) {
  .picMainTrigerFooterPcCtnN {
    margin: 0% 0% 0% 0%;
  }
}

/* ==========================================================================
use＆nameSpace
========================================================================== */
/* ==========================================================================
use＆nameSpace
========================================================================== */
/* ==========================================================================
LAYOUT
========================================================================== */
.footerCopo {
  margin-top: 30px;
  margin-bottom: 0px;
  margin-left: auto;
  margin-right: auto;
}
@media screen and (max-width: 1299px) {
  .footerCopo {
    margin-top: 1.56%;
    margin-bottom: 0%;
    margin-left: auto;
    margin-right: auto;
  }
}
@media screen and (max-width: 767px) {
  .footerCopo {
    border-top: 1px solid #666;
    width: 375px;
    margin-top: 21px;
    margin-bottom: 0px;
    margin-left: auto;
    margin-right: auto;
  }
}
@media screen and (max-width: 767px) and (max-width: 1299px) {
  .footerCopo {
    width: 100%;
  }
}
@media screen and (max-width: 767px) and (max-width: 1299px) {
  .footerCopo {
    margin-top: 5.6%;
    margin-bottom: 0%;
    margin-left: auto;
    margin-right: auto;
  }
}

.footerCopoWap {
  border-top: 1px solid #666;
  padding-top: 22px;
  padding-bottom: 0px;
  padding-left: 0px;
  padding-right: 0px;
}
@media screen and (max-width: 1299px) {
  .footerCopoWap {
    padding: 1.14% 0% 0% 0%;
  }
}
@media screen and (max-width: 767px) {
  .footerCopoWap {
    border-top: none;
    padding-top: 17px;
    padding-bottom: 0px;
    padding-left: 0px;
    padding-right: 0px;
    width: 89.73%;
    margin: auto;
  }
}
@media screen and (max-width: 767px) and (max-width: 1299px) {
  .footerCopoWap {
    padding: 4.53% 0% 0% 0%;
  }
}

.h3FooterCopo {
  width: 135px;
  font-size: 18px;
  line-height: normal;
  letter-spacing: 0.05em;
  text-indent: -0.05em;
}
@media screen and (max-width: 1299px) {
  .h3FooterCopo {
    width: 10.38%;
  }
}
@media screen and (max-width: 1299px) {
  .h3FooterCopo {
    font-size: 1.3856812933vw;
  }
}
@media screen and (max-width: 767px) {
  .h3FooterCopo {
    width: 329px;
    line-height: normal;
    letter-spacing: 0.05em;
    text-indent: -0.05em;
  }
}
@media screen and (max-width: 767px) and (max-width: 1299px) {
  .h3FooterCopo {
    width: 100%;
  }
}
@media screen and (max-width: 767px) and (max-width: 767px) {
  .h3FooterCopo {
    font-size: 3.7333333333vw;
  }
}

.ulFooterCopo {
  width: 835px;
}
@media screen and (max-width: 1299px) {
  .ulFooterCopo {
    width: 64.23%;
  }
}
@media screen and (max-width: 767px) {
  .ulFooterCopo {
    justify-content: flex-start;
    margin-top: 14px;
    margin-bottom: 0px;
    margin-left: auto;
    margin-right: auto;
    width: 329px;
  }
}
@media screen and (max-width: 767px) and (max-width: 1299px) {
  .ulFooterCopo {
    margin-top: 4.25%;
    margin-bottom: 0%;
    margin-left: auto;
    margin-right: auto;
  }
}
@media screen and (max-width: 767px) and (max-width: 1299px) {
  .ulFooterCopo {
    width: 100%;
  }
}

.liFooterCopo {
  width: 81px;
}
@media screen and (max-width: 1299px) {
  .liFooterCopo {
    width: 9.7%;
  }
}
@media screen and (max-width: 767px) {
  .liFooterCopo {
    width: 70px;
  }
}
@media screen and (max-width: 767px) and (max-width: 1299px) {
  .liFooterCopo {
    width: 21.27%;
  }
}
@media screen and (max-width: 767px) {
  .liFooterCopo:nth-child(n+2) {
    margin-top: 0px;
    margin-bottom: 0px;
    margin-left: 11px;
    margin-right: 0px;
  }
}
@media screen and (max-width: 767px) and (max-width: 1299px) {
  .liFooterCopo:nth-child(n+2) {
    margin: 0% 0% 0% 3.34%;
  }
}
@media screen and (max-width: 767px) {
  .liFooterCopo:nth-child(5) {
    margin-top: 14px;
    margin-bottom: 0px;
    margin-left: 0px;
    margin-right: 0px;
  }
}
@media screen and (max-width: 767px) and (max-width: 1299px) {
  .liFooterCopo:nth-child(5) {
    margin: 4.25% 0% 0% 0%;
  }
}
@media screen and (max-width: 767px) {
  .liFooterCopo:nth-child(n+6) {
    margin-top: 14px;
    margin-bottom: 0px;
    margin-left: 11px;
    margin-right: 0px;
  }
}
@media screen and (max-width: 767px) and (max-width: 1299px) {
  .liFooterCopo:nth-child(n+6) {
    margin: 4.25% 0% 0% 3.34%;
  }
}

.h4FooterCopo {
  font-size: 16px;
  line-height: normal;
  letter-spacing: 0em;
  text-indent: 0em;
}
@media screen and (max-width: 1299px) {
  .h4FooterCopo {
    font-size: 1.2317167052vw;
  }
}
@media screen and (max-width: 767px) {
  .h4FooterCopo {
    line-height: normal;
    letter-spacing: 0em;
    text-indent: 0em;
  }
}
@media screen and (max-width: 767px) and (max-width: 767px) {
  .h4FooterCopo {
    font-size: 3.2vw;
  }
}

.txtFooterCopo {
  margin-top: 0px;
  margin-bottom: 0px;
  margin-left: auto;
  margin-right: auto;
  font-size: 12px;
  line-height: normal;
  letter-spacing: 0em;
  text-indent: 0em;
}
@media screen and (max-width: 1299px) {
  .txtFooterCopo {
    margin-top: 0%;
    margin-bottom: 0%;
    margin-left: auto;
    margin-right: auto;
  }
}
@media screen and (max-width: 1299px) {
  .txtFooterCopo {
    font-size: 0.9237875289vw;
  }
}
@media screen and (max-width: 767px) {
  .txtFooterCopo {
    margin-top: 0px;
    margin-bottom: 0px;
    margin-left: auto;
    margin-right: auto;
    line-height: normal;
    letter-spacing: 0em;
    text-indent: 0em;
  }
}
@media screen and (max-width: 767px) and (max-width: 1299px) {
  .txtFooterCopo {
    margin-top: 0%;
    margin-bottom: 0%;
    margin-left: auto;
    margin-right: auto;
  }
}
@media screen and (max-width: 767px) and (max-width: 767px) {
  .txtFooterCopo {
    font-size: 2.6666666667vw;
  }
}

.logoMikaFtb {
  width: 221px;
}
@media screen and (max-width: 1299px) {
  .logoMikaFtb {
    width: 17%;
  }
}
@media screen and (max-width: 767px) {
  .logoMikaFtb {
    width: 65.26%;
    margin-top: 5.38%;
    margin-bottom: 0%;
    margin-left: auto;
    margin-right: auto;
  }
}

/* ==========================================================================
use＆nameSpace
========================================================================== */
/* ==========================================================================
use＆nameSpace
========================================================================== */
/* ==========================================================================
LAYOUT
========================================================================== */
.footerCopy {
  margin-top: 16px;
  margin-bottom: 0px;
  margin-left: auto;
  margin-right: auto;
  font-size: 10px;
  line-height: normal;
  letter-spacing: 0em;
  text-indent: 0em;
}
@media screen and (max-width: 1299px) {
  .footerCopy {
    margin-top: 0.83%;
    margin-bottom: 0%;
    margin-left: auto;
    margin-right: auto;
  }
}
@media screen and (max-width: 1299px) {
  .footerCopy {
    font-size: 0.7698229407vw;
  }
}
@media screen and (max-width: 767px) {
  .footerCopy {
    margin-top: 4%;
    margin-bottom: 0%;
    margin-left: auto;
    margin-right: auto;
    line-height: normal;
    letter-spacing: 0em;
    text-indent: 0em;
    text-align: center;
    color: #666;
  }
}
@media screen and (max-width: 767px) and (max-width: 767px) {
  .footerCopy {
    font-size: 2.6666666667vw;
  }
}

/* ==========================================================================
use＆nameSpace
========================================================================== */
/* ==========================================================================
use＆nameSpace
========================================================================== */
/* ==========================================================================
LAYOUT
========================================================================== */
.btnToHome {
  display: none;
}

.btnToHome {
  position: fixed;
  bottom: 162px;
  right: 9px;
  z-index: 9;
}
.btnToHome:hover {
  opacity: 1;
}

.alc_aroundfooterFixed {
  width: 212px;
  position: fixed;
  bottom: 0;
  right: 0;
  z-index: 9;
  display: none;
}

.btnFooterFixed {
  width: 100%;
  aspect-ratio: 212/76;
  text-decoration: none;
}
.btnFooterFixed:hover {
  opacity: 1;
}

.h3FooterFixeCnt01Pc {
  font-size: 16px;
  line-height: normal;
  letter-spacing: 0em;
  text-indent: 0em;
}

.iconFooterMail {
  padding: 0 0 0 22px;
  background: url(../img/iconFooterMail.svg) no-repeat left center;
  background-size: auto 60%;
}

.txtFooterFixeCnt01 {
  font-size: 11px;
  margin: 2px 0 0 0;
  line-height: normal;
  letter-spacing: 0em;
  text-indent: 0em;
}

.h3FooterFixeCnt01 {
  font-size: 12px;
  line-height: normal;
  letter-spacing: 0em;
  text-indent: 0em;
}

.telFooterFixeCnt02 {
  font-size: 20px;
  line-height: normal;
  letter-spacing: 0em;
  text-indent: 0em;
  margin: 4px 0 0 0;
}

.iconTelFooterFixeCnt02 {
  padding: 0 0 0 19px;
  background: url(../img/iconFooterFixeCnt02.svg) no-repeat left center;
  background-size: auto 60%;
}

.txtFooterFixeCnt02 {
  margin: 2px 0 0 0;
  font-size: 10px;
  line-height: normal;
  letter-spacing: 0em;
  text-indent: 0em;
}

.spFooterFixed {
  position: sticky;
  bottom: 0;
  left: 0;
  width: 100%;
  z-index: 999999;
  display: none;
}

.spFooterFixedFx {
  width: 100%;
}

.ulSpFooterFixedFx {
  width: 325px;
}
@media screen and (max-width: 1299px) {
  .ulSpFooterFixedFx {
    width: 86.66%;
  }
}

.liSpFooterFixedFx {
  width: 163px;
}
@media screen and (max-width: 1299px) {
  .liSpFooterFixedFx {
    width: 50.15%;
  }
}
.liSpFooterFixedFx:nth-child(2) {
  width: 162px;
}
@media screen and (max-width: 1299px) {
  .liSpFooterFixedFx:nth-child(2) {
    width: 49.84%;
  }
}

.btnliSpFooterFixedFx:hover {
  opacity: 1;
}

.btnToHomeSp {
  width: 50px;
}
@media screen and (max-width: 1299px) {
  .btnToHomeSp {
    width: 13.33%;
  }
}

/* ==========================================================================
use＆nameSpace
========================================================================== */
/* ==========================================================================
use＆nameSpace
========================================================================== */
/* ==========================================================================
LAYOUT
========================================================================== */
.contactFormLxn {
  padding-top: 53px;
  padding-bottom: 94px;
  padding-left: 0px;
  padding-right: 0px;
  margin-top: 58px;
  margin-bottom: 0px;
  margin-left: auto;
  margin-right: auto;
  border-radius: 15px;
  /* CSS3草案 */
  -webkit-border-radius: 15px;
  /* Safari,Google Chrome用 */
  -moz-border-radius: 15px;
  /* Firefox用 */
}
@media screen and (max-width: 1299px) {
  .contactFormLxn {
    padding: 4.07% 0% 7.23% 0%;
  }
}
@media screen and (max-width: 1299px) {
  .contactFormLxn {
    margin-top: 4.46%;
    margin-bottom: 0%;
    margin-left: auto;
    margin-right: auto;
  }
}
@media screen and (max-width: 767px) {
  .contactFormLxn {
    padding: 8.4% 0% 11.46% 0%;
    margin-top: 15px;
    margin-bottom: 0px;
    margin-left: auto;
    margin-right: auto;
    border-radius: 15px;
    /* CSS3草案 */
    -webkit-border-radius: 15px;
    /* Safari,Google Chrome用 */
    -moz-border-radius: 15px;
    /* Firefox用 */
    width: 340px;
  }
}
@media screen and (max-width: 767px) and (max-width: 1299px) {
  .contactFormLxn {
    margin-top: 4%;
    margin-bottom: 0%;
    margin-left: auto;
    margin-right: auto;
  }
}
@media screen and (max-width: 767px) and (max-width: 1299px) {
  .contactFormLxn {
    width: 90.66%;
  }
}

.contactFormMain {
  width: 900px;
  margin: auto;
}
@media screen and (max-width: 1299px) {
  .contactFormMain {
    width: 69.23%;
  }
}
@media screen and (max-width: 767px) {
  .contactFormMain {
    width: 288px;
    margin: auto;
  }
}
@media screen and (max-width: 767px) and (max-width: 1299px) {
  .contactFormMain {
    width: 84.7%;
  }
}

.telConatctBox {
  padding-top: 19px;
  padding-bottom: 16px;
  padding-left: 0px;
  padding-right: 0px;
  width: 656px;
  border: 1px solid #D9D9D9;
  margin: auto;
}
@media screen and (max-width: 1299px) {
  .telConatctBox {
    padding: 2.11% 0% 1.77% 0%;
  }
}
@media screen and (max-width: 1299px) {
  .telConatctBox {
    width: 72.88%;
  }
}
@media screen and (max-width: 767px) {
  .telConatctBox {
    padding: 6% 0% 4% 0%;
    width: 288px;
    margin: auto;
  }
}
@media screen and (max-width: 767px) and (max-width: 1299px) {
  .telConatctBox {
    width: 100%;
  }
}

.telConatctBoxFx {
  width: 491.1px;
  margin: auto;
}
@media screen and (max-width: 1299px) {
  .telConatctBoxFx {
    width: 74.86%;
  }
}
@media screen and (max-width: 767px) {
  .telConatctBoxFx {
    flex-flow: row wrap;
    width: 288px;
  }
}
@media screen and (max-width: 767px) and (max-width: 1299px) {
  .telConatctBoxFx {
    width: 100%;
  }
}

.h2TelConatctBoxFx {
  width: 185px;
  font-size: 16px;
  line-height: 1.25;
  letter-spacing: 0.025em;
  text-indent: -0.025em;
  text-align: center;
}
@media screen and (max-width: 1299px) {
  .h2TelConatctBoxFx {
    width: 37.67%;
  }
}
@media screen and (max-width: 1299px) {
  .h2TelConatctBoxFx {
    font-size: 1.2317167052vw;
  }
}
.h2TelConatctBoxFx::before {
  display: block;
  width: 0;
  height: 0;
  margin-top: calc((1 - 1.25) * 0.5em);
  content: "";
}
.h2TelConatctBoxFx::after {
  display: block;
  width: 0;
  height: 0;
  margin-bottom: calc((1 - 1.25) * 0.5em);
  content: "";
}
@media screen and (max-width: 767px) {
  .h2TelConatctBoxFx {
    width: 288px;
    line-height: 1;
    letter-spacing: 0.025em;
    text-indent: -0.025em;
  }
}
@media screen and (max-width: 767px) and (max-width: 1299px) {
  .h2TelConatctBoxFx {
    width: 100%;
  }
}
@media screen and (max-width: 767px) and (max-width: 767px) {
  .h2TelConatctBoxFx {
    font-size: 3.7333333333vw;
  }
}
@media screen and (max-width: 767px) {
  .h2TelConatctBoxFx::before {
    display: block;
    width: 0;
    height: 0;
    margin-top: calc((1 - 1) * 0.5em);
    content: "";
  }
  .h2TelConatctBoxFx::after {
    display: block;
    width: 0;
    height: 0;
    margin-bottom: calc((1 - 1) * 0.5em);
    content: "";
  }
}

.mainTelConatctBoxFx {
  width: 255px;
}
@media screen and (max-width: 1299px) {
  .mainTelConatctBoxFx {
    width: 51.92%;
  }
}
@media screen and (max-width: 767px) {
  .mainTelConatctBoxFx {
    width: 288px;
    margin-top: 3.73%;
    margin-bottom: 0%;
    margin-left: auto;
    margin-right: auto;
  }
}
@media screen and (max-width: 767px) and (max-width: 1299px) {
  .mainTelConatctBoxFx {
    width: 100%;
  }
}

@media screen and (max-width: 767px) {
  .btnTelConatctBoxFxWap {
    text-align: center;
  }
}

.btnTelConatctBoxFx {
  font-size: 28px;
  line-height: 0.8571428571;
  letter-spacing: 0.1em;
  text-indent: -0.1em;
  padding-top: 0px;
  padding-bottom: 0px;
  padding-left: 26px;
  padding-right: 0px;
  background: url(../img/btnTelConatctBoxFx.svg) no-repeat 0% 90%;
  background-size: auto 80%;
  display: inline-block;
  text-decoration: none;
  color: #585253;
  white-space: nowrap;
}
@media screen and (max-width: 1299px) {
  .btnTelConatctBoxFx {
    font-size: 2.155504234vw;
  }
}
.btnTelConatctBoxFx::before {
  display: block;
  width: 0;
  height: 0;
  margin-top: calc((1 - 0.8571428571) * 0.5em);
  content: "";
}
.btnTelConatctBoxFx::after {
  display: block;
  width: 0;
  height: 0;
  margin-bottom: calc((1 - 0.8571428571) * 0.5em);
  content: "";
}
@media screen and (max-width: 1299px) {
  .btnTelConatctBoxFx {
    padding: 0% 0% 0% 10.15%;
  }
}
@media screen and (max-width: 767px) {
  .btnTelConatctBoxFx {
    line-height: 1;
    letter-spacing: 0.1em;
    text-indent: -0.1em;
    padding: 0% 0% 0% 7.02%;
  }
}
@media screen and (max-width: 767px) and (max-width: 767px) {
  .btnTelConatctBoxFx {
    font-size: 6.4vw;
  }
}
@media screen and (max-width: 767px) {
  .btnTelConatctBoxFx::before {
    display: block;
    width: 0;
    height: 0;
    margin-top: calc((1 - 1) * 0.5em);
    content: "";
  }
  .btnTelConatctBoxFx::after {
    display: block;
    width: 0;
    height: 0;
    margin-bottom: calc((1 - 1) * 0.5em);
    content: "";
  }
}

.txtTelConatctBoxFx {
  margin-top: 6px;
  margin-bottom: 0px;
  margin-left: auto;
  margin-right: auto;
  font-size: 14px;
  line-height: normal;
  letter-spacing: 0em;
  text-indent: 0em;
}
@media screen and (max-width: 1299px) {
  .txtTelConatctBoxFx {
    margin-top: 2.34%;
    margin-bottom: 0%;
    margin-left: auto;
    margin-right: auto;
  }
}
@media screen and (max-width: 1299px) {
  .txtTelConatctBoxFx {
    font-size: 1.077752117vw;
  }
}
@media screen and (max-width: 767px) {
  .txtTelConatctBoxFx {
    width: 288px;
    margin-top: 5px;
    margin-bottom: 0px;
    margin-left: auto;
    margin-right: auto;
    line-height: normal;
    letter-spacing: 0em;
    text-indent: 0em;
    text-align: center;
  }
}
@media screen and (max-width: 767px) and (max-width: 1299px) {
  .txtTelConatctBoxFx {
    width: 100%;
  }
}
@media screen and (max-width: 767px) and (max-width: 1299px) {
  .txtTelConatctBoxFx {
    margin-top: 1.73%;
    margin-bottom: 0%;
    margin-left: auto;
    margin-right: auto;
  }
}
@media screen and (max-width: 767px) and (max-width: 767px) {
  .txtTelConatctBoxFx {
    font-size: 3.2vw;
  }
}

.contactFormMainWap {
  width: 727px;
  margin-top: 33px;
  margin-bottom: 0px;
  margin-left: auto;
  margin-right: auto;
}
@media screen and (max-width: 1299px) {
  .contactFormMainWap {
    width: 80.77%;
  }
}
@media screen and (max-width: 1299px) {
  .contactFormMainWap {
    margin-top: 3.66%;
    margin-bottom: 0%;
    margin-left: auto;
    margin-right: auto;
  }
}
@media screen and (max-width: 767px) {
  .contactFormMainWap {
    width: 288px;
    margin-top: 2.37%;
    margin-bottom: 0%;
    margin-left: auto;
    margin-right: auto;
  }
}
@media screen and (max-width: 767px) and (max-width: 1299px) {
  .contactFormMainWap {
    width: 100%;
  }
}

.txtContactFormMain {
  text-align: right;
  font-size: 14px;
  line-height: normal;
  letter-spacing: 0em;
  text-indent: 0em;
}
@media screen and (max-width: 1299px) {
  .txtContactFormMain {
    font-size: 1.077752117vw;
  }
}
@media screen and (max-width: 767px) {
  .txtContactFormMain {
    line-height: normal;
    letter-spacing: 0em;
    text-indent: 0em;
  }
}
@media screen and (max-width: 767px) and (max-width: 767px) {
  .txtContactFormMain {
    font-size: 3.2vw;
  }
}

.tableContactFormMain {
  margin-top: -7px;
  margin-bottom: 0px;
  margin-left: auto;
  margin-right: auto;
}
@media screen and (max-width: 1299px) {
  .tableContactFormMain {
    margin-top: -0.97%;
    margin-bottom: 0%;
    margin-left: auto;
    margin-right: auto;
  }
}
@media screen and (max-width: 767px) {
  .tableContactFormMain {
    margin-top: 4.22%;
    margin-bottom: 0%;
    margin-left: auto;
    margin-right: auto;
  }
}

.thContactFormMain {
  width: 180px;
  padding-top: 16px;
  padding-bottom: 16px;
  padding-left: 0px;
  padding-right: 0px;
  vertical-align: middle;
  font-size: 16px;
  line-height: normal;
  letter-spacing: 0.1em;
  text-indent: -0.1em;
  text-align: left;
}
@media screen and (max-width: 1299px) {
  .thContactFormMain {
    width: 24.75%;
  }
}
@media screen and (max-width: 1299px) {
  .thContactFormMain {
    padding: 2.2% 0% 2.2% 0%;
  }
}
@media screen and (max-width: 1299px) {
  .thContactFormMain {
    font-size: 1.2317167052vw;
  }
}
@media screen and (max-width: 767px) {
  .thContactFormMain {
    display: block;
    width: 100%;
    padding-top: 0px;
    padding-bottom: 0px;
    padding-left: 0px;
    padding-right: 0px;
    vertical-align: middle;
    line-height: 2.1428571429;
    letter-spacing: 0.1em;
    text-indent: -0.1em;
  }
}
@media screen and (max-width: 767px) and (max-width: 1299px) {
  .thContactFormMain {
    padding: 0% 0% 0% 0%;
  }
}
@media screen and (max-width: 767px) and (max-width: 767px) {
  .thContactFormMain {
    font-size: 3.7333333333vw;
  }
}
@media screen and (max-width: 767px) {
  .thContactFormMain::before {
    display: block;
    width: 0;
    height: 0;
    margin-top: calc((1 - 2.1428571429) * 0.5em);
    content: "";
  }
  .thContactFormMain::after {
    display: block;
    width: 0;
    height: 0;
    margin-bottom: calc((1 - 2.1428571429) * 0.5em);
    content: "";
  }
}

.tdContactFormMain {
  width: 547px;
  padding-top: 15.5px;
  padding-bottom: 16px;
  padding-left: 0px;
  padding-right: 0px;
  font-size: 16px;
  line-height: normal;
  letter-spacing: 0em;
  text-indent: 0em;
}
@media screen and (max-width: 1299px) {
  .tdContactFormMain {
    width: 75.24%;
  }
}
@media screen and (max-width: 1299px) {
  .tdContactFormMain {
    padding: 2.13% 0% 2.2% 0%;
  }
}
@media screen and (max-width: 1299px) {
  .tdContactFormMain {
    font-size: 1.2317167052vw;
  }
}
@media screen and (max-width: 767px) {
  .tdContactFormMain {
    display: block;
    width: 100%;
    padding: 5.7% 0% 5.7% 0%;
    vertical-align: middle;
    line-height: 2.1428571429;
    letter-spacing: 0em;
    text-indent: 0em;
  }
}
@media screen and (max-width: 767px) and (max-width: 767px) {
  .tdContactFormMain {
    font-size: 3.7333333333vw;
  }
}
@media screen and (max-width: 767px) {
  .tdContactFormMain::before {
    display: block;
    width: 0;
    height: 0;
    margin-top: calc((1 - 2.1428571429) * 0.5em);
    content: "";
  }
  .tdContactFormMain::after {
    display: block;
    width: 0;
    height: 0;
    margin-bottom: calc((1 - 2.1428571429) * 0.5em);
    content: "";
  }
}
.tdContactFormMain input {
  font-size: inherit;
}

.radioContactFormMain {
  margin: 1% 0;
}
.radioContactFormMain input {
  width: 20px;
  height: 20px;
  margin: 0 10px 0 0;
}
@media screen and (max-width: 767px) {
  .radioContactFormMain input {
    width: 5.3333333333vw;
    height: 5.3333333333vw;
    margin: 0 10px 0 0;
  }
}
.radioContactFormMain label {
  display: flex;
  align-items: center;
  justify-self: start;
}
.radioContactFormMain .horizontal-item + .horizontal-item {
  margin-top: 0px;
  margin-bottom: 0px;
  margin-left: 35px;
  margin-right: 0px;
}
@media screen and (max-width: 1299px) {
  .radioContactFormMain .horizontal-item + .horizontal-item {
    margin: 0% 0% 0% 6.39%;
  }
}

.inputW100 {
  padding-top: 16px;
  padding-bottom: 16px;
  padding-left: 20px;
  padding-right: 20px;
  background: #F5F5F5;
  aspect-ratio: 547/60;
  border-radius: 6px;
  /* CSS3草案 */
  -webkit-border-radius: 6px;
  /* Safari,Google Chrome用 */
  -moz-border-radius: 6px;
  /* Firefox用 */
  border: 1px solid rgba(0, 0, 0, 0.2);
  width: 100%;
}
@media screen and (max-width: 1299px) {
  .inputW100 {
    padding: 2.92% 3.65% 2.92% 3.65%;
  }
}
@media screen and (max-width: 767px) {
  .inputW100 {
    padding-top: 5px;
    padding-bottom: 5px;
    padding-left: 9px;
    padding-right: 9px;
    background: #F5F5F5;
    aspect-ratio: 288/40;
  }
}
@media screen and (max-width: 767px) and (max-width: 1299px) {
  .inputW100 {
    padding: 1.73% 3.12% 1.73% 3.12%;
  }
}
.inputW100::placeholder {
  color: #B2A9AB;
  font-weight: 500;
}

.textW100 {
  padding-top: 16px;
  padding-bottom: 16px;
  padding-left: 20px;
  padding-right: 20px;
  background: #F5F5F5;
  aspect-ratio: 547/195;
  border-radius: 6px;
  /* CSS3草案 */
  -webkit-border-radius: 6px;
  /* Safari,Google Chrome用 */
  -moz-border-radius: 6px;
  /* Firefox用 */
  border: 1px solid rgba(0, 0, 0, 0.2);
  width: 100%;
}
@media screen and (max-width: 1299px) {
  .textW100 {
    padding: 2.92% 3.65% 2.92% 3.65%;
  }
}
@media screen and (max-width: 767px) {
  .textW100 {
    padding-top: 5px;
    padding-bottom: 5px;
    padding-left: 9px;
    padding-right: 9px;
    background: #F5F5F5;
    aspect-ratio: 288/195;
  }
}
@media screen and (max-width: 767px) and (max-width: 1299px) {
  .textW100 {
    padding: 1.73% 3.12% 1.73% 3.12%;
  }
}
.textW100::placeholder {
  color: #B2A9AB;
  font-weight: 500;
}

.readPrivacyLxn {
  width: 100%;
  margin-top: 21px;
  margin-bottom: 0px;
  margin-left: auto;
  margin-right: auto;
  aspect-ratio: 900/189;
  transform: none !important;
  will-change: auto !important;
  overflow: auto !important;
  padding-top: 20px;
  padding-bottom: 20px;
  padding-left: 0px;
  padding-right: 0px;
  border: 1px solid #989898;
}
@media screen and (max-width: 1299px) {
  .readPrivacyLxn {
    margin-top: 2.33%;
    margin-bottom: 0%;
    margin-left: auto;
    margin-right: auto;
  }
}
@media screen and (max-width: 1299px) {
  .readPrivacyLxn {
    padding: 2.22% 0% 2.22% 0%;
  }
}
@media screen and (max-width: 767px) {
  .readPrivacyLxn {
    margin-top: 8%;
    margin-bottom: 0%;
    margin-left: auto;
    margin-right: auto;
    aspect-ratio: 288/210;
    transform: none !important;
    will-change: auto !important;
    overflow: auto !important;
    padding: 10.3% 0% 7.98% 0%;
  }
}

.readPrivacy {
  width: 850px;
  margin: auto;
}
@media screen and (max-width: 1299px) {
  .readPrivacy {
    width: 94.44%;
  }
}
@media screen and (max-width: 767px) {
  .readPrivacy {
    width: 260px;
  }
}
@media screen and (max-width: 767px) and (max-width: 1299px) {
  .readPrivacy {
    width: 90.27%;
  }
}

.h3ReadPrivacy {
  font-size: 16px;
  line-height: 2.25;
  letter-spacing: 0.1em;
  text-indent: -0.1em;
}
@media screen and (max-width: 1299px) {
  .h3ReadPrivacy {
    font-size: 1.2317167052vw;
  }
}
.h3ReadPrivacy::before {
  display: block;
  width: 0;
  height: 0;
  margin-top: calc((1 - 2.25) * 0.5em);
  content: "";
}
.h3ReadPrivacy::after {
  display: block;
  width: 0;
  height: 0;
  margin-bottom: calc((1 - 2.25) * 0.5em);
  content: "";
}
@media screen and (max-width: 767px) {
  .h3ReadPrivacy {
    line-height: 2.5714285714;
    letter-spacing: 0em;
    text-indent: 0em;
  }
}
@media screen and (max-width: 767px) and (max-width: 767px) {
  .h3ReadPrivacy {
    font-size: 3.7333333333vw;
  }
}
@media screen and (max-width: 767px) {
  .h3ReadPrivacy::before {
    display: block;
    width: 0;
    height: 0;
    margin-top: calc((1 - 2.5714285714) * 0.5em);
    content: "";
  }
  .h3ReadPrivacy::after {
    display: block;
    width: 0;
    height: 0;
    margin-bottom: calc((1 - 2.5714285714) * 0.5em);
    content: "";
  }
}

.txtReadPrivacy {
  margin-top: 14px;
  margin-bottom: 0px;
  margin-left: auto;
  margin-right: auto;
  font-size: 10px;
  line-height: 1.4;
  letter-spacing: 0em;
  text-indent: 0em;
}
@media screen and (max-width: 1299px) {
  .txtReadPrivacy {
    margin-top: 1.55%;
    margin-bottom: 0%;
    margin-left: auto;
    margin-right: auto;
  }
}
@media screen and (max-width: 1299px) {
  .txtReadPrivacy {
    font-size: 0.7698229407vw;
  }
}
@media screen and (max-width: 767px) {
  .txtReadPrivacy {
    margin-top: 9.59%;
    margin-bottom: 0%;
    margin-left: auto;
    margin-right: auto;
    line-height: normal;
    letter-spacing: 0em;
    text-indent: 0em;
  }
}
@media screen and (max-width: 767px) and (max-width: 767px) {
  .txtReadPrivacy {
    font-size: 2.6666666667vw;
  }
}

.btnToConfirmLxn {
  margin-top: 36px;
  margin-bottom: 0px;
  margin-left: auto;
  margin-right: auto;
  width: 272px;
}
@media screen and (max-width: 1299px) {
  .btnToConfirmLxn {
    margin-top: 4%;
    margin-bottom: 0%;
    margin-left: auto;
    margin-right: auto;
  }
}
@media screen and (max-width: 1299px) {
  .btnToConfirmLxn {
    width: 30.22%;
  }
}
@media screen and (max-width: 767px) {
  .btnToConfirmLxn {
    margin-top: 43px;
    margin-bottom: 0px;
    margin-left: auto;
    margin-right: auto;
    width: 272px;
  }
}
@media screen and (max-width: 767px) and (max-width: 1299px) {
  .btnToConfirmLxn {
    margin-top: 14.93%;
    margin-bottom: 0%;
    margin-left: auto;
    margin-right: auto;
  }
}
@media screen and (max-width: 767px) and (max-width: 1299px) {
  .btnToConfirmLxn {
    width: 94.44%;
  }
}
.btnToConfirmLxn input {
  width: 100%;
  border: none;
  aspect-ratio: 272/60;
  background: url(../img/btnToConfirmLxn.svg) no-repeat center center;
  background-size: cover;
  cursor: pointer;
}
.btnToConfirmLxn input:hover {
  opacity: 0.8;
}
.btnToConfirmLxn button {
  width: 100%;
  border: none;
  aspect-ratio: 272/60;
  background: url(../img/btnToConfirmLxn.svg) no-repeat center center;
  background-size: cover;
  cursor: pointer;
}
.btnToConfirmLxn button:hover {
  opacity: 0.8;
}

.mw_wp_form .error {
  font-size: 14px;
  color: #DB2E21;
}
@media screen and (max-width: 1299px) {
  .mw_wp_form .error {
    font-size: 1.077752117vw;
  }
}
@media screen and (max-width: 767px) and (max-width: 767px) {
  .mw_wp_form .error {
    font-size: 3.2vw;
  }
}

/* ==========================================================================
use＆nameSpace
========================================================================== */
/* ==========================================================================
use＆nameSpace
========================================================================== */
/* ==========================================================================
LAYOUT
========================================================================== */
/* ==========================================================================
use＆nameSpace
========================================================================== */
/* ==========================================================================
use＆nameSpace
========================================================================== */
/* ==========================================================================
LAYOUT
========================================================================== */
.contactPageWap {
  margin-top: 55px;
  margin-bottom: 56px;
  margin-left: auto;
  margin-right: auto;
}
@media screen and (max-width: 1299px) {
  .contactPageWap {
    margin-top: 2.86%;
    margin-bottom: 2.91%;
    margin-left: auto;
    margin-right: auto;
  }
}
@media screen and (max-width: 767px) {
  .contactPageWap {
    margin-top: 9.2%;
    margin-bottom: 21.33%;
    margin-left: auto;
    margin-right: auto;
  }
}

.secContactPageLxn {
  width: 1300px;
}
@media screen and (max-width: 1299px) {
  .secContactPageLxn {
    width: 100%;
  }
}
@media screen and (max-width: 767px) {
  .secContactPageLxn {
    width: 89.66%;
    margin: auto;
  }
}

.h1ContactTop {
  font-size: 80px;
  line-height: normal;
  letter-spacing: 0.1em;
}
@media screen and (max-width: 1299px) {
  .h1ContactTop {
    font-size: 6.1585835258vw;
  }
}
@media screen and (max-width: 767px) {
  .h1ContactTop {
    line-height: 1.2;
    letter-spacing: 0.1em;
  }
}
@media screen and (max-width: 767px) and (max-width: 767px) {
  .h1ContactTop {
    font-size: 9.6vw;
  }
}

.h2ContactTop {
  margin-top: 0px;
  margin-bottom: 0px;
  margin-left: auto;
  margin-right: auto;
  font-size: 20px;
  line-height: normal;
  letter-spacing: 0.1em;
}
@media screen and (max-width: 1299px) {
  .h2ContactTop {
    margin-top: 0%;
    margin-bottom: 0%;
    margin-left: auto;
    margin-right: auto;
  }
}
@media screen and (max-width: 1299px) {
  .h2ContactTop {
    font-size: 1.5396458814vw;
  }
}
@media screen and (max-width: 767px) {
  .h2ContactTop {
    margin-top: 0px;
    margin-bottom: 0px;
    margin-left: auto;
    margin-right: auto;
    line-height: normal;
    letter-spacing: 0.1em;
  }
}
@media screen and (max-width: 767px) and (max-width: 1299px) {
  .h2ContactTop {
    margin-top: 0%;
    margin-bottom: 0%;
    margin-left: auto;
    margin-right: auto;
  }
}
@media screen and (max-width: 767px) and (max-width: 767px) {
  .h2ContactTop {
    font-size: 4.2666666667vw;
  }
}

.txtContactTop {
  margin-top: 30px;
  margin-bottom: 0px;
  margin-left: auto;
  margin-right: auto;
  font-size: 14px;
  line-height: 2;
  letter-spacing: 0.25px;
}
@media screen and (max-width: 1299px) {
  .txtContactTop {
    margin-top: 2.3%;
    margin-bottom: 0%;
    margin-left: auto;
    margin-right: auto;
  }
}
@media screen and (max-width: 1299px) {
  .txtContactTop {
    font-size: 1.077752117vw;
  }
}
.txtContactTop::before {
  display: block;
  width: 0;
  height: 0;
  margin-top: calc((1 - 2) * 0.5em);
  content: "";
}
.txtContactTop::after {
  display: block;
  width: 0;
  height: 0;
  margin-bottom: calc((1 - 2) * 0.5em);
  content: "";
}
@media screen and (max-width: 767px) {
  .txtContactTop {
    margin-top: 10.5%;
    margin-bottom: 0%;
    margin-left: auto;
    margin-right: auto;
    line-height: 1.6666666667;
    letter-spacing: 0em;
    text-indent: 0em;
  }
}
@media screen and (max-width: 767px) and (max-width: 767px) {
  .txtContactTop {
    font-size: 3.2vw;
  }
}
@media screen and (max-width: 767px) {
  .txtContactTop::before {
    display: block;
    width: 0;
    height: 0;
    margin-top: calc((1 - 1.6666666667) * 0.5em);
    content: "";
  }
  .txtContactTop::after {
    display: block;
    width: 0;
    height: 0;
    margin-bottom: calc((1 - 1.6666666667) * 0.5em);
    content: "";
  }
}

.secThanksCnt {
  margin-top: 93px;
  margin-bottom: 0px;
  margin-left: auto;
  margin-right: auto;
}
@media screen and (max-width: 1299px) {
  .secThanksCnt {
    margin-top: 7.15%;
    margin-bottom: 0%;
    margin-left: auto;
    margin-right: auto;
  }
}
@media screen and (max-width: 767px) {
  .secThanksCnt {
    width: 340px;
    margin-top: 8%;
    margin-bottom: 0%;
    margin-left: auto;
    margin-right: auto;
  }
}
@media screen and (max-width: 767px) and (max-width: 1299px) {
  .secThanksCnt {
    width: 90.66%;
  }
}

.h3ThanksCnt {
  font-size: 32px;
  line-height: normal;
  letter-spacing: 0.1em;
  text-indent: -0.1em;
}
@media screen and (max-width: 1299px) {
  .h3ThanksCnt {
    font-size: 2.4634334103vw;
  }
}
@media screen and (max-width: 767px) {
  .h3ThanksCnt {
    line-height: normal;
    letter-spacing: 0em;
    text-indent: 0em;
  }
}
@media screen and (max-width: 767px) and (max-width: 767px) {
  .h3ThanksCnt {
    font-size: 5.3333333333vw;
  }
}

.txtThanksCnt {
  width: 800px;
  margin-top: 48px;
  margin-bottom: 0px;
  margin-left: auto;
  margin-right: auto;
  font-size: 16px;
  line-height: 1.75;
  letter-spacing: 0em;
  text-indent: 0em;
  font-weight: 500;
}
@media screen and (max-width: 1299px) {
  .txtThanksCnt {
    width: 61.53%;
  }
}
@media screen and (max-width: 1299px) {
  .txtThanksCnt {
    margin-top: 3.69%;
    margin-bottom: 0%;
    margin-left: auto;
    margin-right: auto;
  }
}
@media screen and (max-width: 1299px) {
  .txtThanksCnt {
    font-size: 1.2317167052vw;
  }
}
.txtThanksCnt::before {
  display: block;
  width: 0;
  height: 0;
  margin-top: calc((1 - 1.75) * 0.5em);
  content: "";
}
.txtThanksCnt::after {
  display: block;
  width: 0;
  height: 0;
  margin-bottom: calc((1 - 1.75) * 0.5em);
  content: "";
}
@media screen and (max-width: 767px) {
  .txtThanksCnt {
    width: 340px;
    margin-top: 11.5%;
    margin-bottom: 0%;
    margin-left: auto;
    margin-right: auto;
    line-height: 1.7142857143;
    letter-spacing: 0em;
    text-indent: 0em;
  }
}
@media screen and (max-width: 767px) and (max-width: 1299px) {
  .txtThanksCnt {
    width: 100%;
  }
}
@media screen and (max-width: 767px) and (max-width: 767px) {
  .txtThanksCnt {
    font-size: 3.7333333333vw;
  }
}
@media screen and (max-width: 767px) {
  .txtThanksCnt::before {
    display: block;
    width: 0;
    height: 0;
    margin-top: calc((1 - 1.7142857143) * 0.5em);
    content: "";
  }
  .txtThanksCnt::after {
    display: block;
    width: 0;
    height: 0;
    margin-bottom: calc((1 - 1.7142857143) * 0.5em);
    content: "";
  }
}

.btnThanksCntLxn {
  width: 185px;
  margin-top: 58px;
  margin-bottom: 0px;
  margin-left: auto;
  margin-right: auto;
}
@media screen and (max-width: 1299px) {
  .btnThanksCntLxn {
    width: 14.23%;
  }
}
@media screen and (max-width: 1299px) {
  .btnThanksCntLxn {
    margin-top: 4.46%;
    margin-bottom: 0%;
    margin-left: auto;
    margin-right: auto;
  }
}
@media screen and (max-width: 767px) {
  .btnThanksCntLxn {
    width: 185px;
    margin-top: 14.35%;
    margin-bottom: 0%;
    margin-left: auto;
    margin-right: auto;
  }
}
@media screen and (max-width: 767px) and (max-width: 1299px) {
  .btnThanksCntLxn {
    width: 54.41%;
  }
}

.btnThanksCnt {
  text-decoration: none;
  aspect-ratio: 185/41;
  font-size: 15px;
  line-height: 1;
  letter-spacing: 0em;
  text-indent: 0em;
  cursor: pointer;
  border-radius: 30px;
  /* CSS3草案 */
  -webkit-border-radius: 30px;
  /* Safari,Google Chrome用 */
  -moz-border-radius: 30px;
  /* Firefox用 */
}
@media screen and (max-width: 1299px) {
  .btnThanksCnt {
    font-size: 1.1547344111vw;
  }
}
.btnThanksCnt::before {
  display: block;
  width: 0;
  height: 0;
  margin-top: calc((1 - 1) * 0.5em);
  content: "";
}
.btnThanksCnt::after {
  display: block;
  width: 0;
  height: 0;
  margin-bottom: calc((1 - 1) * 0.5em);
  content: "";
}
@media screen and (max-width: 767px) {
  .btnThanksCnt {
    line-height: 1;
    letter-spacing: 0em;
    text-indent: 0em;
  }
}
@media screen and (max-width: 767px) and (max-width: 767px) {
  .btnThanksCnt {
    font-size: 4vw;
  }
}
@media screen and (max-width: 767px) {
  .btnThanksCnt::before {
    display: block;
    width: 0;
    height: 0;
    margin-top: calc((1 - 1) * 0.5em);
    content: "";
  }
  .btnThanksCnt::after {
    display: block;
    width: 0;
    height: 0;
    margin-bottom: calc((1 - 1) * 0.5em);
    content: "";
  }
}
.btnThanksCnt:hover {
  opacity: 1;
  transform: scale(1.1);
}

.iconBtnThanksCnt {
  width: 168px;
  display: block;
  text-align: center;
  background: url(../img/iconBtnThanksCnt.svg) no-repeat left center;
  background-size: auto 80%;
}
@media screen and (max-width: 1299px) {
  .iconBtnThanksCnt {
    width: 90.81%;
  }
}

/* ==========================================================================
use＆nameSpace
========================================================================== */
/* ==========================================================================
use＆nameSpace
========================================================================== */
/* ==========================================================================
LAYOUT
========================================================================== */
.blogCatTitle {
  margin-top: 55px;
  margin-bottom: 56px;
  margin-left: auto;
  margin-right: auto;
}
@media screen and (max-width: 1299px) {
  .blogCatTitle {
    margin-top: 2.86%;
    margin-bottom: 2.91%;
    margin-left: auto;
    margin-right: auto;
  }
}
@media screen and (max-width: 767px) {
  .blogCatTitle {
    margin-top: 8%;
    margin-bottom: 9.33%;
    margin-left: auto;
    margin-right: auto;
  }
}

.h2ContactTopblog {
  margin-top: -3px;
  margin-bottom: 0px;
  margin-left: auto;
  margin-right: auto;
  font-size: 16px;
  line-height: normal;
  letter-spacing: 0.1em;
  text-indent: -0.1em;
}
@media screen and (max-width: 1299px) {
  .h2ContactTopblog {
    margin-top: -0.24%;
    margin-bottom: 0%;
    margin-left: auto;
    margin-right: auto;
  }
}
@media screen and (max-width: 1299px) {
  .h2ContactTopblog {
    font-size: 1.2317167052vw;
  }
}
@media screen and (max-width: 767px) {
  .h2ContactTopblog {
    margin-top: 0px;
    margin-bottom: 0px;
    margin-left: auto;
    margin-right: auto;
    line-height: normal;
    letter-spacing: 0.1em;
    text-indent: -0.1em;
  }
}
@media screen and (max-width: 767px) and (max-width: 1299px) {
  .h2ContactTopblog {
    margin-top: 0%;
    margin-bottom: 0%;
    margin-left: auto;
    margin-right: auto;
  }
}
@media screen and (max-width: 767px) and (max-width: 767px) {
  .h2ContactTopblog {
    font-size: 4.2666666667vw;
  }
}

.txtContactTopblog {
  font-size: 14px;
  line-height: 2;
  letter-spacing: 0.25px;
}
@media screen and (max-width: 1299px) {
  .txtContactTopblog {
    font-size: 1.077752117vw;
  }
}
.txtContactTopblog::before {
  display: block;
  width: 0;
  height: 0;
  margin-top: calc((1 - 2) * 0.5em);
  content: "";
}
.txtContactTopblog::after {
  display: block;
  width: 0;
  height: 0;
  margin-bottom: calc((1 - 2) * 0.5em);
  content: "";
}
@media screen and (max-width: 767px) {
  .txtContactTopblog {
    display: block;
    line-height: 1.6666666667;
    letter-spacing: 0.25px;
    margin-top: 11%;
    margin-bottom: 0;
    margin-left: auto;
    margin-right: auto;
  }
}
@media screen and (max-width: 767px) and (max-width: 767px) {
  .txtContactTopblog {
    font-size: 3.2vw;
  }
}
@media screen and (max-width: 767px) {
  .txtContactTopblog::before {
    display: block;
    width: 0;
    height: 0;
    margin-top: calc((1 - 1.6666666667) * 0.5em);
    content: "";
  }
  .txtContactTopblog::after {
    display: block;
    width: 0;
    height: 0;
    margin-bottom: calc((1 - 1.6666666667) * 0.5em);
    content: "";
  }
}

/* ==========================================================================
use＆nameSpace
========================================================================== */
/* ==========================================================================
use＆nameSpace
========================================================================== */
/* ==========================================================================
LAYOUT
========================================================================== */
.blogNav {
  margin-top: 49px;
  margin-bottom: 0px;
  margin-left: auto;
  margin-right: auto;
}
@media screen and (max-width: 1299px) {
  .blogNav {
    margin-top: 2.55%;
    margin-bottom: 0%;
    margin-left: auto;
    margin-right: auto;
  }
}
@media screen and (max-width: 767px) {
  .blogNav {
    margin-top: 10.86%;
    margin-bottom: 0%;
    margin-left: auto;
    margin-right: auto;
  }
}

@media screen and (max-width: 767px) {
  .ulBlogNav {
    width: 340px;
    margin: auto;
  }
}
@media screen and (max-width: 767px) and (max-width: 1299px) {
  .ulBlogNav {
    width: 90.66%;
  }
}

.liBlogNav {
  width: 202px;
}
@media screen and (max-width: 1299px) {
  .liBlogNav {
    width: 15.53%;
  }
}
@media screen and (max-width: 767px) {
  .liBlogNav {
    width: 108px;
    margin-top: 0px;
    margin-bottom: 0px;
    margin-left: 0px;
    margin-right: 0px;
  }
}
@media screen and (max-width: 767px) and (max-width: 1299px) {
  .liBlogNav {
    width: 31.76%;
  }
}
@media screen and (max-width: 767px) and (max-width: 1299px) {
  .liBlogNav {
    margin: 0% 0% 0% 0%;
  }
}
@media screen and (max-width: 767px) {
  .liBlogNav:nth-child(n+4) {
    margin-top: 10px;
    margin-bottom: 0px;
    margin-left: 0px;
    margin-right: 0px;
  }
}
@media screen and (max-width: 767px) and (max-width: 1299px) {
  .liBlogNav:nth-child(n+4) {
    margin: 2.94% 0% 0% 0%;
  }
}
.liBlogNav a {
  width: 100%;
  display: flex;
  justify-content: center;
  align-self: center;
  aspect-ratio: 202/48;
  border-radius: 30px;
  /* CSS3草案 */
  -webkit-border-radius: 30px;
  /* Safari,Google Chrome用 */
  -moz-border-radius: 30px;
  /* Firefox用 */
  font-size: 16px;
  line-height: 1.25;
  letter-spacing: 0.05em;
  text-indent: -0.05em;
  color: #666;
  text-decoration: none;
  background: #fff;
  border: 1px solid #666;
}
@media screen and (max-width: 1299px) {
  .liBlogNav a {
    font-size: 1.2317167052vw;
  }
}
.liBlogNav a::before {
  display: block;
  width: 0;
  height: 0;
  margin-top: calc((1 - 1.25) * 0.5em);
  content: "";
}
.liBlogNav a::after {
  display: block;
  width: 0;
  height: 0;
  margin-bottom: calc((1 - 1.25) * 0.5em);
  content: "";
}
@media screen and (max-width: 767px) {
  .liBlogNav a {
    aspect-ratio: 108/35;
    border-radius: 20px;
    /* CSS3草案 */
    -webkit-border-radius: 20px;
    /* Safari,Google Chrome用 */
    -moz-border-radius: 20px;
    /* Firefox用 */
    line-height: 1;
    letter-spacing: 0.05em;
    text-indent: -0.05em;
    text-align: center;
  }
}
@media screen and (max-width: 767px) and (max-width: 767px) {
  .liBlogNav a {
    font-size: 3.2vw;
  }
}
@media screen and (max-width: 767px) {
  .liBlogNav a::before {
    display: block;
    width: 0;
    height: 0;
    margin-top: calc((1 - 1) * 0.5em);
    content: "";
  }
  .liBlogNav a::after {
    display: block;
    width: 0;
    height: 0;
    margin-bottom: calc((1 - 1) * 0.5em);
    content: "";
  }
}
.liBlogNav a.active {
  background: #DB2E21;
  color: #fff;
  border: 1px solid #DB2E21;
}

/* ==========================================================================
use＆nameSpace
========================================================================== */
/* ==========================================================================
use＆nameSpace
========================================================================== */
/* ==========================================================================
LAYOUT
========================================================================== */
.blogLoopPager {
  margin-top: 65px;
  margin-bottom: 0px;
  margin-left: auto;
  margin-right: auto;
}
@media screen and (max-width: 1299px) {
  .blogLoopPager {
    margin-top: 3.38%;
    margin-bottom: 0%;
    margin-left: auto;
    margin-right: auto;
  }
}
@media screen and (max-width: 767px) {
  .blogLoopPager {
    margin-top: 32px;
    margin-bottom: 0px;
    margin-left: auto;
    margin-right: auto;
  }
}
@media screen and (max-width: 767px) and (max-width: 1299px) {
  .blogLoopPager {
    margin-top: 8.53%;
    margin-bottom: 0%;
    margin-left: auto;
    margin-right: auto;
  }
}

@media screen and (max-width: 767px) {
  .ulBlogLoopPager {
    width: 340px;
    margin: auto;
  }
}
@media screen and (max-width: 767px) and (max-width: 1299px) {
  .ulBlogLoopPager {
    width: 90.66%;
  }
}

.liBlogLoopPager {
  width: 308px;
  margin-top: 0px;
  margin-bottom: 14px;
  margin-left: 0px;
  margin-right: 22px;
}
@media screen and (max-width: 1299px) {
  .liBlogLoopPager {
    width: 23.69%;
  }
}
@media screen and (max-width: 1299px) {
  .liBlogLoopPager {
    margin: 0% 1.69% 1.07% 0%;
  }
}
@media screen and (max-width: 767px) {
  .liBlogLoopPager {
    width: 340px;
    margin-top: 0px;
    margin-bottom: 0px;
    margin-left: 0px;
    margin-right: 0px;
  }
}
@media screen and (max-width: 767px) and (max-width: 1299px) {
  .liBlogLoopPager {
    width: 100%;
  }
}
@media screen and (max-width: 767px) and (max-width: 1299px) {
  .liBlogLoopPager {
    margin: 0% 0% 0% 0%;
  }
}
.liBlogLoopPager:nth-child(4n+0) {
  margin-top: 0px;
  margin-bottom: 14px;
  margin-left: 0px;
  margin-right: 0px;
}
@media screen and (max-width: 1299px) {
  .liBlogLoopPager:nth-child(4n+0) {
    margin: 0% 0% 1.07% 0%;
  }
}
@media screen and (max-width: 767px) {
  .liBlogLoopPager:nth-child(4n+0) {
    margin-top: 0px;
    margin-bottom: 0px;
    margin-left: 0px;
    margin-right: 0px;
  }
}
@media screen and (max-width: 767px) and (max-width: 1299px) {
  .liBlogLoopPager:nth-child(4n+0) {
    margin: 0% 0% 0% 0%;
  }
}
@media screen and (max-width: 767px) {
  .liBlogLoopPager:nth-child(n+2) {
    margin-top: 20px;
    margin-bottom: 0px;
    margin-left: 0px;
    margin-right: 0px;
  }
}
@media screen and (max-width: 767px) and (max-width: 1299px) {
  .liBlogLoopPager:nth-child(n+2) {
    margin: 5.88% 0% 0% 0%;
  }
}

.btnBlogLoopPager {
  text-decoration: none;
}
@media screen and (max-width: 767px) {
  .btnBlogLoopPager {
    display: flex;
    justify-content: space-between;
  }
}

.logoBlogLoopPager {
  aspect-ratio: 308/173;
  position: relative;
  border-radius: 6px;
  /* CSS3草案 */
  -webkit-border-radius: 6px;
  /* Safari,Google Chrome用 */
  -moz-border-radius: 6px;
  /* Firefox用 */
  overflow: hidden;
}
@media screen and (max-width: 767px) {
  .logoBlogLoopPager {
    aspect-ratio: 180/101;
    width: 180px;
    margin-top: 0px;
    margin-bottom: 0px;
    margin-left: 0px;
    margin-right: 0px;
  }
}
@media screen and (max-width: 767px) and (max-width: 1299px) {
  .logoBlogLoopPager {
    width: 52.94%;
  }
}
@media screen and (max-width: 767px) and (max-width: 1299px) {
  .logoBlogLoopPager {
    margin: 0% 0% 0% 0%;
  }
}
.logoBlogLoopPager img {
  position: absolute;
  width: 100%;
  height: 100%;
  top: 0;
  right: 0;
  left: 0;
  bottom: 0;
  margin: auto;
  object-fit: cover;
}

@media screen and (max-width: 767px) {
  .secBlogLoopPage {
    width: 150px;
  }
}
@media screen and (max-width: 767px) and (max-width: 1299px) {
  .secBlogLoopPage {
    width: 44.11%;
  }
}

.h3BlogLoopPager {
  margin-top: 10px;
  margin-bottom: 0px;
  margin-left: auto;
  margin-right: auto;
  font-size: 14px;
  line-height: normal;
  letter-spacing: 0em;
  text-indent: 0em;
}
@media screen and (max-width: 1299px) {
  .h3BlogLoopPager {
    margin-top: 3.24%;
    margin-bottom: 0%;
    margin-left: auto;
    margin-right: auto;
  }
}
@media screen and (max-width: 1299px) {
  .h3BlogLoopPager {
    font-size: 1.077752117vw;
  }
}
@media screen and (max-width: 767px) {
  .h3BlogLoopPager {
    margin-top: 0px;
    margin-bottom: 0px;
    margin-left: auto;
    margin-right: auto;
    line-height: normal;
    letter-spacing: 0em;
    text-indent: 0em;
  }
}
@media screen and (max-width: 767px) and (max-width: 1299px) {
  .h3BlogLoopPager {
    margin-top: 0%;
    margin-bottom: 0%;
    margin-left: auto;
    margin-right: auto;
  }
}
@media screen and (max-width: 767px) and (max-width: 767px) {
  .h3BlogLoopPager {
    font-size: 3.2vw;
  }
}

.timeCatBlogLoopPager {
  margin-top: 7px;
  margin-bottom: 0px;
  margin-left: auto;
  margin-right: auto;
}
@media screen and (max-width: 1299px) {
  .timeCatBlogLoopPager {
    margin-top: 2.27%;
    margin-bottom: 0%;
    margin-left: auto;
    margin-right: auto;
  }
}
@media screen and (max-width: 767px) {
  .timeCatBlogLoopPager {
    margin-top: 3.5%;
    margin-bottom: 0%;
    margin-left: auto;
    margin-right: auto;
  }
}

.timeBlogLoopPager {
  margin: 0vw 0.2083333333vw 0.2vw 0vw;
  padding: 0.0520833333vw 0vw 0.0520833333vw 0vw;
  font-size: 10px;
  line-height: normal;
  letter-spacing: 0em;
  text-indent: 0em;
}
@media screen and (max-width: 1299px) {
  .timeBlogLoopPager {
    font-size: 0.7698229407vw;
  }
}
@media screen and (max-width: 767px) {
  .timeBlogLoopPager {
    margin: 0 1.8vw 1vw 0;
    padding: 0.2666666667vw 0vw 0.2666666667vw 0vw;
    line-height: 1;
    letter-spacing: 0.05em;
    text-indent: -0.05em;
  }
}
@media screen and (max-width: 767px) and (max-width: 767px) {
  .timeBlogLoopPager {
    font-size: 2.6666666667vw;
  }
}

.timeCatBlogLoopPager .iconIndexBlogNew {
  margin: 0vw 0.2vw 0.3645833333vw 0vw;
  padding: 0.0520833333vw 0.2083333333vw 0.0520833333vw 0.2083333333vw;
  font-size: 10px;
  line-height: 1;
  letter-spacing: 0em;
  text-indent: 0em;
  display: flex;
  align-items: center;
  justify-content: center;
}
@media screen and (max-width: 1299px) {
  .timeCatBlogLoopPager .iconIndexBlogNew {
    font-size: 0.7698229407vw;
  }
}
@media screen and (max-width: 767px) {
  .timeCatBlogLoopPager .iconIndexBlogNew {
    margin: 0 0.2vw 1vw 0;
    padding: 0.5vw 1.2vw;
    line-height: 1;
    letter-spacing: 0em;
    text-indent: 0em;
  }
}
@media screen and (max-width: 767px) and (max-width: 767px) {
  .timeCatBlogLoopPager .iconIndexBlogNew {
    font-size: 2.6666666667vw;
  }
}

.timeCatBlogLoopPager .iconBlogLoopPager {
  font-size: 10px;
  line-height: 1;
  letter-spacing: 0em;
  text-indent: 0em;
  background: #DB2E21;
  margin: 0vw 0.3645833333vw 0.3645833333vw 0vw;
  padding: 0.0520833333vw 0.2083333333vw 0.0520833333vw 0.2083333333vw;
  display: flex;
  align-items: center;
  justify-content: center;
}
@media screen and (max-width: 1299px) {
  .timeCatBlogLoopPager .iconBlogLoopPager {
    font-size: 0.7698229407vw;
  }
}
@media screen and (max-width: 767px) {
  .timeCatBlogLoopPager .iconBlogLoopPager {
    margin: 0 0.2vw 1vw 0;
    padding: 0.5vw 1.2vw;
    line-height: 1;
    letter-spacing: 0em;
    text-indent: 0em;
  }
}
@media screen and (max-width: 767px) and (max-width: 767px) {
  .timeCatBlogLoopPager .iconBlogLoopPager {
    font-size: 2.6666666667vw;
  }
}

/* ==========================================================================
use＆nameSpace
========================================================================== */
/* ==========================================================================
use＆nameSpace
========================================================================== */
/* ==========================================================================
LAYOUT
========================================================================== */
.mainSingleBlog {
  margin-top: 77px;
  margin-bottom: 80px;
  margin-left: auto;
  margin-right: auto;
}
@media screen and (max-width: 1299px) {
  .mainSingleBlog {
    margin-top: 4.01%;
    margin-bottom: 4.16%;
    margin-left: auto;
    margin-right: auto;
  }
}
@media screen and (max-width: 767px) {
  .mainSingleBlog {
    margin-top: 39px;
    margin-bottom: 80px;
    margin-left: auto;
    margin-right: auto;
  }
}
@media screen and (max-width: 767px) and (max-width: 1299px) {
  .mainSingleBlog {
    margin-top: 10.4%;
    margin-bottom: 21.33%;
    margin-left: auto;
    margin-right: auto;
  }
}

.cntMainSingleBlog {
  width: 914px;
}
@media screen and (max-width: 1299px) {
  .cntMainSingleBlog {
    width: 70.3%;
  }
}
@media screen and (max-width: 767px) {
  .cntMainSingleBlog {
    width: 100%;
  }
}

.cntMainSingleBlogTop {
  padding-top: 53px;
  padding-bottom: 33px;
  padding-left: 0px;
  padding-right: 0px;
  border-radius: 15px;
  /* CSS3草案 */
  -webkit-border-radius: 15px;
  /* Safari,Google Chrome用 */
  -moz-border-radius: 15px;
  /* Firefox用 */
}
@media screen and (max-width: 1299px) {
  .cntMainSingleBlogTop {
    padding: 5.79% 0% 3.61% 0%;
  }
}
@media screen and (max-width: 767px) {
  .cntMainSingleBlogTop {
    padding-top: 39px;
    padding-bottom: 35px;
    padding-left: 0px;
    padding-right: 0px;
  }
}
@media screen and (max-width: 767px) and (max-width: 1299px) {
  .cntMainSingleBlogTop {
    padding: 10.4% 0% 9.33% 0%;
  }
}

.innerMainSingleBlogTop {
  width: 718px;
  margin: auto;
}
@media screen and (max-width: 1299px) {
  .innerMainSingleBlogTop {
    width: 78.55%;
  }
}
@media screen and (max-width: 767px) {
  .innerMainSingleBlogTop {
    width: 88.55%;
  }
}

.h1MainSingleBlogTop {
  font-size: 24px;
  line-height: normal;
  letter-spacing: 0em;
  text-indent: 0em;
}
@media screen and (max-width: 1299px) {
  .h1MainSingleBlogTop {
    font-size: 1.8475750577vw;
  }
}
@media screen and (max-width: 767px) {
  .h1MainSingleBlogTop {
    line-height: normal;
    letter-spacing: 0.05em;
    text-indent: -0.05em;
  }
}
@media screen and (max-width: 767px) and (max-width: 767px) {
  .h1MainSingleBlogTop {
    font-size: 4.8vw;
  }
}

.timeMainSingleBlogTopWap {
  margin-top: 12px;
  margin-bottom: 0px;
  margin-left: auto;
  margin-right: auto;
}
@media screen and (max-width: 1299px) {
  .timeMainSingleBlogTopWap {
    margin-top: 1.67%;
    margin-bottom: 0%;
    margin-left: auto;
    margin-right: auto;
  }
}
@media screen and (max-width: 767px) {
  .timeMainSingleBlogTopWap {
    margin-top: 2.9%;
    margin-bottom: 0%;
    margin-left: auto;
    margin-right: auto;
    width: 100%;
  }
}

.timeMainSingleBlogTop {
  font-size: 14px;
  line-height: 1;
  letter-spacing: 0.1em;
  text-indent: -0.1em;
  margin: 0vw 0vw 0.2083333333vw 0vw;
}
@media screen and (max-width: 1299px) {
  .timeMainSingleBlogTop {
    font-size: 1.077752117vw;
  }
}
@media screen and (max-width: 767px) {
  .timeMainSingleBlogTop {
    line-height: 1;
    letter-spacing: 0.1em;
    text-indent: -0.1em;
  }
}
@media screen and (max-width: 767px) and (max-width: 767px) {
  .timeMainSingleBlogTop {
    font-size: 3.7333333333vw;
  }
}

.timeMainSingleBlogTopWap .iconIndexBlogNew {
  font-size: 12px;
  line-height: 1;
  letter-spacing: 0em;
  text-indent: 0em;
  margin: 0vw 0vw 0.2083333333vw 0.28vw;
  padding: 0.04vw 0.2vw;
  display: flex;
  align-items: center;
  justify-content: center;
}
@media screen and (max-width: 1299px) {
  .timeMainSingleBlogTopWap .iconIndexBlogNew {
    font-size: 0.9237875289vw;
  }
}
@media screen and (max-width: 767px) {
  .timeMainSingleBlogTopWap .iconIndexBlogNew {
    margin: 0vw 1.0666666667vw 1.0666666667vw 1.0666666667vw;
    padding: 0.5333333333vw 1.0666666667vw 0.5333333333vw 1.0666666667vw;
    line-height: 1;
    letter-spacing: 0em;
    text-indent: 0em;
  }
}
@media screen and (max-width: 767px) and (max-width: 767px) {
  .timeMainSingleBlogTopWap .iconIndexBlogNew {
    font-size: 3.2vw;
  }
}

.iconMainSingleBlogTop {
  margin: 0vw 0.2vw 0.2083333333vw;
  padding: 0.04vw 0.2vw;
  font-size: 12px;
  line-height: 1;
  letter-spacing: 0em;
  text-indent: 0em;
  display: flex;
  align-items: center;
  justify-content: center;
}
@media screen and (max-width: 1299px) {
  .iconMainSingleBlogTop {
    font-size: 0.9237875289vw;
  }
}
@media screen and (max-width: 767px) {
  .iconMainSingleBlogTop {
    margin: 0vw 1.0666666667vw 1.0666666667vw 0vw;
    padding: 0.5333333333vw 1.0666666667vw 0.5333333333vw 1.0666666667vw;
    line-height: 1;
    letter-spacing: 0em;
    text-indent: 0em;
  }
}
@media screen and (max-width: 767px) and (max-width: 767px) {
  .iconMainSingleBlogTop {
    font-size: 3.2vw;
  }
}

.tagsSingleBlog {
  margin-top: 12px;
  margin-bottom: 0px;
  margin-left: 0px;
  margin-right: 0px;
}
@media screen and (max-width: 1299px) {
  .tagsSingleBlog {
    margin: 1.67% 0% 0% 0%;
  }
}
@media screen and (max-width: 767px) {
  .tagsSingleBlog {
    margin-top: 3%;
    margin-bottom: 0%;
    margin-left: auto;
    margin-right: auto;
  }
}

.liTagsSingleBlog {
  margin: 0vw 0.3645833333vw 0.3645833333vw 0vw;
  padding: 0.1041666667vw 0.6vw;
  border: 1px solid #ACA5A5;
  color: #ACA5A5;
  font-size: 12px;
  line-height: 1.2;
  letter-spacing: 0.05em;
  text-indent: -0.05em;
  border-radius: 30px;
  /* CSS3草案 */
  -webkit-border-radius: 30px;
  /* Safari,Google Chrome用 */
  -moz-border-radius: 30px;
  /* Firefox用 */
  display: flex;
  align-items: center;
  justify-content: center;
  width: fit-content;
}
@media screen and (max-width: 1299px) {
  .liTagsSingleBlog {
    font-size: 0.9237875289vw;
  }
}
@media screen and (max-width: 767px) {
  .liTagsSingleBlog {
    margin: 0vw 1.45vw 1.45vw 0vw;
    padding: 0.2vw 1.3vw;
    line-height: 1.2;
    letter-spacing: 0.05em;
    text-indent: -0.05em;
  }
}
@media screen and (max-width: 767px) and (max-width: 767px) {
  .liTagsSingleBlog {
    font-size: 2.6666666667vw;
  }
}

.mainSingleBlogCntTop {
  margin-top: 7px;
  margin-bottom: 0px;
  margin-left: auto;
  margin-right: auto;
}
@media screen and (max-width: 1299px) {
  .mainSingleBlogCntTop {
    margin-top: 0.97%;
    margin-bottom: 0%;
    margin-left: auto;
    margin-right: auto;
  }
}
@media screen and (max-width: 767px) {
  .mainSingleBlogCntTop {
    margin-top: 2.54%;
    margin-bottom: 0%;
    margin-left: auto;
    margin-right: auto;
  }
}
.mainSingleBlogCntTop img {
  max-width: 100%;
  width: auto;
}
.mainSingleBlogCntTop h1 + img,
.mainSingleBlogCntTop h2 + img,
.mainSingleBlogCntTop h3 + img,
.mainSingleBlogCntTop h4 + img,
.mainSingleBlogCntTop h5 + img,
.mainSingleBlogCntTop p + img,
.mainSingleBlogCntTop ul + img,
.mainSingleBlogCntTop ol + img,
.mainSingleBlogCntTop aside + img {
  margin-top: 45px;
  margin-bottom: 0px;
  margin-left: 0px;
  margin-right: 0px;
}
@media screen and (max-width: 1299px) {
  .mainSingleBlogCntTop h1 + img,
  .mainSingleBlogCntTop h2 + img,
  .mainSingleBlogCntTop h3 + img,
  .mainSingleBlogCntTop h4 + img,
  .mainSingleBlogCntTop h5 + img,
  .mainSingleBlogCntTop p + img,
  .mainSingleBlogCntTop ul + img,
  .mainSingleBlogCntTop ol + img,
  .mainSingleBlogCntTop aside + img {
    margin: 6.26% 0% 0% 0%;
  }
}
@media screen and (max-width: 767px) {
  .mainSingleBlogCntTop h1 + img,
  .mainSingleBlogCntTop h2 + img,
  .mainSingleBlogCntTop h3 + img,
  .mainSingleBlogCntTop h4 + img,
  .mainSingleBlogCntTop h5 + img,
  .mainSingleBlogCntTop p + img,
  .mainSingleBlogCntTop ul + img,
  .mainSingleBlogCntTop ol + img,
  .mainSingleBlogCntTop aside + img {
    margin-top: 11.63%;
  }
}
.mainSingleBlogCntTop h1 {
  font-size: 24px;
  line-height: 1.5833333333;
  letter-spacing: 0em;
  text-indent: 0em;
  font-weight: 500;
}
@media screen and (max-width: 1299px) {
  .mainSingleBlogCntTop h1 {
    font-size: 1.8475750577vw;
  }
}
.mainSingleBlogCntTop h1::before {
  display: block;
  width: 0;
  height: 0;
  margin-top: calc((1 - 1.5833333333) * 0.5em);
  content: "";
}
.mainSingleBlogCntTop h1::after {
  display: block;
  width: 0;
  height: 0;
  margin-bottom: calc((1 - 1.5833333333) * 0.5em);
  content: "";
}
@media screen and (max-width: 767px) and (max-width: 767px) {
  .mainSingleBlogCntTop h1 {
    font-size: 4.2666666667vw;
  }
}
.mainSingleBlogCntTop h1 + h1,
.mainSingleBlogCntTop h2 + h1,
.mainSingleBlogCntTop h3 + h1,
.mainSingleBlogCntTop h4 + h1,
.mainSingleBlogCntTop h5 + h1,
.mainSingleBlogCntTop p + h1,
.mainSingleBlogCntTop ul + h1,
.mainSingleBlogCntTop ol + h1,
.mainSingleBlogCntTop img + h1,
.mainSingleBlogCntTop aside + h1 {
  margin-top: 46px;
  margin-bottom: 0px;
  margin-left: auto;
  margin-right: auto;
}
@media screen and (max-width: 1299px) {
  .mainSingleBlogCntTop h1 + h1,
  .mainSingleBlogCntTop h2 + h1,
  .mainSingleBlogCntTop h3 + h1,
  .mainSingleBlogCntTop h4 + h1,
  .mainSingleBlogCntTop h5 + h1,
  .mainSingleBlogCntTop p + h1,
  .mainSingleBlogCntTop ul + h1,
  .mainSingleBlogCntTop ol + h1,
  .mainSingleBlogCntTop img + h1,
  .mainSingleBlogCntTop aside + h1 {
    margin-top: 5.67%;
    margin-bottom: 0%;
    margin-left: auto;
    margin-right: auto;
  }
}
@media screen and (max-width: 767px) {
  .mainSingleBlogCntTop h1 + h1,
  .mainSingleBlogCntTop h2 + h1,
  .mainSingleBlogCntTop h3 + h1,
  .mainSingleBlogCntTop h4 + h1,
  .mainSingleBlogCntTop h5 + h1,
  .mainSingleBlogCntTop p + h1,
  .mainSingleBlogCntTop ul + h1,
  .mainSingleBlogCntTop ol + h1,
  .mainSingleBlogCntTop img + h1,
  .mainSingleBlogCntTop aside + h1 {
    margin-top: 8.5%;
    margin-bottom: 0%;
    margin-left: auto;
    margin-right: auto;
  }
}
.mainSingleBlogCntTop h2 {
  padding-top: 8.5px;
  padding-bottom: 8.5px;
  padding-left: 15px;
  padding-right: 15px;
  font-size: 18px;
  line-height: 1.2;
  letter-spacing: 0em;
  text-indent: 0em;
  font-weight: 500;
  background: #F2F2F2;
}
@media screen and (max-width: 1299px) {
  .mainSingleBlogCntTop h2 {
    padding: 1.04% 1.85% 1.04% 1.85%;
  }
}
@media screen and (max-width: 1299px) {
  .mainSingleBlogCntTop h2 {
    font-size: 1.3856812933vw;
  }
}
@media screen and (max-width: 767px) {
  .mainSingleBlogCntTop h2 {
    padding: 3.3% 1.85%;
  }
}
@media screen and (max-width: 767px) and (max-width: 767px) {
  .mainSingleBlogCntTop h2 {
    font-size: 3.7333333333vw;
  }
}
.mainSingleBlogCntTop h1 + h2,
.mainSingleBlogCntTop h2 + h2,
.mainSingleBlogCntTop h3 + h2,
.mainSingleBlogCntTop h4 + h2,
.mainSingleBlogCntTop h5 + h2,
.mainSingleBlogCntTop p + h2,
.mainSingleBlogCntTop ul + h2,
.mainSingleBlogCntTop ol + h2,
.mainSingleBlogCntTop img + h2,
.mainSingleBlogCntTop aside + h2 {
  margin-top: 35px;
  margin-bottom: 0px;
  margin-left: auto;
  margin-right: auto;
}
@media screen and (max-width: 1299px) {
  .mainSingleBlogCntTop h1 + h2,
  .mainSingleBlogCntTop h2 + h2,
  .mainSingleBlogCntTop h3 + h2,
  .mainSingleBlogCntTop h4 + h2,
  .mainSingleBlogCntTop h5 + h2,
  .mainSingleBlogCntTop p + h2,
  .mainSingleBlogCntTop ul + h2,
  .mainSingleBlogCntTop ol + h2,
  .mainSingleBlogCntTop img + h2,
  .mainSingleBlogCntTop aside + h2 {
    margin-top: 4.32%;
    margin-bottom: 0%;
    margin-left: auto;
    margin-right: auto;
  }
}
@media screen and (max-width: 767px) {
  .mainSingleBlogCntTop h1 + h2,
  .mainSingleBlogCntTop h2 + h2,
  .mainSingleBlogCntTop h3 + h2,
  .mainSingleBlogCntTop h4 + h2,
  .mainSingleBlogCntTop h5 + h2,
  .mainSingleBlogCntTop p + h2,
  .mainSingleBlogCntTop ul + h2,
  .mainSingleBlogCntTop ol + h2,
  .mainSingleBlogCntTop img + h2,
  .mainSingleBlogCntTop aside + h2 {
    margin-top: 12%;
    margin-bottom: 0%;
    margin-left: auto;
    margin-right: auto;
  }
}
.mainSingleBlogCntTop h3 {
  font-size: 20px;
  line-height: 1.5833333333;
  letter-spacing: 0em;
  text-indent: 0em;
  font-weight: 500;
}
@media screen and (max-width: 1299px) {
  .mainSingleBlogCntTop h3 {
    font-size: 1.5396458814vw;
  }
}
.mainSingleBlogCntTop h3::before {
  display: block;
  width: 0;
  height: 0;
  margin-top: calc((1 - 1.5833333333) * 0.5em);
  content: "";
}
.mainSingleBlogCntTop h3::after {
  display: block;
  width: 0;
  height: 0;
  margin-bottom: calc((1 - 1.5833333333) * 0.5em);
  content: "";
}
@media screen and (max-width: 767px) and (max-width: 767px) {
  .mainSingleBlogCntTop h3 {
    font-size: 3.7333333333vw;
  }
}
.mainSingleBlogCntTop h1 + h3,
.mainSingleBlogCntTop h2 + h3,
.mainSingleBlogCntTop h3 + h3,
.mainSingleBlogCntTop h4 + h3,
.mainSingleBlogCntTop h5 + h3,
.mainSingleBlogCntTop p + h3,
.mainSingleBlogCntTop ul + h3,
.mainSingleBlogCntTop ol + h3,
.mainSingleBlogCntTop img + h3,
.mainSingleBlogCntTop aside + h3 {
  margin-top: 46px;
  margin-bottom: 0px;
  margin-left: auto;
  margin-right: auto;
}
@media screen and (max-width: 1299px) {
  .mainSingleBlogCntTop h1 + h3,
  .mainSingleBlogCntTop h2 + h3,
  .mainSingleBlogCntTop h3 + h3,
  .mainSingleBlogCntTop h4 + h3,
  .mainSingleBlogCntTop h5 + h3,
  .mainSingleBlogCntTop p + h3,
  .mainSingleBlogCntTop ul + h3,
  .mainSingleBlogCntTop ol + h3,
  .mainSingleBlogCntTop img + h3,
  .mainSingleBlogCntTop aside + h3 {
    margin-top: 5.67%;
    margin-bottom: 0%;
    margin-left: auto;
    margin-right: auto;
  }
}
@media screen and (max-width: 767px) {
  .mainSingleBlogCntTop h1 + h3,
  .mainSingleBlogCntTop h2 + h3,
  .mainSingleBlogCntTop h3 + h3,
  .mainSingleBlogCntTop h4 + h3,
  .mainSingleBlogCntTop h5 + h3,
  .mainSingleBlogCntTop p + h3,
  .mainSingleBlogCntTop ul + h3,
  .mainSingleBlogCntTop ol + h3,
  .mainSingleBlogCntTop img + h3,
  .mainSingleBlogCntTop aside + h3 {
    margin-top: 33px;
    margin-bottom: 0px;
    margin-left: auto;
    margin-right: auto;
  }
}
@media screen and (max-width: 767px) and (max-width: 1299px) {
  .mainSingleBlogCntTop h1 + h3,
  .mainSingleBlogCntTop h2 + h3,
  .mainSingleBlogCntTop h3 + h3,
  .mainSingleBlogCntTop h4 + h3,
  .mainSingleBlogCntTop h5 + h3,
  .mainSingleBlogCntTop p + h3,
  .mainSingleBlogCntTop ul + h3,
  .mainSingleBlogCntTop ol + h3,
  .mainSingleBlogCntTop img + h3,
  .mainSingleBlogCntTop aside + h3 {
    margin-top: 10%;
    margin-bottom: 0%;
    margin-left: auto;
    margin-right: auto;
  }
}
.mainSingleBlogCntTop p {
  margin-top: 12px;
  margin-bottom: 0px;
  margin-left: auto;
  margin-right: auto;
  font-size: 16px;
  line-height: 1.6875;
  letter-spacing: 0em;
  text-indent: 0em;
}
@media screen and (max-width: 1299px) {
  .mainSingleBlogCntTop p {
    margin-top: 1.48%;
    margin-bottom: 0%;
    margin-left: auto;
    margin-right: auto;
  }
}
@media screen and (max-width: 1299px) {
  .mainSingleBlogCntTop p {
    font-size: 1.2317167052vw;
  }
}
.mainSingleBlogCntTop p::before {
  display: block;
  width: 0;
  height: 0;
  margin-top: calc((1 - 1.6875) * 0.5em);
  content: "";
}
.mainSingleBlogCntTop p::after {
  display: block;
  width: 0;
  height: 0;
  margin-bottom: calc((1 - 1.6875) * 0.5em);
  content: "";
}
@media screen and (max-width: 767px) {
  .mainSingleBlogCntTop p {
    margin-top: 4.8%;
    margin-bottom: 0%;
    margin-left: auto;
    margin-right: auto;
    line-height: 1.8461538462;
    letter-spacing: 0em;
    text-indent: 0em;
  }
}
@media screen and (max-width: 767px) and (max-width: 767px) {
  .mainSingleBlogCntTop p {
    font-size: 3.4666666667vw;
  }
}
@media screen and (max-width: 767px) {
  .mainSingleBlogCntTop p::before {
    display: block;
    width: 0;
    height: 0;
    margin-top: calc((1 - 1.8461538462) * 0.5em);
    content: "";
  }
  .mainSingleBlogCntTop p::after {
    display: block;
    width: 0;
    height: 0;
    margin-bottom: calc((1 - 1.8461538462) * 0.5em);
    content: "";
  }
}
.mainSingleBlogCntTop h1 + p,
.mainSingleBlogCntTop h2 + p,
.mainSingleBlogCntTop h3 + p,
.mainSingleBlogCntTop h4 + p,
.mainSingleBlogCntTop h5 + p,
.mainSingleBlogCntTop p + p,
.mainSingleBlogCntTop ul + p,
.mainSingleBlogCntTop ol + p,
.mainSingleBlogCntTop img + p,
.mainSingleBlogCntTop aside + p {
  margin-top: 12px;
  margin-bottom: 0px;
  margin-left: auto;
  margin-right: auto;
}
@media screen and (max-width: 1299px) {
  .mainSingleBlogCntTop h1 + p,
  .mainSingleBlogCntTop h2 + p,
  .mainSingleBlogCntTop h3 + p,
  .mainSingleBlogCntTop h4 + p,
  .mainSingleBlogCntTop h5 + p,
  .mainSingleBlogCntTop p + p,
  .mainSingleBlogCntTop ul + p,
  .mainSingleBlogCntTop ol + p,
  .mainSingleBlogCntTop img + p,
  .mainSingleBlogCntTop aside + p {
    margin-top: 1.68%;
    margin-bottom: 0%;
    margin-left: auto;
    margin-right: auto;
  }
}
@media screen and (max-width: 767px) {
  .mainSingleBlogCntTop h1 + p,
  .mainSingleBlogCntTop h2 + p,
  .mainSingleBlogCntTop h3 + p,
  .mainSingleBlogCntTop h4 + p,
  .mainSingleBlogCntTop h5 + p,
  .mainSingleBlogCntTop p + p,
  .mainSingleBlogCntTop ul + p,
  .mainSingleBlogCntTop ol + p,
  .mainSingleBlogCntTop img + p,
  .mainSingleBlogCntTop aside + p {
    margin-top: 8px;
    margin-bottom: 0px;
    margin-left: auto;
    margin-right: auto;
  }
}
@media screen and (max-width: 767px) and (max-width: 1299px) {
  .mainSingleBlogCntTop h1 + p,
  .mainSingleBlogCntTop h2 + p,
  .mainSingleBlogCntTop h3 + p,
  .mainSingleBlogCntTop h4 + p,
  .mainSingleBlogCntTop h5 + p,
  .mainSingleBlogCntTop p + p,
  .mainSingleBlogCntTop ul + p,
  .mainSingleBlogCntTop ol + p,
  .mainSingleBlogCntTop img + p,
  .mainSingleBlogCntTop aside + p {
    margin-top: 2.42%;
    margin-bottom: 0%;
    margin-left: auto;
    margin-right: auto;
  }
}
.mainSingleBlogCntTop ul {
  padding: 0 0 0 3.5%;
}
@media screen and (max-width: 767px) {
  .mainSingleBlogCntTop ul {
    padding: 0 0 0 5%;
  }
}
.mainSingleBlogCntTop ul li {
  margin-top: 6px;
  margin-bottom: 0px;
  margin-left: auto;
  margin-right: auto;
  font-size: 16px;
  line-height: 1.6875;
  letter-spacing: 0em;
  text-indent: 0em;
  list-style: disc;
  list-style-position: outside;
}
@media screen and (max-width: 1299px) {
  .mainSingleBlogCntTop ul li {
    margin-top: 0.84%;
    margin-bottom: 0%;
    margin-left: auto;
    margin-right: auto;
  }
}
@media screen and (max-width: 1299px) {
  .mainSingleBlogCntTop ul li {
    font-size: 1.2317167052vw;
  }
}
.mainSingleBlogCntTop ul li::before {
  display: block;
  width: 0;
  height: 0;
  margin-top: calc((1 - 1.6875) * 0.5em);
  content: "";
}
.mainSingleBlogCntTop ul li::after {
  display: block;
  width: 0;
  height: 0;
  margin-bottom: calc((1 - 1.6875) * 0.5em);
  content: "";
}
@media screen and (max-width: 767px) {
  .mainSingleBlogCntTop ul li {
    margin-top: 1.7%;
    margin-bottom: 0%;
    margin-left: auto;
    margin-right: auto;
    line-height: 1.8461538462;
    letter-spacing: 0em;
    text-indent: 0em;
  }
}
@media screen and (max-width: 767px) and (max-width: 767px) {
  .mainSingleBlogCntTop ul li {
    font-size: 3.4666666667vw;
  }
}
@media screen and (max-width: 767px) {
  .mainSingleBlogCntTop ul li::before {
    display: block;
    width: 0;
    height: 0;
    margin-top: calc((1 - 1.8461538462) * 0.5em);
    content: "";
  }
  .mainSingleBlogCntTop ul li::after {
    display: block;
    width: 0;
    height: 0;
    margin-bottom: calc((1 - 1.8461538462) * 0.5em);
    content: "";
  }
}
.mainSingleBlogCntTop ul li::marker {
  font-size: 10px;
}
@media screen and (max-width: 1299px) {
  .mainSingleBlogCntTop ul li::marker {
    font-size: 0.7698229407vw;
  }
}
.mainSingleBlogCntTop ul li:nth-child(n+2) {
  margin-top: 8px;
  margin-bottom: 0px;
  margin-left: auto;
  margin-right: auto;
}
@media screen and (max-width: 1299px) {
  .mainSingleBlogCntTop ul li:nth-child(n+2) {
    margin-top: 1.12%;
    margin-bottom: 0%;
    margin-left: auto;
    margin-right: auto;
  }
}
@media screen and (max-width: 767px) {
  .mainSingleBlogCntTop ul li:nth-child(n+2) {
    margin-top: 1.42%;
    margin-bottom: 0%;
    margin-left: auto;
    margin-right: auto;
  }
}
.mainSingleBlogCntTop h2 + ul,
.mainSingleBlogCntTop h3 + ul,
.mainSingleBlogCntTop h4 + ul,
.mainSingleBlogCntTop h5 + ul,
.mainSingleBlogCntTop p + ul,
.mainSingleBlogCntTop img + ul {
  margin-top: 8px;
  margin-bottom: 0px;
  margin-left: auto;
  margin-right: auto;
}
@media screen and (max-width: 1299px) {
  .mainSingleBlogCntTop h2 + ul,
  .mainSingleBlogCntTop h3 + ul,
  .mainSingleBlogCntTop h4 + ul,
  .mainSingleBlogCntTop h5 + ul,
  .mainSingleBlogCntTop p + ul,
  .mainSingleBlogCntTop img + ul {
    margin-top: 1.12%;
    margin-bottom: 0%;
    margin-left: auto;
    margin-right: auto;
  }
}
@media screen and (max-width: 767px) {
  .mainSingleBlogCntTop h2 + ul,
  .mainSingleBlogCntTop h3 + ul,
  .mainSingleBlogCntTop h4 + ul,
  .mainSingleBlogCntTop h5 + ul,
  .mainSingleBlogCntTop p + ul,
  .mainSingleBlogCntTop img + ul {
    margin-top: 1.7%;
    margin-bottom: 0%;
    margin-left: auto;
    margin-right: auto;
  }
}
.mainSingleBlogCntTop ol {
  padding: 0 0 0 3.5%;
}
@media screen and (max-width: 767px) {
  .mainSingleBlogCntTop ol {
    padding: 0 0 0 5%;
  }
}
.mainSingleBlogCntTop ol li {
  margin-top: 5px;
  margin-bottom: 0px;
  margin-left: auto;
  margin-right: auto;
  font-size: 16px;
  line-height: 1.6875;
  letter-spacing: 0em;
  text-indent: 0em;
  list-style: auto;
  list-style-position: outside;
}
@media screen and (max-width: 1299px) {
  .mainSingleBlogCntTop ol li {
    margin-top: 0.7%;
    margin-bottom: 0%;
    margin-left: auto;
    margin-right: auto;
  }
}
@media screen and (max-width: 1299px) {
  .mainSingleBlogCntTop ol li {
    font-size: 1.2317167052vw;
  }
}
.mainSingleBlogCntTop ol li::before {
  display: block;
  width: 0;
  height: 0;
  margin-top: calc((1 - 1.6875) * 0.5em);
  content: "";
}
.mainSingleBlogCntTop ol li::after {
  display: block;
  width: 0;
  height: 0;
  margin-bottom: calc((1 - 1.6875) * 0.5em);
  content: "";
}
@media screen and (max-width: 767px) {
  .mainSingleBlogCntTop ol li {
    margin-top: 1.7%;
    margin-bottom: 0%;
    margin-left: auto;
    margin-right: auto;
    line-height: 1.8461538462;
    letter-spacing: 0em;
    text-indent: 0em;
  }
}
@media screen and (max-width: 767px) and (max-width: 767px) {
  .mainSingleBlogCntTop ol li {
    font-size: 3.4666666667vw;
  }
}
@media screen and (max-width: 767px) {
  .mainSingleBlogCntTop ol li::before {
    display: block;
    width: 0;
    height: 0;
    margin-top: calc((1 - 1.8461538462) * 0.5em);
    content: "";
  }
  .mainSingleBlogCntTop ol li::after {
    display: block;
    width: 0;
    height: 0;
    margin-bottom: calc((1 - 1.8461538462) * 0.5em);
    content: "";
  }
}
.mainSingleBlogCntTop ol li:nth-child(n+2) {
  margin-top: 8px;
  margin-bottom: 0px;
  margin-left: auto;
  margin-right: auto;
}
@media screen and (max-width: 1299px) {
  .mainSingleBlogCntTop ol li:nth-child(n+2) {
    margin-top: 1.12%;
    margin-bottom: 0%;
    margin-left: auto;
    margin-right: auto;
  }
}
@media screen and (max-width: 767px) {
  .mainSingleBlogCntTop ol li:nth-child(n+2) {
    margin-top: 1.6%;
    margin-bottom: 0%;
    margin-left: auto;
    margin-right: auto;
  }
}
.mainSingleBlogCntTop h2 + ol,
.mainSingleBlogCntTop h3 + ol,
.mainSingleBlogCntTop h4 + ol,
.mainSingleBlogCntTop h5 + ol,
.mainSingleBlogCntTop p + ol,
.mainSingleBlogCntTop img + ol {
  margin-top: 8px;
  margin-bottom: 0px;
  margin-left: auto;
  margin-right: auto;
}
@media screen and (max-width: 1299px) {
  .mainSingleBlogCntTop h2 + ol,
  .mainSingleBlogCntTop h3 + ol,
  .mainSingleBlogCntTop h4 + ol,
  .mainSingleBlogCntTop h5 + ol,
  .mainSingleBlogCntTop p + ol,
  .mainSingleBlogCntTop img + ol {
    margin-top: 1.12%;
    margin-bottom: 0%;
    margin-left: auto;
    margin-right: auto;
  }
}
@media screen and (max-width: 767px) {
  .mainSingleBlogCntTop h2 + ol,
  .mainSingleBlogCntTop h3 + ol,
  .mainSingleBlogCntTop h4 + ol,
  .mainSingleBlogCntTop h5 + ol,
  .mainSingleBlogCntTop p + ol,
  .mainSingleBlogCntTop img + ol {
    margin-top: 1.7%;
    margin-bottom: 0%;
    margin-left: auto;
    margin-right: auto;
  }
}
.mainSingleBlogCntTop .aligncenter {
  margin-left: auto !important;
  margin-right: auto !important;
}
.mainSingleBlogCntTop .alignleft {
  float: left;
  margin-left: 0 !important;
  margin-right: auto !important;
}
.mainSingleBlogCntTop .alignright {
  margin-left: auto !important;
  margin-right: 0 !important;
}
.mainSingleBlogCntTop .alignnone {
  margin-left: 0 !important;
  margin-right: 0 !important;
}

/*目次*/
#toc_container.toc_white {
  margin-top: 49px;
  margin-bottom: 0px;
  margin-left: auto;
  margin-right: auto;
  padding-top: 21px;
  padding-bottom: 24px;
  padding-left: 0px;
  padding-right: 0px;
  border-radius: 10px;
  /* CSS3草案 */
  -webkit-border-radius: 10px;
  /* Safari,Google Chrome用 */
  -moz-border-radius: 10px;
  /* Firefox用 */
  border: 1px solid #666;
  width: 100%;
}
@media screen and (max-width: 1299px) {
  #toc_container.toc_white {
    margin-top: 6.82%;
    margin-bottom: 0%;
    margin-left: auto;
    margin-right: auto;
  }
}
@media screen and (max-width: 1299px) {
  #toc_container.toc_white {
    padding: 2.92% 0% 3.34% 0%;
  }
}
@media screen and (max-width: 767px) {
  #toc_container.toc_white {
    margin-top: 8.8%;
    margin-bottom: 0%;
    margin-left: auto;
    margin-right: auto;
    padding-top: 16px;
    padding-bottom: 22px;
    padding-left: 0px;
    padding-right: 0px;
    border-radius: 10px;
    /* CSS3草案 */
    -webkit-border-radius: 10px;
    /* Safari,Google Chrome用 */
    -moz-border-radius: 10px;
    /* Firefox用 */
  }
}
@media screen and (max-width: 767px) and (max-width: 1299px) {
  #toc_container.toc_white {
    padding: 4.84% 0% 6.66% 0%;
  }
}

#toc_container p.toc_title {
  padding-top: 0px;
  padding-bottom: 0px;
  padding-left: 29px;
  padding-right: 0px;
  font-size: 20px;
  line-height: 1.9;
  letter-spacing: 0em;
  text-indent: 0em;
  text-align: left;
  background: url(../img/blogSingle/toc_title.svg) no-repeat left 60%;
  background-size: auto 45%;
  color: #25272F;
  font-weight: 500;
  width: 92%;
  margin: auto;
}
@media screen and (max-width: 1299px) {
  #toc_container p.toc_title {
    padding: 0% 0% 0% 4.46%;
  }
}
@media screen and (max-width: 1299px) {
  #toc_container p.toc_title {
    font-size: 1.5396458814vw;
  }
}
#toc_container p.toc_title::before {
  display: block;
  width: 0;
  height: 0;
  margin-top: calc((1 - 1.9) * 0.5em);
  content: "";
}
#toc_container p.toc_title::after {
  display: block;
  width: 0;
  height: 0;
  margin-bottom: calc((1 - 1.9) * 0.5em);
  content: "";
}
@media screen and (max-width: 767px) {
  #toc_container p.toc_title {
    padding: 0% 0% 0% 8%;
    line-height: 2.375;
    letter-spacing: 0em;
    text-indent: 0em;
  }
}
@media screen and (max-width: 767px) and (max-width: 767px) {
  #toc_container p.toc_title {
    font-size: 4.2666666667vw;
  }
}
@media screen and (max-width: 767px) {
  #toc_container p.toc_title::before {
    display: block;
    width: 0;
    height: 0;
    margin-top: calc((1 - 2.375) * 0.5em);
    content: "";
  }
  #toc_container p.toc_title::after {
    display: block;
    width: 0;
    height: 0;
    margin-bottom: calc((1 - 2.375) * 0.5em);
    content: "";
  }
}

#toc_container p.toc_title + ul.toc_list {
  margin-top: 21px;
  margin-bottom: 0px;
  margin-left: auto;
  margin-right: auto;
  width: 91%;
}
@media screen and (max-width: 1299px) {
  #toc_container p.toc_title + ul.toc_list {
    margin-top: 3.23%;
    margin-bottom: 0%;
    margin-left: auto;
    margin-right: auto;
  }
}
@media screen and (max-width: 767px) {
  #toc_container p.toc_title + ul.toc_list {
    margin-top: 13px;
    margin-bottom: 0px;
    margin-left: auto;
    margin-right: auto;
  }
}
@media screen and (max-width: 767px) and (max-width: 1299px) {
  #toc_container p.toc_title + ul.toc_list {
    margin-top: 4.39%;
    margin-bottom: 0%;
    margin-left: auto;
    margin-right: auto;
  }
}

#toc_container p.toc_title + ul.toc_list li {
  font-size: 16px;
  line-height: normal;
  letter-spacing: 0em;
  text-indent: 0em;
  display: flex;
  align-items: flex-start;
  -ms-flex-flow: row wrap;
}
@media screen and (max-width: 1299px) {
  #toc_container p.toc_title + ul.toc_list li {
    font-size: 1.2317167052vw;
  }
}
@media screen and (max-width: 767px) {
  #toc_container p.toc_title + ul.toc_list li {
    line-height: 1.6923076923;
    letter-spacing: 0em;
    text-indent: 0em;
  }
}
@media screen and (max-width: 767px) and (max-width: 767px) {
  #toc_container p.toc_title + ul.toc_list li {
    font-size: 3.4666666667vw;
  }
}
@media screen and (max-width: 767px) {
  #toc_container p.toc_title + ul.toc_list li::before {
    display: block;
    width: 0;
    height: 0;
    margin-top: calc((1 - 1.6923076923) * 0.5em);
    content: "";
  }
  #toc_container p.toc_title + ul.toc_list li::after {
    display: block;
    width: 0;
    height: 0;
    margin-bottom: calc((1 - 1.6923076923) * 0.5em);
    content: "";
  }
}
#toc_container p.toc_title + ul.toc_list li::before {
  content: "－";
  color: #25272F;
  width: 16px;
  aspect-ratio: 1/1;
  margin: 0;
  height: auto;
}
#toc_container p.toc_title + ul.toc_list li:nth-child(n+2) {
  margin-top: 11px;
  margin-bottom: 0px;
  margin-left: auto;
  margin-right: auto;
}
@media screen and (max-width: 1299px) {
  #toc_container p.toc_title + ul.toc_list li:nth-child(n+2) {
    margin-top: 1.69%;
    margin-bottom: 0%;
    margin-left: auto;
    margin-right: auto;
  }
}
@media screen and (max-width: 767px) {
  #toc_container p.toc_title + ul.toc_list li:nth-child(n+2) {
    margin-top: 1.45%;
    margin-bottom: 0%;
    margin-left: auto;
    margin-right: auto;
  }
}

#toc_container .toc_list li a {
  color: #25272F;
  text-decoration: underline;
  font-weight: 500;
}

/*関連記事*/
.asideRelatedArticlesBlog {
  margin-top: 35px;
  margin-bottom: 45px;
  margin-left: auto;
  margin-right: auto;
  border-radius: 10px;
  /* CSS3草案 */
  -webkit-border-radius: 10px;
  /* Safari,Google Chrome用 */
  -moz-border-radius: 10px;
  /* Firefox用 */
  border: 1px solid #AFB8B0;
  padding-top: 22px;
  padding-bottom: 28px;
  padding-left: 0px;
  padding-right: 0px;
}
@media screen and (max-width: 1299px) {
  .asideRelatedArticlesBlog {
    margin-top: 4.87%;
    margin-bottom: 6.26%;
    margin-left: auto;
    margin-right: auto;
  }
}
@media screen and (max-width: 1299px) {
  .asideRelatedArticlesBlog {
    padding: 3.06% 0% 3.89% 0%;
  }
}
@media screen and (max-width: 767px) {
  .asideRelatedArticlesBlog {
    margin-top: 29px;
    margin-bottom: 0px;
    margin-left: auto;
    margin-right: auto;
    padding-top: 15px;
    padding-bottom: 14px;
    padding-left: 0px;
    padding-right: 0px;
  }
}
@media screen and (max-width: 767px) and (max-width: 1299px) {
  .asideRelatedArticlesBlog {
    margin-top: 8.78%;
    margin-bottom: 0%;
    margin-left: auto;
    margin-right: auto;
  }
}
@media screen and (max-width: 767px) and (max-width: 1299px) {
  .asideRelatedArticlesBlog {
    padding: 4.54% 0% 4.24% 0%;
  }
}

.asideRelatedArticlesBlog .h2AsideRelatedArticlesBlog {
  width: 659px;
  margin: auto;
  font-size: 16px;
  line-height: 1.6875;
  letter-spacing: 0em;
  text-indent: 0em;
  background: none !important;
  padding: 0;
}
@media screen and (max-width: 1299px) {
  .asideRelatedArticlesBlog .h2AsideRelatedArticlesBlog {
    width: 91.78%;
  }
}
@media screen and (max-width: 1299px) {
  .asideRelatedArticlesBlog .h2AsideRelatedArticlesBlog {
    font-size: 1.2317167052vw;
  }
}
.asideRelatedArticlesBlog .h2AsideRelatedArticlesBlog::before {
  display: block;
  width: 0;
  height: 0;
  margin-top: calc((1 - 1.6875) * 0.5em);
  content: "";
}
.asideRelatedArticlesBlog .h2AsideRelatedArticlesBlog::after {
  display: block;
  width: 0;
  height: 0;
  margin-bottom: calc((1 - 1.6875) * 0.5em);
  content: "";
}
@media screen and (max-width: 767px) {
  .asideRelatedArticlesBlog .h2AsideRelatedArticlesBlog {
    width: 300px;
    line-height: 2.25;
    letter-spacing: 0em;
    text-indent: 0em;
  }
}
@media screen and (max-width: 767px) and (max-width: 1299px) {
  .asideRelatedArticlesBlog .h2AsideRelatedArticlesBlog {
    width: 90.9%;
  }
}
@media screen and (max-width: 767px) and (max-width: 767px) {
  .asideRelatedArticlesBlog .h2AsideRelatedArticlesBlog {
    font-size: 3.2vw;
  }
}
@media screen and (max-width: 767px) {
  .asideRelatedArticlesBlog .h2AsideRelatedArticlesBlog::before {
    display: block;
    width: 0;
    height: 0;
    margin-top: calc((1 - 2.25) * 0.5em);
    content: "";
  }
  .asideRelatedArticlesBlog .h2AsideRelatedArticlesBlog::after {
    display: block;
    width: 0;
    height: 0;
    margin-bottom: calc((1 - 2.25) * 0.5em);
    content: "";
  }
}

.mainSingleBlogCntTop .ulAsideRelatedArticlesBlog {
  margin-top: 12px;
  margin-bottom: 0px;
  margin-left: auto;
  margin-right: auto;
  padding: 0;
  width: 659px;
}
@media screen and (max-width: 1299px) {
  .mainSingleBlogCntTop .ulAsideRelatedArticlesBlog {
    margin-top: 1.67%;
    margin-bottom: 0%;
    margin-left: auto;
    margin-right: auto;
  }
}
@media screen and (max-width: 1299px) {
  .mainSingleBlogCntTop .ulAsideRelatedArticlesBlog {
    width: 91.78%;
  }
}
@media screen and (max-width: 767px) {
  .mainSingleBlogCntTop .ulAsideRelatedArticlesBlog {
    margin-top: 7px;
    margin-bottom: 0px;
    margin-left: auto;
    margin-right: auto;
    width: 300px;
  }
}
@media screen and (max-width: 767px) and (max-width: 1299px) {
  .mainSingleBlogCntTop .ulAsideRelatedArticlesBlog {
    margin-top: 2.12%;
    margin-bottom: 0%;
    margin-left: auto;
    margin-right: auto;
  }
}
@media screen and (max-width: 767px) and (max-width: 1299px) {
  .mainSingleBlogCntTop .ulAsideRelatedArticlesBlog {
    width: 90.9%;
  }
}

.mainSingleBlogCntTop .liAsideRelatedArticlesBlog {
  padding: 0;
  list-style: none;
}

.btnAsideRelatedArticlesBlog {
  font-size: 16px;
  line-height: 1.625;
  letter-spacing: 0em;
  text-indent: 0em;
  align-items: flex-start;
}
@media screen and (max-width: 1299px) {
  .btnAsideRelatedArticlesBlog {
    font-size: 1.2317167052vw;
  }
}
.btnAsideRelatedArticlesBlog::before {
  display: block;
  width: 0;
  height: 0;
  margin-top: calc((1 - 1.625) * 0.5em);
  content: "";
}
.btnAsideRelatedArticlesBlog::after {
  display: block;
  width: 0;
  height: 0;
  margin-bottom: calc((1 - 1.625) * 0.5em);
  content: "";
}
@media screen and (max-width: 767px) {
  .btnAsideRelatedArticlesBlog {
    line-height: normal;
    letter-spacing: 0em;
    text-indent: 0em;
  }
}
@media screen and (max-width: 767px) and (max-width: 767px) {
  .btnAsideRelatedArticlesBlog {
    font-size: 3.2vw;
  }
}

.thumbsAsideRelatedArticlesBlog {
  width: 171px;
  border-radius: 6px;
  /* CSS3草案 */
  -webkit-border-radius: 6px;
  /* Safari,Google Chrome用 */
  -moz-border-radius: 6px;
  /* Firefox用 */
  aspect-ratio: 171/96;
  position: relative;
  overflow: hidden;
}
@media screen and (max-width: 1299px) {
  .thumbsAsideRelatedArticlesBlog {
    width: 25.94%;
  }
}
@media screen and (max-width: 767px) {
  .thumbsAsideRelatedArticlesBlog {
    width: 134px;
    aspect-ratio: 134/75;
  }
}
@media screen and (max-width: 767px) and (max-width: 1299px) {
  .thumbsAsideRelatedArticlesBlog {
    width: 44.66%;
  }
}
.thumbsAsideRelatedArticlesBlog img {
  object-fit: cover;
  position: absolute;
  width: 100%;
  height: 100%;
  left: 0;
  right: 0;
  bottom: 0;
  top: 0;
  margin: auto;
}

.h4AsideRelatedArticlesBlog {
  width: 467px;
  font-size: 16px;
  line-height: 1.625;
  letter-spacing: 0em;
  text-indent: 0em;
  margin: 0 0 0 auto;
}
@media screen and (max-width: 1299px) {
  .h4AsideRelatedArticlesBlog {
    width: 70.86%;
  }
}
@media screen and (max-width: 1299px) {
  .h4AsideRelatedArticlesBlog {
    font-size: 1.2317167052vw;
  }
}
.h4AsideRelatedArticlesBlog::before {
  display: block;
  width: 0;
  height: 0;
  margin-top: calc((1 - 1.625) * 0.5em);
  content: "";
}
.h4AsideRelatedArticlesBlog::after {
  display: block;
  width: 0;
  height: 0;
  margin-bottom: calc((1 - 1.625) * 0.5em);
  content: "";
}
@media screen and (max-width: 767px) {
  .h4AsideRelatedArticlesBlog {
    width: 154px;
    line-height: normal;
    letter-spacing: 0em;
    text-indent: 0em;
  }
}
@media screen and (max-width: 767px) and (max-width: 1299px) {
  .h4AsideRelatedArticlesBlog {
    width: 51.33%;
  }
}
@media screen and (max-width: 767px) and (max-width: 767px) {
  .h4AsideRelatedArticlesBlog {
    font-size: 3.2vw;
  }
}

/*した線*/
.brdShareSingleBlogCnt {
  margin-top: 45px;
  margin-bottom: 0px;
  margin-left: auto;
  margin-right: auto;
  height: 1px;
  width: 100%;
  background: #666;
}
@media screen and (max-width: 1299px) {
  .brdShareSingleBlogCnt {
    margin-top: 6.26%;
    margin-bottom: 0%;
    margin-left: auto;
    margin-right: auto;
  }
}
@media screen and (max-width: 767px) {
  .brdShareSingleBlogCnt {
    margin-top: 35px;
    margin-bottom: 0px;
    margin-left: auto;
    margin-right: auto;
  }
}
@media screen and (max-width: 767px) and (max-width: 1299px) {
  .brdShareSingleBlogCnt {
    margin-top: 10.6%;
    margin-bottom: 0%;
    margin-left: auto;
    margin-right: auto;
  }
}

.shareSingleBlogCntFx {
  margin-top: 35px;
  margin-bottom: 0px;
  margin-left: auto;
  margin-right: auto;
  width: 319px;
}
@media screen and (max-width: 1299px) {
  .shareSingleBlogCntFx {
    margin-top: 4.87%;
    margin-bottom: 0%;
    margin-left: auto;
    margin-right: auto;
  }
}
@media screen and (max-width: 1299px) {
  .shareSingleBlogCntFx {
    width: 44.42%;
  }
}
@media screen and (max-width: 767px) {
  .shareSingleBlogCntFx {
    margin-top: 35px;
    margin-bottom: 0px;
    margin-left: auto;
    margin-right: auto;
    width: 100%;
  }
}
@media screen and (max-width: 767px) and (max-width: 1299px) {
  .shareSingleBlogCntFx {
    margin-top: 10.6%;
    margin-bottom: 0%;
    margin-left: auto;
    margin-right: auto;
  }
}

.h3ShareSingleBlogCntFx {
  font-size: 14px;
  line-height: 1.4285714286;
  letter-spacing: 0.05em;
  text-indent: -0.05em;
}
@media screen and (max-width: 1299px) {
  .h3ShareSingleBlogCntFx {
    font-size: 1.077752117vw;
  }
}
.h3ShareSingleBlogCntFx::before {
  display: block;
  width: 0;
  height: 0;
  margin-top: calc((1 - 1.4285714286) * 0.5em);
  content: "";
}
.h3ShareSingleBlogCntFx::after {
  display: block;
  width: 0;
  height: 0;
  margin-bottom: calc((1 - 1.4285714286) * 0.5em);
  content: "";
}
@media screen and (max-width: 767px) {
  .h3ShareSingleBlogCntFx {
    line-height: 1.6666666667;
    letter-spacing: 0.05em;
    text-indent: -0.05em;
  }
}
@media screen and (max-width: 767px) and (max-width: 767px) {
  .h3ShareSingleBlogCntFx {
    font-size: 3.2vw;
  }
}
@media screen and (max-width: 767px) {
  .h3ShareSingleBlogCntFx::before {
    display: block;
    width: 0;
    height: 0;
    margin-top: calc((1 - 1.6666666667) * 0.5em);
    content: "";
  }
  .h3ShareSingleBlogCntFx::after {
    display: block;
    width: 0;
    height: 0;
    margin-bottom: calc((1 - 1.6666666667) * 0.5em);
    content: "";
  }
}

.ulShareSingleBlogCnt {
  margin-top: 0px;
  margin-bottom: 0px;
  margin-left: auto;
  margin-right: 0px;
  width: 151px;
}
@media screen and (max-width: 1299px) {
  .ulShareSingleBlogCnt {
    margin-top: 0%;
    margin-bottom: 0%;
    margin-left: auto;
    margin-right: 0%;
  }
}
@media screen and (max-width: 1299px) {
  .ulShareSingleBlogCnt {
    width: 47.33%;
  }
}
@media screen and (max-width: 767px) {
  .ulShareSingleBlogCnt {
    margin-top: 0px;
    margin-bottom: 0px;
    margin-left: 14px;
    margin-right: 0px;
    width: 104px;
  }
}
@media screen and (max-width: 767px) and (max-width: 1299px) {
  .ulShareSingleBlogCnt {
    margin: 0% 0% 0% 4.24%;
  }
}
@media screen and (max-width: 767px) and (max-width: 1299px) {
  .ulShareSingleBlogCnt {
    width: 31.51%;
  }
}

.liShareSingleBlogCnt {
  width: 36px;
}
@media screen and (max-width: 1299px) {
  .liShareSingleBlogCnt {
    width: 23.84%;
  }
}
@media screen and (max-width: 767px) {
  .liShareSingleBlogCnt {
    width: 25px;
  }
}
@media screen and (max-width: 767px) and (max-width: 1299px) {
  .liShareSingleBlogCnt {
    width: 24.03%;
  }
}

/*前の記事・次の記事*/
.prevNextSingleBlog {
  margin-top: 42px;
  margin-bottom: 0px;
  margin-left: auto;
  margin-right: auto;
}
@media screen and (max-width: 1299px) {
  .prevNextSingleBlog {
    margin-top: 3.23%;
    margin-bottom: 0%;
    margin-left: auto;
    margin-right: auto;
  }
}
@media screen and (max-width: 767px) {
  .prevNextSingleBlog {
    margin-top: 5.5%;
    margin-bottom: 0%;
    margin-left: auto;
    margin-right: auto;
  }
}

.prevNextSingleBlogFx {
  width: 800px;
  margin: auto;
}
@media screen and (max-width: 1299px) {
  .prevNextSingleBlogFx {
    width: 61.53%;
  }
}
@media screen and (max-width: 767px) {
  .prevNextSingleBlogFx {
    width: 342px;
  }
}
@media screen and (max-width: 767px) and (max-width: 1299px) {
  .prevNextSingleBlogFx {
    width: 91.2%;
  }
}

.prevSingleBlog {
  width: 400px;
  padding-top: 7px;
  padding-bottom: 7px;
  padding-left: 0px;
  padding-right: 0px;
}
@media screen and (max-width: 1299px) {
  .prevSingleBlog {
    width: 50%;
  }
}
@media screen and (max-width: 1299px) {
  .prevSingleBlog {
    padding: 0.87% 0% 0.87% 0%;
  }
}
@media screen and (max-width: 767px) {
  .prevSingleBlog {
    width: 48.5%;
    padding-top: 0px;
    padding-bottom: 0px;
    padding-left: 0px;
    padding-right: 0px;
  }
}
@media screen and (max-width: 767px) and (max-width: 1299px) {
  .prevSingleBlog {
    padding: 0% 0% 0% 0%;
  }
}

.cntInPrevNextSingleBlogFx {
  width: 382px;
  text-decoration: none;
  align-items: flex-start;
}
@media screen and (max-width: 1299px) {
  .cntInPrevNextSingleBlogFx {
    width: 95.5%;
  }
}
@media screen and (max-width: 767px) {
  .cntInPrevNextSingleBlogFx {
    width: 94.5%;
  }
}

.photoInPrevNextSingleBlog {
  width: 91px;
  border-radius: 8px;
  /* CSS3草案 */
  -webkit-border-radius: 8px;
  /* Safari,Google Chrome用 */
  -moz-border-radius: 8px;
  /* Firefox用 */
  aspect-ratio: 91/62;
  position: relative;
  overflow: hidden;
}
@media screen and (max-width: 1299px) {
  .photoInPrevNextSingleBlog {
    width: 23.82%;
  }
}
@media screen and (max-width: 767px) {
  .photoInPrevNextSingleBlog {
    width: 73px;
    aspect-ratio: 73/50;
  }
}
@media screen and (max-width: 767px) and (max-width: 1299px) {
  .photoInPrevNextSingleBlog {
    width: 45.91%;
  }
}
.photoInPrevNextSingleBlog img {
  object-fit: cover;
  position: absolute;
  width: 100%;
  height: 100%;
  left: 0;
  right: 0;
  bottom: 0;
  top: 0;
  margin: auto;
}

.secInPrevNextSingleBlog {
  width: 280px;
}
@media screen and (max-width: 1299px) {
  .secInPrevNextSingleBlog {
    width: 73.29%;
  }
}
@media screen and (max-width: 767px) {
  .secInPrevNextSingleBlog {
    width: 78px;
    margin: 2% 0 0 0;
  }
}
@media screen and (max-width: 767px) and (max-width: 1299px) {
  .secInPrevNextSingleBlog {
    width: 49.05%;
  }
}

.h4InPrevNextSingleBlog {
  font-size: 14px;
  line-height: 1.4285714286;
  letter-spacing: 0em;
  text-indent: 0em;
}
@media screen and (max-width: 1299px) {
  .h4InPrevNextSingleBlog {
    font-size: 1.077752117vw;
  }
}
.h4InPrevNextSingleBlog::before {
  display: block;
  width: 0;
  height: 0;
  margin-top: calc((1 - 1.4285714286) * 0.5em);
  content: "";
}
.h4InPrevNextSingleBlog::after {
  display: block;
  width: 0;
  height: 0;
  margin-bottom: calc((1 - 1.4285714286) * 0.5em);
  content: "";
}
@media screen and (max-width: 767px) {
  .h4InPrevNextSingleBlog {
    line-height: 2;
    letter-spacing: 0em;
    text-indent: 0em;
  }
}
@media screen and (max-width: 767px) and (max-width: 767px) {
  .h4InPrevNextSingleBlog {
    font-size: 2.6666666667vw;
  }
}
@media screen and (max-width: 767px) {
  .h4InPrevNextSingleBlog::before {
    display: block;
    width: 0;
    height: 0;
    margin-top: calc((1 - 2) * 0.5em);
    content: "";
  }
  .h4InPrevNextSingleBlog::after {
    display: block;
    width: 0;
    height: 0;
    margin-bottom: calc((1 - 2) * 0.5em);
    content: "";
  }
}

.txtInPrevNextSingleBlog {
  margin-top: 11px;
  margin-bottom: 0px;
  margin-left: 0px;
  margin-right: 0px;
  font-size: 14px;
  line-height: 1.4285714286;
  letter-spacing: 0em;
  text-indent: 0em;
}
@media screen and (max-width: 1299px) {
  .txtInPrevNextSingleBlog {
    margin: 3.92% 0% 0% 0%;
  }
}
@media screen and (max-width: 1299px) {
  .txtInPrevNextSingleBlog {
    font-size: 1.077752117vw;
  }
}
.txtInPrevNextSingleBlog::before {
  display: block;
  width: 0;
  height: 0;
  margin-top: calc((1 - 1.4285714286) * 0.5em);
  content: "";
}
.txtInPrevNextSingleBlog::after {
  display: block;
  width: 0;
  height: 0;
  margin-bottom: calc((1 - 1.4285714286) * 0.5em);
  content: "";
}
@media screen and (max-width: 767px) {
  .txtInPrevNextSingleBlog {
    margin: 4% 0% 0% 0%;
    line-height: 1.4;
    letter-spacing: 0em;
    text-indent: 0em;
  }
}
@media screen and (max-width: 767px) and (max-width: 767px) {
  .txtInPrevNextSingleBlog {
    font-size: 2.6666666667vw;
  }
}
@media screen and (max-width: 767px) {
  .txtInPrevNextSingleBlog::before {
    display: block;
    width: 0;
    height: 0;
    margin-top: calc((1 - 1.4) * 0.5em);
    content: "";
  }
  .txtInPrevNextSingleBlog::after {
    display: block;
    width: 0;
    height: 0;
    margin-bottom: calc((1 - 1.4) * 0.5em);
    content: "";
  }
}

.nextSingleBlog {
  width: 400px;
  padding-top: 7px;
  padding-bottom: 7px;
  padding-left: 17px;
  padding-right: 0px;
  border-left: 1px solid #D9D9D9;
}
@media screen and (max-width: 1299px) {
  .nextSingleBlog {
    width: 50%;
  }
}
@media screen and (max-width: 1299px) {
  .nextSingleBlog {
    padding: 0.87% 0% 0.87% 2.12%;
  }
}
@media screen and (max-width: 767px) {
  .nextSingleBlog {
    width: 54%;
    padding: 0% 0% 0% 5%;
  }
}

/*一覧にもどる*/
.btnBackMainSingleBlogTopLxn {
  margin-top: 36px;
  margin-bottom: 0px;
  margin-left: auto;
  margin-right: auto;
  width: 185px;
}
@media screen and (max-width: 1299px) {
  .btnBackMainSingleBlogTopLxn {
    margin-top: 2.76%;
    margin-bottom: 0%;
    margin-left: auto;
    margin-right: auto;
  }
}
@media screen and (max-width: 1299px) {
  .btnBackMainSingleBlogTopLxn {
    width: 14.23%;
  }
}
@media screen and (max-width: 767px) {
  .btnBackMainSingleBlogTopLxn {
    margin-top: 34px;
    margin-bottom: 0px;
    margin-left: auto;
    margin-right: auto;
    width: 185px;
  }
}
@media screen and (max-width: 767px) and (max-width: 1299px) {
  .btnBackMainSingleBlogTopLxn {
    margin-top: 9.06%;
    margin-bottom: 0%;
    margin-left: auto;
    margin-right: auto;
  }
}
@media screen and (max-width: 767px) and (max-width: 1299px) {
  .btnBackMainSingleBlogTopLxn {
    width: 49.33%;
  }
}

.btnBackMainSingleBlogTop {
  aspect-ratio: 185/41;
  border-radius: 30px;
  /* CSS3草案 */
  -webkit-border-radius: 30px;
  /* Safari,Google Chrome用 */
  -moz-border-radius: 30px;
  /* Firefox用 */
  text-decoration: none;
}
@media screen and (max-width: 767px) {
  .btnBackMainSingleBlogTop {
    aspect-ratio: 185/41;
  }
}

.btnBackMainSingleBlogTopLxn .txtBtnMoreViewIndexBlog {
  width: 165px;
  margin: auto;
  font-size: 12px;
  line-height: normal;
  letter-spacing: 0em;
  text-indent: 0em;
  background: url(../img/txtBtnMoreViewIndexBlog.svg) no-repeat center left;
  background-size: auto 80%;
}
@media screen and (max-width: 1299px) {
  .btnBackMainSingleBlogTopLxn .txtBtnMoreViewIndexBlog {
    width: 89.18%;
  }
}
@media screen and (max-width: 1299px) {
  .btnBackMainSingleBlogTopLxn .txtBtnMoreViewIndexBlog {
    font-size: 0.9237875289vw;
  }
}
@media screen and (max-width: 767px) {
  .btnBackMainSingleBlogTopLxn .txtBtnMoreViewIndexBlog {
    width: 165px;
    line-height: 2.9166666667;
    letter-spacing: 0em;
    text-indent: 0em;
  }
}
@media screen and (max-width: 767px) and (max-width: 1299px) {
  .btnBackMainSingleBlogTopLxn .txtBtnMoreViewIndexBlog {
    width: 89.18%;
  }
}
@media screen and (max-width: 767px) and (max-width: 767px) {
  .btnBackMainSingleBlogTopLxn .txtBtnMoreViewIndexBlog {
    font-size: 3.2vw;
  }
}
@media screen and (max-width: 767px) {
  .btnBackMainSingleBlogTopLxn .txtBtnMoreViewIndexBlog::before {
    display: block;
    width: 0;
    height: 0;
    margin-top: calc((1 - 2.9166666667) * 0.5em);
    content: "";
  }
  .btnBackMainSingleBlogTopLxn .txtBtnMoreViewIndexBlog::after {
    display: block;
    width: 0;
    height: 0;
    margin-bottom: calc((1 - 2.9166666667) * 0.5em);
    content: "";
  }
}

/*右カラム*/
.sidebarSingleBlog {
  width: 330px;
}
@media screen and (max-width: 1299px) {
  .sidebarSingleBlog {
    width: 25.38%;
  }
}
@media screen and (max-width: 767px) {
  .sidebarSingleBlog {
    margin-top: 35px;
    margin-bottom: 0px;
    margin-left: auto;
    margin-right: auto;
    padding-top: 31px;
    padding-bottom: 0px;
    padding-left: 0px;
    padding-right: 0px;
    border-top: 1px solid #D1D1D1;
    width: 100%;
  }
}
@media screen and (max-width: 767px) and (max-width: 1299px) {
  .sidebarSingleBlog {
    margin-top: 9.33%;
    margin-bottom: 0%;
    margin-left: auto;
    margin-right: auto;
  }
}
@media screen and (max-width: 767px) and (max-width: 1299px) {
  .sidebarSingleBlog {
    padding: 8.26% 0% 0% 0%;
  }
}

@media screen and (max-width: 767px) {
  .sidebarSingleBlogSp {
    width: 335px;
    margin-top: 0px;
    margin-bottom: 0px;
    margin-left: auto;
    margin-right: auto;
  }
}
@media screen and (max-width: 767px) and (max-width: 1299px) {
  .sidebarSingleBlogSp {
    width: 89.33%;
  }
}
@media screen and (max-width: 767px) and (max-width: 1299px) {
  .sidebarSingleBlogSp {
    margin-top: 0%;
    margin-bottom: 0%;
    margin-left: auto;
    margin-right: auto;
  }
}

/**/
.pcbrdPagerBlogSingle {
  margin-top: 55px;
  margin-bottom: 0px;
  margin-left: auto;
  margin-right: auto;
  height: 1px;
  width: 100%;
  background: #D1D1D1;
}
@media screen and (max-width: 1299px) {
  .pcbrdPagerBlogSingle {
    margin-top: 2.86%;
    margin-bottom: 0%;
    margin-left: auto;
    margin-right: auto;
  }
}
@media screen and (max-width: 767px) {
  .pcbrdPagerBlogSingle {
    margin-top: 31px;
    margin-bottom: 0px;
    margin-left: auto;
    margin-right: auto;
    width: 335px;
  }
}
@media screen and (max-width: 767px) and (max-width: 1299px) {
  .pcbrdPagerBlogSingle {
    margin-top: 8.26%;
    margin-bottom: 0%;
    margin-left: auto;
    margin-right: auto;
  }
}
@media screen and (max-width: 767px) and (max-width: 1299px) {
  .pcbrdPagerBlogSingle {
    width: 89.33%;
  }
}

.brdPagerBlogSingleRec {
  margin-top: 38px;
  margin-bottom: 0px;
  margin-left: auto;
  margin-right: auto;
}
@media screen and (max-width: 1299px) {
  .brdPagerBlogSingleRec {
    margin-top: 1.97%;
    margin-bottom: 0%;
    margin-left: auto;
    margin-right: auto;
  }
}
/* ==========================================================================
use＆nameSpace
========================================================================== */
/* ==========================================================================
use＆nameSpace
========================================================================== */
/* ==========================================================================
LAYOUT
========================================================================== */
/* ==========================================================================
use＆nameSpace
========================================================================== */
/* ==========================================================================
use＆nameSpace
========================================================================== */
/* ==========================================================================
LAYOUT
========================================================================== */
.h2RecBlogInfo {
  font-size: 16px;
  line-height: 1.25;
  letter-spacing: 0.05em;
  text-indent: -0.05em;
}
@media screen and (max-width: 1299px) {
  .h2RecBlogInfo {
    font-size: 1.2317167052vw;
  }
}
.h2RecBlogInfo::before {
  display: block;
  width: 0;
  height: 0;
  margin-top: calc((1 - 1.25) * 0.5em);
  content: "";
}
.h2RecBlogInfo::after {
  display: block;
  width: 0;
  height: 0;
  margin-bottom: calc((1 - 1.25) * 0.5em);
  content: "";
}
@media screen and (max-width: 767px) {
  .h2RecBlogInfo {
    line-height: 1.4285714286;
    letter-spacing: 0.05em;
    text-indent: -0.05em;
  }
}
@media screen and (max-width: 767px) and (max-width: 767px) {
  .h2RecBlogInfo {
    font-size: 3.7333333333vw;
  }
}
@media screen and (max-width: 767px) {
  .h2RecBlogInfo::before {
    display: block;
    width: 0;
    height: 0;
    margin-top: calc((1 - 1.4285714286) * 0.5em);
    content: "";
  }
  .h2RecBlogInfo::after {
    display: block;
    width: 0;
    height: 0;
    margin-bottom: calc((1 - 1.4285714286) * 0.5em);
    content: "";
  }
}

/*一覧にもどる*/
.btnBackrecBlogInfoLxn {
  margin-top: 34px;
  margin-bottom: 0px;
  margin-left: auto;
  margin-right: auto;
  width: 185px;
}
@media screen and (max-width: 1299px) {
  .btnBackrecBlogInfoLxn {
    margin-top: 2.61%;
    margin-bottom: 0%;
    margin-left: auto;
    margin-right: auto;
  }
}
@media screen and (max-width: 1299px) {
  .btnBackrecBlogInfoLxn {
    width: 14.23%;
  }
}
@media screen and (max-width: 767px) {
  .btnBackrecBlogInfoLxn {
    margin-top: 35px;
    margin-bottom: 0px;
    margin-left: auto;
    margin-right: auto;
    width: 185px;
  }
}
@media screen and (max-width: 767px) and (max-width: 1299px) {
  .btnBackrecBlogInfoLxn {
    margin-top: 10.44%;
    margin-bottom: 0%;
    margin-left: auto;
    margin-right: auto;
  }
}
@media screen and (max-width: 767px) and (max-width: 1299px) {
  .btnBackrecBlogInfoLxn {
    width: 55.22%;
  }
}

.btnBackrecBlogInfo {
  aspect-ratio: 185/41;
  border-radius: 30px;
  /* CSS3草案 */
  -webkit-border-radius: 30px;
  /* Safari,Google Chrome用 */
  -moz-border-radius: 30px;
  /* Firefox用 */
  text-decoration: none;
}

.txtBtnMoreViewrecBlogInfo {
  font-size: 12px;
  line-height: normal;
  letter-spacing: 0em;
  text-indent: 0em;
  background: url(../img/txtBtnMoreViewIndexBlog.svg) no-repeat left center;
  background-size: auto 80%;
  width: 165px;
  margin: auto;
}
@media screen and (max-width: 1299px) {
  .txtBtnMoreViewrecBlogInfo {
    font-size: 0.9237875289vw;
  }
}
@media screen and (max-width: 1299px) {
  .txtBtnMoreViewrecBlogInfo {
    width: 89.18%;
  }
}
@media screen and (max-width: 767px) {
  .txtBtnMoreViewrecBlogInfo {
    width: 165px;
    line-height: normal;
    letter-spacing: 0em;
    text-indent: 0em;
  }
}
@media screen and (max-width: 767px) and (max-width: 1299px) {
  .txtBtnMoreViewrecBlogInfo {
    width: 89.18%;
  }
}
@media screen and (max-width: 767px) and (max-width: 767px) {
  .txtBtnMoreViewrecBlogInfo {
    font-size: 3.2vw;
  }
}

/* ==========================================================================
use＆nameSpace
========================================================================== */
/* ==========================================================================
use＆nameSpace
========================================================================== */
/* ==========================================================================
LAYOUT
========================================================================== */
@media screen and (max-width: 767px) {
  .blogRanking {
    margin-top: 49px;
    margin-bottom: 0px;
    margin-left: auto;
    margin-right: auto;
    width: 335px;
  }
}
@media screen and (max-width: 767px) and (max-width: 1299px) {
  .blogRanking {
    margin-top: 13.06%;
    margin-bottom: 0%;
    margin-left: auto;
    margin-right: auto;
  }
}
@media screen and (max-width: 767px) and (max-width: 1299px) {
  .blogRanking {
    width: 89.33%;
  }
}

.h3BlogRanking {
  font-size: 16px;
  line-height: 1.25;
  letter-spacing: 0.1em;
  text-indent: -0.1em;
}
@media screen and (max-width: 1299px) {
  .h3BlogRanking {
    font-size: 1.2317167052vw;
  }
}
.h3BlogRanking::before {
  display: block;
  width: 0;
  height: 0;
  margin-top: calc((1 - 1.25) * 0.5em);
  content: "";
}
.h3BlogRanking::after {
  display: block;
  width: 0;
  height: 0;
  margin-bottom: calc((1 - 1.25) * 0.5em);
  content: "";
}
@media screen and (max-width: 767px) {
  .h3BlogRanking {
    line-height: 1.25;
    letter-spacing: 0.1em;
    text-indent: -0.1em;
  }
}
@media screen and (max-width: 767px) and (max-width: 767px) {
  .h3BlogRanking {
    font-size: 4.2666666667vw;
  }
}
@media screen and (max-width: 767px) {
  .h3BlogRanking::before {
    display: block;
    width: 0;
    height: 0;
    margin-top: calc((1 - 1.25) * 0.5em);
    content: "";
  }
  .h3BlogRanking::after {
    display: block;
    width: 0;
    height: 0;
    margin-bottom: calc((1 - 1.25) * 0.5em);
    content: "";
  }
}

.ulblogRanking {
  margin-top: 14px;
  margin-bottom: 0px;
  margin-left: auto;
  margin-right: auto;
}
@media screen and (max-width: 1299px) {
  .ulblogRanking {
    margin-top: 4.24%;
    margin-bottom: 0%;
    margin-left: auto;
    margin-right: auto;
  }
}
@media screen and (max-width: 767px) {
  .ulblogRanking {
    margin-top: 11px;
    margin-bottom: 0px;
    margin-left: auto;
    margin-right: auto;
  }
}
@media screen and (max-width: 767px) and (max-width: 1299px) {
  .ulblogRanking {
    margin-top: 3.28%;
    margin-bottom: 0%;
    margin-left: auto;
    margin-right: auto;
  }
}

.liblogRanking:nth-child(n+2) {
  margin-top: 20px;
  margin-bottom: 0px;
  margin-left: auto;
  margin-right: auto;
}
@media screen and (max-width: 1299px) {
  .liblogRanking:nth-child(n+2) {
    margin-top: 6.06%;
    margin-bottom: 0%;
    margin-left: auto;
    margin-right: auto;
  }
}
@media screen and (max-width: 767px) {
  .liblogRanking:nth-child(n+2) {
    margin-top: 11px;
    margin-bottom: 0px;
    margin-left: auto;
    margin-right: auto;
  }
}
@media screen and (max-width: 767px) and (max-width: 1299px) {
  .liblogRanking:nth-child(n+2) {
    margin-top: 3.28%;
    margin-bottom: 0%;
    margin-left: auto;
    margin-right: auto;
  }
}

.btnBlogRankingsFx {
  align-items: flex-start;
}

.thumbsBlogRankings {
  width: 144px;
  position: relative;
  aspect-ratio: 144/81;
  overflow: hidden;
  border-radius: 6px;
  /* CSS3草案 */
  -webkit-border-radius: 6px;
  /* Safari,Google Chrome用 */
  -moz-border-radius: 6px;
  /* Firefox用 */
}
@media screen and (max-width: 1299px) {
  .thumbsBlogRankings {
    width: 43.63%;
  }
}
@media screen and (max-width: 767px) {
  .thumbsBlogRankings {
    width: 144px;
  }
}
@media screen and (max-width: 767px) and (max-width: 1299px) {
  .thumbsBlogRankings {
    width: 42.98%;
  }
}

.thumbsBlogRankings img {
  object-fit: cover;
  width: 100%;
  height: 100%;
  position: absolute;
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
  margin: auto;
}

.capBlogRankings {
  position: absolute;
  z-index: 1;
  top: 4%;
  left: 3%;
  width: 13px;
  font-size: 10px;
  line-height: normal;
  letter-spacing: 0em;
  text-indent: 0em;
  border-radius: 2px;
  /* CSS3草案 */
  -webkit-border-radius: 2px;
  /* Safari,Google Chrome用 */
  -moz-border-radius: 2px;
  /* Firefox用 */
}
@media screen and (max-width: 1299px) {
  .capBlogRankings {
    width: 9.02%;
  }
}
@media screen and (max-width: 1299px) {
  .capBlogRankings {
    font-size: 0.7698229407vw;
  }
}
@media screen and (max-width: 767px) {
  .capBlogRankings {
    width: 13px;
    line-height: normal;
    letter-spacing: 0em;
    text-indent: 0em;
  }
}
@media screen and (max-width: 767px) and (max-width: 1299px) {
  .capBlogRankings {
    width: 9.02%;
  }
}
@media screen and (max-width: 767px) and (max-width: 767px) {
  .capBlogRankings {
    font-size: 2.6666666667vw;
  }
}

.secBlogRankings {
  width: 170px;
}
@media screen and (max-width: 1299px) {
  .secBlogRankings {
    width: 51.51%;
  }
}
@media screen and (max-width: 767px) {
  .secBlogRankings {
    width: 175px;
  }
}
@media screen and (max-width: 767px) and (max-width: 1299px) {
  .secBlogRankings {
    width: 52.23%;
  }
}

.txtBlogRankings {
  font-size: 14px;
  line-height: normal;
  letter-spacing: 0em;
  text-indent: 0em;
}
@media screen and (max-width: 1299px) {
  .txtBlogRankings {
    font-size: 1.077752117vw;
  }
}
@media screen and (max-width: 767px) {
  .txtBlogRankings {
    line-height: normal;
    letter-spacing: 0em;
    text-indent: 0em;
  }
}
@media screen and (max-width: 767px) and (max-width: 767px) {
  .txtBlogRankings {
    font-size: 3.7333333333vw;
  }
}

.timeBlogRankingsWap {
  margin-top: 5px;
  margin-bottom: 0px;
  margin-left: 0px;
  margin-right: 0px;
  flex-flow: row wrap;
}
@media screen and (max-width: 1299px) {
  .timeBlogRankingsWap {
    margin: 1.51% 0% 0% 0%;
  }
}
@media screen and (max-width: 767px) {
  .timeBlogRankingsWap {
    margin-top: 10px;
    margin-bottom: 0px;
    margin-left: 0px;
    margin-right: 0px;
  }
}
@media screen and (max-width: 767px) and (max-width: 1299px) {
  .timeBlogRankingsWap {
    margin: 5.71% 0% 0% 0%;
  }
}

.timeBlogRankings {
  margin: 0vw 0.2vw 0.3645833333vw 0vw;
  font-size: 10px;
  line-height: 1;
  letter-spacing: 0.05em;
  text-indent: -0.05em;
}
@media screen and (max-width: 1299px) {
  .timeBlogRankings {
    font-size: 0.7698229407vw;
  }
}
@media screen and (max-width: 767px) {
  .timeBlogRankings {
    margin: 0 0 1vw 0;
    line-height: normal;
    letter-spacing: 0.05em;
    text-indent: -0.05em;
  }
}
@media screen and (max-width: 767px) and (max-width: 767px) {
  .timeBlogRankings {
    font-size: 2.6666666667vw;
  }
}

.iconBlogRankings {
  font-size: 10px;
  line-height: 1;
  letter-spacing: 0em;
  text-indent: 0em;
  background: #DB2E21;
  margin: 0vw 0.3645833333vw 0.3645833333vw 0vw;
  padding: 0.0520833333vw 0.2083333333vw 0.0520833333vw 0.2083333333vw;
  display: flex;
  align-items: center;
  justify-content: center;
}
@media screen and (max-width: 1299px) {
  .iconBlogRankings {
    font-size: 0.7698229407vw;
  }
}
@media screen and (max-width: 767px) {
  .iconBlogRankings {
    margin: 0 0.2vw 1vw 0;
    padding: 0.5vw 1.2vw;
    line-height: 1;
    letter-spacing: 0em;
    text-indent: 0em;
  }
}
@media screen and (max-width: 767px) and (max-width: 767px) {
  .iconBlogRankings {
    font-size: 2.6666666667vw;
  }
}

/* ==========================================================================
use＆nameSpace
========================================================================== */
/* ==========================================================================
use＆nameSpace
========================================================================== */
/* ==========================================================================
LAYOUT
========================================================================== */
.searchBlogs {
  margin-top: 40px;
  margin-bottom: 0px;
  margin-left: auto;
  margin-right: auto;
}
@media screen and (max-width: 1299px) {
  .searchBlogs {
    margin-top: 12.12%;
    margin-bottom: 0%;
    margin-left: auto;
    margin-right: auto;
  }
}
@media screen and (max-width: 767px) {
  .searchBlogs {
    margin-top: 42px;
    margin-bottom: 0px;
    margin-left: auto;
    margin-right: auto;
    width: 335px;
  }
}
@media screen and (max-width: 767px) and (max-width: 1299px) {
  .searchBlogs {
    margin-top: 11.2%;
    margin-bottom: 0%;
    margin-left: auto;
    margin-right: auto;
  }
}
@media screen and (max-width: 767px) and (max-width: 1299px) {
  .searchBlogs {
    width: 89.33%;
  }
}

.inputSearchBlogsLxn {
  padding-top: 0px;
  padding-bottom: 19px;
  padding-left: 0px;
  padding-right: 0px;
  position: relative;
  border-bottom: 1px solid #666;
}
@media screen and (max-width: 1299px) {
  .inputSearchBlogsLxn {
    padding: 0% 0% 5.75% 0%;
  }
}
@media screen and (max-width: 767px) {
  .inputSearchBlogsLxn {
    padding-top: 0px;
    padding-bottom: 19px;
    padding-left: 0px;
    padding-right: 0px;
  }
}
@media screen and (max-width: 767px) and (max-width: 1299px) {
  .inputSearchBlogsLxn {
    padding: 0% 0% 5.67% 0%;
  }
}

.inputSearchBlogs {
  font-size: 16px;
  line-height: 1.25;
  letter-spacing: 0.05em;
  text-indent: -0.05em;
  border: none;
  background: unset;
  width: 280px;
}
@media screen and (max-width: 1299px) {
  .inputSearchBlogs {
    font-size: 1.2317167052vw;
  }
}
.inputSearchBlogs::before {
  display: block;
  width: 0;
  height: 0;
  margin-top: calc((1 - 1.25) * 0.5em);
  content: "";
}
.inputSearchBlogs::after {
  display: block;
  width: 0;
  height: 0;
  margin-bottom: calc((1 - 1.25) * 0.5em);
  content: "";
}
@media screen and (max-width: 1299px) {
  .inputSearchBlogs {
    width: 84.84%;
  }
}
@media screen and (max-width: 767px) {
  .inputSearchBlogs {
    line-height: 1.25;
    letter-spacing: 0.05em;
    text-indent: -0.05em;
  }
}
@media screen and (max-width: 767px) and (max-width: 767px) {
  .inputSearchBlogs {
    font-size: 4.2666666667vw;
  }
}
@media screen and (max-width: 767px) {
  .inputSearchBlogs::before {
    display: block;
    width: 0;
    height: 0;
    margin-top: calc((1 - 1.25) * 0.5em);
    content: "";
  }
  .inputSearchBlogs::after {
    display: block;
    width: 0;
    height: 0;
    margin-bottom: calc((1 - 1.25) * 0.5em);
    content: "";
  }
}
.inputSearchBlogs:focus-visible, .inputSearchBlogs:focus {
  outline: none;
  border: none;
  pointer-events: all;
}

.iconInputSearchBlogs {
  width: 20px;
  position: absolute;
  right: 7%;
  top: 10%;
  cursor: pointer;
}
@media screen and (max-width: 1299px) {
  .iconInputSearchBlogs {
    width: 6.06%;
  }
}
@media screen and (max-width: 767px) {
  .iconInputSearchBlogs {
    width: 20px;
  }
}
@media screen and (max-width: 767px) and (max-width: 1299px) {
  .iconInputSearchBlogs {
    width: 5.97%;
  }
}

.ulSearchBlogInfo {
  padding-top: 10px;
  padding-bottom: 10px;
  padding-left: 10px;
  padding-right: 10px;
  background: #FFF;
  display: none;
  max-height: 200px;
  overflow: auto;
}
@media screen and (max-width: 1299px) {
  .ulSearchBlogInfo {
    padding: 3.03% 3.03% 3.03% 3.03%;
  }
}
@media screen and (max-width: 767px) {
  .ulSearchBlogInfo {
    padding-top: 0px;
    padding-bottom: 0px;
    padding-left: 0px;
    padding-right: 0px;
  }
}
@media screen and (max-width: 767px) and (max-width: 1299px) {
  .ulSearchBlogInfo {
    padding: 0% 0% 0% 0%;
  }
}

.liSearchBlogInfo:nth-child(n+2) {
  margin-top: 10px;
  margin-bottom: 0px;
  margin-left: 0px;
  margin-right: 0px;
}
@media screen and (max-width: 1299px) {
  .liSearchBlogInfo:nth-child(n+2) {
    margin: 3.22% 0% 0% 0%;
  }
}

.btnSearchBlogInfo {
  color: #25272F;
  font-size: 16px;
  line-height: normal;
  letter-spacing: 0em;
  text-indent: 0em;
}
@media screen and (max-width: 1299px) {
  .btnSearchBlogInfo {
    font-size: 1.2317167052vw;
  }
}

/* ==========================================================================
use＆nameSpace
========================================================================== */
/* ==========================================================================
use＆nameSpace
========================================================================== */
/* ==========================================================================
LAYOUT
========================================================================== */
/*CATEGORY*/
.categoryBlgs {
  margin-top: 57px;
  margin-bottom: 0px;
  margin-left: auto;
  margin-right: auto;
}
@media screen and (max-width: 1299px) {
  .categoryBlgs {
    margin-top: 17.27%;
    margin-bottom: 0%;
    margin-left: auto;
    margin-right: auto;
  }
}
@media screen and (max-width: 767px) {
  .categoryBlgs {
    width: 335px;
  }
}
@media screen and (max-width: 767px) and (max-width: 1299px) {
  .categoryBlgs {
    width: 89.33%;
  }
}

.h3CategoryBlgs {
  font-size: 16px;
  line-height: 1.25;
  letter-spacing: 0.1em;
  text-indent: -0.1em;
}
@media screen and (max-width: 1299px) {
  .h3CategoryBlgs {
    font-size: 1.2317167052vw;
  }
}
.h3CategoryBlgs::before {
  display: block;
  width: 0;
  height: 0;
  margin-top: calc((1 - 1.25) * 0.5em);
  content: "";
}
.h3CategoryBlgs::after {
  display: block;
  width: 0;
  height: 0;
  margin-bottom: calc((1 - 1.25) * 0.5em);
  content: "";
}
@media screen and (max-width: 767px) {
  .h3CategoryBlgs {
    line-height: 1.25;
    letter-spacing: 0.1em;
    text-indent: -0.1em;
  }
}
@media screen and (max-width: 767px) and (max-width: 767px) {
  .h3CategoryBlgs {
    font-size: 4.2666666667vw;
  }
}
@media screen and (max-width: 767px) {
  .h3CategoryBlgs::before {
    display: block;
    width: 0;
    height: 0;
    margin-top: calc((1 - 1.25) * 0.5em);
    content: "";
  }
  .h3CategoryBlgs::after {
    display: block;
    width: 0;
    height: 0;
    margin-bottom: calc((1 - 1.25) * 0.5em);
    content: "";
  }
}

.ulCategoryBlgs {
  margin-top: 16px;
  margin-bottom: 0px;
  margin-left: auto;
  margin-right: auto;
}
@media screen and (max-width: 1299px) {
  .ulCategoryBlgs {
    margin-top: 4.84%;
    margin-bottom: 0%;
    margin-left: auto;
    margin-right: auto;
  }
}
@media screen and (max-width: 767px) {
  .ulCategoryBlgs {
    margin-top: 5.46%;
    margin-bottom: 0%;
    margin-left: auto;
    margin-right: auto;
  }
}

.liCategoryBlgs {
  padding-top: 18px;
  padding-bottom: 18px;
  padding-left: 0px;
  padding-right: 0px;
  border-bottom: 1px solid #666;
}
@media screen and (max-width: 1299px) {
  .liCategoryBlgs {
    padding: 5.45% 0% 5.45% 0%;
  }
}
@media screen and (max-width: 767px) {
  .liCategoryBlgs {
    padding: 5.2% 0% 5.2% 0%;
  }
}

.btnCategoryBlogs {
  font-size: 16px;
  line-height: 1.25;
  letter-spacing: 0.05em;
  text-indent: -0.05em;
  text-decoration: none;
}
@media screen and (max-width: 1299px) {
  .btnCategoryBlogs {
    font-size: 1.2317167052vw;
  }
}
.btnCategoryBlogs::before {
  display: block;
  width: 0;
  height: 0;
  margin-top: calc((1 - 1.25) * 0.5em);
  content: "";
}
.btnCategoryBlogs::after {
  display: block;
  width: 0;
  height: 0;
  margin-bottom: calc((1 - 1.25) * 0.5em);
  content: "";
}
@media screen and (max-width: 767px) {
  .btnCategoryBlogs {
    line-height: 1.25;
    letter-spacing: 0.05em;
    text-indent: -0.05em;
  }
}
@media screen and (max-width: 767px) and (max-width: 767px) {
  .btnCategoryBlogs {
    font-size: 4.2666666667vw;
  }
}
@media screen and (max-width: 767px) {
  .btnCategoryBlogs::before {
    display: block;
    width: 0;
    height: 0;
    margin-top: calc((1 - 1.25) * 0.5em);
    content: "";
  }
  .btnCategoryBlogs::after {
    display: block;
    width: 0;
    height: 0;
    margin-bottom: calc((1 - 1.25) * 0.5em);
    content: "";
  }
}

.countCategoryBlogs {
  margin-top: 0px;
  margin-bottom: 0px;
  margin-left: 9px;
  margin-right: 0px;
}
@media screen and (max-width: 1299px) {
  .countCategoryBlogs {
    margin: 0% 0% 0% 2.72%;
  }
}
@media screen and (max-width: 767px) {
  .countCategoryBlogs {
    margin-top: 0px;
    margin-bottom: 0px;
    margin-left: 9px;
    margin-right: 0px;
  }
}
@media screen and (max-width: 767px) and (max-width: 1299px) {
  .countCategoryBlogs {
    margin: 0% 0% 0% 2.68%;
  }
}

/* ==========================================================================
use＆nameSpace
========================================================================== */
/* ==========================================================================
use＆nameSpace
========================================================================== */
/* ==========================================================================
LAYOUT
========================================================================== */
.faqCatTitle {
  margin-top: 55px;
  margin-bottom: 56px;
  margin-left: auto;
  margin-right: auto;
}
@media screen and (max-width: 1299px) {
  .faqCatTitle {
    margin-top: 2.86%;
    margin-bottom: 2.91%;
    margin-left: auto;
    margin-right: auto;
  }
}
@media screen and (max-width: 767px) {
  .faqCatTitle {
    margin-top: 8%;
    margin-bottom: 9.33%;
    margin-left: auto;
    margin-right: auto;
  }
}

.h2ContactTopFaq {
  margin-top: -3px;
  margin-bottom: 0px;
  margin-left: auto;
  margin-right: auto;
  font-size: 16px;
  line-height: normal;
  letter-spacing: 0.1em;
  text-indent: -0.1em;
}
@media screen and (max-width: 1299px) {
  .h2ContactTopFaq {
    margin-top: -0.24%;
    margin-bottom: 0%;
    margin-left: auto;
    margin-right: auto;
  }
}
@media screen and (max-width: 1299px) {
  .h2ContactTopFaq {
    font-size: 1.2317167052vw;
  }
}
@media screen and (max-width: 767px) {
  .h2ContactTopFaq {
    margin-top: 0px;
    margin-bottom: 0px;
    margin-left: auto;
    margin-right: auto;
    line-height: normal;
    letter-spacing: 0.1em;
    text-indent: -0.1em;
  }
}
@media screen and (max-width: 767px) and (max-width: 1299px) {
  .h2ContactTopFaq {
    margin-top: 0%;
    margin-bottom: 0%;
    margin-left: auto;
    margin-right: auto;
  }
}
@media screen and (max-width: 767px) and (max-width: 767px) {
  .h2ContactTopFaq {
    font-size: 4.2666666667vw;
  }
}

.txtContactTopFaq {
  font-size: 14px;
  line-height: 2;
  letter-spacing: 0.25px;
}
@media screen and (max-width: 1299px) {
  .txtContactTopFaq {
    font-size: 1.077752117vw;
  }
}
.txtContactTopFaq::before {
  display: block;
  width: 0;
  height: 0;
  margin-top: calc((1 - 2) * 0.5em);
  content: "";
}
.txtContactTopFaq::after {
  display: block;
  width: 0;
  height: 0;
  margin-bottom: calc((1 - 2) * 0.5em);
  content: "";
}
@media screen and (max-width: 767px) {
  .txtContactTopFaq {
    display: block;
    line-height: 1.6666666667;
    letter-spacing: 0.25px;
    margin-top: 11%;
    margin-bottom: 0;
    margin-left: auto;
    margin-right: auto;
  }
}
@media screen and (max-width: 767px) and (max-width: 767px) {
  .txtContactTopFaq {
    font-size: 3.2vw;
  }
}
@media screen and (max-width: 767px) {
  .txtContactTopFaq::before {
    display: block;
    width: 0;
    height: 0;
    margin-top: calc((1 - 1.6666666667) * 0.5em);
    content: "";
  }
  .txtContactTopFaq::after {
    display: block;
    width: 0;
    height: 0;
    margin-bottom: calc((1 - 1.6666666667) * 0.5em);
    content: "";
  }
}

/* ==========================================================================
use＆nameSpace
========================================================================== */
/* ==========================================================================
use＆nameSpace
========================================================================== */
/* ==========================================================================
LAYOUT
========================================================================== */
.brdPagerBlogLoop {
  margin-top: 40px;
  margin-bottom: 0px;
  margin-left: auto;
  margin-right: auto;
  height: 1px;
  background: #D1D1D1;
  width: 100%;
}
@media screen and (max-width: 1299px) {
  .brdPagerBlogLoop {
    margin-top: 2.08%;
    margin-bottom: 0%;
    margin-left: auto;
    margin-right: auto;
  }
}
@media screen and (max-width: 767px) {
  .brdPagerBlogLoop {
    margin-top: 60px;
    margin-bottom: 0px;
    margin-left: auto;
    margin-right: auto;
  }
}
@media screen and (max-width: 767px) and (max-width: 1299px) {
  .brdPagerBlogLoop {
    margin-top: 16%;
    margin-bottom: 0%;
    margin-left: auto;
    margin-right: auto;
  }
}

.pagerBlogLoop {
  margin-top: 38px;
  margin-bottom: 80px;
  margin-left: auto;
  margin-right: auto;
}
@media screen and (max-width: 1299px) {
  .pagerBlogLoop {
    margin-top: 1.97%;
    margin-bottom: 4.16%;
    margin-left: auto;
    margin-right: auto;
  }
}
@media screen and (max-width: 767px) {
  .pagerBlogLoop {
    margin-top: 39px;
    margin-bottom: 77px;
    margin-left: auto;
    margin-right: auto;
  }
}
@media screen and (max-width: 767px) and (max-width: 1299px) {
  .pagerBlogLoop {
    margin-top: 10.4%;
    margin-bottom: 20.53%;
    margin-left: auto;
    margin-right: auto;
  }
}

.wp-pagenavi {
  display: flex;
  justify-content: center;
  align-items: center;
}
.wp-pagenavi span,
.wp-pagenavi a {
  width: 33px;
  color: #333;
  text-align: center;
  font-family: Onest;
  font-size: 14px;
  line-height: normal;
  letter-spacing: 0em;
  text-indent: 0em;
  font-weight: 400;
  line-height: normal;
  aspect-ratio: 1/1;
  display: flex;
  justify-content: center;
  align-items: center;
  border-radius: 100px;
  /* CSS3草案 */
  -webkit-border-radius: 100px;
  /* Safari,Google Chrome用 */
  -moz-border-radius: 100px;
  /* Firefox用 */
  text-decoration: none;
  margin: 0 6px;
}
@media screen and (max-width: 1299px) {
  .wp-pagenavi span,
  .wp-pagenavi a {
    font-size: 1.077752117vw;
  }
}
@media screen and (max-width: 767px) {
  .wp-pagenavi span,
  .wp-pagenavi a {
    line-height: normal;
    letter-spacing: 0em;
    text-indent: 0em;
    margin: 0 1px;
  }
}
@media screen and (max-width: 767px) and (max-width: 767px) {
  .wp-pagenavi span,
  .wp-pagenavi a {
    font-size: 3.7333333333vw;
  }
}
.wp-pagenavi span {
  background: #DB2E21;
  color: #fff;
}
.wp-pagenavi .nextpostslink {
  text-indent: -9999px;
  text-align: left;
  overflow: hidden;
  display: block;
  font-size: 0.1em;
  width: 50px;
  aspect-ratio: 1/1;
  margin: 0 0 0 5px;
  background: url(../img/nextpostslink.svg) no-repeat center center;
  background-size: 100% 100%;
}
@media screen and (max-width: 767px) {
  .wp-pagenavi .nextpostslink {
    width: 10.6666666667vw;
    margin: 0 0 0 0.966667vw;
  }
}
.wp-pagenavi .previouspostslink {
  text-indent: -9999px;
  text-align: left;
  overflow: hidden;
  display: block;
  font-size: 0.1em;
  width: 50px;
  aspect-ratio: 1/1;
  margin: 0 5px 0 0px;
  background: url(../img/previouspostslink.svg) no-repeat center center;
  background-size: 100% 100%;
}
@media screen and (max-width: 767px) {
  .wp-pagenavi .previouspostslink {
    width: 10.6666666667vw;
    margin: 0 0.966667vw 0 0;
  }
}

/* ==========================================================================
use＆nameSpace
========================================================================== */
/* ==========================================================================
use＆nameSpace
========================================================================== */
/* ==========================================================================
LAYOUT
========================================================================== */
/* ==========================================================================
use＆nameSpace
========================================================================== */
/* ==========================================================================
use＆nameSpace
========================================================================== */
/* ==========================================================================
LAYOUT
========================================================================== */
.worksCatPickUp {
  padding-top: 53px;
  padding-bottom: 39px;
  padding-left: 0px;
  padding-right: 0px;
}
@media screen and (max-width: 1299px) {
  .worksCatPickUp {
    padding: 2.76% 0% 2.03% 0%;
  }
}
@media screen and (max-width: 767px) {
  .worksCatPickUp {
    padding: 11.26% 0% 10.33% 0%;
  }
}

@media screen and (max-width: 767px) {
  .worksCatPickUpWap {
    width: 340px;
    margin: auto;
  }
}
@media screen and (max-width: 767px) and (max-width: 1299px) {
  .worksCatPickUpWap {
    width: 90.66%;
  }
}

.h3WorksCatPickUp {
  font-size: 25px;
  line-height: normal;
  letter-spacing: 0.15em;
  text-indent: -0.15em;
}
@media screen and (max-width: 1299px) {
  .h3WorksCatPickUp {
    font-size: 1.9245573518vw;
  }
}
@media screen and (max-width: 767px) {
  .h3WorksCatPickUp {
    line-height: normal;
    letter-spacing: 0.15em;
    text-indent: -0.15em;
  }
}
@media screen and (max-width: 767px) and (max-width: 767px) {
  .h3WorksCatPickUp {
    font-size: 4.2666666667vw;
  }
}

.jsSwiperWorks {
  padding-top: 0px;
  padding-bottom: 31px;
  padding-left: 0px;
  padding-right: 0px;
  position: relative;
}
@media screen and (max-width: 1299px) {
  .jsSwiperWorks {
    padding: 0% 0% 2.38% 0%;
  }
}
@media screen and (max-width: 767px) {
  .jsSwiperWorks {
    padding: 0 0 9.38% 0;
  }
}

.worksCatPickUpFx {
  margin-top: 21px;
  margin-bottom: 0px;
  margin-left: auto;
  margin-right: auto;
}
@media screen and (max-width: 1299px) {
  .worksCatPickUpFx {
    margin-top: 1.61%;
    margin-bottom: 0%;
    margin-left: auto;
    margin-right: auto;
  }
}
@media screen and (max-width: 767px) {
  .worksCatPickUpFx {
    margin-top: 8px;
    margin-bottom: 0px;
    margin-left: auto;
    margin-right: auto;
    flex-flow: row wrap;
  }
}
@media screen and (max-width: 767px) and (max-width: 1299px) {
  .worksCatPickUpFx {
    margin-top: 2.35%;
    margin-bottom: 0%;
    margin-left: auto;
    margin-right: auto;
  }
}

.jsSwiperWorks .thumbsIndexWorks {
  width: 715px;
  position: relative;
}
@media screen and (max-width: 1299px) {
  .jsSwiperWorks .thumbsIndexWorks {
    width: 55%;
  }
}
@media screen and (max-width: 767px) {
  .jsSwiperWorks .thumbsIndexWorks {
    width: 100%;
  }
}

.thumbsIndexWorksIn {
  width: 100%;
  border-radius: 6px;
  /* CSS3草案 */
  -webkit-border-radius: 6px;
  /* Safari,Google Chrome用 */
  -moz-border-radius: 6px;
  /* Firefox用 */
  overflow: hidden;
  position: relative;
  aspect-ratio: 715/400;
}
@media screen and (max-width: 767px) {
  .thumbsIndexWorksIn {
    aspect-ratio: 340/190;
  }
}

.jsSwiperWorks .thumbsIndexWorksBtn {
  width: 56px;
  aspect-ratio: 1/1;
  position: absolute;
}
@media screen and (max-width: 1299px) {
  .jsSwiperWorks .thumbsIndexWorksBtn {
    width: 7.83%;
  }
}
@media screen and (max-width: 767px) {
  .jsSwiperWorks .thumbsIndexWorksBtn {
    width: 50px;
  }
}
@media screen and (max-width: 767px) and (max-width: 1299px) {
  .jsSwiperWorks .thumbsIndexWorksBtn {
    width: 14.7%;
  }
}

.thumbsIndexWorksBtn img {
  width: 100%;
}

.secCatWorks {
  width: 550px;
  transform: translate(0, 0.4vw);
}
@media screen and (max-width: 1299px) {
  .secCatWorks {
    width: 42.3%;
  }
}
@media screen and (max-width: 767px) {
  .secCatWorks {
    margin: 1.94% auto 0 auto;
    width: 100%;
  }
}

.logoCatWorksFig {
  width: 50px;
  margin-top: 0px;
  margin-bottom: 0px;
  margin-left: 0px;
  margin-right: 12px;
}
@media screen and (max-width: 1299px) {
  .logoCatWorksFig {
    width: 9.09%;
  }
}
@media screen and (max-width: 1299px) {
  .logoCatWorksFig {
    margin: 0% 2.18% 0% 0%;
  }
}
@media screen and (max-width: 767px) {
  .logoCatWorksFig {
    width: 50px;
    margin-top: 0px;
    margin-bottom: 0px;
    margin-left: 0px;
    margin-right: 12px;
  }
}
@media screen and (max-width: 767px) and (max-width: 1299px) {
  .logoCatWorksFig {
    width: 14.7%;
  }
}
@media screen and (max-width: 767px) and (max-width: 1299px) {
  .logoCatWorksFig {
    margin: 0% 3.52% 0% 0%;
  }
}

.txtCopoNameCatWorks {
  width: 488px;
  font-size: 16px;
  line-height: normal;
  letter-spacing: 0.1em;
  text-indent: -0.1em;
}
@media screen and (max-width: 1299px) {
  .txtCopoNameCatWorks {
    width: 88.72%;
  }
}
@media screen and (max-width: 1299px) {
  .txtCopoNameCatWorks {
    font-size: 1.2317167052vw;
  }
}
@media screen and (max-width: 767px) {
  .txtCopoNameCatWorks {
    width: 278px;
    line-height: normal;
    letter-spacing: 0.1em;
    text-indent: -0.1em;
  }
}
@media screen and (max-width: 767px) and (max-width: 1299px) {
  .txtCopoNameCatWorks {
    width: 81.76%;
  }
}
@media screen and (max-width: 767px) and (max-width: 767px) {
  .txtCopoNameCatWorks {
    font-size: 4.2666666667vw;
  }
}

.h3CatWorks {
  margin-top: 8px;
  margin-bottom: 0px;
  margin-left: auto;
  margin-right: auto;
  font-size: 24px;
  line-height: normal;
  letter-spacing: 0.1em;
  text-indent: -0.1em;
}
@media screen and (max-width: 1299px) {
  .h3CatWorks {
    margin-top: 1.45%;
    margin-bottom: 0%;
    margin-left: auto;
    margin-right: auto;
  }
}
@media screen and (max-width: 1299px) {
  .h3CatWorks {
    font-size: 1.8475750577vw;
  }
}
@media screen and (max-width: 767px) {
  .h3CatWorks {
    margin-top: 2px;
    margin-bottom: 0px;
    margin-left: auto;
    margin-right: auto;
    line-height: 1.4;
    letter-spacing: 0.1em;
    text-indent: -0.1em;
  }
}
@media screen and (max-width: 767px) and (max-width: 1299px) {
  .h3CatWorks {
    margin-top: 0.58%;
    margin-bottom: 0%;
    margin-left: auto;
    margin-right: auto;
  }
}
@media screen and (max-width: 767px) and (max-width: 767px) {
  .h3CatWorks {
    font-size: 4.2666666667vw;
  }
}

.btnCopoNameCatWorks {
  margin-top: 22px;
  margin-bottom: 0px;
  margin-left: 0px;
  margin-right: 0px;
  width: 140px;
  border-radius: 20px;
  /* CSS3草案 */
  -webkit-border-radius: 20px;
  /* Safari,Google Chrome用 */
  -moz-border-radius: 20px;
  /* Firefox用 */
  font-size: 12px;
  line-height: normal;
  letter-spacing: 0em;
  text-indent: 0em;
  text-decoration: none;
  aspect-ratio: 140/30;
}
@media screen and (max-width: 1299px) {
  .btnCopoNameCatWorks {
    margin: 4% 0% 0% 0%;
  }
}
@media screen and (max-width: 1299px) {
  .btnCopoNameCatWorks {
    width: 25.45%;
  }
}
@media screen and (max-width: 1299px) {
  .btnCopoNameCatWorks {
    font-size: 0.9237875289vw;
  }
}
@media screen and (max-width: 767px) {
  .btnCopoNameCatWorks {
    margin: 3.7% 0% 0% 0%;
    width: 93px;
    line-height: normal;
    letter-spacing: 0.1em;
    text-indent: -0.1em;
  }
}
@media screen and (max-width: 767px) and (max-width: 1299px) {
  .btnCopoNameCatWorks {
    width: 27.35%;
  }
}
@media screen and (max-width: 767px) and (max-width: 767px) {
  .btnCopoNameCatWorks {
    font-size: 2.6666666667vw;
  }
}

.iconBtnCopoNameCatWorks {
  width: 122px;
  margin: auto;
  background: url(../img/index/iconBtnCopoNameIndexWorks.svg) no-repeat center right;
  background-size: auto 30%;
}
@media screen and (max-width: 1299px) {
  .iconBtnCopoNameCatWorks {
    width: 87.14%;
  }
}
@media screen and (max-width: 767px) {
  .iconBtnCopoNameCatWorks {
    width: 81px;
  }
}
@media screen and (max-width: 767px) and (max-width: 1299px) {
  .iconBtnCopoNameCatWorks {
    width: 87.09%;
  }
}

.paginationSwiperWorks {
  bottom: 0 !important;
  position: absolute;
}

.paginationSwiperWorks .swiper-pagination-bullet {
  position: relative;
  overflow: hidden;
  width: 10px;
  height: 10px;
  margin: 0 4px !important;
  background: #666;
  opacity: 1;
}

.paginationSwiperWorks .swiper-pagination-bullet-active {
  background: #DB2E21;
}

/* ==========================================================================
use＆nameSpace
========================================================================== */
/* ==========================================================================
use＆nameSpace
========================================================================== */
/* ==========================================================================
LAYOUT
========================================================================== */
.worksLoopMain {
  padding-top: 68px;
  padding-bottom: 0px;
  padding-left: 0px;
  padding-right: 0px;
}
@media screen and (max-width: 1299px) {
  .worksLoopMain {
    padding: 3.54% 0% 0% 0%;
  }
}
@media screen and (max-width: 767px) {
  .worksLoopMain {
    padding: 6.6% 0% 0% 0%;
  }
}

@media screen and (max-width: 767px) {
  .ulWorksLoopMain {
    margin-top: 0;
    width: 340px;
  }
}
@media screen and (max-width: 767px) and (max-width: 1299px) {
  .ulWorksLoopMain {
    width: 90.66%;
  }
}

/* ==========================================================================
use＆nameSpace
========================================================================== */
/* ==========================================================================
use＆nameSpace
========================================================================== */
/* ==========================================================================
LAYOUT
========================================================================== */
.mainWorksSingle {
  margin-top: 77px;
  margin-bottom: 0px;
  margin-left: auto;
  margin-right: auto;
  padding-top: 0px;
  padding-bottom: 80px;
  padding-left: 0px;
  padding-right: 0px;
}
@media screen and (max-width: 1299px) {
  .mainWorksSingle {
    margin-top: 4.01%;
    margin-bottom: 0%;
    margin-left: auto;
    margin-right: auto;
  }
}
@media screen and (max-width: 1299px) {
  .mainWorksSingle {
    padding: 0% 0% 4.16% 0%;
  }
}
@media screen and (max-width: 767px) {
  .mainWorksSingle {
    margin-top: 39px;
    margin-bottom: 0px;
    margin-left: auto;
    margin-right: auto;
    padding-top: 0px;
    padding-bottom: 68px;
    padding-left: 0px;
    padding-right: 0px;
  }
}
@media screen and (max-width: 767px) and (max-width: 1299px) {
  .mainWorksSingle {
    margin-top: 10.4%;
    margin-bottom: 0%;
    margin-left: auto;
    margin-right: auto;
  }
}
@media screen and (max-width: 767px) and (max-width: 1299px) {
  .mainWorksSingle {
    padding: 0% 0% 18.13% 0%;
  }
}

.jslighatWorksBoxIframe {
  aspect-ratio: 939/528;
  width: 100%;
}

/* ==========================================================================
use＆nameSpace
========================================================================== */
/* ==========================================================================
use＆nameSpace
========================================================================== */
/* ==========================================================================
LAYOUT
========================================================================== */
.photoWorksSingle {
  overflow: hidden;
}

.photoWorksSingle img {
  object-fit: cover;
  width: 100%;
}

/* ==========================================================================
use＆nameSpace
========================================================================== */
/* ==========================================================================
use＆nameSpace
========================================================================== */
/* ==========================================================================
LAYOUT
========================================================================== */
.mainWorksSingleWap {
  margin-top: 40px;
  margin-bottom: 0px;
  margin-left: auto;
  margin-right: auto;
}
@media screen and (max-width: 1299px) {
  .mainWorksSingleWap {
    margin-top: 3.07%;
    margin-bottom: 0%;
    margin-left: auto;
    margin-right: auto;
  }
}
@media screen and (max-width: 767px) {
  .mainWorksSingleWap {
    margin-top: 53px;
    margin-bottom: 0px;
    margin-left: auto;
    margin-right: auto;
    width: 340px;
  }
}
@media screen and (max-width: 767px) and (max-width: 1299px) {
  .mainWorksSingleWap {
    margin-top: 14.13%;
    margin-bottom: 0%;
    margin-left: auto;
    margin-right: auto;
  }
}
@media screen and (max-width: 767px) and (max-width: 1299px) {
  .mainWorksSingleWap {
    width: 90.66%;
  }
}

.cntMainWorksSingle {
  width: 718px;
  margin: auto;
}
@media screen and (max-width: 1299px) {
  .cntMainWorksSingle {
    width: 55.23%;
  }
}
@media screen and (max-width: 767px) {
  .cntMainWorksSingle {
    width: 100%;
  }
}

.h1MainWorksSingle {
  font-size: 20px;
  line-height: normal;
  letter-spacing: 0.15em;
  text-indent: -0.15em;
}
@media screen and (max-width: 1299px) {
  .h1MainWorksSingle {
    font-size: 1.5396458814vw;
  }
}
@media screen and (max-width: 767px) {
  .h1MainWorksSingle {
    line-height: normal;
    letter-spacing: 0.15em;
    text-indent: -0.15em;
  }
}
@media screen and (max-width: 767px) and (max-width: 767px) {
  .h1MainWorksSingle {
    font-size: 4.2666666667vw;
  }
}

.logoWorksSingle {
  margin-top: 9px;
  margin-bottom: 0px;
  margin-left: auto;
  margin-right: auto;
}
@media screen and (max-width: 1299px) {
  .logoWorksSingle {
    margin-top: 1.25%;
    margin-bottom: 0%;
    margin-left: auto;
    margin-right: auto;
  }
}
@media screen and (max-width: 767px) {
  .logoWorksSingle {
    margin-top: 11px;
    margin-bottom: 0px;
    margin-left: auto;
    margin-right: auto;
  }
}
@media screen and (max-width: 767px) and (max-width: 1299px) {
  .logoWorksSingle {
    margin-top: 3.23%;
    margin-bottom: 0%;
    margin-left: auto;
    margin-right: auto;
  }
}

.logoSingleWorks {
  width: 50px;
  margin-top: 0px;
  margin-bottom: 0px;
  margin-left: 0px;
  margin-right: 21px;
}
@media screen and (max-width: 1299px) {
  .logoSingleWorks {
    width: 6.96%;
  }
}
@media screen and (max-width: 1299px) {
  .logoSingleWorks {
    margin: 0% 2.92% 0% 0%;
  }
}
@media screen and (max-width: 767px) {
  .logoSingleWorks {
    width: 50px;
    margin: 0% 3.5% 0% 0%;
  }
}
@media screen and (max-width: 767px) and (max-width: 1299px) {
  .logoSingleWorks {
    width: 14.7%;
  }
}

.txtCopoNameSingleWorks {
  font-size: 18px;
  line-height: normal;
  letter-spacing: 0.1em;
  text-indent: -0.1em;
}
@media screen and (max-width: 1299px) {
  .txtCopoNameSingleWorks {
    font-size: 1.3856812933vw;
  }
}
@media screen and (max-width: 767px) {
  .txtCopoNameSingleWorks {
    line-height: normal;
    letter-spacing: 0.1em;
    text-indent: -0.1em;
  }
}
@media screen and (max-width: 767px) and (max-width: 767px) {
  .txtCopoNameSingleWorks {
    font-size: 4.2666666667vw;
  }
}

.h2SingleWorks {
  margin-top: 11px;
  margin-bottom: 0px;
  margin-left: 0px;
  margin-right: 0px;
  font-size: 24px;
  line-height: normal;
  letter-spacing: 0.05em;
  text-indent: -0.05em;
}
@media screen and (max-width: 1299px) {
  .h2SingleWorks {
    margin: 1.53% 0% 0% 0%;
  }
}
@media screen and (max-width: 1299px) {
  .h2SingleWorks {
    font-size: 1.8475750577vw;
  }
}
@media screen and (max-width: 767px) {
  .h2SingleWorks {
    margin-top: 8.94%;
    margin-bottom: 0%;
    margin-left: auto;
    margin-right: auto;
    line-height: 1.5;
    letter-spacing: 0em;
    text-indent: 0em;
  }
}
@media screen and (max-width: 767px) and (max-width: 767px) {
  .h2SingleWorks {
    font-size: 4.2666666667vw;
  }
}
@media screen and (max-width: 767px) {
  .h2SingleWorks::before {
    display: block;
    width: 0;
    height: 0;
    margin-top: calc((1 - 1.5) * 0.5em);
    content: "";
  }
  .h2SingleWorks::after {
    display: block;
    width: 0;
    height: 0;
    margin-bottom: calc((1 - 1.5) * 0.5em);
    content: "";
  }
}

.txtSingleWorks {
  margin-top: 26px;
  margin-bottom: 0px;
  margin-left: auto;
  margin-right: auto;
  font-size: 14px;
  line-height: 1.4285714286;
  letter-spacing: 0.05em;
  text-indent: -0.05em;
}
@media screen and (max-width: 1299px) {
  .txtSingleWorks {
    margin-top: 3.62%;
    margin-bottom: 0%;
    margin-left: auto;
    margin-right: auto;
  }
}
@media screen and (max-width: 1299px) {
  .txtSingleWorks {
    font-size: 1.077752117vw;
  }
}
.txtSingleWorks::before {
  display: block;
  width: 0;
  height: 0;
  margin-top: calc((1 - 1.4285714286) * 0.5em);
  content: "";
}
.txtSingleWorks::after {
  display: block;
  width: 0;
  height: 0;
  margin-bottom: calc((1 - 1.4285714286) * 0.5em);
  content: "";
}
@media screen and (max-width: 767px) {
  .txtSingleWorks {
    margin-top: 4.5%;
    margin-bottom: 0%;
    margin-left: auto;
    margin-right: auto;
    line-height: 1.8461538462;
    letter-spacing: 0em;
    text-indent: 0em;
  }
}
@media screen and (max-width: 767px) and (max-width: 767px) {
  .txtSingleWorks {
    font-size: 3.4666666667vw;
  }
}
@media screen and (max-width: 767px) {
  .txtSingleWorks::before {
    display: block;
    width: 0;
    height: 0;
    margin-top: calc((1 - 1.8461538462) * 0.5em);
    content: "";
  }
  .txtSingleWorks::after {
    display: block;
    width: 0;
    height: 0;
    margin-bottom: calc((1 - 1.8461538462) * 0.5em);
    content: "";
  }
}

.btnSingleInterviewLxn {
  margin-top: 18px;
  margin-bottom: 0px;
  margin-left: 0px;
  margin-right: 0px;
  width: 160px;
}
@media screen and (max-width: 1299px) {
  .btnSingleInterviewLxn {
    margin: 2.5% 0% 0% 0%;
  }
}
@media screen and (max-width: 1299px) {
  .btnSingleInterviewLxn {
    width: 22.28%;
  }
}
@media screen and (max-width: 767px) {
  .btnSingleInterviewLxn {
    margin: 3.5% 0% 0% 0%;
    width: 160px;
  }
}
@media screen and (max-width: 767px) and (max-width: 1299px) {
  .btnSingleInterviewLxn {
    width: 47.05%;
  }
}

.btnSingleInterview {
  width: 100%;
  font-size: 10px;
  line-height: normal;
  letter-spacing: 0.05em;
  text-indent: -0.05em;
  border-radius: 20px;
  /* CSS3草案 */
  -webkit-border-radius: 20px;
  /* Safari,Google Chrome用 */
  -moz-border-radius: 20px;
  /* Firefox用 */
  aspect-ratio: 160/20;
  text-decoration: none;
}
@media screen and (max-width: 1299px) {
  .btnSingleInterview {
    font-size: 0.7698229407vw;
  }
}
@media screen and (max-width: 767px) {
  .btnSingleInterview {
    line-height: normal;
    letter-spacing: 0.05em;
    text-indent: -0.05em;
    aspect-ratio: 160/20;
  }
}
@media screen and (max-width: 767px) and (max-width: 767px) {
  .btnSingleInterview {
    font-size: 2.6666666667vw;
  }
}

.iconbtnSingleInterview {
  width: 150px;
  margin: auto;
  background: url(../img/iconbtnSingleInterview.svg) no-repeat right center;
  background-size: auto 80%;
}
@media screen and (max-width: 1299px) {
  .iconbtnSingleInterview {
    width: 93.75%;
  }
}
.cntMainWorksEditor {
  margin-top: 28px;
  margin-bottom: 0px;
  margin-left: auto;
  margin-right: auto;
}
@media screen and (max-width: 1299px) {
  .cntMainWorksEditor {
    margin-top: 3.89%;
    margin-bottom: 0%;
    margin-left: auto;
    margin-right: auto;
  }
}
@media screen and (max-width: 767px) {
  .cntMainWorksEditor {
    margin-top: 10%;
    margin-bottom: 0%;
    margin-left: auto;
    margin-right: auto;
  }
}

.cntMainWorksEditor img {
  max-width: 100%;
  width: auto;
}
.cntMainWorksEditor h1 + img,
.cntMainWorksEditor h2 + img,
.cntMainWorksEditor h3 + img,
.cntMainWorksEditor h4 + img,
.cntMainWorksEditor h5 + img,
.cntMainWorksEditor p + img,
.cntMainWorksEditor ul + img,
.cntMainWorksEditor ol + img,
.cntMainWorksEditor aside + img {
  margin-top: 45px;
  margin-bottom: 0px;
  margin-left: 0px;
  margin-right: 0px;
}
@media screen and (max-width: 1299px) {
  .cntMainWorksEditor h1 + img,
  .cntMainWorksEditor h2 + img,
  .cntMainWorksEditor h3 + img,
  .cntMainWorksEditor h4 + img,
  .cntMainWorksEditor h5 + img,
  .cntMainWorksEditor p + img,
  .cntMainWorksEditor ul + img,
  .cntMainWorksEditor ol + img,
  .cntMainWorksEditor aside + img {
    margin: 6.26% 0% 0% 0%;
  }
}
@media screen and (max-width: 767px) {
  .cntMainWorksEditor h1 + img,
  .cntMainWorksEditor h2 + img,
  .cntMainWorksEditor h3 + img,
  .cntMainWorksEditor h4 + img,
  .cntMainWorksEditor h5 + img,
  .cntMainWorksEditor p + img,
  .cntMainWorksEditor ul + img,
  .cntMainWorksEditor ol + img,
  .cntMainWorksEditor aside + img {
    margin-top: 11.63%;
  }
}
.cntMainWorksEditor h1 {
  font-size: 14px;
  line-height: 2.1428571429;
  letter-spacing: 0.05em;
  text-indent: -0.05em;
}
@media screen and (max-width: 1299px) {
  .cntMainWorksEditor h1 {
    font-size: 1.077752117vw;
  }
}
.cntMainWorksEditor h1::before {
  display: block;
  width: 0;
  height: 0;
  margin-top: calc((1 - 2.1428571429) * 0.5em);
  content: "";
}
.cntMainWorksEditor h1::after {
  display: block;
  width: 0;
  height: 0;
  margin-bottom: calc((1 - 2.1428571429) * 0.5em);
  content: "";
}
@media screen and (max-width: 767px) and (max-width: 767px) {
  .cntMainWorksEditor h1 {
    font-size: 3.7333333333vw;
  }
}
.cntMainWorksEditor h1 + h1,
.cntMainWorksEditor h2 + h1,
.cntMainWorksEditor h3 + h1,
.cntMainWorksEditor h4 + h1,
.cntMainWorksEditor h5 + h1,
.cntMainWorksEditor p + h1,
.cntMainWorksEditor ul + h1,
.cntMainWorksEditor ol + h1,
.cntMainWorksEditor img + h1,
.cntMainWorksEditor aside + h1 {
  margin-top: 28px;
  margin-bottom: 0px;
  margin-left: auto;
  margin-right: auto;
}
@media screen and (max-width: 1299px) {
  .cntMainWorksEditor h1 + h1,
  .cntMainWorksEditor h2 + h1,
  .cntMainWorksEditor h3 + h1,
  .cntMainWorksEditor h4 + h1,
  .cntMainWorksEditor h5 + h1,
  .cntMainWorksEditor p + h1,
  .cntMainWorksEditor ul + h1,
  .cntMainWorksEditor ol + h1,
  .cntMainWorksEditor img + h1,
  .cntMainWorksEditor aside + h1 {
    margin-top: 3.89%;
    margin-bottom: 0%;
    margin-left: auto;
    margin-right: auto;
  }
}
@media screen and (max-width: 767px) {
  .cntMainWorksEditor h1 + h1,
  .cntMainWorksEditor h2 + h1,
  .cntMainWorksEditor h3 + h1,
  .cntMainWorksEditor h4 + h1,
  .cntMainWorksEditor h5 + h1,
  .cntMainWorksEditor p + h1,
  .cntMainWorksEditor ul + h1,
  .cntMainWorksEditor ol + h1,
  .cntMainWorksEditor img + h1,
  .cntMainWorksEditor aside + h1 {
    margin-top: 13.76%;
    margin-bottom: 0%;
    margin-left: auto;
    margin-right: auto;
  }
}
.cntMainWorksEditor h2 {
  font-size: 18px;
  line-height: normal;
  letter-spacing: 0.05em;
  text-indent: -0.05em;
  font-weight: 500;
  background: #F2F2F2;
}
@media screen and (max-width: 1299px) {
  .cntMainWorksEditor h2 {
    font-size: 1.3856812933vw;
  }
}
@media screen and (max-width: 767px) and (max-width: 767px) {
  .cntMainWorksEditor h2 {
    font-size: 4.2666666667vw;
  }
}
.cntMainWorksEditor h1 + h2,
.cntMainWorksEditor h2 + h2,
.cntMainWorksEditor h3 + h2,
.cntMainWorksEditor h4 + h2,
.cntMainWorksEditor h5 + h2,
.cntMainWorksEditor p + h2,
.cntMainWorksEditor ul + h2,
.cntMainWorksEditor ol + h2,
.cntMainWorksEditor img + h2,
.cntMainWorksEditor aside + h2 {
  margin-top: 14px;
  margin-bottom: 0px;
  margin-left: auto;
  margin-right: auto;
}
@media screen and (max-width: 1299px) {
  .cntMainWorksEditor h1 + h2,
  .cntMainWorksEditor h2 + h2,
  .cntMainWorksEditor h3 + h2,
  .cntMainWorksEditor h4 + h2,
  .cntMainWorksEditor h5 + h2,
  .cntMainWorksEditor p + h2,
  .cntMainWorksEditor ul + h2,
  .cntMainWorksEditor ol + h2,
  .cntMainWorksEditor img + h2,
  .cntMainWorksEditor aside + h2 {
    margin-top: 1.94%;
    margin-bottom: 0%;
    margin-left: auto;
    margin-right: auto;
  }
}
@media screen and (max-width: 767px) {
  .cntMainWorksEditor h1 + h2,
  .cntMainWorksEditor h2 + h2,
  .cntMainWorksEditor h3 + h2,
  .cntMainWorksEditor h4 + h2,
  .cntMainWorksEditor h5 + h2,
  .cntMainWorksEditor p + h2,
  .cntMainWorksEditor ul + h2,
  .cntMainWorksEditor ol + h2,
  .cntMainWorksEditor img + h2,
  .cntMainWorksEditor aside + h2 {
    margin-top: 4.5%;
    margin-bottom: 0%;
    margin-left: auto;
    margin-right: auto;
  }
}
.cntMainWorksEditor p {
  margin-top: 12px;
  margin-bottom: 0px;
  margin-left: auto;
  margin-right: auto;
  font-size: 14px;
  line-height: 1.4285714286;
  letter-spacing: 0.05em;
  text-indent: -0.05em;
}
@media screen and (max-width: 1299px) {
  .cntMainWorksEditor p {
    margin-top: 1.67%;
    margin-bottom: 0%;
    margin-left: auto;
    margin-right: auto;
  }
}
@media screen and (max-width: 1299px) {
  .cntMainWorksEditor p {
    font-size: 1.077752117vw;
  }
}
.cntMainWorksEditor p::before {
  display: block;
  width: 0;
  height: 0;
  margin-top: calc((1 - 1.4285714286) * 0.5em);
  content: "";
}
.cntMainWorksEditor p::after {
  display: block;
  width: 0;
  height: 0;
  margin-bottom: calc((1 - 1.4285714286) * 0.5em);
  content: "";
}
@media screen and (max-width: 767px) {
  .cntMainWorksEditor p {
    margin-top: 12px;
    margin-bottom: 0px;
    margin-left: auto;
    margin-right: auto;
    line-height: 1.8461538462;
    letter-spacing: 0em;
    text-indent: 0em;
  }
}
@media screen and (max-width: 767px) and (max-width: 1299px) {
  .cntMainWorksEditor p {
    margin-top: 3.52%;
    margin-bottom: 0%;
    margin-left: auto;
    margin-right: auto;
  }
}
@media screen and (max-width: 767px) and (max-width: 767px) {
  .cntMainWorksEditor p {
    font-size: 3.4666666667vw;
  }
}
@media screen and (max-width: 767px) {
  .cntMainWorksEditor p::before {
    display: block;
    width: 0;
    height: 0;
    margin-top: calc((1 - 1.8461538462) * 0.5em);
    content: "";
  }
  .cntMainWorksEditor p::after {
    display: block;
    width: 0;
    height: 0;
    margin-bottom: calc((1 - 1.8461538462) * 0.5em);
    content: "";
  }
}
.cntMainWorksEditor h1 + p,
.cntMainWorksEditor h2 + p,
.cntMainWorksEditor h3 + p,
.cntMainWorksEditor h4 + p,
.cntMainWorksEditor h5 + p,
.cntMainWorksEditor p + p,
.cntMainWorksEditor ul + p,
.cntMainWorksEditor ol + p,
.cntMainWorksEditor img + p,
.cntMainWorksEditor aside + p {
  margin-top: 12px;
  margin-bottom: 0px;
  margin-left: auto;
  margin-right: auto;
}
@media screen and (max-width: 1299px) {
  .cntMainWorksEditor h1 + p,
  .cntMainWorksEditor h2 + p,
  .cntMainWorksEditor h3 + p,
  .cntMainWorksEditor h4 + p,
  .cntMainWorksEditor h5 + p,
  .cntMainWorksEditor p + p,
  .cntMainWorksEditor ul + p,
  .cntMainWorksEditor ol + p,
  .cntMainWorksEditor img + p,
  .cntMainWorksEditor aside + p {
    margin-top: 1.67%;
    margin-bottom: 0%;
    margin-left: auto;
    margin-right: auto;
  }
}
@media screen and (max-width: 767px) {
  .cntMainWorksEditor h1 + p,
  .cntMainWorksEditor h2 + p,
  .cntMainWorksEditor h3 + p,
  .cntMainWorksEditor h4 + p,
  .cntMainWorksEditor h5 + p,
  .cntMainWorksEditor p + p,
  .cntMainWorksEditor ul + p,
  .cntMainWorksEditor ol + p,
  .cntMainWorksEditor img + p,
  .cntMainWorksEditor aside + p {
    margin-top: 12px;
    margin-bottom: 0px;
    margin-left: auto;
    margin-right: auto;
  }
}
@media screen and (max-width: 767px) and (max-width: 1299px) {
  .cntMainWorksEditor h1 + p,
  .cntMainWorksEditor h2 + p,
  .cntMainWorksEditor h3 + p,
  .cntMainWorksEditor h4 + p,
  .cntMainWorksEditor h5 + p,
  .cntMainWorksEditor p + p,
  .cntMainWorksEditor ul + p,
  .cntMainWorksEditor ol + p,
  .cntMainWorksEditor img + p,
  .cntMainWorksEditor aside + p {
    margin-top: 3.52%;
    margin-bottom: 0%;
    margin-left: auto;
    margin-right: auto;
  }
}
.cntMainWorksEditor .aligncenter {
  margin-left: auto !important;
  margin-right: auto !important;
}
.cntMainWorksEditor .alignleft {
  float: left;
  margin-left: 0 !important;
  margin-right: auto !important;
}
.cntMainWorksEditor .alignright {
  margin-left: auto !important;
  margin-right: 0 !important;
}
.cntMainWorksEditor .alignnone {
  margin-left: 0 !important;
  margin-right: 0 !important;
}
.cntMainWorksEditor .ulAsideRelatedArticlesBlog {
  margin-top: 12px;
  margin-bottom: 0px;
  margin-left: auto;
  margin-right: auto;
  padding: 0;
  width: 659px;
}
@media screen and (max-width: 1299px) {
  .cntMainWorksEditor .ulAsideRelatedArticlesBlog {
    margin-top: 1.67%;
    margin-bottom: 0%;
    margin-left: auto;
    margin-right: auto;
  }
}
@media screen and (max-width: 1299px) {
  .cntMainWorksEditor .ulAsideRelatedArticlesBlog {
    width: 91.78%;
  }
}
@media screen and (max-width: 767px) {
  .cntMainWorksEditor .ulAsideRelatedArticlesBlog {
    margin-top: 7px;
    margin-bottom: 0px;
    margin-left: auto;
    margin-right: auto;
    width: 300px;
  }
}
@media screen and (max-width: 767px) and (max-width: 1299px) {
  .cntMainWorksEditor .ulAsideRelatedArticlesBlog {
    margin-top: 2.12%;
    margin-bottom: 0%;
    margin-left: auto;
    margin-right: auto;
  }
}
@media screen and (max-width: 767px) and (max-width: 1299px) {
  .cntMainWorksEditor .ulAsideRelatedArticlesBlog {
    width: 90.9%;
  }
}
.cntMainWorksEditor .liAsideRelatedArticlesBlog {
  padding: 0;
  list-style: none;
}

.mainSingleBlogCntTopVideo {
  margin-top: 30px;
  margin-bottom: 0px;
  margin-left: auto;
  margin-right: auto;
  position: relative;
  aspect-ratio: 718/402;
  overflow: hidden;
  border-radius: 6px;
  /* CSS3草案 */
  -webkit-border-radius: 6px;
  /* Safari,Google Chrome用 */
  -moz-border-radius: 6px;
  /* Firefox用 */
}
@media screen and (max-width: 1299px) {
  .mainSingleBlogCntTopVideo {
    margin-top: 4.17%;
    margin-bottom: 0%;
    margin-left: auto;
    margin-right: auto;
  }
}
@media screen and (max-width: 767px) {
  .mainSingleBlogCntTopVideo {
    margin-top: 22px;
    margin-bottom: 0px;
    margin-left: auto;
    margin-right: auto;
    aspect-ratio: 340/190;
    border-radius: 6px;
    /* CSS3草案 */
    -webkit-border-radius: 6px;
    /* Safari,Google Chrome用 */
    -moz-border-radius: 6px;
    /* Firefox用 */
  }
}
@media screen and (max-width: 767px) and (max-width: 1299px) {
  .mainSingleBlogCntTopVideo {
    margin-top: 6.47%;
    margin-bottom: 0%;
    margin-left: auto;
    margin-right: auto;
  }
}

.mainSingleBlogCntTopVideo iframe {
  position: absolute;
  width: 100%;
  height: 100%;
  object-fit: cover;
}

/* ==========================================================================
use＆nameSpace
========================================================================== */
/* ==========================================================================
use＆nameSpace
========================================================================== */
/* ==========================================================================
LAYOUT
========================================================================== */
.cntMainWorksInterviewEditorLxn {
  margin-top: 74px;
  margin-bottom: 0px;
  margin-left: auto;
  margin-right: auto;
  width: 718px;
}
@media screen and (max-width: 1299px) {
  .cntMainWorksInterviewEditorLxn {
    margin-top: 5.69%;
    margin-bottom: 0%;
    margin-left: auto;
    margin-right: auto;
  }
}
@media screen and (max-width: 1299px) {
  .cntMainWorksInterviewEditorLxn {
    width: 55.23%;
  }
}
@media screen and (max-width: 767px) {
  .cntMainWorksInterviewEditorLxn {
    margin-top: 13.46%;
    margin-bottom: 0%;
    margin-left: auto;
    margin-right: auto;
    width: 100%;
  }
}

.h2MainWorksInterviewEditor {
  font-size: 20px;
  line-height: normal;
  letter-spacing: 0.1em;
  text-indent: -0.1em;
}
@media screen and (max-width: 1299px) {
  .h2MainWorksInterviewEditor {
    font-size: 1.5396458814vw;
  }
}
@media screen and (max-width: 767px) {
  .h2MainWorksInterviewEditor {
    line-height: normal;
    letter-spacing: 0.1em;
    text-indent: -0.1em;
  }
}
@media screen and (max-width: 767px) and (max-width: 767px) {
  .h2MainWorksInterviewEditor {
    font-size: 4.2666666667vw;
  }
}

.cntMainWorksInterviewEditorLxn .cntMainWorksEditor {
  margin-top: 24px;
  margin-bottom: 0px;
  margin-left: auto;
  margin-right: auto;
}
@media screen and (max-width: 1299px) {
  .cntMainWorksInterviewEditorLxn .cntMainWorksEditor {
    margin-top: 3.34%;
    margin-bottom: 0%;
    margin-left: auto;
    margin-right: auto;
  }
}
@media screen and (max-width: 767px) {
  .cntMainWorksInterviewEditorLxn .cntMainWorksEditor {
    margin-top: 5.41%;
    margin-bottom: 0%;
    margin-left: auto;
    margin-right: auto;
  }
}
.cntMainWorksInterviewEditorLxn img {
  max-width: 100%;
  width: auto;
}
.cntMainWorksInterviewEditorLxn h1 + img,
.cntMainWorksInterviewEditorLxn h2 + img,
.cntMainWorksInterviewEditorLxn h3 + img,
.cntMainWorksInterviewEditorLxn h4 + img,
.cntMainWorksInterviewEditorLxn h5 + img,
.cntMainWorksInterviewEditorLxn p + img,
.cntMainWorksInterviewEditorLxn ul + img,
.cntMainWorksInterviewEditorLxn ol + img,
.cntMainWorksInterviewEditorLxn aside + img {
  margin-top: 35px;
  margin-bottom: 0px;
  margin-left: 0px;
  margin-right: 0px;
}
@media screen and (max-width: 1299px) {
  .cntMainWorksInterviewEditorLxn h1 + img,
  .cntMainWorksInterviewEditorLxn h2 + img,
  .cntMainWorksInterviewEditorLxn h3 + img,
  .cntMainWorksInterviewEditorLxn h4 + img,
  .cntMainWorksInterviewEditorLxn h5 + img,
  .cntMainWorksInterviewEditorLxn p + img,
  .cntMainWorksInterviewEditorLxn ul + img,
  .cntMainWorksInterviewEditorLxn ol + img,
  .cntMainWorksInterviewEditorLxn aside + img {
    margin: 4.87% 0% 0% 0%;
  }
}
@media screen and (max-width: 767px) {
  .cntMainWorksInterviewEditorLxn h1 + img,
  .cntMainWorksInterviewEditorLxn h2 + img,
  .cntMainWorksInterviewEditorLxn h3 + img,
  .cntMainWorksInterviewEditorLxn h4 + img,
  .cntMainWorksInterviewEditorLxn h5 + img,
  .cntMainWorksInterviewEditorLxn p + img,
  .cntMainWorksInterviewEditorLxn ul + img,
  .cntMainWorksInterviewEditorLxn ol + img,
  .cntMainWorksInterviewEditorLxn aside + img {
    margin-top: 11.63%;
  }
}
.cntMainWorksInterviewEditorLxn h1 {
  margin-top: 40px;
  margin-bottom: 0px;
  margin-left: auto;
  margin-right: auto;
  font-size: 20px;
  line-height: normal;
  letter-spacing: 0.05em;
  text-indent: -0.05em;
}
@media screen and (max-width: 1299px) {
  .cntMainWorksInterviewEditorLxn h1 {
    margin-top: 5.57%;
    margin-bottom: 0%;
    margin-left: auto;
    margin-right: auto;
  }
}
@media screen and (max-width: 1299px) {
  .cntMainWorksInterviewEditorLxn h1 {
    font-size: 1.5396458814vw;
  }
}
@media screen and (max-width: 767px) {
  .cntMainWorksInterviewEditorLxn h1 {
    font-weight: 400;
    margin-top: 9.94%;
    margin-bottom: 0%;
    margin-left: auto;
    margin-right: auto;
  }
}
@media screen and (max-width: 767px) and (max-width: 767px) {
  .cntMainWorksInterviewEditorLxn h1 {
    font-size: 4.2666666667vw;
  }
}
.cntMainWorksInterviewEditorLxn h1 + h1,
.cntMainWorksInterviewEditorLxn h2 + h1,
.cntMainWorksInterviewEditorLxn h3 + h1,
.cntMainWorksInterviewEditorLxn h4 + h1,
.cntMainWorksInterviewEditorLxn h5 + h1,
.cntMainWorksInterviewEditorLxn p + h1,
.cntMainWorksInterviewEditorLxn ul + h1,
.cntMainWorksInterviewEditorLxn ol + h1,
.cntMainWorksInterviewEditorLxn img + h1,
.cntMainWorksInterviewEditorLxn aside + h1 {
  margin-top: 40px;
  margin-bottom: 0px;
  margin-left: auto;
  margin-right: auto;
}
@media screen and (max-width: 1299px) {
  .cntMainWorksInterviewEditorLxn h1 + h1,
  .cntMainWorksInterviewEditorLxn h2 + h1,
  .cntMainWorksInterviewEditorLxn h3 + h1,
  .cntMainWorksInterviewEditorLxn h4 + h1,
  .cntMainWorksInterviewEditorLxn h5 + h1,
  .cntMainWorksInterviewEditorLxn p + h1,
  .cntMainWorksInterviewEditorLxn ul + h1,
  .cntMainWorksInterviewEditorLxn ol + h1,
  .cntMainWorksInterviewEditorLxn img + h1,
  .cntMainWorksInterviewEditorLxn aside + h1 {
    margin-top: 5.57%;
    margin-bottom: 0%;
    margin-left: auto;
    margin-right: auto;
  }
}
@media screen and (max-width: 767px) {
  .cntMainWorksInterviewEditorLxn h1 + h1,
  .cntMainWorksInterviewEditorLxn h2 + h1,
  .cntMainWorksInterviewEditorLxn h3 + h1,
  .cntMainWorksInterviewEditorLxn h4 + h1,
  .cntMainWorksInterviewEditorLxn h5 + h1,
  .cntMainWorksInterviewEditorLxn p + h1,
  .cntMainWorksInterviewEditorLxn ul + h1,
  .cntMainWorksInterviewEditorLxn ol + h1,
  .cntMainWorksInterviewEditorLxn img + h1,
  .cntMainWorksInterviewEditorLxn aside + h1 {
    margin-top: 9.94%;
    margin-bottom: 0%;
    margin-left: auto;
    margin-right: auto;
  }
}
.cntMainWorksInterviewEditorLxn p {
  margin-top: 25px;
  margin-bottom: 0px;
  margin-left: auto;
  margin-right: auto;
  font-size: 17px;
  line-height: normal;
  letter-spacing: 0em;
  text-indent: 0em;
  font-weight: 400;
}
@media screen and (max-width: 1299px) {
  .cntMainWorksInterviewEditorLxn p {
    margin-top: 3.48%;
    margin-bottom: 0%;
    margin-left: auto;
    margin-right: auto;
  }
}
@media screen and (max-width: 1299px) {
  .cntMainWorksInterviewEditorLxn p {
    font-size: 1.3086989992vw;
  }
}
@media screen and (max-width: 767px) {
  .cntMainWorksInterviewEditorLxn p {
    margin-top: 5.3%;
    margin-bottom: 0%;
    margin-left: auto;
    margin-right: auto;
    line-height: 1.8461538462;
    letter-spacing: 0em;
    text-indent: 0em;
  }
}
@media screen and (max-width: 767px) and (max-width: 767px) {
  .cntMainWorksInterviewEditorLxn p {
    font-size: 3.4666666667vw;
  }
}
@media screen and (max-width: 767px) {
  .cntMainWorksInterviewEditorLxn p::before {
    display: block;
    width: 0;
    height: 0;
    margin-top: calc((1 - 1.8461538462) * 0.5em);
    content: "";
  }
  .cntMainWorksInterviewEditorLxn p::after {
    display: block;
    width: 0;
    height: 0;
    margin-bottom: calc((1 - 1.8461538462) * 0.5em);
    content: "";
  }
}
.cntMainWorksInterviewEditorLxn h1 + p,
.cntMainWorksInterviewEditorLxn h2 + p,
.cntMainWorksInterviewEditorLxn h3 + p,
.cntMainWorksInterviewEditorLxn h4 + p,
.cntMainWorksInterviewEditorLxn h5 + p,
.cntMainWorksInterviewEditorLxn p + p,
.cntMainWorksInterviewEditorLxn ul + p,
.cntMainWorksInterviewEditorLxn ol + p,
.cntMainWorksInterviewEditorLxn img + p,
.cntMainWorksInterviewEditorLxn aside + p {
  margin-top: 25px;
  margin-bottom: 0px;
  margin-left: auto;
  margin-right: auto;
}
@media screen and (max-width: 1299px) {
  .cntMainWorksInterviewEditorLxn h1 + p,
  .cntMainWorksInterviewEditorLxn h2 + p,
  .cntMainWorksInterviewEditorLxn h3 + p,
  .cntMainWorksInterviewEditorLxn h4 + p,
  .cntMainWorksInterviewEditorLxn h5 + p,
  .cntMainWorksInterviewEditorLxn p + p,
  .cntMainWorksInterviewEditorLxn ul + p,
  .cntMainWorksInterviewEditorLxn ol + p,
  .cntMainWorksInterviewEditorLxn img + p,
  .cntMainWorksInterviewEditorLxn aside + p {
    margin-top: 3.48%;
    margin-bottom: 0%;
    margin-left: auto;
    margin-right: auto;
  }
}
@media screen and (max-width: 767px) {
  .cntMainWorksInterviewEditorLxn h1 + p,
  .cntMainWorksInterviewEditorLxn h2 + p,
  .cntMainWorksInterviewEditorLxn h3 + p,
  .cntMainWorksInterviewEditorLxn h4 + p,
  .cntMainWorksInterviewEditorLxn h5 + p,
  .cntMainWorksInterviewEditorLxn p + p,
  .cntMainWorksInterviewEditorLxn ul + p,
  .cntMainWorksInterviewEditorLxn ol + p,
  .cntMainWorksInterviewEditorLxn img + p,
  .cntMainWorksInterviewEditorLxn aside + p {
    margin-top: 10px;
    margin-bottom: 0px;
    margin-left: auto;
    margin-right: auto;
  }
}
@media screen and (max-width: 767px) and (max-width: 1299px) {
  .cntMainWorksInterviewEditorLxn h1 + p,
  .cntMainWorksInterviewEditorLxn h2 + p,
  .cntMainWorksInterviewEditorLxn h3 + p,
  .cntMainWorksInterviewEditorLxn h4 + p,
  .cntMainWorksInterviewEditorLxn h5 + p,
  .cntMainWorksInterviewEditorLxn p + p,
  .cntMainWorksInterviewEditorLxn ul + p,
  .cntMainWorksInterviewEditorLxn ol + p,
  .cntMainWorksInterviewEditorLxn img + p,
  .cntMainWorksInterviewEditorLxn aside + p {
    margin-top: 2.94%;
    margin-bottom: 0%;
    margin-left: auto;
    margin-right: auto;
  }
}
.cntMainWorksInterviewEditorLxn .aligncenter {
  margin-left: auto !important;
  margin-right: auto !important;
}
.cntMainWorksInterviewEditorLxn .alignleft {
  float: left;
  margin-left: 0 !important;
  margin-right: auto !important;
}
.cntMainWorksInterviewEditorLxn .alignright {
  margin-left: auto !important;
  margin-right: 0 !important;
}
.cntMainWorksInterviewEditorLxn .alignnone {
  margin-left: 0 !important;
  margin-right: 0 !important;
}

/* ==========================================================================
use＆nameSpace
========================================================================== */
/* ==========================================================================
use＆nameSpace
========================================================================== */
/* ==========================================================================
LAYOUT
========================================================================== */
@media screen and (max-width: 767px) {
  .mainWorksSingle .btnBackMainSingleBlogTopLxn {
    width: 54.5%;
  }
}

/* ==========================================================================
use＆nameSpace
========================================================================== */
/* ==========================================================================
use＆nameSpace
========================================================================== */
/* ==========================================================================
LAYOUT
========================================================================== */
.pcbrdPagerWorksSingle {
  margin-top: 80px;
  margin-bottom: 0px;
  margin-left: auto;
  margin-right: auto;
  height: 1px;
  width: 100%;
  background: #D1D1D1;
}
@media screen and (max-width: 1299px) {
  .pcbrdPagerWorksSingle {
    margin-top: 4.16%;
    margin-bottom: 0%;
    margin-left: auto;
    margin-right: auto;
  }
}
@media screen and (max-width: 767px) {
  .pcbrdPagerWorksSingle {
    margin-top: 35px;
    margin-bottom: 0px;
    margin-left: auto;
    margin-right: auto;
    width: 100%;
  }
}
@media screen and (max-width: 767px) and (max-width: 1299px) {
  .pcbrdPagerWorksSingle {
    margin-top: 9.33%;
    margin-bottom: 0%;
    margin-left: auto;
    margin-right: auto;
  }
}

.brdPagerWorksSingleRec {
  margin-top: 38px;
  margin-bottom: 0px;
  margin-left: auto;
  margin-right: auto;
}
@media screen and (max-width: 1299px) {
  .brdPagerWorksSingleRec {
    margin-top: 1.97%;
    margin-bottom: 0%;
    margin-left: auto;
    margin-right: auto;
  }
}
@media screen and (max-width: 767px) {
  .brdPagerWorksSingleRec {
    margin-top: 34px;
    margin-bottom: 0px;
    margin-left: auto;
    margin-right: auto;
    width: 340px;
  }
}
@media screen and (max-width: 767px) and (max-width: 1299px) {
  .brdPagerWorksSingleRec {
    margin-top: 9.06%;
    margin-bottom: 0%;
    margin-left: auto;
    margin-right: auto;
  }
}
@media screen and (max-width: 767px) and (max-width: 1299px) {
  .brdPagerWorksSingleRec {
    width: 90.66%;
  }
}

.h2RecWorksInfo {
  font-size: 20px;
  line-height: 1.75;
  letter-spacing: 0em;
  text-indent: 0em;
}
@media screen and (max-width: 1299px) {
  .h2RecWorksInfo {
    font-size: 1.5396458814vw;
  }
}
.h2RecWorksInfo::before {
  display: block;
  width: 0;
  height: 0;
  margin-top: calc((1 - 1.75) * 0.5em);
  content: "";
}
.h2RecWorksInfo::after {
  display: block;
  width: 0;
  height: 0;
  margin-bottom: calc((1 - 1.75) * 0.5em);
  content: "";
}
@media screen and (max-width: 767px) {
  .h2RecWorksInfo {
    line-height: 2.1875;
    letter-spacing: 0em;
    text-indent: 0em;
  }
}
@media screen and (max-width: 767px) and (max-width: 767px) {
  .h2RecWorksInfo {
    font-size: 4.2666666667vw;
  }
}
@media screen and (max-width: 767px) {
  .h2RecWorksInfo::before {
    display: block;
    width: 0;
    height: 0;
    margin-top: calc((1 - 2.1875) * 0.5em);
    content: "";
  }
  .h2RecWorksInfo::after {
    display: block;
    width: 0;
    height: 0;
    margin-bottom: calc((1 - 2.1875) * 0.5em);
    content: "";
  }
}

.ulSingleWorksRec {
  margin-top: 28px;
  margin-bottom: 0px;
  margin-left: auto;
  margin-right: auto;
}
@media screen and (max-width: 1299px) {
  .ulSingleWorksRec {
    margin-top: 2.15%;
    margin-bottom: 0%;
    margin-left: auto;
    margin-right: auto;
  }
}
@media screen and (max-width: 767px) {
  .ulSingleWorksRec {
    margin-top: 8.15%;
    margin-bottom: 0%;
    margin-left: auto;
    margin-right: auto;
  }
}

/* ==========================================================================
Component
========================================================================== */
.animsition,
.animsition-overlay {
  position: relative;
  opacity: 0;
  -webkit-animation-fill-mode: both;
  animation-fill-mode: both;
}

/**
 * overlay option
 */
.animsition-overlay-slide {
  position: fixed;
  z-index: 1;
  width: 100%;
  height: 100%;
  background-color: #ddd;
}

/* loading option */
.animsition-loading,
.animsition-loading:after {
  width: 32px;
  height: 32px;
  position: fixed;
  top: 50%;
  left: 50%;
  margin-top: -16px;
  margin-left: -16px;
  border-radius: 50%;
  z-index: 100;
}

.animsition-loading {
  background-color: transparent;
  border-top: 5px solid rgba(0, 0, 0, 0.2);
  border-right: 5px solid rgba(0, 0, 0, 0.2);
  border-bottom: 5px solid rgba(0, 0, 0, 0.2);
  border-left: 5px solid #eee;
  -webkit-transform: translateZ(0);
  transform: translateZ(0);
  -webkit-animation-iteration-count: infinite;
  animation-iteration-count: infinite;
  -webkit-animation-timing-function: linear;
  animation-timing-function: linear;
  -webkit-animation-duration: 0.8s;
  animation-duration: 0.8s;
  -webkit-animation-name: animsition-loading;
  animation-name: animsition-loading;
}

@-webkit-keyframes animsition-loading {
  0% {
    -webkit-transform: rotate(0deg);
    transform: rotate(0deg);
  }
  100% {
    -webkit-transform: rotate(360deg);
    transform: rotate(360deg);
  }
}
@keyframes animsition-loading {
  0% {
    -webkit-transform: rotate(0deg);
    transform: rotate(0deg);
  }
  100% {
    -webkit-transform: rotate(360deg);
    transform: rotate(360deg);
  }
}
@-webkit-keyframes fade-in {
  0% {
    opacity: 0;
  }
  100% {
    opacity: 1;
  }
}
@keyframes fade-in {
  0% {
    opacity: 0;
  }
  100% {
    opacity: 1;
  }
}
.fade-in {
  -webkit-animation-name: fade-in;
  animation-name: fade-in;
}

@-webkit-keyframes fade-out {
  0% {
    opacity: 1;
  }
  100% {
    opacity: 0;
  }
}
@keyframes fade-out {
  0% {
    opacity: 1;
  }
  100% {
    opacity: 0;
  }
}
.fade-out {
  -webkit-animation-name: fade-out;
  animation-name: fade-out;
}

@-webkit-keyframes fade-in-up {
  0% {
    -webkit-transform: translateY(500px);
    transform: translateY(500px);
    opacity: 0;
  }
  100% {
    -webkit-transform: translateY(0);
    transform: translateY(0);
    opacity: 1;
  }
}
@keyframes fade-in-up {
  0% {
    -webkit-transform: translateY(500px);
    transform: translateY(500px);
    opacity: 0;
  }
  100% {
    -webkit-transform: translateY(0);
    transform: translateY(0);
    opacity: 1;
  }
}
.fade-in-up {
  -webkit-animation-name: fade-in-up;
  animation-name: fade-in-up;
}

@-webkit-keyframes fade-out-up {
  0% {
    -webkit-transform: translateY(0);
    transform: translateY(0);
    opacity: 1;
  }
  100% {
    -webkit-transform: translateY(-500px);
    transform: translateY(-500px);
    opacity: 0;
  }
}
@keyframes fade-out-up {
  0% {
    -webkit-transform: translateY(0);
    transform: translateY(0);
    opacity: 1;
  }
  100% {
    -webkit-transform: translateY(-500px);
    transform: translateY(-500px);
    opacity: 0;
  }
}
.fade-out-up {
  -webkit-animation-name: fade-out-up;
  animation-name: fade-out-up;
}

@-webkit-keyframes fade-in-up-sm {
  0% {
    -webkit-transform: translateY(100px);
    transform: translateY(100px);
    opacity: 0;
  }
  100% {
    -webkit-transform: translateY(0);
    transform: translateY(0);
    opacity: 1;
  }
}
@keyframes fade-in-up-sm {
  0% {
    -webkit-transform: translateY(100px);
    transform: translateY(100px);
    opacity: 0;
  }
  100% {
    -webkit-transform: translateY(0);
    transform: translateY(0);
    opacity: 1;
  }
}
.fade-in-up-sm {
  -webkit-animation-name: fade-in-up-sm;
  animation-name: fade-in-up-sm;
}

@-webkit-keyframes fade-out-up-sm {
  0% {
    -webkit-transform: translateY(0);
    transform: translateY(0);
    opacity: 1;
  }
  100% {
    -webkit-transform: translateY(-100px);
    transform: translateY(-100px);
    opacity: 0;
  }
}
@keyframes fade-out-up-sm {
  0% {
    -webkit-transform: translateY(0);
    transform: translateY(0);
    opacity: 1;
  }
  100% {
    -webkit-transform: translateY(-100px);
    transform: translateY(-100px);
    opacity: 0;
  }
}
.fade-out-up-sm {
  -webkit-animation-name: fade-out-up-sm;
  animation-name: fade-out-up-sm;
}

@-webkit-keyframes fade-in-up-lg {
  0% {
    -webkit-transform: translateY(1000px);
    transform: translateY(1000px);
    opacity: 0;
  }
  100% {
    -webkit-transform: translateY(0);
    transform: translateY(0);
    opacity: 1;
  }
}
@keyframes fade-in-up-lg {
  0% {
    -webkit-transform: translateY(1000px);
    transform: translateY(1000px);
    opacity: 0;
  }
  100% {
    -webkit-transform: translateY(0);
    transform: translateY(0);
    opacity: 1;
  }
}
.fade-in-up-lg {
  -webkit-animation-name: fade-in-up-lg;
  animation-name: fade-in-up-lg;
}

@-webkit-keyframes fade-out-up-lg {
  0% {
    -webkit-transform: translateY(0);
    transform: translateY(0);
    opacity: 1;
  }
  100% {
    -webkit-transform: translateY(-1000px);
    transform: translateY(-1000px);
    opacity: 0;
  }
}
@keyframes fade-out-up-lg {
  0% {
    -webkit-transform: translateY(0);
    transform: translateY(0);
    opacity: 1;
  }
  100% {
    -webkit-transform: translateY(-1000px);
    transform: translateY(-1000px);
    opacity: 0;
  }
}
.fade-out-up-lg {
  -webkit-animation-name: fade-out-up-lg;
  animation-name: fade-out-up-lg;
}

@-webkit-keyframes fade-in-down {
  0% {
    -webkit-transform: translateY(-500px);
    transform: translateY(-500px);
    opacity: 0;
  }
  100% {
    -webkit-transform: translateY(0);
    transform: translateY(0);
    opacity: 1;
  }
}
@keyframes fade-in-down {
  0% {
    -webkit-transform: translateY(-500px);
    transform: translateY(-500px);
    opacity: 0;
  }
  100% {
    -webkit-transform: translateY(0);
    transform: translateY(0);
    opacity: 1;
  }
}
.fade-in-down {
  -webkit-animation-name: fade-in-down;
  animation-name: fade-in-down;
}

@-webkit-keyframes fade-out-down {
  0% {
    -webkit-transform: translateY(0);
    transform: translateY(0);
    opacity: 1;
  }
  100% {
    -webkit-transform: translateY(500px);
    transform: translateY(500px);
    opacity: 0;
  }
}
@keyframes fade-out-down {
  0% {
    -webkit-transform: translateY(0);
    transform: translateY(0);
    opacity: 1;
  }
  100% {
    -webkit-transform: translateY(500px);
    transform: translateY(500px);
    opacity: 0;
  }
}
.fade-out-down {
  -webkit-animation-name: fade-out-down;
  animation-name: fade-out-down;
}

@-webkit-keyframes fade-in-down-sm {
  0% {
    -webkit-transform: translateY(-100px);
    transform: translateY(-100px);
    opacity: 0;
  }
  100% {
    -webkit-transform: translateY(0);
    transform: translateY(0);
    opacity: 1;
  }
}
@keyframes fade-in-down-sm {
  0% {
    -webkit-transform: translateY(-100px);
    transform: translateY(-100px);
    opacity: 0;
  }
  100% {
    -webkit-transform: translateY(0);
    transform: translateY(0);
    opacity: 1;
  }
}
.fade-in-down-sm {
  -webkit-animation-name: fade-in-down-sm;
  animation-name: fade-in-down-sm;
}

@-webkit-keyframes fade-out-down-sm {
  0% {
    -webkit-transform: translateY(0);
    transform: translateY(0);
    opacity: 1;
  }
  100% {
    -webkit-transform: translateY(100px);
    transform: translateY(100px);
    opacity: 0;
  }
}
@keyframes fade-out-down-sm {
  0% {
    -webkit-transform: translateY(0);
    transform: translateY(0);
    opacity: 1;
  }
  100% {
    -webkit-transform: translateY(100px);
    transform: translateY(100px);
    opacity: 0;
  }
}
.fade-out-down-sm {
  -webkit-animation-name: fade-out-down-sm;
  animation-name: fade-out-down-sm;
}

@-webkit-keyframes fade-in-down-lg {
  0% {
    -webkit-transform: translateY(-1000px);
    transform: translateY(-1000px);
    opacity: 0;
  }
  100% {
    -webkit-transform: translateY(0);
    transform: translateY(0);
    opacity: 1;
  }
}
@keyframes fade-in-down-lg {
  0% {
    -webkit-transform: translateY(-1000px);
    transform: translateY(-1000px);
    opacity: 0;
  }
  100% {
    -webkit-transform: translateY(0);
    transform: translateY(0);
    opacity: 1;
  }
}
.fade-in-down-lg {
  -webkit-animation-name: fade-in-down;
  animation-name: fade-in-down;
}

@-webkit-keyframes fade-out-down-lg {
  0% {
    -webkit-transform: translateY(0);
    transform: translateY(0);
    opacity: 1;
  }
  100% {
    -webkit-transform: translateY(1000px);
    transform: translateY(1000px);
    opacity: 0;
  }
}
@keyframes fade-out-down-lg {
  0% {
    -webkit-transform: translateY(0);
    transform: translateY(0);
    opacity: 1;
  }
  100% {
    -webkit-transform: translateY(1000px);
    transform: translateY(1000px);
    opacity: 0;
  }
}
.fade-out-down-lg {
  -webkit-animation-name: fade-out-down-lg;
  animation-name: fade-out-down-lg;
}

@-webkit-keyframes fade-in-left {
  0% {
    -webkit-transform: translateX(-500px);
    transform: translateX(-500px);
    opacity: 0;
  }
  100% {
    -webkit-transform: translateX(0);
    transform: translateX(0);
    opacity: 1;
  }
}
@keyframes fade-in-left {
  0% {
    -webkit-transform: translateX(-500px);
    transform: translateX(-500px);
    opacity: 0;
  }
  100% {
    -webkit-transform: translateX(0);
    transform: translateX(0);
    opacity: 1;
  }
}
.fade-in-left {
  -webkit-animation-name: fade-in-left;
  animation-name: fade-in-left;
}

@-webkit-keyframes fade-out-left {
  0% {
    -webkit-transform: translateX(0);
    transform: translateX(0);
    opacity: 1;
  }
  100% {
    -webkit-transform: translateX(-500px);
    transform: translateX(-500px);
    opacity: 0;
  }
}
@keyframes fade-out-left {
  0% {
    -webkit-transform: translateX(0);
    transform: translateX(0);
    opacity: 1;
  }
  100% {
    -webkit-transform: translateX(-500px);
    transform: translateX(-500px);
    opacity: 0;
  }
}
.fade-out-left {
  -webkit-animation-name: fade-out-left;
  animation-name: fade-out-left;
}

@-webkit-keyframes fade-in-left-sm {
  0% {
    -webkit-transform: translateX(-100px);
    transform: translateX(-100px);
    opacity: 0;
  }
  100% {
    -webkit-transform: translateX(0);
    transform: translateX(0);
    opacity: 1;
  }
}
@keyframes fade-in-left-sm {
  0% {
    -webkit-transform: translateX(-100px);
    transform: translateX(-100px);
    opacity: 0;
  }
  100% {
    -webkit-transform: translateX(0);
    transform: translateX(0);
    opacity: 1;
  }
}
.fade-in-left-sm {
  -webkit-animation-name: fade-in-left-sm;
  animation-name: fade-in-left-sm;
}

@-webkit-keyframes fade-out-left-sm {
  0% {
    -webkit-transform: translateX(0);
    transform: translateX(0);
    opacity: 1;
  }
  100% {
    -webkit-transform: translateX(-100px);
    transform: translateX(-100px);
    opacity: 0;
  }
}
@keyframes fade-out-left-sm {
  0% {
    -webkit-transform: translateX(0);
    transform: translateX(0);
    opacity: 1;
  }
  100% {
    -webkit-transform: translateX(-100px);
    transform: translateX(-100px);
    opacity: 0;
  }
}
.fade-out-left-sm {
  -webkit-animation-name: fade-out-left-sm;
  animation-name: fade-out-left-sm;
}

@-webkit-keyframes fade-in-left-lg {
  0% {
    -webkit-transform: translateX(-1500px);
    transform: translateX(-1500px);
    opacity: 0;
  }
  100% {
    -webkit-transform: translateX(0);
    transform: translateX(0);
    opacity: 1;
  }
}
@keyframes fade-in-left-lg {
  0% {
    -webkit-transform: translateX(-1500px);
    transform: translateX(-1500px);
    opacity: 0;
  }
  100% {
    -webkit-transform: translateX(0);
    transform: translateX(0);
    opacity: 1;
  }
}
.fade-in-left-lg {
  -webkit-animation-name: fade-in-left-lg;
  animation-name: fade-in-left-lg;
}

@-webkit-keyframes fade-out-left-lg {
  0% {
    -webkit-transform: translateX(0);
    transform: translateX(0);
    opacity: 1;
  }
  100% {
    -webkit-transform: translateX(-1500px);
    transform: translateX(-1500px);
    opacity: 0;
  }
}
@keyframes fade-out-left-lg {
  0% {
    -webkit-transform: translateX(0);
    transform: translateX(0);
    opacity: 1;
  }
  100% {
    -webkit-transform: translateX(-1500px);
    transform: translateX(-1500px);
    opacity: 0;
  }
}
.fade-out-left-lg {
  -webkit-animation-name: fade-out-left-lg;
  animation-name: fade-out-left-lg;
}

@-webkit-keyframes fade-in-right {
  0% {
    -webkit-transform: translateX(500px);
    transform: translateX(500px);
    opacity: 0;
  }
  100% {
    -webkit-transform: translateX(0);
    transform: translateX(0);
    opacity: 1;
  }
}
@keyframes fade-in-right {
  0% {
    -webkit-transform: translateX(500px);
    transform: translateX(500px);
    opacity: 0;
  }
  100% {
    -webkit-transform: translateX(0);
    transform: translateX(0);
    opacity: 1;
  }
}
.fade-in-right {
  -webkit-animation-name: fade-in-right;
  animation-name: fade-in-right;
}

@-webkit-keyframes fade-out-right {
  0% {
    -webkit-transform: translateX(0);
    transform: translateX(0);
    opacity: 1;
  }
  100% {
    -webkit-transform: translateX(500px);
    transform: translateX(500px);
    opacity: 0;
  }
}
@keyframes fade-out-right {
  0% {
    -webkit-transform: translateX(0);
    transform: translateX(0);
    opacity: 1;
  }
  100% {
    -webkit-transform: translateX(500px);
    transform: translateX(500px);
    opacity: 0;
  }
}
.fade-out-right {
  -webkit-animation-name: fade-out-right;
  animation-name: fade-out-right;
}

@-webkit-keyframes fade-in-right-sm {
  0% {
    -webkit-transform: translateX(100px);
    transform: translateX(100px);
    opacity: 0;
  }
  100% {
    -webkit-transform: translateX(0);
    transform: translateX(0);
    opacity: 1;
  }
}
@keyframes fade-in-right-sm {
  0% {
    -webkit-transform: translateX(100px);
    transform: translateX(100px);
    opacity: 0;
  }
  100% {
    -webkit-transform: translateX(0);
    transform: translateX(0);
    opacity: 1;
  }
}
.fade-in-right-sm {
  -webkit-animation-name: fade-in-right-sm;
  animation-name: fade-in-right-sm;
}

@-webkit-keyframes fade-out-right-sm {
  0% {
    -webkit-transform: translateX(0);
    transform: translateX(0);
    opacity: 1;
  }
  100% {
    -webkit-transform: translateX(100px);
    transform: translateX(100px);
    opacity: 0;
  }
}
@keyframes fade-out-right-sm {
  0% {
    -webkit-transform: translateX(0);
    transform: translateX(0);
    opacity: 1;
  }
  100% {
    -webkit-transform: translateX(100px);
    transform: translateX(100px);
    opacity: 0;
  }
}
.fade-out-right-sm {
  -webkit-animation-name: fade-out-right-sm;
  animation-name: fade-out-right-sm;
}

@-webkit-keyframes fade-in-right-lg {
  0% {
    -webkit-transform: translateX(1500px);
    transform: translateX(1500px);
    opacity: 0;
  }
  100% {
    -webkit-transform: translateX(0);
    transform: translateX(0);
    opacity: 1;
  }
}
@keyframes fade-in-right-lg {
  0% {
    -webkit-transform: translateX(1500px);
    transform: translateX(1500px);
    opacity: 0;
  }
  100% {
    -webkit-transform: translateX(0);
    transform: translateX(0);
    opacity: 1;
  }
}
.fade-in-right-lg {
  -webkit-animation-name: fade-in-right-lg;
  animation-name: fade-in-right-lg;
}

@-webkit-keyframes fade-out-right-lg {
  0% {
    -webkit-transform: translateX(0);
    transform: translateX(0);
    opacity: 1;
  }
  100% {
    -webkit-transform: translateX(1500px);
    transform: translateX(1500px);
    opacity: 0;
  }
}
@keyframes fade-out-right-lg {
  0% {
    -webkit-transform: translateX(0);
    transform: translateX(0);
    opacity: 1;
  }
  100% {
    -webkit-transform: translateX(1500px);
    transform: translateX(1500px);
    opacity: 0;
  }
}
.fade-out-right-lg {
  -webkit-animation-name: fade-out-right-lg;
  animation-name: fade-out-right-lg;
}

@-webkit-keyframes rotate-in {
  0% {
    -webkit-transform: rotate(-90deg);
    transform: rotate(-90deg);
    -webkit-transform-origin: center center;
    transform-origin: center center;
    opacity: 0;
  }
  100% {
    -webkit-transform: rotate(0);
    transform: rotate(0);
    -webkit-transform-origin: center center;
    transform-origin: center center;
    opacity: 1;
  }
}
@keyframes rotate-in {
  0% {
    -webkit-transform: rotate(-90deg);
    transform: rotate(-90deg);
    -webkit-transform-origin: center center;
    transform-origin: center center;
    opacity: 0;
  }
  100% {
    -webkit-transform: rotate(0);
    transform: rotate(0);
    -webkit-transform-origin: center center;
    transform-origin: center center;
    opacity: 1;
  }
}
.rotate-in {
  -webkit-animation-name: rotate-in;
  animation-name: rotate-in;
}

@-webkit-keyframes rotate-out {
  0% {
    -webkit-transform: rotate(0);
    transform: rotate(0);
    -webkit-transform-origin: center center;
    transform-origin: center center;
    opacity: 1;
  }
  100% {
    -webkit-transform: rotate(90deg);
    transform: rotate(90deg);
    -webkit-transform-origin: center center;
    transform-origin: center center;
    opacity: 0;
  }
}
@keyframes rotate-out {
  0% {
    -webkit-transform: rotate(0);
    transform: rotate(0);
    -webkit-transform-origin: center center;
    transform-origin: center center;
    opacity: 1;
  }
  100% {
    -webkit-transform: rotate(90deg);
    transform: rotate(90deg);
    -webkit-transform-origin: center center;
    transform-origin: center center;
    opacity: 0;
  }
}
.rotate-out {
  -webkit-animation-name: rotate-out;
  animation-name: rotate-out;
}

@-webkit-keyframes rotate-in-sm {
  0% {
    -webkit-transform: rotate(-45deg);
    transform: rotate(-45deg);
    -webkit-transform-origin: center center;
    transform-origin: center center;
    opacity: 0;
  }
  100% {
    -webkit-transform: rotate(0);
    transform: rotate(0);
    -webkit-transform-origin: center center;
    transform-origin: center center;
    opacity: 1;
  }
}
@keyframes rotate-in-sm {
  0% {
    -webkit-transform: rotate(-45deg);
    transform: rotate(-45deg);
    -webkit-transform-origin: center center;
    transform-origin: center center;
    opacity: 0;
  }
  100% {
    -webkit-transform: rotate(0);
    transform: rotate(0);
    -webkit-transform-origin: center center;
    transform-origin: center center;
    opacity: 1;
  }
}
.rotate-in-sm {
  -webkit-animation-name: rotate-in-sm;
  animation-name: rotate-in-sm;
}

@-webkit-keyframes rotate-out-sm {
  0% {
    -webkit-transform: rotate(0);
    transform: rotate(0);
    -webkit-transform-origin: center center;
    transform-origin: center center;
    opacity: 1;
  }
  100% {
    -webkit-transform: rotate(45deg);
    transform: rotate(45deg);
    -webkit-transform-origin: center center;
    transform-origin: center center;
    opacity: 0;
  }
}
@keyframes rotate-out-sm {
  0% {
    -webkit-transform: rotate(0);
    transform: rotate(0);
    -webkit-transform-origin: center center;
    transform-origin: center center;
    opacity: 1;
  }
  100% {
    -webkit-transform: rotate(45deg);
    transform: rotate(45deg);
    -webkit-transform-origin: center center;
    transform-origin: center center;
    opacity: 0;
  }
}
.rotate-out-sm {
  -webkit-animation-name: rotate-out-sm;
  animation-name: rotate-out-sm;
}

@-webkit-keyframes rotate-in-lg {
  0% {
    -webkit-transform: rotate(-180deg);
    transform: rotate(-180deg);
    -webkit-transform-origin: center center;
    transform-origin: center center;
    opacity: 0;
  }
  100% {
    -webkit-transform: rotate(0);
    transform: rotate(0);
    -webkit-transform-origin: center center;
    transform-origin: center center;
    opacity: 1;
  }
}
@keyframes rotate-in-lg {
  0% {
    -webkit-transform: rotate(-180deg);
    transform: rotate(-180deg);
    -webkit-transform-origin: center center;
    transform-origin: center center;
    opacity: 0;
  }
  100% {
    -webkit-transform: rotate(0);
    transform: rotate(0);
    -webkit-transform-origin: center center;
    transform-origin: center center;
    opacity: 1;
  }
}
.rotate-in-lg {
  -webkit-animation-name: rotate-in-lg;
  animation-name: rotate-in-lg;
}

@-webkit-keyframes rotate-out-lg {
  0% {
    -webkit-transform: rotate(0);
    transform: rotate(0);
    -webkit-transform-origin: center center;
    transform-origin: center center;
    opacity: 1;
  }
  100% {
    -webkit-transform: rotate(180deg);
    transform: rotate(180deg);
    -webkit-transform-origin: center center;
    transform-origin: center center;
    opacity: 0;
  }
}
@keyframes rotate-out-lg {
  0% {
    -webkit-transform: rotate(0);
    transform: rotate(0);
    -webkit-transform-origin: center center;
    transform-origin: center center;
    opacity: 1;
  }
  100% {
    -webkit-transform: rotate(180deg);
    transform: rotate(180deg);
    -webkit-transform-origin: center center;
    transform-origin: center center;
    opacity: 0;
  }
}
.rotate-out-lg {
  -webkit-animation-name: rotate-out-lg;
  animation-name: rotate-out-lg;
}

@-webkit-keyframes flip-in-x {
  0% {
    -webkit-transform: perspective(550px) rotateX(90deg);
    transform: perspective(550px) rotateX(90deg);
    opacity: 0;
  }
  100% {
    -webkit-transform: perspective(550px) rotateX(0deg);
    transform: perspective(550px) rotateX(0deg);
    opacity: 1;
  }
}
@keyframes flip-in-x {
  0% {
    -webkit-transform: perspective(550px) rotateX(90deg);
    transform: perspective(550px) rotateX(90deg);
    opacity: 0;
  }
  100% {
    -webkit-transform: perspective(550px) rotateX(0deg);
    transform: perspective(550px) rotateX(0deg);
    opacity: 1;
  }
}
.flip-in-x {
  -webkit-animation-name: flip-in-x;
  animation-name: flip-in-x;
  -webkit-backface-visibility: visible !important;
  backface-visibility: visible !important;
}

@-webkit-keyframes flip-out-x {
  0% {
    -webkit-transform: perspective(550px) rotateX(0deg);
    transform: perspective(550px) rotateX(0deg);
    opacity: 1;
  }
  100% {
    -webkit-transform: perspective(550px) rotateX(90deg);
    transform: perspective(550px) rotateX(90deg);
    opacity: 0;
  }
}
@keyframes flip-out-x {
  0% {
    -webkit-transform: perspective(550px) rotateX(0deg);
    transform: perspective(550px) rotateX(0deg);
    opacity: 1;
  }
  100% {
    -webkit-transform: perspective(550px) rotateX(90deg);
    transform: perspective(550px) rotateX(90deg);
    opacity: 0;
  }
}
.flip-out-x {
  -webkit-animation-name: flip-out-x;
  animation-name: flip-out-x;
  -webkit-backface-visibility: visible !important;
  backface-visibility: visible !important;
}

@-webkit-keyframes flip-in-x-nr {
  0% {
    -webkit-transform: perspective(100px) rotateX(90deg);
    transform: perspective(100px) rotateX(90deg);
    opacity: 0;
  }
  100% {
    -webkit-transform: perspective(100px) rotateX(0deg);
    transform: perspective(100px) rotateX(0deg);
    opacity: 1;
  }
}
@keyframes flip-in-x-nr {
  0% {
    -webkit-transform: perspective(100px) rotateX(90deg);
    transform: perspective(100px) rotateX(90deg);
    opacity: 0;
  }
  100% {
    -webkit-transform: perspective(100px) rotateX(0deg);
    transform: perspective(100px) rotateX(0deg);
    opacity: 1;
  }
}
.flip-in-x-nr {
  -webkit-animation-name: flip-in-x-nr;
  animation-name: flip-in-x-nr;
  -webkit-backface-visibility: visible !important;
  backface-visibility: visible !important;
}

@-webkit-keyframes flip-out-x-nr {
  0% {
    -webkit-transform: perspective(100px) rotateX(0deg);
    transform: perspective(100px) rotateX(0deg);
    opacity: 1;
  }
  100% {
    -webkit-transform: perspective(100px) rotateX(90deg);
    transform: perspective(100px) rotateX(90deg);
    opacity: 0;
  }
}
@keyframes flip-out-x-nr {
  0% {
    -webkit-transform: perspective(100px) rotateX(0deg);
    transform: perspective(100px) rotateX(0deg);
    opacity: 1;
  }
  100% {
    -webkit-transform: perspective(100px) rotateX(90deg);
    transform: perspective(100px) rotateX(90deg);
    opacity: 0;
  }
}
.flip-out-x-nr {
  -webkit-animation-name: flip-out-x-nr;
  animation-name: flip-out-x-nr;
  -webkit-backface-visibility: visible !important;
  backface-visibility: visible !important;
}

@-webkit-keyframes flip-in-x-fr {
  0% {
    -webkit-transform: perspective(1000px) rotateX(90deg);
    transform: perspective(1000px) rotateX(90deg);
    opacity: 0;
  }
  100% {
    -webkit-transform: perspective(1000px) rotateX(0deg);
    transform: perspective(1000px) rotateX(0deg);
    opacity: 1;
  }
}
@keyframes flip-in-x-fr {
  0% {
    -webkit-transform: perspective(1000px) rotateX(90deg);
    transform: perspective(1000px) rotateX(90deg);
    opacity: 0;
  }
  100% {
    -webkit-transform: perspective(1000px) rotateX(0deg);
    transform: perspective(1000px) rotateX(0deg);
    opacity: 1;
  }
}
.flip-in-x-fr {
  -webkit-animation-name: flip-in-x-fr;
  animation-name: flip-in-x-fr;
  -webkit-backface-visibility: visible !important;
  backface-visibility: visible !important;
}

@-webkit-keyframes flip-out-x-fr {
  0% {
    -webkit-transform: perspective(1000px) rotateX(0deg);
    transform: perspective(1000px) rotateX(0deg);
    opacity: 1;
  }
  100% {
    -webkit-transform: perspective(1000px) rotateX(90deg);
    transform: perspective(1000px) rotateX(90deg);
    opacity: 0;
  }
}
@keyframes flip-out-x-fr {
  0% {
    -webkit-transform: perspective(1000px) rotateX(0deg);
    transform: perspective(1000px) rotateX(0deg);
    opacity: 1;
  }
  100% {
    -webkit-transform: perspective(1000px) rotateX(90deg);
    transform: perspective(1000px) rotateX(90deg);
    opacity: 0;
  }
}
.flip-out-x-fr {
  -webkit-animation-name: flip-out-x-fr;
  animation-name: flip-out-x-fr;
  -webkit-backface-visibility: visible !important;
  backface-visibility: visible !important;
}

@-webkit-keyframes flip-in-y {
  0% {
    -webkit-transform: perspective(550px) rotateY(90deg);
    transform: perspective(550px) rotateY(90deg);
    opacity: 0;
  }
  100% {
    -webkit-transform: perspective(550px) rotateY(0deg);
    transform: perspective(550px) rotateY(0deg);
    opacity: 1;
  }
}
@keyframes flip-in-y {
  0% {
    -webkit-transform: perspective(550px) rotateY(90deg);
    transform: perspective(550px) rotateY(90deg);
    opacity: 0;
  }
  100% {
    -webkit-transform: perspective(550px) rotateY(0deg);
    transform: perspective(550px) rotateY(0deg);
    opacity: 1;
  }
}
.flip-in-y {
  -webkit-animation-name: flip-in-y;
  animation-name: flip-in-y;
  -webkit-backface-visibility: visible !important;
  backface-visibility: visible !important;
}

@-webkit-keyframes flip-out-y {
  0% {
    -webkit-transform: perspective(550px) rotateY(0deg);
    transform: perspective(550px) rotateY(0deg);
    opacity: 1;
  }
  100% {
    -webkit-transform: perspective(550px) rotateY(90deg);
    transform: perspective(550px) rotateY(90deg);
    opacity: 0;
  }
}
@keyframes flip-out-y {
  0% {
    -webkit-transform: perspective(550px) rotateY(0deg);
    transform: perspective(550px) rotateY(0deg);
    opacity: 1;
  }
  100% {
    -webkit-transform: perspective(550px) rotateY(90deg);
    transform: perspective(550px) rotateY(90deg);
    opacity: 0;
  }
}
.flip-out-y {
  -webkit-animation-name: flip-out-y;
  animation-name: flip-out-y;
  -webkit-backface-visibility: visible !important;
  backface-visibility: visible !important;
}

@-webkit-keyframes flip-in-y-nr {
  0% {
    -webkit-transform: perspective(100px) rotateY(90deg);
    transform: perspective(100px) rotateY(90deg);
    opacity: 0;
  }
  100% {
    -webkit-transform: perspective(100px) rotateY(0deg);
    transform: perspective(100px) rotateY(0deg);
    opacity: 1;
  }
}
@keyframes flip-in-y-nr {
  0% {
    -webkit-transform: perspective(100px) rotateY(90deg);
    transform: perspective(100px) rotateY(90deg);
    opacity: 0;
  }
  100% {
    -webkit-transform: perspective(100px) rotateY(0deg);
    transform: perspective(100px) rotateY(0deg);
    opacity: 1;
  }
}
.flip-in-y-nr {
  -webkit-animation-name: flip-in-y-nr;
  animation-name: flip-in-y-nr;
  -webkit-backface-visibility: visible !important;
  backface-visibility: visible !important;
}

@-webkit-keyframes flip-out-y-nr {
  0% {
    -webkit-transform: perspective(100px) rotateY(0deg);
    transform: perspective(100px) rotateY(0deg);
    opacity: 1;
  }
  100% {
    -webkit-transform: perspective(100px) rotateY(90deg);
    transform: perspective(100px) rotateY(90deg);
    opacity: 0;
  }
}
@keyframes flip-out-y-nr {
  0% {
    -webkit-transform: perspective(100px) rotateY(0deg);
    transform: perspective(100px) rotateY(0deg);
    opacity: 1;
  }
  100% {
    -webkit-transform: perspective(100px) rotateY(90deg);
    transform: perspective(100px) rotateY(90deg);
    opacity: 0;
  }
}
.flip-out-y-nr {
  -webkit-animation-name: flip-out-y-nr;
  animation-name: flip-out-y-nr;
  -webkit-backface-visibility: visible !important;
  backface-visibility: visible !important;
}

@-webkit-keyframes flip-in-y-fr {
  0% {
    -webkit-transform: perspective(1000px) rotateY(90deg);
    transform: perspective(1000px) rotateY(90deg);
    opacity: 0;
  }
  100% {
    -webkit-transform: perspective(1000px) rotateY(0deg);
    transform: perspective(1000px) rotateY(0deg);
    opacity: 1;
  }
}
@keyframes flip-in-y-fr {
  0% {
    -webkit-transform: perspective(1000px) rotateY(90deg);
    transform: perspective(1000px) rotateY(90deg);
    opacity: 0;
  }
  100% {
    -webkit-transform: perspective(1000px) rotateY(0deg);
    transform: perspective(1000px) rotateY(0deg);
    opacity: 1;
  }
}
.flip-in-y-fr {
  -webkit-animation-name: flip-in-y-fr;
  animation-name: flip-in-y-fr;
  -webkit-backface-visibility: visible !important;
  backface-visibility: visible !important;
}

@-webkit-keyframes flip-out-y-fr {
  0% {
    -webkit-transform: perspective(1000px) rotateY(0deg);
    transform: perspective(1000px) rotateY(0deg);
    opacity: 1;
  }
  100% {
    -webkit-transform: perspective(1000px) rotateY(90deg);
    transform: perspective(1000px) rotateY(90deg);
    opacity: 0;
  }
}
@keyframes flip-out-y-fr {
  0% {
    -webkit-transform: perspective(1000px) rotateY(0deg);
    transform: perspective(1000px) rotateY(0deg);
    opacity: 1;
  }
  100% {
    -webkit-transform: perspective(1000px) rotateY(90deg);
    transform: perspective(1000px) rotateY(90deg);
    opacity: 0;
  }
}
.flip-out-y-fr {
  -webkit-animation-name: flip-out-y-fr;
  animation-name: flip-out-y-fr;
  -webkit-backface-visibility: visible !important;
  backface-visibility: visible !important;
}

@-webkit-keyframes zoom-in {
  0% {
    -webkit-transform: scale(0.7);
    transform: scale(0.7);
    opacity: 0;
  }
  100% {
    opacity: 1;
  }
}
@keyframes zoom-in {
  0% {
    -webkit-transform: scale(0.7);
    transform: scale(0.7);
    opacity: 0;
  }
  100% {
    opacity: 1;
  }
}
.zoom-in {
  -webkit-animation-name: zoom-in;
  animation-name: zoom-in;
}

@-webkit-keyframes zoom-out {
  0% {
    -webkit-transform: scale(1);
    transform: scale(1);
    opacity: 1;
  }
  50% {
    -webkit-transform: scale(0.7);
    transform: scale(0.7);
    opacity: 0;
  }
  100% {
    opacity: 0;
  }
}
@keyframes zoom-out {
  0% {
    -webkit-transform: scale(1);
    transform: scale(1);
    opacity: 1;
  }
  50% {
    -webkit-transform: scale(0.7);
    transform: scale(0.7);
    opacity: 0;
  }
  100% {
    opacity: 0;
  }
}
.zoom-out {
  -webkit-animation-name: zoom-out;
  animation-name: zoom-out;
}

@-webkit-keyframes zoom-in-sm {
  0% {
    -webkit-transform: scale(0.95);
    transform: scale(0.95);
    opacity: 0;
  }
  100% {
    opacity: 1;
  }
}
@keyframes zoom-in-sm {
  0% {
    -webkit-transform: scale(0.95);
    transform: scale(0.95);
    opacity: 0;
  }
  100% {
    opacity: 1;
  }
}
.zoom-in-sm {
  -webkit-animation-name: zoom-in-sm;
  animation-name: zoom-in-sm;
}

@-webkit-keyframes zoom-out-sm {
  0% {
    -webkit-transform: scale(1);
    transform: scale(1);
    opacity: 1;
  }
  50% {
    -webkit-transform: scale(0.95);
    transform: scale(0.95);
    opacity: 0;
  }
  100% {
    opacity: 0;
  }
}
@keyframes zoom-out-sm {
  0% {
    -webkit-transform: scale(1);
    transform: scale(1);
    opacity: 1;
  }
  50% {
    -webkit-transform: scale(0.95);
    transform: scale(0.95);
    opacity: 0;
  }
  100% {
    opacity: 0;
  }
}
.zoom-out-sm {
  -webkit-animation-name: zoom-out-sm;
  animation-name: zoom-out-sm;
}

@-webkit-keyframes zoom-in-lg {
  0% {
    -webkit-transform: scale(0.4);
    transform: scale(0.4);
    opacity: 0;
  }
  100% {
    opacity: 1;
  }
}
@keyframes zoom-in-lg {
  0% {
    -webkit-transform: scale(0.4);
    transform: scale(0.4);
    opacity: 0;
  }
  100% {
    opacity: 1;
  }
}
.zoom-in-lg {
  -webkit-animation-name: zoom-in-lg;
  animation-name: zoom-in-lg;
}

@-webkit-keyframes zoom-out-lg {
  0% {
    -webkit-transform: scale(1);
    transform: scale(1);
    opacity: 1;
  }
  50% {
    -webkit-transform: scale(0.4);
    transform: scale(0.4);
    opacity: 0;
  }
  100% {
    opacity: 0;
  }
}
@keyframes zoom-out-lg {
  0% {
    -webkit-transform: scale(1);
    transform: scale(1);
    opacity: 1;
  }
  50% {
    -webkit-transform: scale(0.4);
    transform: scale(0.4);
    opacity: 0;
  }
  100% {
    opacity: 0;
  }
}
.zoom-out-lg {
  -webkit-animation-name: zoom-out-lg;
  animation-name: zoom-out-lg;
}

@-webkit-keyframes overlay-slide-in-top {
  0% {
    height: 100%;
  }
  100% {
    height: 0;
  }
}
@keyframes overlay-slide-in-top {
  0% {
    height: 100%;
  }
  100% {
    height: 0;
  }
}
.overlay-slide-in-top {
  top: 0;
  height: 0;
  -webkit-animation-name: overlay-slide-in-top;
  animation-name: overlay-slide-in-top;
}

@-webkit-keyframes overlay-slide-out-top {
  0% {
    height: 0;
  }
  100% {
    height: 100%;
  }
}
@keyframes overlay-slide-out-top {
  0% {
    height: 0;
  }
  100% {
    height: 100%;
  }
}
.overlay-slide-out-top {
  top: 0;
  height: 100%;
  -webkit-animation-name: overlay-slide-out-top;
  animation-name: overlay-slide-out-top;
}

@-webkit-keyframes overlay-slide-in-bottom {
  0% {
    height: 100%;
  }
  100% {
    height: 0;
  }
}
@keyframes overlay-slide-in-bottom {
  0% {
    height: 100%;
  }
  100% {
    height: 0;
  }
}
.overlay-slide-in-bottom {
  bottom: 0;
  height: 0;
  -webkit-animation-name: overlay-slide-in-bottom;
  animation-name: overlay-slide-in-bottom;
}

@-webkit-keyframes overlay-slide-out-bottom {
  0% {
    height: 0;
  }
  100% {
    height: 100%;
  }
}
@keyframes overlay-slide-out-bottom {
  0% {
    height: 0;
  }
  100% {
    height: 100%;
  }
}
.overlay-slide-out-bottom {
  bottom: 0;
  height: 100%;
  -webkit-animation-name: overlay-slide-out-bottom;
  animation-name: overlay-slide-out-bottom;
}

@-webkit-keyframes overlay-slide-in-left {
  0% {
    width: 100%;
  }
  100% {
    width: 0;
  }
}
@keyframes overlay-slide-in-left {
  0% {
    width: 100%;
  }
  100% {
    width: 0;
  }
}
.overlay-slide-in-left {
  width: 0;
  -webkit-animation-name: overlay-slide-in-left;
  animation-name: overlay-slide-in-left;
}

@-webkit-keyframes overlay-slide-out-left {
  0% {
    width: 0;
  }
  100% {
    width: 100%;
  }
}
@keyframes overlay-slide-out-left {
  0% {
    width: 0;
  }
  100% {
    width: 100%;
  }
}
.overlay-slide-out-left {
  left: 0;
  width: 100%;
  -webkit-animation-name: overlay-slide-out-left;
  animation-name: overlay-slide-out-left;
}

@-webkit-keyframes overlay-slide-in-right {
  0% {
    width: 100%;
  }
  100% {
    width: 0;
  }
}
@keyframes overlay-slide-in-right {
  0% {
    width: 100%;
  }
  100% {
    width: 0;
  }
}
.overlay-slide-in-right {
  right: 0;
  width: 0;
  -webkit-animation-name: overlay-slide-in-right;
  animation-name: overlay-slide-in-right;
}

@-webkit-keyframes overlay-slide-out-right {
  0% {
    width: 0;
  }
  100% {
    width: 100%;
  }
}
@keyframes overlay-slide-out-right {
  0% {
    width: 0;
  }
  100% {
    width: 100%;
  }
}
.overlay-slide-out-right {
  right: 0;
  width: 100%;
  -webkit-animation-name: overlay-slide-out-right;
  animation-name: overlay-slide-out-right;
}

@keyframes fadein_sc_top {
  0% {
    opacity: 0;
    transform: translate3d(0px, 20px, 0px);
  }
  100% {
    opacity: 1;
    transform: translate3d(0px, 0px, 0px);
  }
}
@keyframes fadein_sc_top2 {
  0% {
    opacity: 0;
    transform: translate3d(0px, 20px, 0px);
  }
  70% {
    opacity: 1;
    transform: translate3d(0px, -10px, 0px);
  }
  100% {
    opacity: 1;
    transform: translate3d(0px, 0px, 0px);
  }
}
@keyframes fadein_sc_left {
  0% {
    opacity: 0;
    transform: translate3d(-20px, 0px, 0px);
  }
  100% {
    opacity: 1;
    transform: translate3d(0px, 0px, 0px);
  }
}
@keyframes fadein_sc_right {
  0% {
    opacity: 0;
    transform: translate3d(20px, 0px, 0px);
  }
  100% {
    opacity: 1;
    transform: translate3d(0px, 0px, 0px);
  }
}
@keyframes fadein_in {
  0% {
    opacity: 0;
  }
  100% {
    opacity: 1;
  }
}
.opacity_0_fade_set {
  transform: translate3d(0px, 20px, 0px);
  opacity: 0;
}
.opacity_0_fade_set.active {
  -webkit-animation: fadein_sc_top 0.75s ease 0.35s forwards alternate;
  animation: fadein_sc_top 0.75s ease 0.35s forwards alternate;
}

.opacity_0_fadeleft_in {
  opacity: 0;
  transform: translate3d(-20px, 0px, 0px);
}
.opacity_0_fadeleft_in.active {
  -webkit-animation: fadein_sc_left 0.75s ease 0.35s forwards alternate;
  animation: fadein_sc_left 0.75s ease 0.35s forwards alternate;
}

.opacity_0_faderight_in {
  opacity: 0;
  transform: translate3d(20px, 0px, 0px);
}
.opacity_0_faderight_in.active {
  -webkit-animation: fadein_sc_right 0.75s ease 0.35s forwards alternate;
  animation: fadein_sc_right 0.75s ease 0.35s forwards alternate;
}

.opacity_0_fade_in {
  opacity: 0;
}
.opacity_0_fade_in.active {
  -webkit-animation: fadein_in 0.75s ease 0.35s forwards alternate;
  animation: fadein_in 0.75s ease 0.35s forwards alternate;
}

.opacity_0_list_fade_set > li {
  transform: translate3d(0px, 20px, 0px);
  opacity: 0;
  position: relative;
}
.opacity_0_list_fade_set.active > li:nth-child(1) {
  -webkit-animation: fadein_sc_top 0.75s ease 0.35s forwards alternate;
  animation: fadein_sc_top 0.75s ease 0.35s forwards alternate;
}
.opacity_0_list_fade_set.active > li:nth-child(2) {
  -webkit-animation: fadein_sc_top 0.75s ease 0.7s forwards alternate;
  animation: fadein_sc_top 0.75s ease 0.7s forwards alternate;
}
.opacity_0_list_fade_set.active > li:nth-child(3) {
  -webkit-animation: fadein_sc_top 0.75s ease 1.05s forwards alternate;
  animation: fadein_sc_top 0.75s ease 1.05s forwards alternate;
}
.opacity_0_list_fade_set.active > li:nth-child(4) {
  -webkit-animation: fadein_sc_top 0.75s ease 1.4s forwards alternate;
  animation: fadein_sc_top 0.75s ease 1.4s forwards alternate;
}
.opacity_0_list_fade_set.active > li:nth-child(5) {
  -webkit-animation: fadein_sc_top 0.75s ease 1.75s forwards alternate;
  animation: fadein_sc_top 0.75s ease 1.75s forwards alternate;
}
.opacity_0_list_fade_set.active > li:nth-child(6) {
  -webkit-animation: fadein_sc_top 0.75s ease 2.1s forwards alternate;
  animation: fadein_sc_top 0.75s ease 2.1s forwards alternate;
}
.opacity_0_list_fade_set.active > li:nth-child(7) {
  -webkit-animation: fadein_sc_top 0.75s ease 2.45s forwards alternate;
  animation: fadein_sc_top 0.75s ease 2.45s forwards alternate;
}
.opacity_0_list_fade_set.active > li:nth-child(8) {
  -webkit-animation: fadein_sc_top 0.75s ease 2.8s forwards alternate;
  animation: fadein_sc_top 0.75s ease 2.8s forwards alternate;
}
.opacity_0_list_fade_set.active > li:nth-child(9) {
  -webkit-animation: fadein_sc_top 0.75s ease 3.15s forwards alternate;
  animation: fadein_sc_top 0.75s ease 3.15s forwards alternate;
}
.opacity_0_list_fade_set.active > li:nth-child(10) {
  -webkit-animation: fadein_sc_top 0.75s ease 3.5s forwards alternate;
  animation: fadein_sc_top 0.75s ease 3.5s forwards alternate;
}
.opacity_0_list_fade_set.active > li:nth-child(11) {
  -webkit-animation: fadein_sc_top 0.75s ease 3.85s forwards alternate;
  animation: fadein_sc_top 0.75s ease 3.85s forwards alternate;
}
.opacity_0_list_fade_set.active > li:nth-child(12) {
  -webkit-animation: fadein_sc_top 0.75s ease 4.2s forwards alternate;
  animation: fadein_sc_top 0.75s ease 4.2s forwards alternate;
}

.listcnt .moveList {
  opacity: 0;
}
.listcnt.active .moveList:nth-child(1) {
  -webkit-animation: fadein_in 0.75s ease 0.15s forwards alternate;
  animation: fadein_in 0.75s ease 0.15s forwards alternate;
}
.listcnt.active .moveList:nth-child(2) {
  -webkit-animation: fadein_in 0.75s ease 0.3s forwards alternate;
  animation: fadein_in 0.75s ease 0.3s forwards alternate;
}
.listcnt.active .moveList:nth-child(3) {
  -webkit-animation: fadein_in 0.75s ease 0.45s forwards alternate;
  animation: fadein_in 0.75s ease 0.45s forwards alternate;
}
.listcnt.active .moveList:nth-child(4) {
  -webkit-animation: fadein_in 0.75s ease 0.6s forwards alternate;
  animation: fadein_in 0.75s ease 0.6s forwards alternate;
}
.listcnt.active .moveList:nth-child(5) {
  -webkit-animation: fadein_in 0.75s ease 0.75s forwards alternate;
  animation: fadein_in 0.75s ease 0.75s forwards alternate;
}
.listcnt.active .moveList:nth-child(6) {
  -webkit-animation: fadein_in 0.75s ease 0.9s forwards alternate;
  animation: fadein_in 0.75s ease 0.9s forwards alternate;
}
.listcnt.active .moveList:nth-child(7) {
  -webkit-animation: fadein_in 0.75s ease 1.05s forwards alternate;
  animation: fadein_in 0.75s ease 1.05s forwards alternate;
}
.listcnt.active .moveList:nth-child(8) {
  -webkit-animation: fadein_in 0.75s ease 1.2s forwards alternate;
  animation: fadein_in 0.75s ease 1.2s forwards alternate;
}
.listcnt.active .moveList:nth-child(9) {
  -webkit-animation: fadein_in 0.75s ease 1.35s forwards alternate;
  animation: fadein_in 0.75s ease 1.35s forwards alternate;
}
.listcnt.active .moveList:nth-child(10) {
  -webkit-animation: fadein_in 0.75s ease 1.5s forwards alternate;
  animation: fadein_in 0.75s ease 1.5s forwards alternate;
}

.listcntmainasu .moveList {
  opacity: 0;
}
.listcntmainasu.active .moveList:nth-child(1) {
  -webkit-animation: fadein_sc_top2 0.75s ease-in 0.25s forwards alternate;
  animation: fadein_sc_top2 0.75s ease-in 0.25s forwards alternate;
}
.listcntmainasu.active .moveList:nth-child(2) {
  -webkit-animation: fadein_sc_top2 0.75s ease-in 0.5s forwards alternate;
  animation: fadein_sc_top2 0.75s ease-in 0.5s forwards alternate;
}
.listcntmainasu.active .moveList:nth-child(3) {
  -webkit-animation: fadein_sc_top2 0.75s ease-in 0.75s forwards alternate;
  animation: fadein_sc_top2 0.75s ease-in 0.75s forwards alternate;
}
.listcntmainasu.active .moveList:nth-child(4) {
  -webkit-animation: fadein_sc_top2 0.75s ease-in 1s forwards alternate;
  animation: fadein_sc_top2 0.75s ease-in 1s forwards alternate;
}
.listcntmainasu.active .moveList:nth-child(5) {
  -webkit-animation: fadein_sc_top2 0.75s ease-in 1.25s forwards alternate;
  animation: fadein_sc_top2 0.75s ease-in 1.25s forwards alternate;
}
.listcntmainasu.active .moveList:nth-child(6) {
  -webkit-animation: fadein_sc_top2 0.75s ease-in 1.5s forwards alternate;
  animation: fadein_sc_top2 0.75s ease-in 1.5s forwards alternate;
}
.listcntmainasu.active .moveList:nth-child(7) {
  -webkit-animation: fadein_sc_top2 0.75s ease-in 1.75s forwards alternate;
  animation: fadein_sc_top2 0.75s ease-in 1.75s forwards alternate;
}
.listcntmainasu.active .moveList:nth-child(8) {
  -webkit-animation: fadein_sc_top2 0.75s ease-in 2s forwards alternate;
  animation: fadein_sc_top2 0.75s ease-in 2s forwards alternate;
}
.listcntmainasu.active .moveList:nth-child(9) {
  -webkit-animation: fadein_sc_top2 0.75s ease-in 2.25s forwards alternate;
  animation: fadein_sc_top2 0.75s ease-in 2.25s forwards alternate;
}
.listcntmainasu.active .moveList:nth-child(10) {
  -webkit-animation: fadein_sc_top2 0.75s ease-in 2.5s forwards alternate;
  animation: fadein_sc_top2 0.75s ease-in 2.5s forwards alternate;
}

.listcntmainasu .moveList1 {
  opacity: 0;
}

.listcntmainasu.active .moveList1 {
  -webkit-animation: fadein_sc_top2 0.75s ease-in 0.25s forwards alternate;
  animation: fadein_sc_top2 0.75s ease-in 0.25s forwards alternate;
}

.listcntmainasu .moveList2 {
  opacity: 0;
}

.listcntmainasu.active .moveList2 {
  -webkit-animation: fadein_sc_top2 0.75s ease-in 0.5s forwards alternate;
  animation: fadein_sc_top2 0.75s ease-in 0.5s forwards alternate;
}

.listcntmainasu .moveList3 {
  opacity: 0;
}

.listcntmainasu.active .moveList3 {
  -webkit-animation: fadein_sc_top2 0.75s ease-in 0.75s forwards alternate;
  animation: fadein_sc_top2 0.75s ease-in 0.75s forwards alternate;
}

.listcntmainasu .moveList4 {
  opacity: 0;
}

.listcntmainasu.active .moveList4 {
  -webkit-animation: fadein_sc_top2 0.75s ease-in 1s forwards alternate;
  animation: fadein_sc_top2 0.75s ease-in 1s forwards alternate;
}

.listcntmainasu .moveList5 {
  opacity: 0;
}

.listcntmainasu.active .moveList5 {
  -webkit-animation: fadein_sc_top2 0.75s ease-in 1.25s forwards alternate;
  animation: fadein_sc_top2 0.75s ease-in 1.25s forwards alternate;
}

.listcntmainasu .moveList6 {
  opacity: 0;
}

.listcntmainasu.active .moveList6 {
  -webkit-animation: fadein_sc_top2 0.75s ease-in 1.5s forwards alternate;
  animation: fadein_sc_top2 0.75s ease-in 1.5s forwards alternate;
}

.listcntmainasu .moveList7 {
  opacity: 0;
}

.listcntmainasu.active .moveList7 {
  -webkit-animation: fadein_sc_top2 0.75s ease-in 1.75s forwards alternate;
  animation: fadein_sc_top2 0.75s ease-in 1.75s forwards alternate;
}

.listcntmainasu .moveList8 {
  opacity: 0;
}

.listcntmainasu.active .moveList8 {
  -webkit-animation: fadein_sc_top2 0.75s ease-in 2s forwards alternate;
  animation: fadein_sc_top2 0.75s ease-in 2s forwards alternate;
}

.listcntmainasu .moveList9 {
  opacity: 0;
}

.listcntmainasu.active .moveList9 {
  -webkit-animation: fadein_sc_top2 0.75s ease-in 2.25s forwards alternate;
  animation: fadein_sc_top2 0.75s ease-in 2.25s forwards alternate;
}

.listcntmainasu .moveList10 {
  opacity: 0;
}

.listcntmainasu.active .moveList10 {
  -webkit-animation: fadein_sc_top2 0.75s ease-in 2.5s forwards alternate;
  animation: fadein_sc_top2 0.75s ease-in 2.5s forwards alternate;
}

.listcntmainasuLeft .moveList {
  opacity: 0;
}
.listcntmainasuLeft.active .moveList:nth-child(1) {
  -webkit-animation: fadein_sc_left 0.75s ease 0.15s forwards alternate;
  animation: fadein_sc_left 0.75s ease 0.15s forwards alternate;
}
.listcntmainasuLeft.active .moveList:nth-child(2) {
  -webkit-animation: fadein_sc_left 0.75s ease 0.3s forwards alternate;
  animation: fadein_sc_left 0.75s ease 0.3s forwards alternate;
}
.listcntmainasuLeft.active .moveList:nth-child(3) {
  -webkit-animation: fadein_sc_left 0.75s ease 0.45s forwards alternate;
  animation: fadein_sc_left 0.75s ease 0.45s forwards alternate;
}
.listcntmainasuLeft.active .moveList:nth-child(4) {
  -webkit-animation: fadein_sc_left 0.75s ease 0.6s forwards alternate;
  animation: fadein_sc_left 0.75s ease 0.6s forwards alternate;
}
.listcntmainasuLeft.active .moveList:nth-child(5) {
  -webkit-animation: fadein_sc_left 0.75s ease 0.75s forwards alternate;
  animation: fadein_sc_left 0.75s ease 0.75s forwards alternate;
}
.listcntmainasuLeft.active .moveList:nth-child(6) {
  -webkit-animation: fadein_sc_left 0.75s ease 0.9s forwards alternate;
  animation: fadein_sc_left 0.75s ease 0.9s forwards alternate;
}
.listcntmainasuLeft.active .moveList:nth-child(7) {
  -webkit-animation: fadein_sc_left 0.75s ease 1.05s forwards alternate;
  animation: fadein_sc_left 0.75s ease 1.05s forwards alternate;
}
.listcntmainasuLeft.active .moveList:nth-child(8) {
  -webkit-animation: fadein_sc_left 0.75s ease 1.2s forwards alternate;
  animation: fadein_sc_left 0.75s ease 1.2s forwards alternate;
}
.listcntmainasuLeft.active .moveList:nth-child(9) {
  -webkit-animation: fadein_sc_left 0.75s ease 1.35s forwards alternate;
  animation: fadein_sc_left 0.75s ease 1.35s forwards alternate;
}
.listcntmainasuLeft.active .moveList:nth-child(10) {
  -webkit-animation: fadein_sc_left 0.75s ease 1.5s forwards alternate;
  animation: fadein_sc_left 0.75s ease 1.5s forwards alternate;
}
.listcntmainasuLeft.active .moveList:nth-child(11) {
  -webkit-animation: fadein_sc_left 0.75s ease 1.65s forwards alternate;
  animation: fadein_sc_left 0.75s ease 1.65s forwards alternate;
}
.listcntmainasuLeft.active .moveList:nth-child(12) {
  -webkit-animation: fadein_sc_left 0.75s ease 1.8s forwards alternate;
  animation: fadein_sc_left 0.75s ease 1.8s forwards alternate;
}

.opacity_0_list_left_fade_set > li,
.opacity_0_list_left_fade_set section,
.opacity_0_list_left_fade_set div,
.opacity_0_list_left_fade_set tr,
.opacity_0_list_left_fade_set figure {
  transform: translate3d(-10px, 0px, 0px);
  opacity: 0;
}
.opacity_0_list_left_fade_set.active > li:nth-child(1),
.opacity_0_list_left_fade_set.active section:nth-child(1),
.opacity_0_list_left_fade_set.active div:nth-child(1),
.opacity_0_list_left_fade_set.active p:nth-child(1),
.opacity_0_list_left_fade_set.active h2:nth-child(1),
.opacity_0_list_left_fade_set.active h3:nth-child(1),
.opacity_0_list_left_fade_set.active h4:nth-child(1),
.opacity_0_list_left_fade_set.active h5:nth-child(1),
.opacity_0_list_left_fade_set.active figure:nth-child(1) {
  -webkit-animation: fadein_sc_left 0.75s ease 0.35s forwards alternate;
  animation: fadein_sc_left 0.75s ease 0.35s forwards alternate;
}
.opacity_0_list_left_fade_set.active > li:nth-child(2),
.opacity_0_list_left_fade_set.active section:nth-child(2),
.opacity_0_list_left_fade_set.active div:nth-child(2),
.opacity_0_list_left_fade_set.active p:nth-child(2),
.opacity_0_list_left_fade_set.active h2:nth-child(2),
.opacity_0_list_left_fade_set.active h3:nth-child(2),
.opacity_0_list_left_fade_set.active h4:nth-child(2),
.opacity_0_list_left_fade_set.active h5:nth-child(2),
.opacity_0_list_left_fade_set.active figure:nth-child(2) {
  -webkit-animation: fadein_sc_left 0.75s ease 0.7s forwards alternate;
  animation: fadein_sc_left 0.75s ease 0.7s forwards alternate;
}
.opacity_0_list_left_fade_set.active > li:nth-child(3),
.opacity_0_list_left_fade_set.active section:nth-child(3),
.opacity_0_list_left_fade_set.active div:nth-child(3),
.opacity_0_list_left_fade_set.active p:nth-child(3),
.opacity_0_list_left_fade_set.active h2:nth-child(3),
.opacity_0_list_left_fade_set.active h3:nth-child(3),
.opacity_0_list_left_fade_set.active h4:nth-child(3),
.opacity_0_list_left_fade_set.active h5:nth-child(3),
.opacity_0_list_left_fade_set.active figure:nth-child(3) {
  -webkit-animation: fadein_sc_left 0.75s ease 1.05s forwards alternate;
  animation: fadein_sc_left 0.75s ease 1.05s forwards alternate;
}
.opacity_0_list_left_fade_set.active > li:nth-child(4),
.opacity_0_list_left_fade_set.active section:nth-child(4),
.opacity_0_list_left_fade_set.active div:nth-child(4),
.opacity_0_list_left_fade_set.active p:nth-child(4),
.opacity_0_list_left_fade_set.active h2:nth-child(4),
.opacity_0_list_left_fade_set.active h3:nth-child(4),
.opacity_0_list_left_fade_set.active h4:nth-child(4),
.opacity_0_list_left_fade_set.active h5:nth-child(4),
.opacity_0_list_left_fade_set.active figure:nth-child(4) {
  -webkit-animation: fadein_sc_left 0.75s ease 1.4s forwards alternate;
  animation: fadein_sc_left 0.75s ease 1.4s forwards alternate;
}
.opacity_0_list_left_fade_set.active > li:nth-child(5),
.opacity_0_list_left_fade_set.active section:nth-child(5),
.opacity_0_list_left_fade_set.active div:nth-child(5),
.opacity_0_list_left_fade_set.active p:nth-child(5),
.opacity_0_list_left_fade_set.active h2:nth-child(5),
.opacity_0_list_left_fade_set.active h3:nth-child(5),
.opacity_0_list_left_fade_set.active h4:nth-child(5),
.opacity_0_list_left_fade_set.active h5:nth-child(5),
.opacity_0_list_left_fade_set.active figure:nth-child(5) {
  -webkit-animation: fadein_sc_left 0.75s ease 1.75s forwards alternate;
  animation: fadein_sc_left 0.75s ease 1.75s forwards alternate;
}
.opacity_0_list_left_fade_set.active > li:nth-child(6),
.opacity_0_list_left_fade_set.active section:nth-child(6),
.opacity_0_list_left_fade_set.active div:nth-child(6),
.opacity_0_list_left_fade_set.active p:nth-child(6),
.opacity_0_list_left_fade_set.active h2:nth-child(6),
.opacity_0_list_left_fade_set.active h3:nth-child(6),
.opacity_0_list_left_fade_set.active h4:nth-child(6),
.opacity_0_list_left_fade_set.active h5:nth-child(6),
.opacity_0_list_left_fade_set.active figure:nth-child(6) {
  -webkit-animation: fadein_sc_left 0.75s ease 2.1s forwards alternate;
  animation: fadein_sc_left 0.75s ease 2.1s forwards alternate;
}
.opacity_0_list_left_fade_set.active > li:nth-child(7),
.opacity_0_list_left_fade_set.active section:nth-child(7),
.opacity_0_list_left_fade_set.active div:nth-child(7),
.opacity_0_list_left_fade_set.active p:nth-child(7),
.opacity_0_list_left_fade_set.active h2:nth-child(7),
.opacity_0_list_left_fade_set.active h3:nth-child(7),
.opacity_0_list_left_fade_set.active h4:nth-child(7),
.opacity_0_list_left_fade_set.active h5:nth-child(7),
.opacity_0_list_left_fade_set.active figure:nth-child(7) {
  -webkit-animation: fadein_sc_left 0.75s ease 2.45s forwards alternate;
  animation: fadein_sc_left 0.75s ease 2.45s forwards alternate;
}
.opacity_0_list_left_fade_set.active > li:nth-child(8),
.opacity_0_list_left_fade_set.active section:nth-child(8),
.opacity_0_list_left_fade_set.active div:nth-child(8),
.opacity_0_list_left_fade_set.active p:nth-child(8),
.opacity_0_list_left_fade_set.active h2:nth-child(8),
.opacity_0_list_left_fade_set.active h3:nth-child(8),
.opacity_0_list_left_fade_set.active h4:nth-child(8),
.opacity_0_list_left_fade_set.active h5:nth-child(8),
.opacity_0_list_left_fade_set.active figure:nth-child(8) {
  -webkit-animation: fadein_sc_left 0.75s ease 2.8s forwards alternate;
  animation: fadein_sc_left 0.75s ease 2.8s forwards alternate;
}
.opacity_0_list_left_fade_set.active > li:nth-child(9),
.opacity_0_list_left_fade_set.active section:nth-child(9),
.opacity_0_list_left_fade_set.active div:nth-child(9),
.opacity_0_list_left_fade_set.active p:nth-child(9),
.opacity_0_list_left_fade_set.active h2:nth-child(9),
.opacity_0_list_left_fade_set.active h3:nth-child(9),
.opacity_0_list_left_fade_set.active h4:nth-child(9),
.opacity_0_list_left_fade_set.active h5:nth-child(9),
.opacity_0_list_left_fade_set.active figure:nth-child(9) {
  -webkit-animation: fadein_sc_left 0.75s ease 3.15s forwards alternate;
  animation: fadein_sc_left 0.75s ease 3.15s forwards alternate;
}
.opacity_0_list_left_fade_set.active > li:nth-child(10),
.opacity_0_list_left_fade_set.active section:nth-child(10),
.opacity_0_list_left_fade_set.active div:nth-child(10),
.opacity_0_list_left_fade_set.active p:nth-child(10),
.opacity_0_list_left_fade_set.active h2:nth-child(10),
.opacity_0_list_left_fade_set.active h3:nth-child(10),
.opacity_0_list_left_fade_set.active h4:nth-child(10),
.opacity_0_list_left_fade_set.active h5:nth-child(10),
.opacity_0_list_left_fade_set.active figure:nth-child(10) {
  -webkit-animation: fadein_sc_left 0.75s ease 3.5s forwards alternate;
  animation: fadein_sc_left 0.75s ease 3.5s forwards alternate;
}
.opacity_0_list_left_fade_set.active > li:nth-child(11),
.opacity_0_list_left_fade_set.active section:nth-child(11),
.opacity_0_list_left_fade_set.active div:nth-child(11),
.opacity_0_list_left_fade_set.active p:nth-child(11),
.opacity_0_list_left_fade_set.active h2:nth-child(11),
.opacity_0_list_left_fade_set.active h3:nth-child(11),
.opacity_0_list_left_fade_set.active h4:nth-child(11),
.opacity_0_list_left_fade_set.active h5:nth-child(11),
.opacity_0_list_left_fade_set.active figure:nth-child(11) {
  -webkit-animation: fadein_sc_left 0.75s ease 3.85s forwards alternate;
  animation: fadein_sc_left 0.75s ease 3.85s forwards alternate;
}
.opacity_0_list_left_fade_set.active > li:nth-child(12),
.opacity_0_list_left_fade_set.active section:nth-child(12),
.opacity_0_list_left_fade_set.active div:nth-child(12),
.opacity_0_list_left_fade_set.active p:nth-child(12),
.opacity_0_list_left_fade_set.active h2:nth-child(12),
.opacity_0_list_left_fade_set.active h3:nth-child(12),
.opacity_0_list_left_fade_set.active h4:nth-child(12),
.opacity_0_list_left_fade_set.active h5:nth-child(12),
.opacity_0_list_left_fade_set.active figure:nth-child(12) {
  -webkit-animation: fadein_sc_left 0.75s ease 4.2s forwards alternate;
  animation: fadein_sc_left 0.75s ease 4.2s forwards alternate;
}

.opacity_0_list_right_fade_set > li,
.opacity_0_list_right_fade_set section,
.opacity_0_list_right_fade_set div,
.opacity_0_list_right_fade_set tr,
.opacity_0_list_right_fade_set figure {
  transform: translate3d(-10px, 0px, 0px);
  opacity: 0;
}
.opacity_0_list_right_fade_set.active > li:nth-child(1),
.opacity_0_list_right_fade_set.active section:nth-child(1),
.opacity_0_list_right_fade_set.active div:nth-child(1),
.opacity_0_list_right_fade_set.active p:nth-child(1),
.opacity_0_list_right_fade_set.active h2:nth-child(1),
.opacity_0_list_right_fade_set.active h3:nth-child(1),
.opacity_0_list_right_fade_set.active h4:nth-child(1),
.opacity_0_list_right_fade_set.active h5:nth-child(1),
.opacity_0_list_right_fade_set.active figure:nth-child(1) {
  -webkit-animation: fadein_sc_right 0.75s ease 0.35s forwards alternate;
  animation: fadein_sc_right 0.75s ease 0.35s forwards alternate;
}
.opacity_0_list_right_fade_set.active > li:nth-child(2),
.opacity_0_list_right_fade_set.active section:nth-child(2),
.opacity_0_list_right_fade_set.active div:nth-child(2),
.opacity_0_list_right_fade_set.active p:nth-child(2),
.opacity_0_list_right_fade_set.active h2:nth-child(2),
.opacity_0_list_right_fade_set.active h3:nth-child(2),
.opacity_0_list_right_fade_set.active h4:nth-child(2),
.opacity_0_list_right_fade_set.active h5:nth-child(2),
.opacity_0_list_right_fade_set.active figure:nth-child(2) {
  -webkit-animation: fadein_sc_right 0.75s ease 0.7s forwards alternate;
  animation: fadein_sc_right 0.75s ease 0.7s forwards alternate;
}
.opacity_0_list_right_fade_set.active > li:nth-child(3),
.opacity_0_list_right_fade_set.active section:nth-child(3),
.opacity_0_list_right_fade_set.active div:nth-child(3),
.opacity_0_list_right_fade_set.active p:nth-child(3),
.opacity_0_list_right_fade_set.active h2:nth-child(3),
.opacity_0_list_right_fade_set.active h3:nth-child(3),
.opacity_0_list_right_fade_set.active h4:nth-child(3),
.opacity_0_list_right_fade_set.active h5:nth-child(3),
.opacity_0_list_right_fade_set.active figure:nth-child(3) {
  -webkit-animation: fadein_sc_right 0.75s ease 1.05s forwards alternate;
  animation: fadein_sc_right 0.75s ease 1.05s forwards alternate;
}
.opacity_0_list_right_fade_set.active > li:nth-child(4),
.opacity_0_list_right_fade_set.active section:nth-child(4),
.opacity_0_list_right_fade_set.active div:nth-child(4),
.opacity_0_list_right_fade_set.active p:nth-child(4),
.opacity_0_list_right_fade_set.active h2:nth-child(4),
.opacity_0_list_right_fade_set.active h3:nth-child(4),
.opacity_0_list_right_fade_set.active h4:nth-child(4),
.opacity_0_list_right_fade_set.active h5:nth-child(4),
.opacity_0_list_right_fade_set.active figure:nth-child(4) {
  -webkit-animation: fadein_sc_right 0.75s ease 1.4s forwards alternate;
  animation: fadein_sc_right 0.75s ease 1.4s forwards alternate;
}
.opacity_0_list_right_fade_set.active > li:nth-child(5),
.opacity_0_list_right_fade_set.active section:nth-child(5),
.opacity_0_list_right_fade_set.active div:nth-child(5),
.opacity_0_list_right_fade_set.active p:nth-child(5),
.opacity_0_list_right_fade_set.active h2:nth-child(5),
.opacity_0_list_right_fade_set.active h3:nth-child(5),
.opacity_0_list_right_fade_set.active h4:nth-child(5),
.opacity_0_list_right_fade_set.active h5:nth-child(5),
.opacity_0_list_right_fade_set.active figure:nth-child(5) {
  -webkit-animation: fadein_sc_right 0.75s ease 1.75s forwards alternate;
  animation: fadein_sc_right 0.75s ease 1.75s forwards alternate;
}
.opacity_0_list_right_fade_set.active > li:nth-child(6),
.opacity_0_list_right_fade_set.active section:nth-child(6),
.opacity_0_list_right_fade_set.active div:nth-child(6),
.opacity_0_list_right_fade_set.active p:nth-child(6),
.opacity_0_list_right_fade_set.active h2:nth-child(6),
.opacity_0_list_right_fade_set.active h3:nth-child(6),
.opacity_0_list_right_fade_set.active h4:nth-child(6),
.opacity_0_list_right_fade_set.active h5:nth-child(6),
.opacity_0_list_right_fade_set.active figure:nth-child(6) {
  -webkit-animation: fadein_sc_right 0.75s ease 2.1s forwards alternate;
  animation: fadein_sc_right 0.75s ease 2.1s forwards alternate;
}
.opacity_0_list_right_fade_set.active > li:nth-child(7),
.opacity_0_list_right_fade_set.active section:nth-child(7),
.opacity_0_list_right_fade_set.active div:nth-child(7),
.opacity_0_list_right_fade_set.active p:nth-child(7),
.opacity_0_list_right_fade_set.active h2:nth-child(7),
.opacity_0_list_right_fade_set.active h3:nth-child(7),
.opacity_0_list_right_fade_set.active h4:nth-child(7),
.opacity_0_list_right_fade_set.active h5:nth-child(7),
.opacity_0_list_right_fade_set.active figure:nth-child(7) {
  -webkit-animation: fadein_sc_right 0.75s ease 2.45s forwards alternate;
  animation: fadein_sc_right 0.75s ease 2.45s forwards alternate;
}
.opacity_0_list_right_fade_set.active > li:nth-child(8),
.opacity_0_list_right_fade_set.active section:nth-child(8),
.opacity_0_list_right_fade_set.active div:nth-child(8),
.opacity_0_list_right_fade_set.active p:nth-child(8),
.opacity_0_list_right_fade_set.active h2:nth-child(8),
.opacity_0_list_right_fade_set.active h3:nth-child(8),
.opacity_0_list_right_fade_set.active h4:nth-child(8),
.opacity_0_list_right_fade_set.active h5:nth-child(8),
.opacity_0_list_right_fade_set.active figure:nth-child(8) {
  -webkit-animation: fadein_sc_right 0.75s ease 2.8s forwards alternate;
  animation: fadein_sc_right 0.75s ease 2.8s forwards alternate;
}
.opacity_0_list_right_fade_set.active > li:nth-child(9),
.opacity_0_list_right_fade_set.active section:nth-child(9),
.opacity_0_list_right_fade_set.active div:nth-child(9),
.opacity_0_list_right_fade_set.active p:nth-child(9),
.opacity_0_list_right_fade_set.active h2:nth-child(9),
.opacity_0_list_right_fade_set.active h3:nth-child(9),
.opacity_0_list_right_fade_set.active h4:nth-child(9),
.opacity_0_list_right_fade_set.active h5:nth-child(9),
.opacity_0_list_right_fade_set.active figure:nth-child(9) {
  -webkit-animation: fadein_sc_right 0.75s ease 3.15s forwards alternate;
  animation: fadein_sc_right 0.75s ease 3.15s forwards alternate;
}
.opacity_0_list_right_fade_set.active > li:nth-child(10),
.opacity_0_list_right_fade_set.active section:nth-child(10),
.opacity_0_list_right_fade_set.active div:nth-child(10),
.opacity_0_list_right_fade_set.active p:nth-child(10),
.opacity_0_list_right_fade_set.active h2:nth-child(10),
.opacity_0_list_right_fade_set.active h3:nth-child(10),
.opacity_0_list_right_fade_set.active h4:nth-child(10),
.opacity_0_list_right_fade_set.active h5:nth-child(10),
.opacity_0_list_right_fade_set.active figure:nth-child(10) {
  -webkit-animation: fadein_sc_right 0.75s ease 3.5s forwards alternate;
  animation: fadein_sc_right 0.75s ease 3.5s forwards alternate;
}
.opacity_0_list_right_fade_set.active > li:nth-child(11),
.opacity_0_list_right_fade_set.active section:nth-child(11),
.opacity_0_list_right_fade_set.active div:nth-child(11),
.opacity_0_list_right_fade_set.active p:nth-child(11),
.opacity_0_list_right_fade_set.active h2:nth-child(11),
.opacity_0_list_right_fade_set.active h3:nth-child(11),
.opacity_0_list_right_fade_set.active h4:nth-child(11),
.opacity_0_list_right_fade_set.active h5:nth-child(11),
.opacity_0_list_right_fade_set.active figure:nth-child(11) {
  -webkit-animation: fadein_sc_right 0.75s ease 3.85s forwards alternate;
  animation: fadein_sc_right 0.75s ease 3.85s forwards alternate;
}
.opacity_0_list_right_fade_set.active > li:nth-child(12),
.opacity_0_list_right_fade_set.active section:nth-child(12),
.opacity_0_list_right_fade_set.active div:nth-child(12),
.opacity_0_list_right_fade_set.active p:nth-child(12),
.opacity_0_list_right_fade_set.active h2:nth-child(12),
.opacity_0_list_right_fade_set.active h3:nth-child(12),
.opacity_0_list_right_fade_set.active h4:nth-child(12),
.opacity_0_list_right_fade_set.active h5:nth-child(12),
.opacity_0_list_right_fade_set.active figure:nth-child(12) {
  -webkit-animation: fadein_sc_right 0.75s ease 4.2s forwards alternate;
  animation: fadein_sc_right 0.75s ease 4.2s forwards alternate;
}

.moveTopBtms {
  transition: 0.5s;
}
.moveTopBtms:hover {
  transform: translate(0px, -5px);
}

.scrollHarukazeFvPosta {
  animation: pathmove 2.4s ease-in-out infinite;
  opacity: 0;
}

@keyframes pathmove {
  0% {
    height: 0;
    top: 0;
    opacity: 0;
  }
  30% {
    height: 100%;
    opacity: 1;
  }
  100% {
    height: 0;
    top: 110%;
    opacity: 0;
  }
}
@keyframes scale_in {
  0% {
    opacity: 0;
    transform: 0;
  }
  50% {
    opacity: 1;
    transform: 1.2;
  }
  100% {
    transform: 1;
  }
}
.opacity_0_scale_in {
  opacity: 0;
}
.opacity_0_scale_in.active {
  -webkit-animation: scale_in 0.75s ease 0.35s forwards alternate;
  animation: scale_in 0.75s ease 0.35s forwards alternate;
}

/** VARIABLES
===================================*/
/** RESET AND LAYOUT
===================================*/
.bx-wrapper {
  position: relative;
  padding: 0;
  *zoom: 1;
  -ms-touch-action: pan-y;
  touch-action: pan-y;
}

.bx-wrapper img {
  max-width: 100%;
  display: block;
}

.bxslider {
  margin: 0;
  padding: 0;
}

ul.bxslider {
  list-style: none;
}

.bx-viewport {
  /* fix other elements on the page moving (in Chrome) */
  -webkit-transform: translateZ(0);
}

/** THEME
===================================*/
.bx-wrapper .bx-pager,
.bx-wrapper .bx-controls-auto {
  position: absolute;
  bottom: 3%;
  width: 100%;
}

/* LOADER */
.bx-wrapper .bx-loading {
  min-height: 50px;
  background: url("../images/bx_loader.gif") center center no-repeat #ffffff;
  height: 100%;
  width: 100%;
  position: absolute;
  top: 0;
  left: 0;
  z-index: 2000;
}

/* PAGER */
.bx-wrapper .bx-pager {
  text-align: center;
  font-size: 0.85em;
  font-family: Arial;
  font-weight: bold;
  color: #666;
  padding-top: 20px;
}

.bx-wrapper .bx-pager.bx-default-pager a {
  background: #666;
  text-indent: -9999px;
  display: block;
  width: 10px;
  height: 10px;
  margin: 0 5px;
  outline: 0;
  -moz-border-radius: 5px;
  -webkit-border-radius: 5px;
  border-radius: 5px;
}

.bx-wrapper .bx-pager.bx-default-pager a:hover,
.bx-wrapper .bx-pager.bx-default-pager a.active,
.bx-wrapper .bx-pager.bx-default-pager a:focus {
  background: #000;
}

.bx-wrapper .bx-pager-item,
.bx-wrapper .bx-controls-auto .bx-controls-auto-item {
  display: inline-block;
  vertical-align: bottom;
  *zoom: 1;
  *display: inline;
}

.bx-wrapper .bx-pager-item {
  font-size: 0;
  line-height: 0;
}

/* DIRECTION CONTROLS (NEXT / PREV) */
.bx-wrapper .bx-prev {
  left: 10px;
  background: url("../images/controls.png") no-repeat 0 -32px;
}

.bx-wrapper .bx-prev:hover,
.bx-wrapper .bx-prev:focus {
  background-position: 0 0;
}

.bx-wrapper .bx-next {
  right: 10px;
  background: url("../images/controls.png") no-repeat -43px -32px;
}

.bx-wrapper .bx-next:hover,
.bx-wrapper .bx-next:focus {
  background-position: -43px 0;
}

.bx-wrapper .bx-controls-direction a {
  position: absolute;
  top: 50%;
  margin-top: -16px;
  outline: 0;
  width: 32px;
  height: 32px;
  text-indent: -9999px;
  z-index: 99;
}

.bx-wrapper .bx-controls-direction a.disabled {
  display: none;
}

/* AUTO CONTROLS (START / STOP) */
.bx-wrapper .bx-controls-auto {
  text-align: center;
}

.bx-wrapper .bx-controls-auto .bx-start {
  display: block;
  text-indent: -9999px;
  width: 10px;
  height: 11px;
  outline: 0;
  background: url("../images/controls.png") -86px -11px no-repeat;
  margin: 0 3px;
}

.bx-wrapper .bx-controls-auto .bx-start:hover,
.bx-wrapper .bx-controls-auto .bx-start.active,
.bx-wrapper .bx-controls-auto .bx-start:focus {
  background-position: -86px 0;
}

.bx-wrapper .bx-controls-auto .bx-stop {
  display: block;
  text-indent: -9999px;
  width: 9px;
  height: 11px;
  outline: 0;
  background: url("../images/controls.png") -86px -44px no-repeat;
  margin: 0 3px;
}

.bx-wrapper .bx-controls-auto .bx-stop:hover,
.bx-wrapper .bx-controls-auto .bx-stop.active,
.bx-wrapper .bx-controls-auto .bx-stop:focus {
  background-position: -86px -33px;
}

/* PAGER WITH AUTO-CONTROLS HYBRID LAYOUT */
.bx-wrapper .bx-controls.bx-has-controls-auto.bx-has-pager .bx-pager {
  text-align: left;
  width: 80%;
}

.bx-wrapper .bx-controls.bx-has-controls-auto.bx-has-pager .bx-controls-auto {
  right: 0;
  width: 35px;
}

/* IMAGE CAPTIONS */
.bx-wrapper .bx-caption {
  position: absolute;
  bottom: 0;
  left: 0;
  background: #666;
  background: rgba(80, 80, 80, 0.75);
  width: 100%;
}

.bx-wrapper .bx-caption span {
  color: #fff;
  font-family: Arial;
  display: block;
  font-size: 0.85em;
  padding: 10px;
}

.lb-loader, .lightbox {
  text-align: center;
  line-height: 0;
}

body:after {
  content: url(../images/close.png) url(../images/loading.gif) url(../images/prev.png) url(../images/next.png);
  display: none;
}

.lb-dataContainer:after, .lb-outerContainer:after {
  content: "";
  clear: both;
}

body.lb-disable-scrolling {
  overflow: hidden;
}

.lightboxOverlay {
  position: absolute;
  top: 0;
  left: 0;
  z-index: 9999;
  background-color: #000;
  filter: alpha(Opacity=80);
  opacity: 0.8;
  display: none;
}

.lightbox {
  position: absolute;
  left: 0;
  width: 100%;
  z-index: 10000;
  font-weight: 400;
}

.lightbox .lb-image {
  display: block;
  height: auto;
  max-width: inherit;
  max-height: none;
  border-radius: 3px;
  border: 4px solid #fff;
}

.lightbox a img {
  border: none;
}

.lb-outerContainer {
  position: relative;
  width: 250px;
  height: 250px;
  margin: 0 auto;
  border-radius: 4px;
  background-color: #fff;
}

.lb-loader, .lb-nav {
  position: absolute;
  left: 0;
}

.lb-outerContainer:after {
  display: table;
}

.lb-loader {
  top: 43%;
  height: 25%;
  width: 100%;
}

.lb-cancel {
  display: block;
  width: 32px;
  height: 32px;
  margin: 0 auto;
  background: url(../images/loading.gif) no-repeat;
}

.lb-nav {
  top: 0;
  height: 100%;
  width: 100%;
  z-index: 10;
}

.lb-container > .nav {
  left: 0;
}

.lb-nav a {
  outline: 0;
  background-image: url(data:image/gif;base64,R0lGODlhAQABAPAAAP///wAAACH5BAEAAAAALAAAAAABAAEAAAICRAEAOw==);
}

.lb-next, .lb-prev {
  height: 100%;
  cursor: pointer;
  display: block;
}

.lb-nav a.lb-prev {
  width: 34%;
  left: 0;
  float: left;
  background: url(../images/prev.png) left 48% no-repeat;
  filter: alpha(Opacity=0);
  opacity: 0;
  -webkit-transition: opacity 0.6s;
  -moz-transition: opacity 0.6s;
  -o-transition: opacity 0.6s;
  transition: opacity 0.6s;
}

.lb-nav a.lb-prev:hover {
  filter: alpha(Opacity=100);
  opacity: 1;
}

.lb-nav a.lb-next {
  width: 64%;
  right: 0;
  float: right;
  background: url(../images/next.png) right 48% no-repeat;
  filter: alpha(Opacity=0);
  opacity: 0;
  -webkit-transition: opacity 0.6s;
  -moz-transition: opacity 0.6s;
  -o-transition: opacity 0.6s;
  transition: opacity 0.6s;
}

.lb-nav a.lb-next:hover {
  filter: alpha(Opacity=100);
  opacity: 1;
}

.lb-dataContainer {
  margin: 0 auto;
  padding-top: 5px;
  width: 100%;
  -moz-border-radius-bottomleft: 4px;
  -webkit-border-bottom-left-radius: 4px;
  border-bottom-left-radius: 4px;
  -moz-border-radius-bottomright: 4px;
  -webkit-border-bottom-right-radius: 4px;
  border-bottom-right-radius: 4px;
}

.lb-dataContainer:after {
  display: table;
}

.lb-data {
  padding: 0 4px;
  color: #ccc;
}

.lb-data .lb-details {
  width: 85%;
  float: left;
  text-align: left;
  line-height: 1.1em;
}

.lb-data .lb-caption {
  font-size: 13px;
  font-weight: 700;
  line-height: 1em;
}

.lb-data .lb-caption a {
  color: #4ae;
}

.lb-data .lb-number {
  display: block;
  clear: left;
  padding-bottom: 1em;
  font-size: 12px;
  color: #999;
}

.lb-data .lb-close {
  display: block;
  float: right;
  width: 30px;
  height: 30px;
  background: url(../images/close.png) top right no-repeat;
  text-align: right;
  outline: 0;
  filter: alpha(Opacity=70);
  opacity: 0.7;
  -webkit-transition: opacity 0.2s;
  -moz-transition: opacity 0.2s;
  -o-transition: opacity 0.2s;
  transition: opacity 0.2s;
}

.lb-data .lb-close:hover {
  cursor: pointer;
  filter: alpha(Opacity=100);
  opacity: 1;
}/*# sourceMappingURL=common.css.map */