@charset "UTF-8";
/* ----------------------------------------------------------------font*/
/*
font-family: 'Kosugi', sans-serif
font-family: 'Roboto', sans-serif;
*/
@import url("https://fonts.googleapis.com/css2?family=Kosugi&family=Roboto:ital,wght@1,500;1,700;1,900&display=swap");
/**
 * Noto Sans CJK JP: https://www.google.com/get/noto/#sans-jpan
 * Noto Sans JP: https://fonts.google.com/earlyaccess#Noto+Sans+JP
 */
@import url("https://cdn.jsdelivr.net/npm/remixicon@2.5.0/fonts/remixicon.css");
@font-face {
  font-family: "Noto Sans JP";
  font-style: normal;
  font-weight: 100;
  src: local("Noto Sans CJK JP Thin"), url(../fonts/NotoSansJP-Thin.woff2) format("woff2"), url(../fonts/NotoSansJP-Thin.woff) format("woff"), url(../fonts/NotoSansJP-Thin.otf) format("opentype");
}

@font-face {
  font-family: "Noto Sans JP";
  font-style: normal;
  font-weight: 300;
  src: local("Noto Sans CJK JP Light"), url(../fonts/NotoSansJP-Light.woff2) format("woff2"), url(../fonts/NotoSansJP-Light.woff) format("woff"), url(../fonts/NotoSansJP-Light.otf) format("opentype");
}

@font-face {
  font-family: "Noto Sans JP";
  font-style: normal;
  font-weight: 400;
  src: local("Noto Sans CJK JP Regular"), url(../fonts/NotoSansJP-Regular.woff2) format("woff2"), url(../fonts/NotoSansJP-Regular.woff) format("woff"), url(../fonts/NotoSansJP-Regular.otf) format("opentype");
}

@font-face {
  font-family: "Noto Sans JP";
  font-style: normal;
  font-weight: 500;
  src: local("Noto Sans CJK JP Medium"), url(../fonts/NotoSansJP-Medium.woff2) format("woff2"), url(../fonts/NotoSansJP-Medium.woff) format("woff"), url(../fonts/NotoSansJP-Medium.otf) format("opentype");
}

@font-face {
  font-family: "Noto Sans JP";
  font-style: normal;
  font-weight: 700;
  src: local("Noto Sans CJK JP Bold"), url(../fonts/NotoSansJP-Bold.woff2) format("woff2"), url(../fonts/NotoSansJP-Bold.woff) format("woff"), url(../fonts/NotoSansJP-Bold.otf) format("opentype");
}

@font-face {
  font-family: "Noto Sans JP";
  font-style: normal;
  font-weight: 900;
  src: local("Noto Sans CJK JP Black"), url(../fonts/NotoSansJP-Black.woff2) format("woff2"), url(../fonts/NotoSansJP-Black.woff) format("woff"), url(../fonts/NotoSansJP-Black.otf) format("opentype");
}

/*icon*/
body {
  font-family: "Noto Sans JP";
  font-weight: 500;
}

img {
  image-rendering: -webkit-optimize-contrast;
}

/* ----------------------------------------------------------------header*/
.header_wrap {
  display: flex;
  justify-content: space-between;
  width: 100%;
  box-sizing: border-box;
  padding: 16px 15px 0;
}

@media print, screen and (min-width: 360px) {
  .header_wrap {
    padding: 16px 20px 0;
  }
}

@media print, screen and (min-width: 768px) {
  .header_wrap {
    padding: 24px 0 0 30px;
  }
}

@media print, screen and (min-width: 992px) {
  .header_wrap {
    padding: 0;
  }
}

.main_logo {
  text-align: left;
}

.main_logo a {
  text-decoration: none;
}

.main_logo h1 img {
  width: 140px;
  height: auto;
}

.main_logo .patent_tx {
  background: #261b18;
  color: #f2b705;
  width: 140px;
  display: flex;
  justify-content: center;
  align-items: center;
  font-size: 1rem;
  margin-top: 6px;
  font-weight: 700;
}

@media print, screen and (min-width: 360px) {
  .main_logo h1 img {
    width: 180px;
  }
  .main_logo .patent_tx {
    width: 180px;
  }
}

@media print, screen and (min-width: 992px) {
  .main_logo {
    margin: 15px 0 0 30px;
  }
  .main_logo h1 img {
    width: 274px;
  }
  .main_logo .patent_tx {
    width: 260px;
    font-size: 1.2rem;
    line-height: 1;
    margin: 6px auto 0;
    padding: 5px;
  }
}

@media print, screen and (min-width: 992px) {
  header.fixed {
    position: fixed;
    width: 100%;
    height: 76px;
    background: rgba(255, 255, 255, 0.9);
    -webkit-animation: header_posi 0.3s;
    animation: header_posi 0.3s;
    z-index: 2000;
  }
  header.fixed .main_logo {
    margin: 0 0 0 30px;
  }
  header.fixed .main_logo h1 img {
    width: 55px;
  }
  header.fixed .main_logo .patent_tx {
    display: none;
  }
  header.fixed #mainnavi {
    background: transparent;
  }
  header.fixed #mainnavi .mainnavi_wrap .h_nav_wrap {
    display: none;
  }
  header.fixed #mainnavi .mainnavi_wrap .nav_wrap .nav {
    padding-top: 10px;
  }
  header.fixed #mainnavi .mainnavi_wrap .nav_wrap .nav > li.fixed_nav {
    display: block;
  }
}

@-webkit-keyframes header_posi {
  0% {
    top: -100px;
  }
  100% {
    top: 0;
  }
}

@keyframes header_posi {
  0% {
    top: -100px;
  }
  100% {
    top: 0;
  }
}

/*------------------------------------------------------------mainnavi*/
#mainnavi {
  display: none;
  width: 100%;
  height: 100vh;
  background: rgba(255, 255, 255, 0.9);
  position: fixed;
  top: 0;
  left: 0;
  overflow: auto;
  z-index: 2001;
}

#mainnavi .mainnavi_wrap {
  display: flex;
  width: 90%;
  height: 100vh;
  flex-direction: column;
  align-items: center;
  box-sizing: border-box;
  margin: 8% auto auto;
}

@media print, screen and (min-width: 360px) {
  #mainnavi .mainnavi_wrap {
    width: 80%;
    margin: 15% auto auto;
  }
}

@media print, screen and (min-width: 992px) {
  #mainnavi {
    display: block;
    width: auto;
    height: auto;
    position: static;
    overflow: visible;
  }
  #mainnavi .mainnavi_wrap {
    width: auto;
    height: auto;
    margin: 0;
    display: block;
  }
}

/*h_nav*/
.h_nav_wrap {
  border-bottom: 1px solid #ddd;
  padding-bottom: 6px;
  width: 100%;
}

.h_nav_wrap .header_contact {
  display: none;
}

@media print, screen and (min-width: 992px) {
  .h_nav_wrap {
    display: flex;
    justify-content: space-between;
    padding: 0;
    width: 100%;
  }
  .h_nav_wrap .header_contact {
    display: flex;
    margin-left: auto;
    margin-right: 0;
  }
}

.h_nav {
  display: flex;
  justify-content: center;
}

.h_nav li {
  font-size: 1.4rem;
  margin: 0 6px;
}

.h_nav li a {
  text-decoration: none;
  color: #261b18;
  transition: 0.2s;
}

.h_nav li a i {
  color: #f27405;
  margin-right: 6px;
  vertical-align: middle;
  font-size: 1.8rem;
}

.h_nav li a:hover {
  opacity: 0.8;
  color: #f27405;
}

.h_nav li.active a {
  pointer-events: none;
  color: #f27405;
}

@media print, screen and (min-width: 360px) {
  .h_nav li {
    font-size: 1.6rem;
  }
  .h_nav li a i {
    font-size: 2rem;
  }
}

@media print, screen and (min-width: 992px) {
  .h_nav {
    padding-left: 10px;
  }
  .h_nav li {
    font-size: 1.4rem;
    display: inline-flex;
    align-items: center;
    padding-top: 8px;
  }
  .h_nav li + li {
    margin-left: 30px;
  }
}

.sp_header_contact {
  padding-top: 2px;
}

.header_contact {
  display: flex;
}

.header_contact li.h_tel {
  padding-right: 1px;
}

.header_contact li.h_tel a {
  font-family: "Roboto", "Noto Sans JP", sans-serif;
  font-weight: 900;
  font-style: italic;
  color: #261b18;
  text-decoration: none;
  background: rgba(221, 221, 221, 0.6);
  display: flex;
  justify-content: center;
  align-items: center;
  width: 50px;
  height: 50px;
  transition: 0.2s;
}

.header_contact li.h_tel a .svg {
  fill: #f27405;
  width: 60px;
  height: 34px;
  vertical-align: middle;
}

.header_contact li.h_tel a span {
  display: none;
}

.header_contact li.h_tel a:hover {
  background: #f27405;
}

.header_contact li.h_tel a:hover .svg {
  fill: #fff;
}

.header_contact li.h_mail a {
  text-decoration: none;
  background: rgba(221, 221, 221, 0.6);
  display: flex;
  justify-content: center;
  align-items: center;
  width: 50px;
  height: 50px;
  transition: 0.2s;
}

.header_contact li.h_mail a i {
  font-size: 33px;
  color: #f27405;
}

.header_contact li.h_mail a:hover {
  background: #f27405;
}

.header_contact li.h_mail a:hover i {
  color: #fff;
}

@media print, screen and (min-width: 360px) {
  .header_contact li.h_tel a {
    width: 60px;
    height: 60px;
  }
  .header_contact li.h_mail a {
    width: 60px;
    height: 60px;
  }
}

@media print, screen and (min-width: 768px) {
  .header_contact {
    align-items: center;
    margin-right: 100px;
  }
  .header_contact li.h_tel {
    padding-right: 24px;
    padding-top: 5px;
  }
  .header_contact li.h_tel a {
    width: auto;
    height: auto;
    background: none;
    pointer-events: none;
  }
  .header_contact li.h_tel a span {
    display: block;
    font-weight: 900;
    font-size: 2.8rem;
    position: relative;
  }
  .header_contact li.h_tel a span::before {
    content: "イーコート21";
    font-size: 1.2rem;
    position: absolute;
    top: -6px;
    right: 20px;
    font-family: "Noto Sans JP";
    font-weight: 400;
    font-style: normal;
  }
  .header_contact li.h_tel a .svg {
    fill: #261b18;
    vertical-align: middle;
  }
}

/*nav*/
.nav_wrap {
  width: 100%;
  margin-top: 16px;
  text-align: left;
}

.nav_wrap .nav {
  display: flex;
  flex-direction: column;
}

.nav_wrap .nav > li > a {
  text-decoration: none;
  color: #261b18;
  font-size: 1.6rem;
  transition: 0.2s;
  display: block;
}

.nav_wrap .nav > li + li {
  margin-top: 8px;
}

.nav_wrap .nav > li:hover a {
  color: #f27405;
}

.nav_wrap .nav > li.sub_toggle {
  order: 7;
  padding-top: 8px;
}

.nav_wrap .nav > li.sub_toggle > a {
  border-bottom: 2px solid #cb4329;
  color: #cb4329;
  pointer-events: none;
}

.nav_wrap .nav > li.sub_toggle .mnav_dropdown > li a {
  display: block;
  white-space: nowrap;
  text-decoration: none;
}

.nav_wrap .nav > li.sub_toggle .mnav_dropdown > li a img {
  width: auto;
  height: 40px;
  margin-top: 16px;
  transition: 0.2s;
  -webkit-backface-visibility: hidden;
  backface-visibility: hidden;
}

.nav_wrap .nav > li.sub_toggle .mnav_dropdown > li a {
  color: #261b18;
  font-size: 16px;
  white-space: nowrap;
  line-height: 1.8;
}
.nav_wrap .nav > li.sub_toggle .mnav_dropdown > li a:hover {
  color: #f27405;
}
.nav_wrap .nav > li.sub_toggle .mnav_dropdown > li a:hover img {
  opacity: 0.8;
}

.nav_wrap .nav > li.fixed_nav {
  display: none;
}

.nav_wrap .nav > li.active a {
  pointer-events: none;
  color: #f27405;
}

.nav_wrap .nav > li.sub_toggle .mnav_dropdown.tx_link {
  padding-top: 10px;
}
.nav_wrap .nav > li.sub_toggle .mnav_dropdown.tx_link li {
  padding: 0.5em 0;
}
.nav_wrap .nav > li.sub_toggle .mnav_dropdown.tx_link li.mnav_child a {
  font-size: 14px;
}
.nav_wrap .nav > li.sub_toggle .mnav_dropdown.tx_link li.mnav_child a::before {
  font-family: remixicon !important;
  font-style: normal;
  content: "\ea68";
  margin-right: 0.5em;
  color: #cb4329;
}
@media print, screen and (min-width: 360px) {
  .nav_wrap {
    margin-top: 24px;
  }
  .nav_wrap .nav > li > a {
    font-size: 1.8rem;
  }
  .nav_wrap .nav > li + li {
    margin-top: 16px;
  }
  .nav_wrap .nav > li.sub_toggle {
    padding-top: 16px;
  }
}

@media print, screen and (min-width: 992px) {
  .nav_wrap {
    margin-top: 0;
  }
  .nav_wrap .nav {
    flex-direction: row;
    padding: 0 15px 0 0;
  }
  .nav_wrap .nav > li > a {
    font-size: 1.4rem;
    padding: 15px 6px;
  }
  .nav_wrap .nav > li + li {
    margin: 0 0 0 10px;
  }
  .nav_wrap .nav > li.sub_toggle {
    order: 0;
    padding-top: 0;
    position: relative;
  }
  .nav_wrap .nav > li.sub_toggle > a {
    border-bottom: none;
    color: #261b18;
    pointer-events: auto;
  }
  .nav_wrap .nav > li.sub_toggle .mnav_dropdown {
    display: none;
    position: absolute;
    right: 0;
    /* right: 50%; */
    -webkit-transform: translateX(50%);
    transform: translateX(50%);
  }
  .nav_wrap .nav > li.sub_toggle .mnav_dropdown > li {
    background: rgba(255, 255, 255, 0.9);
  }
  .nav_wrap .nav > li.sub_toggle .mnav_dropdown > li a {
    display: block;
    background: rgba(221, 221, 221, 0.6);
    padding: 10px 15px;
    margin-bottom: 1px;
  }
  .nav_wrap .nav > li.sub_toggle .mnav_dropdown > li a img {
    margin-top: 0;
  }
  .nav_wrap .nav > li.sub_toggle .mnav_dropdown > li a:hover {
    background: rgba(221, 221, 221, 0.3);
  }
  .nav_wrap .nav > li.sub_toggle .mnav_dropdown > li a:hover img {
    opacity: 1;
  }
  .nav_wrap .nav > li.fixed_nav.fixed_contact a {
    background: rgba(221, 221, 221, 0.6);
    margin: -16px -15px 0 10px;
    padding: 15px;
    transition: 0.2s;
  }
  .nav_wrap .nav > li.fixed_nav.fixed_contact a i {
    font-size: 33px;
    color: #f27405;
  }
  .nav_wrap .nav > li.fixed_nav.fixed_contact a:hover {
    background: #f27405;
  }
  .nav_wrap .nav > li.fixed_nav.fixed_contact a:hover i {
    color: #fff;
  }

  .nav_wrap .nav > li.sub_toggle .mnav_dropdown.tx_link {
    padding-top: 0;
  }
  .nav_wrap .nav > li.sub_toggle .mnav_dropdown.tx_link li {
    padding: 0;
  }

}

@media print, screen and (min-width: 1200px) {
  .nav_wrap .nav > li > a {
    font-size: 1.6rem;
    padding: 20px 15px;
  }
  .nav_wrap .nav > li.fixed_nav.fixed_contact a {
    padding: 15px 20px;
  }
}

/*------------------------------------------------------------toggle*/
/*toggle*/
.toggle {
  width: 52px;
  height: 52px;
  text-align: center;
  border: #261b18 2px solid;
  background-color: #fff;
  border-radius: 50%;
  padding-top: 12px;
  position: fixed;
  bottom: 30px;
  right: 16px;
  transition: 0.3s;
  z-index: 2010;
}

@media print, screen and (min-width: 480px) {
  .toggle {
    bottom: 25px;
  }
}

@media print, screen and (min-width: 768px) {
  .toggle {
    top: 30px;
    right: 30px;
    width: 56px;
    height: 56px;
    padding-top: 13px;
    padding-top: 14px;
  }
}

@-webkit-keyframes nav_anime {
  0% {
    top: -60px;
    opacity: 0;
  }
  100% {
    top: 15px;
    opacity: 100%;
  }
}

@keyframes nav_anime {
  0% {
    top: -60px;
    opacity: 0;
  }
  100% {
    top: 15px;
    opacity: 100%;
  }
}

.menu_trigger,
.menu_trigger span {
  display: inline-block;
  transition: all 0.4s;
  box-sizing: border-box;
}

.menu_trigger {
  position: relative;
  width: 30px;
  height: 24px;
  transition: 0.2s;
}

.menu_trigger span {
  position: absolute;
  left: 0;
  width: 100%;
  height: 2px;
  background-color: #261b18;
  border-radius: 4px;
}

.menu_trigger span:nth-of-type(1) {
  top: 0;
}

.menu_trigger span:nth-of-type(2) {
  top: 11px;
}

.menu_trigger span:nth-of-type(3) {
  bottom: 0;
}

.menu_trigger.onmenu span:nth-of-type(1) {
  width: 45%;
  -webkit-transform: translate3d(2px, 5px, 0) rotate(45deg);
  transform: translate3d(2px, 5px, 0) rotate(45deg);
}

.menu_trigger.onmenu span:nth-of-type(2) {
  -webkit-transform: translate3d(-1px, 0, 0) rotate(-45deg);
  transform: translate3d(-1px, 0, 0) rotate(-45deg);
}

.menu_trigger.onmenu span:nth-of-type(3) {
  width: 45%;
  -webkit-transform: translate3d(14px, -5px, 0) rotate(45deg);
  transform: translate3d(14px, -5px, 0) rotate(45deg);
}

@media print, screen and (min-width: 992px) {
  .toggle {
    display: none;
  }
}

/*------------------------------------------------------------pagetitle*/
#pagetitle {
  margin-top: 16px;
  width: 100%;
  height: 200px;
  position: relative;
}

#pagetitle::after {
  content: "";
  display: block;
  height: 100%;
  width: 100%;
  background: rgba(255, 255, 255, 0.6);
  position: absolute;
  left: 0;
  top: 0;
  z-index: 2;
}

#pagetitle .pagetitle_wrap {
  width: 100%;
  height: 100%;
  display: flex;
  justify-content: center;
  align-items: center;
  -webkit-filter: none;
  filter: none;
  position: relative;
  z-index: 10;
  text-align: left;
}

#pagetitle .pagetitle_wrap h2 {
  font-size: 2.4rem;
  font-weight: 700;
  /* font-family: 'Kosugi', sans-serif; */
  font-weight: 500;
  font-style: normal;
  color: #261b18;
  font-weight: bold;
}

#pagetitle .pagetitle_wrap h2 img {
  width: auto;
  height: 60px;
  margin-bottom: 8px;
  -webkit-filter: drop-shadow(0 0 3px #fff);
  filter: drop-shadow(0 0 3px #fff);
}

#pagetitle .pagetitle_wrap h2 span {
  display: block;
  font-family: "Roboto", "Noto Sans JP", sans-serif;
  font-weight: 900;
  font-style: italic;
  font-size: 0.6em;
  line-height: 1;
  margin-top: 0;
  padding-top: 4px;
  color: #f2b705;
  border-top: 1px solid #f2b705;
}

#pagetitle .pagetitle_img {
  content: "";
  display: block;
  background: url(../img/common_img/pagetitle.jpg) center right no-repeat;
  background-size: cover;
  -webkit-filter: grayscale(60%);
  filter: grayscale(60%);
  width: 100%;
  height: 100%;
  position: absolute;
  left: 0;
  top: 0;
  z-index: 1;
}

@media print, screen and (min-width: 768px) {
  #pagetitle {
    height: 300px;
  }
  #pagetitle::after {
    content: "";
    display: block;
    height: 100%;
    width: 50%;
    background: rgba(255, 255, 255, 0.85);
    position: absolute;
    left: 0;
    top: 0;
    z-index: 2;
  }
  #pagetitle .pagetitle_wrap {
    width: 50%;
  }
  #pagetitle .pagetitle_wrap h2 {
    font-size: 3.4rem;
  }
}

@media print, screen and (min-width: 992px) {
  #pagetitle {
    margin-top: 0;
  }
  #pagetitle .pagetitle_wrap h2 img {
    height: 80px;
  }
}

@media print, screen and (min-width: 1200px) {
  #pagetitle {
    height: 400px;
  }
  #pagetitle .pagetitle_wrap h2 {
    font-size: 4.8rem;
  }
  #pagetitle .pagetitle_wrap h2 img {
    height: 90px;
    margin-bottom: 12px;
  }
}

/* ----------------------------------------------------------------footer*/
/*footer_contact--------------------------*/
.footer_contact .cts_p {
  margin-top: 26px;
}

@media print, screen and (min-width: 992px) {
  .footer_contact .cts_p {
    margin-top: 32px;
  }
}

.f_contact_wrap {
  margin-top: 24px;
}

@media print, screen and (min-width: 768px) {
  .f_contact_wrap {
    display: flex;
    justify-content: center;
    align-items: center;
  }
}

.f_tel a {
  display: block;
}

.f_tel a .svg {
  fill: #261b18;
  width: 60px;
  height: 50px;
  vertical-align: bottom;
}

.f_tel a span {
  color: #261b18;
  font-family: "Roboto", "Noto Sans JP", sans-serif;
  font-weight: 900;
  font-style: italic;
  font-size: 3.2rem;
  position: relative;
}

.f_tel a span::before {
  content: "イーコート21";
  font-size: 1.4rem;
  position: absolute;
  top: -14px;
  right: 20px;
  font-family: "Noto Sans JP";
  font-weight: 400;
  font-style: normal;
}

@media print, screen and (min-width: 360px) {
  .f_tel a span {
    font-size: 4rem;
  }
  .f_tel a .svg {
    vertical-align: -12px;
  }
}

@media print, screen and (min-width: 768px) {
  .f_tel a {
    pointer-events: none;
  }
}

@media print, screen and (min-width: 1200px) {
  .f_tel a {
    padding-top: 20px;
  }
  .f_tel a span {
    font-size: 6.8rem;
  }
  .f_tel a span::before {
    font-size: 2.8rem;
    position: absolute;
    top: -24px;
    right: 50px;
    font-family: "Noto Sans JP";
    font-weight: 400;
  }
  .f_tel a .svg {
    width: 60px;
    height: 100px;
    margin-right: 8px;
    vertical-align: -30px;
  }
}

.f_mail a {
  display: flex;
  justify-content: center;
  align-items: center;
  background: #261b18;
  border-radius: 10px;
  color: #fff;
  text-decoration: none;
  font-size: 1.8rem;
  font-weight: 700;
  padding: 8px 40px 8px 0;
  transition: 0.2s;
  position: relative;
  max-width: 460px;
  margin: 0 auto;
}

.f_mail a::after {
  content: "";
  display: block;
  background: url("data:image/svg+xml;charset=utf8,%3Csvg xmlns='http://www.w3.org/2000/svg' width='11' height='18'%3E%3Cpath fill='%23fff' d='M1.83 0l7.34 7.2L11 9l-9.17 9L0 16.2 7.33 9 0 1.8z'/%3E%3C/svg%3E") 50% 50%/100% 100% no-repeat;
  background-size: 4px auto;
  width: 20px;
  height: 20px;
  border-radius: 50%;
  border: 2px solid #fff;
  position: absolute;
  right: 12px;
}

.f_mail a .f_mail_icon {
  margin-right: 16px;
}

.f_mail a:hover {
  -webkit-transform: translateY(2px);
  transform: translateY(2px);
  color: #f2b705;
}

.f_mail a:hover::after {
  background: url("data:image/svg+xml;charset=utf8,%3Csvg xmlns='http://www.w3.org/2000/svg' width='11' height='18'%3E%3Cpath fill='%23f2b705' d='M1.83 0l7.34 7.2L11 9l-9.17 9L0 16.2 7.33 9 0 1.8z'/%3E%3C/svg%3E") 50% 50%/100% 100% no-repeat;
  background-size: 4px auto;
  border: 2px solid #f2b705;
}

@media print, screen and (min-width: 360px) {
  .f_mail a {
    padding: 8px 32px 8px 0;
  }
}

@media print, screen and (min-width: 768px) {
  .f_mail {
    margin-left: 30px;
  }
  .f_mail a {
    min-width: 300px;
    padding: 12px 45px 12px 12px;
  }
  .f_mail a::after {
    background: url("data:image/svg+xml;charset=utf8,%3Csvg xmlns='http://www.w3.org/2000/svg' width='11' height='18'%3E%3Cpath fill='%23fff' d='M1.83 0l7.34 7.2L11 9l-9.17 9L0 16.2 7.33 9 0 1.8z'/%3E%3C/svg%3E") 50% 50%/100% 100% no-repeat;
    background-size: 4px auto;
    width: 30px;
    height: 30px;
    right: 16px;
  }
}

@media print, screen and (min-width: 992px) {
  .f_mail a {
    font-size: 2.4rem;
    min-width: 360px;
  }
}

@media print, screen and (min-width: 1200px) {
  .f_mail a {
    min-width: 460px;
    padding: 16px 60px 16px 0;
  }
  .f_mail a::after {
    background: url("data:image/svg+xml;charset=utf8,%3Csvg xmlns='http://www.w3.org/2000/svg' width='11' height='18'%3E%3Cpath fill='%23fff' d='M1.83 0l7.34 7.2L11 9l-9.17 9L0 16.2 7.33 9 0 1.8z'/%3E%3C/svg%3E") 50% 50%/100% 100% no-repeat;
    background-size: 7px auto;
    width: 36px;
    height: 36px;
    right: 30px;
  }
  .f_mail a:hover::after {
    background: url("data:image/svg+xml;charset=utf8,%3Csvg xmlns='http://www.w3.org/2000/svg' width='11' height='18'%3E%3Cpath fill='%23f2b705' d='M1.83 0l7.34 7.2L11 9l-9.17 9L0 16.2 7.33 9 0 1.8z'/%3E%3C/svg%3E") 50% 50%/100% 100% no-repeat;
    background-size: 7px auto;
  }
  .f_mail a .f_mail_icon {
    margin-right: 30px;
  }
}

.f_mail_icon {
  display: flex;
  flex-direction: column;
  line-height: 1;
  font-family: "Roboto", "Noto Sans JP", sans-serif;
  font-weight: 900;
  font-style: italic;
  font-size: 1.4rem;
  font-weight: 500;
}

.f_mail_icon i {
  font-size: 2.6rem;
  font-weight: normal;
}

@media print, screen and (min-width: 1200px) {
  .f_mail_icon {
    font-size: 1.8rem;
    line-height: 0.9;
  }
  .f_mail_icon i {
    font-size: 4rem;
  }
}

/**/
.company_info_wrap {
  margin-top: 30px;
}

@media print, screen and (min-width: 480px) {
  .company_info_wrap {
    margin-top: 40px;
    display: flex;
  }
  .company_info_wrap .company_info {
    width: 50%;
    padding: 0 20px 20px;
    box-sizing: border-box;
    border-left: 1px solid #fff;
  }
  .company_info_wrap .company_info:last-child {
    border-right: 1px solid #fff;
  }
}

.company_info {
  color: #fff;
  padding: 16px;
}

.company_info dt {
  font-weight: 700;
  border: 1px solid #fff;
  display: inline-flex;
  justify-content: center;
  align-items: center;
  padding: 4px 6px;
  min-width: 200px;
}

.company_info dt + dd {
  margin-top: 10px;
}

/*footer--------------------------*/
footer .container {
  padding-top: 30px;
  padding-bottom: 30px;
}

@media print, screen and (min-width: 1200px) {
  footer .container {
    padding-top: 60px;
    padding-bottom: 60px;
    display: flex;
    justify-content: space-between;
    flex-wrap: wrap;
  }
}

.footer_nav_wrap {
  text-align: left;
  display: flex;
  flex-wrap: wrap;
}

.footer_nav_wrap > li {
  width: 50%;
}

@media print, screen and (min-width: 480px) {
  .footer_nav_wrap > li {
    width: calc(100% / 2);
  }
}
@media print, screen and (min-width:768px) {
  .footer_nav_wrap > li {
    width: calc(100% / 4);
  }
}
@media print, screen and (min-width: 1200px) {
  .footer_nav_wrap {
    width: calc(100% - 360px - 80px);
  }
}

.footer_nav li a {
  text-decoration: none;
  color: #fff;
  line-height: 2.6;
  transition: 0.2s;
  white-space: nowrap;
  font-size: 1.4rem;
}

.footer_nav li a:hover {
  text-decoration: underline;
  opacity: 0.5;
}

.footer_nav li dl dt {
  color: #f2b705;
  font-weight: 700;
}

.footer_nav li dl dd {
  position: relative;
  padding-left: 16px;
}

.footer_nav li dl dd::before {
  content: "";
  display: block;
  width: 8px;
  height: 1px;
  background: #fff;
  position: absolute;
  left: 0;
  top: 20px;
}

.f_right_column {
  padding-top: 24px;
}

@media print, screen and (min-width: 768px) {
  .f_right_column {
    display: flex;
    justify-content: space-between;
  }
}

@media print, screen and (min-width: 1200px) {
  .f_right_column {
    flex-direction: column;
    justify-content: flex-start;
    align-items: flex-end;
  }
}

#pagetop {
  padding-top: 30px;
}

#pagetop a {
  font-family: "Roboto", "Noto Sans JP", sans-serif;
  font-weight: 900;
  font-style: italic;
  color: #f27405;
  font-size: 3rem;
  text-decoration: none;
  transition: 0.2s;
}

#pagetop a::after {
  content: "";
  display: inline-flex;
  width: 36px;
  height: 36px;
  border: 2px solid #f27405;
  background: url("data:image/svg+xml;charset=utf8,%3Csvg xmlns='http://www.w3.org/2000/svg' width='10.82' height='6.59'%3E%3Cpath fill='%23f27405' d='M.01 5.49l4.32-4.4 1.08-1.1 5.4 5.5-1.08 1.1-4.32-4.4-4.32 4.4z'/%3E%3C/svg%3E") 50% 50%/100% 100% no-repeat;
  background-size: 12px auto;
  border-radius: 50%;
  vertical-align: -5px;
  margin-left: 8px;
}

#pagetop a:hover {
  color: #f2b705;
}

#pagetop a:hover::after {
  border: 2px solid #f2b705;
  background: url("data:image/svg+xml;charset=utf8,%3Csvg xmlns='http://www.w3.org/2000/svg' width='10.82' height='6.59'%3E%3Cpath fill='%23f2b705' d='M.01 5.49l4.32-4.4 1.08-1.1 5.4 5.5-1.08 1.1-4.32-4.4-4.32 4.4z'/%3E%3C/svg%3E") 50% 50%/100% 100% no-repeat;
  background-size: 12px auto;
}

small {
  color: #fff;
  font-size: 1.2rem;
  font-weight: 400;
  display: block;
  padding-top: 24px;
}

@media print, screen and (min-width: 1200px) {
  small {
    width: 100%;
  }
}

/*------------------------------------------------------------Pankuzu*/
/*pankuzu*/
#pankuzu {
  width: 100%;
  margin: 16px 0 0;
  clear: both;
}

#pankuzu ol {
  list-style: none;
}

#pankuzu ol li {
  float: left;
  font-size: 11px;
  padding: 0 7px 0 10px;
  background: url(../img/common_img/icon_pankuzu.gif) no-repeat 0 50%;
}

#pankuzu ol li em {
  font-style: normal;
}

#pankuzu ol li.home {
  padding-left: 0;
  background: none;
}

#pankuzu ol li a:link,
#pankuzu ol li a:visited {
  text-decoration: underline;
}

#pankuzu ol li a:hover,
#pankuzu ol li a:active {
  text-decoration: underline;
}

/* ----------------------------------------------------------------rayout*/
.center {
  display: block;
  margin: auto;
}

/*------------------------------------------------------------table*/
.sheet_basic {
  width: 100%;
  border-collapse: collapse;
  border-bottom: 1px solid #a39896;
  background: #fff;
}

.sheet_basic tr th,
.sheet_basic tr td {
  border: 1px solid #a39896;
  border-bottom: none;
  padding: 10px;
  text-align: left;
  display: block;
}

.sheet_basic tr th {
  background: rgba(221, 221, 221, 0.6);
  white-space: nowrap;
}

@media print, screen and (min-width: 768px) {
  .sheet_basic tr th,
  .sheet_basic tr td {
    display: table-cell;
    padding: 16px;
  }
}

.table_basic {
  width: 100%;
  border-collapse: collapse;
  background: #fff;
}

.table_basic th {
  background: rgba(221, 221, 221, 0.6);
  white-space: nowrap;
}

.table_basic th,
.table_basic td {
  border: 1px solid #a39896;
  padding: 10px;
  text-align: left;
}

.list_basic li {
  text-align: left;
  position: relative;
  padding: 0 0 0 1em;
}

.list_basic li::before {
  content: "";
  width: 6px;
  height: 6px;
  background: #261b18;
  display: block;
  left: 0;
  top: 9px;
  position: absolute;
  border-radius: 50%;
}

.list_basic li + li {
  margin-top: 8px;
}

.dl_basic {
  text-align: left;
  overflow: hidden;
}

.dl_basic dt {
  font-weight: 700;
  margin-right: 8px;
}

.dl_basic dt::before {
  content: "[";
  margin-right: 6px;
}

.dl_basic dt::after {
  content: "]";
  margin-left: 6px;
}

.dl_basic dd {
  overflow: hidden;
  margin-bottom: 10px;
}

@media print, screen and (min-width: 768px) {
  .dl_basic dt {
    margin-bottom: 10px;
    float: left;
    overflow: hidden;
  }
  .dl_basic dd {
    overflow: hidden;
    margin-bottom: 10px;
  }
}

@media print, screen and (min-width: 992px) {
  .dl_basic dt {
    margin-right: 16px;
  }
}

/*------------------------------------------------------------Decoration*/
/*Line*/
hr.line_01 {
  height: 1px;
  clear: both;
  margin: 20px 0px;
  border-top: 1px dotted #ccc;
  border-right: 0 dotted #ccc;
  border-bottom: 0 dotted #ccc;
  border-left: 0 dotted #ccc;
}

.space_10 {
  height: 10px;
  clear: both;
}

.space_20 {
  height: 20px;
  clear: both;
}

.space_30 {
  height: 30px;
  clear: both;
}

.space_10 hr,
.space_20 hr,
.space_30 hr {
  display: none;
}

/*------------------------------------------------------------content*/
.bg_color01 {
  background: #f27405;
}

.bg_color02 {
  background: rgba(221, 221, 221, 0.4);
}

.bg_color03 {
  background: #261b18;
}

.bg_color01 .title01,
.bg_color03 .title01 {
  color: #fff;
}

.bg_color01 .cts_p,
.bg_color03 .cts_p {
  color: #fff;
}

.bg_color01 .title01 .ti_ja.tx_black {
  color: #261b18;
}

.section {
  padding-top: 30px;
  padding-bottom: 30px;
}

@media print, screen and (min-width: 768px) {
  .section {
    padding-top: 50px;
    padding-bottom: 50px;
  }
}

@media print, screen and (min-width: 1200px) {
  .section {
    padding-top: 80px;
    padding-bottom: 80px;
  }
}

/*------------------------------------------------------------Text*/
/*title*/
.title01 {
  font-family: "Roboto", "Noto Sans JP", sans-serif;
  font-weight: 900;
  font-style: italic;
  font-size: 4rem;
  line-height: 1;
}

.title01.maincolor {
  color: #f27405;
}

.title01.maincolor .ti_ja {
  color: #261b18;
}

.title01 .ti_ja {
  display: block;
  font-size: 1.6rem;
  line-height: 1.2;
  font-family: "Noto Sans JP";
  font-weight: 700;
  font-style: normal;
  padding-top: 8px;
}

@media print, screen and (min-width: 992px) {
  .title01 {
    font-size: 4.8rem;
  }
  .title01 .ti_ja {
    font-size: 1.8rem;
  }
}

@media print, screen and (min-width: 1200px) {
  .title01 {
    font-size: 6rem;
  }
}

.title01 + .cts_p {
  margin-top: 16px;
}

@media print, screen and (min-width: 768px) {
  .title01 + .cts_p {
    margin-top: 24px;
  }
}

.title02 {
  background: #f27405;
  color: #fff;
  font-size: 1.8rem;
  position: relative;
  font-weight: 700;
  padding: 8px 16px;
}

.title02.color02 {
  background: #f2b705;
}

.title02::before {
  content: "";
  display: block;
  width: 0;
  height: 0;
  border-style: solid;
  border-width: 45px 18px 0 0;
  border-color: #fff transparent transparent transparent;
  top: 0;
  left: 0;
  position: absolute;
}

.title02::after {
  content: "";
  display: block;
  width: 0;
  height: 0;
  border-style: solid;
  border-width: 0 0 45px 18px;
  border-color: transparent transparent #fff;
  bottom: 0;
  right: 0;
  position: absolute;
}

@media print, screen and (min-width: 992px) {
  .title02 {
    font-size: 2.4rem;
  }
  .title02::before {
    border-width: 60px 18px 0 0;
  }
  .title02::after {
    border-width: 0 0 60px 18px;
  }
}

.bg_color01 .title02 {
  background: #261b18;
}

.bg_color01 .title02.color02 {
  background: #f2b705;
}

.bg_color01 .title02::before {
  border-color: #f27405 transparent transparent transparent;
}

.bg_color01 .title02::after {
  border-color: transparent transparent #f27405;
}

.bg_color02 .title02::before {
  border-color: #f1f1f1 transparent transparent transparent;
}

.bg_color02 .title02::after {
  border-color: transparent transparent #f1f1f1;
}

.bg_color03 .title02::before {
  border-color: #261b18 transparent transparent transparent;
}

.bg_color03 .title02::after {
  border-color: transparent transparent #261b18;
}

.title03 {
  text-align: left;
  position: relative;
  font-weight: 700;
  font-size: 1.8rem;
  padding: 8px 0 4px 16px;
  z-index: 20;
  border-bottom: 2px solid #f27405;
}

.title03 span {
  color: rgba(242, 116, 5, 0.3);
  font-family: "Roboto", "Noto Sans JP", sans-serif;
  font-weight: 900;
  font-style: italic;
  font-size: 3rem;
  position: absolute;
  left: 2px;
  top: 0;
  z-index: -1;
}

@media print, screen and (min-width: 992px) {
  .title03 {
    font-size: 2.4rem;
    padding: 14px 0 8px 18px;
  }
  .title03 span {
    font-size: 4rem;
  }
}

.bg_color01 .title03 {
  border-bottom: 2px solid rgba(242, 183, 5, 0.5);
}

.bg_color01 .title03 span {
  color: rgba(242, 183, 5, 0.5);
}

.bg_color03 .title03 {
  color: #fff;
}

.bg_color03 .title03 span {
  color: rgba(242, 183, 5, 0.3);
}

.title04 {
  font-size: 1.6rem;
  font-weight: 700;
  position: relative;
  padding-bottom: 8px;
}

.title04::after {
  content: "";
  width: 80px;
  height: 2px;
  background: #f27405;
  display: block;
  position: absolute;
  bottom: 0;
  left: 0;
  right: 0;
  margin: auto auto 0;
}

.title04.ti_big {
  font-size: 1.8rem;
}

@media print, screen and (min-width: 768px) {
  .title04 {
    font-size: 2rem;
    padding-bottom: 16px;
  }
  .title04.ti_big {
    font-size: 2.4rem;
  }
}

@media print, screen and (min-width: 992px) {
  .title04 {
    font-size: 2.4rem;
  }
  .title04.ti_big {
    font-size: 3rem;
  }
}

.bg_color01 .title04::after {
  background: #f2b705;
}

.bg_color03 .title04 {
  color: #fff;
}

.title05 {
  padding: 0.5rem 1rem;
  /* font-family: 'Kosugi', sans-serif; */
  font-weight: 500;
  font-style: normal;
  font-weight: bold;
  color: #fff;
  background-image: linear-gradient(to right, #f27405 0%, #f2b705 100%);
  font-size: 1.8rem;
}

@media print, screen and (min-width: 992px) {
  .title05 {
    padding: 1rem 2rem;
    font-size: 2rem;
  }
}

.title06 {
  text-align: left;
  border-left: 6px solid #f2b705;
  font-weight: 700;
  padding: 4px 0 4px 8px;
  font-size: 1.6rem;
}

@media print, screen and (min-width: 768px) {
  .title06 {
    font-size: 1.8rem;
    padding: 6px 0 6px 12px;
  }
}

[class^="title0"] + [class^="title0"] {
  margin-top: 24px;
}

.title02 + .cts_p,
.title03 + .cts_p,
.title02 + table,
.title03 + table,
.title04 + .cts_p,
.title04 + table,
.title05 + .cts_p,
.title05 + table,
.title06 + .cts_p,
.title06 + table {
  margin-top: 16px;
}

.cts_p + p {
  margin-top: 16px;
}

.cts_p + [class^="title0"],
table + [class^="title0"] {
  margin-top: 32px;
}

@media print, screen and (min-width: 992px) {
  .cts_p + [class^="title0"],
  table + [class^="title0"] {
    margin-top: 40px;
  }
}

/*TextRight*/
.tx_right {
  text-align: right;
}

/*TextLeft*/
.tx_left {
  text-align: left;
}

.tx_l_c {
  text-align: left;
}

@media print, screen and (min-width: 768px) {
  .tx_l_c {
    text-align: center;
  }
}

.tx_c_l {
  text-align: center;
}

@media print, screen and (min-width: 768px) {
  .tx_c_l {
    text-align: left;
  }
}

/*TextCenter*/
.tx_cent {
  text-align: center;
}



/*bold*/
.tx_bold {
  font-style: normal;
  font-weight: bold;
}

/*TextRed*/
.tx_red {
  color: #c33;
}

.tx_maincolor {
  color: #f27405;
}

.tx_subcolor {
  color: #f2b705;
}

.tx_black {
  color: #261b18;
}

/*attention*/
.attention {
  font-size: 10px;
  line-height: 130%;
  margin: 5px 0;
}

.en_tx {
  font-family: "Roboto", "Noto Sans JP", sans-serif;
  font-weight: 700;
  font-style: italic;
}

.en_tx_bold {
  font-family: "Roboto", "Noto Sans JP", sans-serif;
  font-weight: 900;
  font-style: italic;
}

.kosugi_tx {
  /* font-family: 'Kosugi', sans-serif; */
  font-weight: 500;
  font-style: normal;
}

.mincho_tx {
  font-family: "游明朝", YuMincho, "Hiragino Mincho ProN W3", "ヒラギノ明朝 ProN W3", "Hiragino Mincho ProN", "HG明朝E", "ＭＳ Ｐ明朝", "ＭＳ 明朝", serif;
}

.marker {
  background: linear-gradient(transparent 40%, #ffd249 40%);
  padding-bottom: 4px;
}

.catch_tx {
  /* font-family: 'Kosugi', sans-serif; */
  font-weight: 500;
  font-style: normal;
  font-weight: bold;
  font-size: 1.4em;
}

@media print, screen and (min-width: 1200px) {
  .catch_tx {
    font-size: 1.8em;
  }
}

@media print, screen and (min-width: 1200px) {
  .catch_tx {
    font-size: 2em;
  }
}

.tx_big {
  font-size: 1.6rem;
}

@media print, screen and (min-width: 992px) {
  .tx_big {
    font-size: 1.8rem;
  }
}

.tx_s {
  font-size: 0.8em;
}

.tx_em01 {
  display: inline-block;
  background: #261b18;
  line-height: 1.2;
  color: #f2b705;
  font-weight: 700;
  padding: 4px 8px;
}

.tx_em02 {
  border: 1px solid #f27405;
  box-sizing: border-box;
  padding: 15px;
  font-size: 1.4em;
  /* font-family: 'Kosugi', sans-serif; */
  font-weight: 500;
  font-style: normal;
  font-weight: bold;
  color: #f27405;
}

@media print, screen and (min-width: 768px) {
  .tx_em02 {
    padding: 30px;
  }
}

@media print, screen and (min-width: 1200px) {
  .tx_em02 {
    font-size: 1.6em;
  }
}

.tx_em03 {
  font-weight: 700;
  padding: 0 0 8px 2px;
  position: relative;
}

.tx_em03::after {
  content: "";
  display: block;
  background-image: linear-gradient(to right, #f27405 0%, #f2b705 100%);
  width: 100%;
  height: 3px;
  position: absolute;
  bottom: 0;
  left: 0;
}

/**/
.ol_list01 {
  text-align: left;
  list-style: none;
  counter-reset: number;
}

.ol_list01 li {
  padding: 0 0 0 1.7em;
  position: relative;
}

.ol_list01 li::before {
  counter-increment: number;
  content: "0" counter(number) ".";
  font-family: "Roboto", "Noto Sans JP", sans-serif;
  font-weight: 700;
  font-style: italic;
  position: absolute;
  left: 0;
  top: 0;
  color: #f27405;
}

.ol_list01 li + li {
  margin-top: 8px;
}

/*inner*/
.tx_max_right {
  box-sizing: border-box;
  padding: 0 20px 20px;
}

@media print, screen and (min-width: 768px) {
  .tx_max_right {
    padding: 0 30px 24px 40px;
  }
}
@media print, screen and (min-width: 1200px) {
  .tx_max_right {
    padding: 0 80px 24px 60px;
  }
}

.tx_max_left {
  box-sizing: border-box;
  padding: 0 20px 20px;
}

@media print, screen and (min-width: 768px) {
  .tx_max_left {
    padding: 0 40px 24px 30px;
  }
}
@media print, screen and (min-width: 1200px) {
  .tx_max_left {
    padding: 0 60px 24px 80px;
  }
}

.tx_inner_right {
  box-sizing: border-box;
  padding: 0 0 20px;
}

@media print, screen and (min-width: 768px) {
  .tx_inner_right {
    padding: 0 0 24px 40px;
  }
}

.tx_inner_left {
  box-sizing: border-box;
  padding: 0 0 20px;
}

@media print, screen and (min-width: 768px) {
  .tx_inner_left {
    padding: 0 40px 24px 0;
  }
}

.ph_center_box {
  display: flex;
  justify-content: center;
  align-items: center;
}

.tx_inner_cent {
  display: flex;
  justify-content: center;
  flex-direction: column;
}

/*------------------------------------------------------------Float*/
/*FloatLeft*/
.float_left {
  float: left;
}

/*FloatRight*/
.float_right {
  float: right;
}

/*ClearBoth*/
.clearboth {
  clear: both;
}

/*phbox*/
.phbox_right {
  text-align: center;
}

.phbox_right img {
  max-width: 100%;
  height: auto;
  margin-bottom: 20px;
}

.phbox_left {
  text-align: center;
}

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

.ov_hidden {
  overflow: hidden;
}

@media print, screen and (min-width: 768px) {
  .phbox_right {
    float: right;
    margin-left: 30px;
    margin-bottom: 0px;
  }
  .phbox_left {
    float: left;
    margin-right: 30px;
    margin-bottom: 0px;
  }
}

/*------------------------------------------------------------Margin*/
/*MarginTop*/
.margin_t05 {
  margin-top: 5px;
}

.margin_t10 {
  margin-top: 10px;
}

.margin_t20 {
  margin-top: 20px;
}

.margin_t30 {
  margin-top: 30px;
}

.margin_t40 {
  margin-top: 40px;
}

.margin_t50 {
  margin-top: 50px;
}

/*MarginBottom*/
.margin_b05 {
  margin-bottom: 5px;
}

.margin_b10 {
  margin-bottom: 10px;
}

.margin_b20 {
  margin-bottom: 20px;
}

.margin_b30 {
  margin-bottom: 30px;
}

.margin_b40 {
  margin-bottom: 40px;
}

.margin_b50 {
  margin-bottom: 50px;
}

/*MarginRight*/
.margin_r05 {
  margin-right: 5px;
}

.margin_r10 {
  margin-right: 10px;
}

.margin_r15 {
  margin-right: 15px;
}

.margin_r20 {
  margin-right: 20px;
}

/*MarginLeft*/
.margin_l05 {
  margin-left: 50px;
}

.margin_l10 {
  margin-left: 10px;
}

.margin_l15 {
  margin-left: 15px;
}

.margin_l20 {
  margin-left: 20px;
}

/*Margin_device*/
.margin-xs-b10 {
  margin-bottom: 10px;
}

@media print, screen and (min-width: 768px) {
  .margin-xs-b10 {
    margin-bottom: 0px;
  }
}

/*------------------------------------------------------------ClearFix*/
.clearfix {
  zoom: 1;
}

.clearfix:after {
  content: "";
  display: block;
  clear: both;
}

/*------------------------------------------------------------Hoverimg*/
a:hover img {
  transition: 0.2s;
}

a:hover img.hoverimg {
  opacity: 0.6;
  filter: alpha(opacity=60);
  -ms-filter: "alpha( opacity=60 )";
}

/*------------------------------------------------------------other*/
.btn01 a {
  display: block;
  background: #fff;
  border: 2px solid #261b18;
  color: #261b18;
  border-radius: 100px;
  text-decoration: none;
  position: relative;
  padding: 4px 16px;
  transition: 0.2s;
}

.btn01 a::after {
  content: "";
  display: block;
  position: absolute;
  background: url("data:image/svg+xml;charset=utf8,%3Csvg xmlns='http://www.w3.org/2000/svg' width='11' height='18'%3E%3Cpath fill='%23261b18' d='M1.83 0l7.34 7.2L11 9l-9.17 9L0 16.2 7.33 9 0 1.8z'/%3E%3C/svg%3E") 50% 50%/100% 100% no-repeat;
  background-size: 12px;
  width: 12px;
  height: 12px;
  right: 12px;
  top: 0;
  bottom: 0;
  margin: auto 0 auto auto;
}

.btn01 a:hover {
  background: #261b18;
  color: #fff;
}

.btn01 a:hover::after {
  background: url("data:image/svg+xml;charset=utf8,%3Csvg xmlns='http://www.w3.org/2000/svg' width='11' height='18'%3E%3Cpath fill='%23fff' d='M1.83 0l7.34 7.2L11 9l-9.17 9L0 16.2 7.33 9 0 1.8z'/%3E%3C/svg%3E") 50% 50%/100% 100% no-repeat;
  background-size: 12px;
}

.bg_color03 .btn01 a:hover {
  background: #f2b705;
}

/**/
.btn02 a {
  display: block;
  border: 2px solid #f27405;
  color: #f27405;
  border-radius: 100px;
  text-decoration: none;
  position: relative;
  padding: 4px 16px;
  transition: 0.2s;
}

.btn02 a:hover {
  background: #f27405;
  color: #fff;
}

.btn02.subcolor a {
  border: 2px solid #f2b705;
  color: #f2b705;
}

.btn02.subcolor a:hover {
  background: #f2b705;
  color: #fff;
}

@media print, screen and (min-width: 992px) {
  .btn02 a {
    font-size: 1.6rem;
  }
}

.bg_color01 .btn02 a {
  border: 2px solid #fff;
  color: #fff;
}

.bg_color01 .btn02 a:hover {
  background: #fff;
  color: #261b18;
}

/**/
.btn03 a {
  display: flex;
  justify-content: center;
  align-items: center;
  background: #261b18;
  border-radius: 10px;
  color: #fff;
  text-decoration: none;
  font-size: 1.8rem;
  line-height: 1.2;
  font-weight: 700;
  padding: 8px 40px 8px 8px;
  transition: 0.2s;
  position: relative;
  margin: 0 auto;
}

.btn03 a::after {
  content: "";
  display: block;
  background: url("data:image/svg+xml;charset=utf8,%3Csvg xmlns='http://www.w3.org/2000/svg' width='11' height='18'%3E%3Cpath fill='%23fff' d='M1.83 0l7.34 7.2L11 9l-9.17 9L0 16.2 7.33 9 0 1.8z'/%3E%3C/svg%3E") 50% 50%/100% 100% no-repeat;
  background-size: 4px auto;
  width: 20px;
  height: 20px;
  border-radius: 50%;
  border: 2px solid #fff;
  position: absolute;
  right: 12px;
}

.btn03 a:hover {
  -webkit-transform: translateY(2px);
  transform: translateY(2px);
  color: #f2b705;
}

.btn03 a:hover::after {
  background: url("data:image/svg+xml;charset=utf8,%3Csvg xmlns='http://www.w3.org/2000/svg' width='11' height='18'%3E%3Cpath fill='%23f2b705' d='M1.83 0l7.34 7.2L11 9l-9.17 9L0 16.2 7.33 9 0 1.8z'/%3E%3C/svg%3E") 50% 50%/100% 100% no-repeat;
  background-size: 4px auto;
  border: 2px solid #f2b705;
}
.btn03.btn_hi a{
  padding: 24px 40px 24px 8px;
}

@media print, screen and (min-width: 360px) {
  .btn03 a {
    padding: 8px 32px 8px 12px;
  }
}

@media print, screen and (min-width: 768px) {
  .btn03 a {
    min-width: 300px;
    padding: 12px 45px 12px 12px;
  }
}

.bg_color03 .btn03 a {
  background: #f27405;
}

.btn_cent{
  margin-left: auto;
  margin-right: auto;
}
.btn_cent_l{
  margin-left: auto;
  margin-right: auto;
}
@media print, screen and (min-width: 768px) {
  .btn_cent_l{
    margin-left:0;
  }
}
/*レスポンシブblock/none*/
@media print, screen and (min-width: 768px) {
  .pc_none {
    display: none;
  }
}

.sp_none {
  display: none;
}

@media print, screen and (min-width: 768px) {
  .sp_none {
    display: inline-block;
  }
}

/*tel-link*/
.tel-link a {
  text-decoration: underline;
  color: inherit;
}

.tel-link a:hover {
  opacity: 0.8;
}
/*=============================*/
/*== 幅 ==*/
/*=============================*/
.w100 {
  width: 100%;
}

.max_40 {
  max-width: 40px;
}

.max_60 {
  max-width: 60px;
}

.max_80 {
  max-width: 80px;
}

.max_160 {
  max-width: 160px;
}

.max_240 {
  max-width: 240px;
}

.max_360 {
  max-width: 360px;
}

.max_400 {
  max-width: 400px;
}

.max_560 {
  max-width: 560px;
}

.min_40 {
  min-width: 40px;
}

.min_60 {
  min-width: 60px;
}

.min_80 {
  min-width: 80px;
}

.min_160 {
  min-width: 160px;
}

.min_240 {
  min-width: 240px;
}

.min_360 {
  min-width: 360px;
}

.min_400 {
  min-width: 400px;
}

.min_560 {
  min-width: 560px;
}
/*layout-----------------------*/
/*2*/
.ly_card_2column > div + div,
.ly_card_2column > div + li,
.ly_card_2column > li + div,
.ly_card_2column > li + li {
  margin-top: 16px;
}

@media print, screen and (min-width: 768px) {
  .ly_card_2column {
    display: flex;
    justify-content: space-between;
    flex-wrap: wrap;
  }
  .ly_card_2column > div,
  .ly_card_2column > li {
    width: calc(100% / 2 - 20px);
  }
  .ly_card_2column > div + div,
  .ly_card_2column > div + li,
  .ly_card_2column > li + div,
  .ly_card_2column > li + li {
    margin-top: 0;
  }
  .ly_card_2column > div:nth-child(n + 3),
  .ly_card_2column > li:nth-child(n + 3) {
    margin-top: 30px;
  }
}
@media print, screen and (min-width: 1200px) {
  .ly_card_2column > div,
  .ly_card_2column > li {
    width: calc(100% / 2 - 30px);
  }
}

/*3*/
.ly_card_3column > div + div,
.ly_card_3column > div + li,
.ly_card_3column > li + div,
.ly_card_3column > li + li {
  margin-top: 16px;
}

@media print, screen and (min-width: 768px) {
  .ly_card_3column {
    display: flex;
    justify-content: space-between;
    flex-wrap: wrap;
  }
  .ly_card_3column::after {
    content: "";
    display: block;
    width: calc(100% / 3 - 15px);
  }
  .ly_card_3column > div,
  .ly_card_3column > li {
    width: calc(100% / 3 - 15px);
  }
  .ly_card_3column > div + div,
  .ly_card_3column > div + li,
  .ly_card_3column > li + div,
  .ly_card_3column > li + li {
    margin-top: 0;
  }
  .ly_card_3column > div:nth-child(n + 4),
  .ly_card_3column > li:nth-child(n + 4) {
    margin-top: 30px;
  }
}

/*4*/
.ly_card_4column > div + div,
.ly_card_4column > div + li,
.ly_card_4column > li + div,
.ly_card_4column > li + li {
  margin-top: 16px;
}

@media print, screen and (min-width: 768px) {
  .ly_card_4column {
    display: flex;
    justify-content: space-between;
    flex-wrap: wrap;
  }
  .ly_card_4column::before {
    content: "";
    display: block;
    width: calc(100% / 4 - 15px);
    order: 1;
  }
  .ly_card_4column::after {
    content: "";
    display: block;
    width: calc(100% / 4 - 15px);
  }
  .ly_card_4column > div,
  .ly_card_4column > li {
    width: calc(100% / 4 - 15px);
  }
  .ly_card_4column > div + div,
  .ly_card_4column > div + li,
  .ly_card_4column > li + div,
  .ly_card_4column > li + li {
    margin-top: 0;
  }
  .ly_card_4column > div > div:nth-child(n + 5),
  .ly_card_4column > div > li:nth-child(n + 5),
  .ly_card_4column > li > div:nth-child(n + 5),
  .ly_card_4column > li > li:nth-child(n + 5) {
    margin-top: 30px;
  }
}

/*2*/
.ly_2column {
  display: flex;
  justify-content: space-between;
  flex-wrap: wrap;
}

.ly_2column > div,
.ly_2column > li {
  width: calc(100% / 2 - 10px);
}

.ly_2column > div + div,
.ly_2column > div + li,
.ly_2column > li + div,
.ly_2column > li + li {
  margin-top: 0;
}

.ly_2column > div:nth-child(n + 3),
.ly_2column > li:nth-child(n + 3) {
  margin-top: 20px;
}

@media print, screen and (min-width: 992px) {
  .ly_2column > div,
  .ly_2column > li {
    width: calc(100% / 2 - 15px);
  }
  .ly_2column > div:nth-child(n + 3),
  .ly_2column > li:nth-child(n + 3) {
    margin-top: 30px;
  }
}

/*golden ratio*/
.ly_gold {
  display: flex;
  flex-direction: column;
}

.ly_gold .ly_gold_s + .ly_gold_b {
  order: -1;
}

@media print, screen and (min-width: 768px) {
  .ly_gold {
    flex-direction: row;
  }
  .ly_gold .ly_gold_s {
    width: 50%;
  }
  .ly_gold .ly_gold_s + .ly_gold_b {
    order: 1;
  }
  .ly_gold .ly_gold_b {
    width: 50%;
  }
}

@media print, screen and (min-width: 992px) {
  .ly_gold .ly_gold_s {
    width: 38%;
  }
  .ly_gold .ly_gold_b {
    width: 62%;
  }
}

/*half*/
.ly_half {
  display: flex;
  flex-direction: column;
}

@media print, screen and (min-width: 768px) {
  .ly_half {
    flex-direction: row;
  }
  .ly_half > li,
  .ly_half > div {
    width: 50%;
  }
}

/*ly_ph_bg*/
.ly_ph_bg {
  background: #ccc;
  box-sizing: border-box;
  padding: 20px;
}

.ly_ph_bg .ly_ph_bg_inner {
  display: block;
  background: rgba(255, 255, 255, 0.8);
  box-sizing: border-box;
  padding: 30px 20px;
}

@media print, screen and (min-width: 768px) {
  .ly_ph_bg {
    padding: 40px 80px;
  }
  .ly_ph_bg .ly_ph_bg_inner {
    max-width: 800px;
    margin: 0 auto;
    padding: 40px 30px;
  }
}

@media print, screen and (min-width: 992px) {
  .ly_ph_bg .ly_ph_bg_inner {
    padding: 40px 30px;
  }
}

/*box*/
.white_box {
  background: #fff;
  border-radius: 10px;
  box-sizing: border-box;
  padding: 24px 16px;
}

@media print, screen and (min-width: 768px) {
  .white_box {
    padding: 32px 24px;
  }
}

@media print, screen and (min-width: 1200px) {
  .white_box {
    padding: 40px 32px;
  }
}

.gray_box {
  background: rgba(221, 221, 221, 0.4);
  border-radius: 10px;
  box-sizing: border-box;
  padding: 16px;
}

@media print, screen and (min-width: 768px) {
  .gray_box {
    padding: 24px;
  }
}

@media print, screen and (min-width: 1200px) {
  .gray_box {
    padding: 30px;
  }
}

.bg_color02 .gray_box {
  background: #fff;
}

.card_ph_box p {
  text-align: left;
  padding: 8px 4px;
  font-size: 1.4rem;
}

.card_ph_box p + p {
  margin-top: 8px;
}

@media print, screen and (min-width: 992px) {
  .card_ph_box p {
    padding: 16px 4px;
    margin: 0 auto;
  }
}

.card_ph_box02 p {
  text-align: left;
  padding: 8px 3px 20px;
}

.card_title {
  display: block;
  position: relative;
  text-align: left;
  font-size: 1.8rem;
  font-weight: 700;
  padding: 6px 3px;
  border-bottom: 1px solid #f27405;
}

.card_title span:not(.tx_s) {
  display: block;
  color: rgba(242, 116, 5, 0.3);
  font-family: "Roboto", "Noto Sans JP", sans-serif;
  font-weight: 900;
  font-style: italic;
  font-size: 3rem;
  position: absolute;
  right: 2px;
  bottom: 50%;
  -webkit-transform: translateY(50%);
  transform: translateY(50%);
  z-index: -1;
}

/*dt*/
.dt_style01 {
  text-align: left;
}

.dt_style01 dt {
  font-size: 1.2em;
  font-weight: 700;
}

.dt_style01 dd {
  margin-top: 6px;
  padding: 15px;
  background: #ddd;
  border: 1px solid rgba(38, 27, 24, 0.2);
}

.dt_style01 dd + dt {
  margin-top: 24px;
}

@media print, screen and (min-width: 992px) {
  .dt_style01 dd {
    padding: 16px 24px;
  }
}

.bg_color02 .dt_style01 dd {
  background: #fff;
}

/*PageNavi*/
.pagenavi {
  margin: 0 0 10px;
  padding: 10px 10px 5px;
  text-align: center;
}

.pagenavi li {
  display: inline;
  margin: 0 2px;
  padding: 0;
}

.pagenavi li span {
  display: inline-block;
  text-decoration: none;
  vertical-align: middle;
  margin-bottom: 5px;
  padding: 3px 10px;
  color: #fff;
  border: 1px solid #f27405;
  background: #f27405;
}

.pagenavi li a {
  display: inline-block;
  text-decoration: none;
  vertical-align: middle;
  margin-bottom: 5px;
  padding: 3px 10px;
  color: #f27405;
  border: 1px solid #f27405;
  background: #fff;
}

.pagenavi li a:hover {
  opacity: 0.7;
}

/*anchor----------------------------*/
/*01*/
.anchor_style01 {
  display: -ms-grid;
  display: grid;
  -ms-grid-columns: (minmax(145px, 1fr)) [auto-fit];
  grid-template-columns: repeat(auto-fit, minmax(145px, 1fr));
  gap: 1px;
  justify-content: center;
  padding: 30px 0;
}

.anchor_style01 li {
  box-sizing: border-box;
}

.anchor_style01 li a {
  display: flex;
  justify-content: center;
  align-items: center;
  width: 100%;
  height: 100%;
  background: #f2b705;
  color: #261b18;
  text-decoration: none;
  line-height: 1;
  padding: 8px;
  transition: 0.2s;
}

.anchor_style01 li a i {
  font-size: 1.2em;
  vertical-align: middle;
  margin-right: 6px;
}

.anchor_style01 li a:hover {
  background: #261b18;
  color: #fff;
}

@media print, screen and (min-width: 360px) {
  .anchor_style01 {
    -ms-grid-columns: (minmax(160px, 1fr)) [auto-fit];
    grid-template-columns: repeat(auto-fit, minmax(160px, 1fr));
  }
}

@media print, screen and (min-width: 768px) {
  .anchor_style01 {
    -ms-grid-columns: (minmax(230px, 1fr)) [auto-fit];
    grid-template-columns: repeat(auto-fit, minmax(230px, 1fr));
  }
  .anchor_style01 li a {
    padding: 16px 20px;
  }
}

@media print, screen and (min-width: 1200px) {
  .anchor_style01 {
    padding: 60px 0;
    -ms-grid-columns: (minmax(360px, 1fr)) [auto-fit];
    grid-template-columns: repeat(auto-fit, minmax(360px, 1fr));
  }
  .anchor_style01 li a {
    padding: 20px 24px;
  }
}

.anchor_style02 {
  padding: 30px 0;
  display: -ms-grid;
  display: grid;
  -ms-grid-columns: (minmax(300px, 1fr)) [auto-fit];
  grid-template-columns: repeat(auto-fit, minmax(300px, 1fr));
  gap: 4px;
  justify-content: center;
}

.anchor_style02 li a {
  display: flex;
  width: 100%;
  background: rgba(221, 221, 221, 0.6);
  border: 1px solid #ddd;
  box-sizing: border-box;
  text-decoration: none;
  color: #261b18;
  transition: 0.2s;
  font-weight: 500;
}

.anchor_style02 li a figure img {
  width: 60px;
  height: auto;
}

.anchor_style02 li a p {
  display: flex;
  width: calc(100% - 60px);
  align-items: center;
  box-sizing: border-box;
  text-align: left;
  padding: 0 16px;
  line-height: 1.2;
}

.anchor_style02 li a:hover {
  background: rgba(221, 221, 221, 0.9);
}

.anchor_style02 li a:hover figure img {
  -webkit-filter: grayscale(70%);
  filter: grayscale(70%);
}

@media print, screen and (min-width: 992px) {
  .anchor_style02 {
    gap: 8px;
  }
}

@media print, screen and (min-width: 1200px) {
  .anchor_style02 {
    padding: 60px 0;
  }
}

/*download*/
#download .btn03 {
  max-width: 420px;
  margin: 30px auto 0;
}

#download .btn03 a[href$=".pdf"] {
  padding: 8px 32px;
}

#download .btn03 a[href$=".pdf"]::before {
  content: "";
  background: url("data:image/svg+xml;charset=utf8,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 512 512' style='width:256px;height:256px'%3E%3Cpath class='st0' fill='%23cb4329' d='M189.031 111.069V6.177L68.398 126.817h104.884c11.336 0 15.749-4.413 15.749-15.748zM252.038 254.612c2.19-1.672 4.397-15.914 8.777-37.329 4.397-21.398-1.104-34.563-12.605-32.899-11.535 1.63-14.26 14.794-13.157 28.519 1.087 13.708 8.208 29.072 12.605 37.856 0 0 2.19 5.492 4.38 3.853zM198.258 365.431c-3.728 1.379-28.503 8.785-43.314 23.036-14.829 14.277-13.742 26.881-7.138 31.27 6.57 4.381 25.226-8.777 36.761-22.484 11.518-13.733 19.192-27.442 19.192-29.631 0-2.191-1.087-3.845-5.501-2.191zM239.45 341.835c10.934-4.38 50.436-13.174 50.436-13.174s-25.762-30.701-29.071-36.745c0 .001-15.363 40.031-21.365 49.919z'/%3E%3Cpath class='st0' fill='%23cb4329' d='M429.091 0h-216.74v125.104c0 13.8-11.234 25.043-25.026 25.043H62.498V491.58c0 11.259 9.161 20.42 20.411 20.42h346.182c11.25 0 20.411-9.161 20.411-20.42V20.404C449.502 9.152 440.342 0 429.091 0zm-66.769 380.77c-19.325-2.633-42.814-22.719-62.707-40.246-.586-.201-1.104-.318-1.488-.318-3.227 0-39.118 10.34-66.401 18.088-39.854 71.266-79.558 91.612-98.198 68.032-9.796-12.412-6.018-41.702 41.158-63.652 9.478-4.38 22.668-9.57 38.048-14.26 13.14-23.864 26.397-56.838 33.82-76.356-12.104-23.153-21.933-47.544-23.037-59.137-2.206-23.062 7.674-43.917 27.433-43.917 25.176 0 43.866 24.14 14.36 109.038 9.194 15.088 21.632 33.385 35.976 47.904 24.792-4.722 49.566-6.185 59.865-5.567 35.507 2.14 42.88 18.716 43.966 31.337 1.105 12.621-14.81 32.907-42.795 29.054z'/%3E%3Cpath class='st0' fill='%23cb4329' d='M358.478 331.947c-13.24-.853-47.728 3.836-43.9 5.474 0 0 27.984 19.786 44.417 21.959 16.5 2.19 22.535-4.932 22.535-12.062 0-7.138-6.035-14.268-23.052-15.371z'/%3E%3C/svg%3E")
    50% 50%/100% 100% no-repeat;
  display: block;
  width: 30px;
  height: 30px;
  position: absolute;
  left: 16px;
}

@media print, screen and (min-width: 768px) {
  #download .btn03 a[href$=".pdf"] {
    padding: 16px 32px;
  }
}

/*---------------------------------------------
series
-----------------------------------------------*/
.youtube {
  position: relative;
  padding-bottom: 56.25%;
}

.series_ti_wrap {
  margin-top: 30px;
}

.series_ti_wrap .tx_box {
  box-sizing: border-box;
}

.series_ti_wrap .tx_box .gray_box {
  margin-top: 24px;
}

.series_ti_wrap .tx_box .dl_basic dt,
.series_ti_wrap .tx_box .dl_basic dd {
  font-size: 1.4rem;
}

.series_ti_wrap .move_box {
  box-sizing: border-box;
  margin-top: 30px;
}

@media print, screen and (min-width: 768px) {
  .series_ti_wrap .move_box {
    margin: 0;
    padding: 0 0 0 30px;
  }
}

@media print, screen and (min-width: 1200px) {
  .series_ti_wrap {
    margin-top: 60px;
  }
  .series_ti_wrap .tx_box {
    padding: 0 30px 0 0;
  }
  .series_ti_wrap .move_box {
    padding: 0 0 0 40px;
  }
}

.series_ti img {
  width: auto;
  height: 60px;
  margin-bottom: 8px;
}

@media print, screen and (min-width: 992px) {
  .series_ti img {
    height: 70px;
  }
}

@media print, screen and (min-width: 1200px) {
  .series_ti img {
    height: 80px;
  }
}

/*merit_wrap*/
@media print, screen and (min-width: 768px) {
  #merit {
    background: url(../img/common_img/e-coat_bg.png) bottom 40px right no-repeat #f27405;
    background-size: 450px auto;
  }
}

@media print, screen and (min-width: 992px) {
  #merit {
    background: url(../img/common_img/e-coat_bg.png) bottom 50px right no-repeat #f27405;
    background-size: 528px auto;
  }
}

@media print, screen and (min-width: 1200px) {
  #merit {
    background: url(../img/common_img/e-coat_bg.png) bottom 80px right no-repeat #f27405;
    background-size: 700px auto;
  }
}

.merit_wrap {
  counter-reset: number;
}

.merit_wrap li {
  list-style: none;
  position: relative;
  max-width: 360px;
  margin-top: 30px;
}

.merit_wrap li::before {
  counter-increment: number;
  content: "0" counter(number);
  position: absolute;
  z-index: 2;
  left: -2px;
  top: -2px;
  color: #fff;
  font-family: "Roboto", "Noto Sans JP", sans-serif;
  font-weight: 900;
  font-style: italic;
  font-size: 3.8rem;
  line-height: 1;
}

.merit_wrap li:nth-child(n + 10)::before {
  counter-increment: number;
  content: counter(number);
  position: absolute;
  z-index: 2;
  left: -2px;
  top: -2px;
  color: #fff;
  font-family: "Roboto", "Noto Sans JP", sans-serif;
  font-weight: 900;
  font-style: italic;
  font-size: 3.8rem;
  line-height: 1;
}

.merit_wrap li::after {
  content: "";
  display: block;
  width: 0;
  height: 0;
  border-style: solid;
  border-width: 60px 60px 0 0;
  border-color: #f27405 transparent transparent transparent;
  position: absolute;
  left: 0;
  top: 0;
  z-index: 1;
}

.merit_wrap li .btn02 {
  margin: 16px 24px;
}

@media print, screen and (min-width: 768px) {
  .merit_wrap {
    display: flex;
    justify-content: space-between;
    flex-wrap: wrap;
  }
  .merit_wrap li {
    width: calc(100% / 3 - 15px);
  }
  .merit_wrap::after {
    content: "";
    display: block;
    width: calc(100% / 3 - 15px);
  }
}

.merit_ti {
  font-weight: 900;
  color: #ffd249;
  font-size: 1.8rem;
  padding: 8px 0 0;
}

.merit_tx {
  font-size: 1.4rem;
  color: #fff;
  text-align: left;
  padding: 8px 0 0;
}

/**/
.series_merit .ly_half:nth-child(odd) .ph_box {
  min-height: 160px;
  order: -1;
}

.series_merit .ly_half:nth-child(odd) .tx_box {
  text-align: left;
}

@media print, screen and (min-width: 768px) {
  .series_merit .ly_half:nth-child(odd) .ph_box {
    min-height: 320px;
    order: 2;
  }
  .series_merit .ly_half:nth-child(odd) .tx_box {
    display: flex;
    flex-direction: column;
    justify-content: center;
    text-align: right;
  }
}

@media print, screen and (min-width: 1200px) {
  .series_merit .ly_half:nth-child(odd) .ph_box {
    min-height: 380px;
  }
}

.series_merit .ly_half:nth-child(even) .ph_box {
  min-height: 160px;
  order: -1;
}

.series_merit .ly_half:nth-child(even) .tx_box {
  text-align: left;
}

@media print, screen and (min-width: 768px) {
  .series_merit .ly_half:nth-child(even) .ph_box {
    min-height: 320px;
  }
  .series_merit .ly_half:nth-child(even) .tx_box {
    display: flex;
    flex-direction: column;
    justify-content: center;
  }
}

@media print, screen and (min-width: 1200px) {
  .series_merit .ly_half:nth-child(even) .ph_box {
    min-height: 380px;
  }
}

/*-----------------------lineup*/
@media print, screen and (min-width: 992px) {
  #lineup {
    display: flex;
  }
}

.lineup_ti {
  padding: 30px;
}

.lineup_ti .cts_p {
  margin-top: 24px;
}

@media print, screen and (min-width: 992px) {
  .lineup_ti {
    width: 38%;
    padding: 50px 30px;
    display: flex;
    flex-direction: column;
    justify-content: center;
  }
}

@media print, screen and (min-width: 1200px) {
  .lineup_ti {
    padding: 80px;
  }
  .lineup_ti .cts_p {
    margin-top: 36px;
  }
}

@media print, screen and (min-width: 480px) {
  .lineup_wrap {
    display: flex;
  }
  .lineup_wrap > [class^="lineup_bnr"] {
    width: calc(100% / 2);
  }
}

@media print, screen and (min-width: 992px) {
  .lineup_wrap {
    width: 62%;
  }
}

[class^="lineup_bnr"] a {
  display: block;
  text-decoration: none;
  padding: 30px;
  text-align: left;
  position: relative;
  min-height: 176px;
}

[class^="lineup_bnr"] a::before {
  content: "";
  display: block;
  width: 40px;
  height: 40px;
  border: 2px solid #261b18;
  border-radius: 100px;
  position: absolute;
  background: url("data:image/svg+xml;charset=utf8,%3Csvg xmlns='http://www.w3.org/2000/svg' width='11' height='18'%3E%3Cpath fill='%23261b18' d='M1.83 0l7.34 7.2L11 9l-9.17 9L0 16.2 7.33 9 0 1.8z'/%3E%3C/svg%3E") 50% 50%/100% 100% no-repeat;
  background-size: 7px auto;
  right: 20px;
  top: 0;
  bottom: 0;
  margin: auto 0 auto auto;
}

[class^="lineup_bnr"] a::after {
  content: "";
  width: 100%;
  height: 100%;
  display: block;
  position: absolute;
  background: #261b18;
  mix-blend-mode: difference;
  left: 0;
  top: 0;
  opacity: 0;
  transition: 0.2s;
}

[class^="lineup_bnr"] a:hover::after {
  opacity: 1;
}

[class^="lineup_bnr"] .lineup_name img {
  -webkit-filter: drop-shadow(0 0 6px #fff);
  filter: drop-shadow(0 0 6px #fff);
  height: 48px;
  width: auto;
}

[class^="lineup_bnr"] .lineup_tx {
  color: #261b18;
  font-weight: 700;
  margin-top: 24px;
  text-shadow: 0 0 5px #fff, 0 0 5px #fff, 0 0 5px #fff;
  padding-right: 50px;
  line-height: 1.4;
}

@media print, screen and (min-width: 480px) {
  [class^="lineup_bnr"] a {
    padding: 15px;
    min-height: initial;
    height: 100%;
    min-height: 300px;
  }
  [class^="lineup_bnr"] a::before {
    display: none;
  }
  [class^="lineup_bnr"] .lineup_name img {
    height: 30px;
    position: absolute;
    bottom: 15px;
    left: 15px;
  }
  [class^="lineup_bnr"] .lineup_tx {
    position: absolute;
    top: 15px;
    left: 15px;
    right: 15px;
    margin: 0;
    padding: 0;
  }
}

@media print, screen and (min-width: 768px) {
  [class^="lineup_bnr"] .lineup_name img {
    bottom: 30px;
    left: 30px;
    height: 50px;
  }
  [class^="lineup_bnr"] .lineup_tx {
    top: 30px;
    left: 30px;
    right: 30px;
  }
}

@media print, screen and (min-width: 1200px) {
  [class^="lineup_bnr"] .lineup_tx {
    font-size: 1.8rem;
  }
}

.lineup_bnr01 {
  background: url(../img/index_img/product_img01.jpg) center center no-repeat;
  background-size: cover;
}

.lineup_bnr02 {
  background: url(../img/index_img/product_img03.jpg) center center no-repeat;
  background-size: cover;
}

.lineup_bnr03 {
  background: url(../img/index_img/product_img02.jpg) center center no-repeat;
  background-size: cover;
}

/*before/after*/
.ly_before_after li {
  box-sizing: border-box;
  border: 6px solid #fff;
  box-shadow: 0 0 1px #261b18, 0 0 1px #261b18;
  position: relative;
}

.ly_before_after li .ecoat_img img {
  position: absolute;
  bottom: -12px;
  right: 8px;
  width: 100px;
  height: auto;
}

.ly_before_after li:nth-child(1) {
  margin-bottom: 40px;
}

.ly_before_after li:nth-child(1)::before {
  content: "BEFORE";
  font-family: "Roboto", "Noto Sans JP", sans-serif;
  font-weight: 900;
  font-style: italic;
  position: absolute;
  -webkit-text-stroke: 1px #fff;
  text-stroke: 1px #fff;
  color: transparent;
  font-size: 2rem;
  left: 12px;
  top: 4px;
}

.ly_before_after li:nth-child(1)::after {
  content: "";
  width: 0;
  height: 0;
  border-style: solid;
  border-width: 20px 20px 0 20px;
  border-color: #cb4329 transparent transparent transparent;
  display: block;
  position: absolute;
  bottom: -37px;
  left: 0;
  right: 0;
  margin: auto auto 0;
}

.ly_before_after li:nth-child(2)::before {
  content: "AFTER";
  font-family: "Roboto", "Noto Sans JP", sans-serif;
  font-weight: 900;
  font-style: italic;
  position: absolute;
  -webkit-text-stroke: 1px #ffd249;
  text-stroke: 1px #ffd249;
  color: transparent;
  font-size: 2rem;
  left: 12px;
  top: 4px;
}

@media print, screen and (min-width: 768px) {
  .ly_before_after {
    display: flex;
    justify-content: space-between;
  }
  .ly_before_after li {
    width: calc(50% - 30px);
  }
  .ly_before_after li .ecoat_img img {
    width: 80px;
  }
  .ly_before_after li:nth-child(1) {
    margin-bottom: 0;
  }
  .ly_before_after li:nth-child(1)::before {
    font-size: 3rem;
  }
  .ly_before_after li:nth-child(1)::after {
    content: "";
    width: 0;
    height: 0;
    border-style: solid;
    border-width: 20px 0 20px 26px;
    border-color: transparent transparent transparent #cb4329;
    display: block;
    position: absolute;
    bottom: 0;
    left: auto;
    right: -50px;
    top: 0;
    margin: auto 0 auto auto;
  }
  .ly_before_after li:nth-child(2)::before {
    font-size: 3rem;
  }
}

@media print, screen and (min-width: 992px) {
  .ly_before_after li .ecoat_img img {
    width: 120px;
  }
}

@media print, screen and (min-width: 1200px) {
  .ly_before_after li .ecoat_img img {
    width: 160px;
  }
}

.flow_list01 li:not(:last-child) {
  position: relative;
  margin-bottom: 40px;
}

.flow_list01 li:not(:last-child)::after {
  content: "";
  width: 0;
  height: 0;
  border-style: solid;
  border-width: 20px 20px 0 20px;
  border-color: #cb4329 transparent transparent transparent;
  display: block;
  position: absolute;
  bottom: -30px;
  left: 0;
  right: 0;
  margin: auto auto 0;
}

.figcaption_po {
  position: relative;
  display: inline;
}

.figcaption_po figcaption {
  position: absolute;
  background: #261b18;
  color: #fff;
  bottom: 0;
  right: 0;
  padding: 4px 6px;
}

.compare_wrap {
  margin-top: 20px;
}

.compare_wrap li p {
  padding: 10px 10px 20px;
  line-height: 1.4;
}

.compare_wrap li figure figcaption {
  display: block;
  background: #cb4329;
  color: #fff;
  font-weight: 700;
  padding: 10px;
}

.compare_wrap li:nth-child(1) figure figcaption {
  background: #cb4329;
}

.compare_wrap li:nth-child(2) figure figcaption {
  background: #666;
}

#float_pagetop{
 position: fixed;
 bottom: 20px;
 right: 20px;
 z-index: 9999;
}
#float_pagetop img{
  width: 36px;
  height: auto;
 }
#float_pagetop a{
 transition: all 0.5s;
}
#float_pagetop a:hover{
 opacity: 0.7;
}
.is-hidden {
  visibility: hidden;
  opacity: 0;
 transition: all 0.5s;
}

@media print, screen and (min-width:768px){
 #float_pagetop img{
  width: auto;
  height: auto;
 }
}