@charset "UTF-8";
/* Scss Document */
/* base color */
/* base font color */
/* gray text */
/* @use "variable" as var; */
@media print {
  body {
    width: 100% !important;
    zoom: .8; } }
/* font deco------------------------------------ */
/* req span */
span.doubleunderline {
  border-bottom: double 6px orange; }

span.dashed {
  border-bottom: dashed 2px orange; }

span.dotted {
  border-bottom: dotted 3px orange; }

span.borderline {
  border-bottom: solid 2px orange; }

/* base Link color ----------------------------- */
a {
  color: #11100F; }

a:visited {
  color: #11100F; }

a:hover {
  color: #11100F; }

/* link right arrow ---------------------------- */
a.a_btn {
  position: relative;
  display: block;
  box-sizing: border-box; }

a.a_btn::after {
  display: block;
  content: "";
  position: absolute;
  top: 50%;
  width: 3px;
  height: 3px;
  margin: -2px 0 0 0;
  border-top: solid 2px #11100F;
  border-right: solid 2px #11100F;
  -webkit-transform: rotate(45deg);
  transform: rotate(45deg); }

/* link left triangle -------------------------- */
.btn_triangle {
  position: relative;
  display: block;
  box-sizing: border-box; }

.btn_triangle::before {
  width: 0;
  height: 0;
  content: "";
  display: inline-block;
  margin-bottom: 1px;
  padding-right: 5px;
  border-style: solid;
  border-width: 4px 0 4px 5px;
  border-color: transparent transparent transparent #00c3e5; }

/* parallax ------------------------------------ */
.parallax {
  position: relative;
  opacity: var(--opacity);
  will-change: opacity; }

/* 100% width ---------------------------------- */
.f_wid {
  width: 100vw;
  margin: 0 calc(-50vw + 50%) !important;
  object-fit: cover; }

/* fonts tweaks -------------------------------- */
/* text color fontfamily */
html {
  font-size: 62.5%;
  /* 16px x 0.625 = 10px(=1rem) */
  color: #11100F;
  font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol", "Noto Color Emoji";
  font-family: "Hiragino Kaku Gothic ProN", "ヒラギノ角ゴ ProN W3", "游ゴシック", YuGothic, "メイリオ", Meiryo, "ＭＳ Ｐゴシック", "MS PGothic", sans-serif; }

/* mincho */
.min {
  font-family: "黎ミン M", "Reimin Medium", "ヒラギノ明朝 ProN W3", "游明朝", YuMincho, "Hiragino Mincho ProN", "HG明朝E", "ＭＳ Ｐ明朝", "ＭＳ 明朝", serif !important; }

body {
  font-size: 1.55rem;
  /* 15.5px*/
  line-height: 1.8em;
  -webkit-text-size-adjust: 100%;
  /* webkit browser bug 拡大表示 */
  font-feature-settings: "palt";
  /* carning CSSで文字詰め */ }

@media screen and (-webkit-min-device-pixel-ratio: 0) {
  ::i-block-chrome, body {
    font-feature-settings: "pkna"; } }
/*font size responsive */
/* PC & default */
h1 {
  font-size: 36px;
  /* IE8以下とAndroid4.3以下用フォールバック */
  font-size: calc(20rem + ((1vw - 0.64rem) * 2.1429));
  /* 24px~36pxで可変*/ }

h2 {
  font-size: 24px;
  /* IE8以下とAndroid4.3以下用フォールバック */
  font-size: calc( 2rem + ((1vw - 0.64rem) * 0.7143));
  /* 20px~24pxで可変*/ }

/* Sp */
@media screen and (max-width: 767px) {
  h1 {
    font-size: 2.4rem;
    /* 24px*/ }

  h2 {
    font-size: 2rem;
    /* 20px */ } }
/* Tab */
@media (min-width: 768px) {
  h1 {
    font-size: 2.2rem;
    /* 22px*/ }

  h2 {
    font-size: 1.4rem;
    /* 14px*/ } }
#wrapper {
  background: #fff; }

/* header common -------------------------- */
header {
  border-top: solid 1px #efefef; }

div.headlogobox p {
  display: block; }

div.headlogobox p a {
  width: 18%;
  font-size: 0;
  display: flex;
  flex-direction: column;
  justify-content: center; }

div.headlogobox p a svg {
  width: 100%;
  max-width: 140px;
  display: block;
  text-align: center; }

div.headlogobox p a svg .cls-2 {
  fill: #11100F; }

/* main visual ---------------------------- */
/* lower-page mv gradation box */
.mavbox {
  width: 100%;
  margin: 0 auto;
  align-self: center;
  background: #11100F;
  background-size: 100%;
  box-sizing: border-box; }

/* contents ------------------------------- */
/* bunner maincont bottom */
#bunner_maincnt {
  border-top: solid 1px #efefef; }

.bunner_maincnt_inner {
  width: 100%;
  max-width: 1200px;
  margin: 0 auto; }

#bunner_maincnt ul {
  width: 100%;
  display: flex;
  flex-wrap: wrap;
  justify-content: space-between; }

#bunner_maincnt ul li {
  width: calc((100% / 2) - 0px );
  overflow: hidden; }

#bunner_maincnt ul li img {
  width: 100%;
  height: 100%; }

/* side menu under */
.bunner_side {
  width: 100%; }

.bunner_side ul {
  width: 100%;
  box-sizing: border-box;
  padding: 12px 2px 0px; }

/* breadcrumb ------------------------------ */
#breadcrumb {
  width: 100%;
  border-top: solid 1px #efefef;
  box-sizing: border-box; }

.breadcrumbinner {
  width: 100%;
  box-sizing: border-box;
  padding: 0 4.8%; }

/* breadcrumb margin responsive */
@media screen and (max-width: 767px) {
  .breadcrumbinner {
    padding: 0 6.4%; }

  #breadcrumb ul li {
    max-width: calc( 100% - 3em ); } }
@media screen and (min-width: 768px) and (max-width: 1200px) {
  .breadcrumbinner {
    padding: 0 6.4%; } }
@media screen and (min-width: 1201px) {
  .breadcrumbinner {
    max-width: 1200px;
    padding: 0 64px;
    margin: 0 auto; } }
#breadcrumb ul {
  width: 100%;
  display: flex;
  justify-content: flex-start;
  flex-wrap: wrap;
  align-items: center;
  flex: 4; }

#breadcrumb ul li {
  font-size: 12px;
  box-sizing: border-box;
  min-width: calc( 3em + 0em );
  max-width: calc( 100% - ( 0px + 3.05em ) ); }

#breadcrumb ul li:nth-child(1) a {
  padding-right: 12px; }

#breadcrumb ul li:nth-child(n+2) a {
  padding: 0 12px; }

#breadcrumb ul li:last-child a {
  padding-left: 12px !important;
  padding-right: 0  !important; }

#breadcrumb ul li a {
  display: grid;
  place-items: center center;
  font-size: 12px;
  position: relative;
  box-sizing: border-box;
  line-height: 1.2em;
  height: 44px;
  color: #11100F; }

#breadcrumb ul li a:hover {
  text-decoration: underline;
  color: #11100F; }

#breadcrumb ul li a::after {
  display: block;
  content: "";
  position: absolute;
  top: 50%;
  width: 3px;
  height: 3px;
  margin: 0 0 0 0;
  border-top: solid 1px #11100F;
  border-right: solid 1px #11100F;
  -webkit-transform: rotate(45deg);
  transform: rotate(45deg);
  right: -1.5px !important;
  top: 19.3px !important; }

#breadcrumb ul li:last-child a::after {
  display: none !important; }

/* footer ---------------------------------- */
footer {
  width: 100%; }

footer div.innerbg {
  background: #11100F no-repeat;
  background-size: contain;
  background-position: right bottom; }

.footerinner {
  width: 100%;
  max-width: 1200px;
  box-sizing: border-box;
  background: url(../images/01_common/footer_bg_btm2.webp) no-repeat;
  background-position: right bottom;
  display: flex;
  flex-wrap: wrap; }

p.footlogo {
  width: 100%;
  text-align: center;
  font-size: 0; }

p.footlogo svg {
  width: 20%;
  margin: 0 auto;
  display: block; }

p.footlogo svg .cls-2 {
  fill: #ffffff; }

/* div.footer_nav nav#footer_nav */
@media screen and (max-width: 767px) {
  p.footlogo {
    margin-bottom: 9.6%; }

  p.footlogo img {
    max-height: 32px; }

  .footerinner {
    background-size: contain;
    padding: 12% 6.4%; }

  div.bunner_footer {
    width: 100%;
    margin: 4.8% auto 4.8%; }

  /* 1column padding margin */
  footer.content_1column .footerinner {
    padding: 4.8% !important;
    margin-bottom: 0 !important; }

  footer.content_1column .footerinner p.footlogo {
    margin-bottom: 0 !important;
    padding-bottom: 0 !important; } }
@media screen and (min-width: 768px) and (max-width: 1200px) {
  p.footlogo {
    margin-bottom: 12px; }

  p.footlogo img {
    vertical-align: bottom;
    max-height: 32px; }

  .footerinner {
    background-size: 60% auto;
    padding: 4.8%;
    justify-content: space-between; }

  p.footlogo {
    margin-bottom: 4.8%;
    justify-content: flex-end; }

  p.footlogo svg {
    width: 20% !important; }

  /* bunner_footer */
  div.bunner_footer {
    width: 30%; }

  /* 1column padding margin */
  footer.content_1column .footerinner {
    padding: 36px !important;
    margin-bottom: 0 !important; }

  footer.content_1column .footerinner p.footlogo {
    margin-bottom: 0 !important;
    padding-bottom: 0 !important; } }
@media screen and (min-width: 1201px) {
  footer p.footlogo {
    margin-bottom: 36px; }

  p.footlogo svg {
    width: 20% !important; }

  p.footlogo img {
    max-height: 32px;
    vertical-align: bottom; }

  footer .footerinner {
    padding: 64px 64px;
    margin: 0 auto;
    justify-content: space-between; }

  /* bunner_footer */
  div.bunner_footer {
    width: 30%; }

  div.footer_nav nav ul li:last-child {
    margin: 0 !important; }

  /* 1column padding margin */
  footer.content_1column .footerinner {
    padding: 36px !important;
    margin-bottom: 0 !important; }

  footer.content_1column .footerinner p.footlogo {
    margin-bottom: 0 !important;
    padding-bottom: 0 !important; } }
div.footer_nav nav ul {
  box-sizing: border-box; }

/* footer navigation linkaction */
@media screen and (max-width: 767px) {
  div.footer_nav {
    width: 100%; }

  div.footer_nav nav ul li a {
    width: 100%;
    box-sizing: border-box;
    height: 44px;
    line-height: 44px;
    font-size: 0.8em;
    color: #FFF;
    padding-left: 12px;
    display: block;
    position: relative; } }
@media screen and (min-width: 768px) and (max-width: 1024px) {
  div.footer_nav {
    width: 30% !important; }

  div.footer_nav nav ul li a {
    width: 100%;
    box-sizing: border-box;
    height: 44px;
    line-height: 44px;
    font-size: 0.8em;
    color: #FFF;
    padding-left: 12px;
    display: block;
    position: relative; } }
@media screen and (min-width: 1025px) {
  div.footer_nav {
    width: 30%;
    max-width: 200px; }

  div.footer_nav nav ul li a {
    font-size: 0.70em;
    height: 32px;
    line-height: 32px;
    color: #FFF;
    padding-left: 12px;
    display: block;
    position: relative; } }
div.footer_nav nav ul li a:after {
  display: block;
  content: "";
  position: absolute;
  top: calc( 50% - 2.5px );
  right: 13.5px;
  width: 4px;
  height: 4px;
  border-top: solid 1px #FFF;
  border-right: solid 1px #FFF;
  -webkit-transform: rotate(45deg);
  transform: rotate(45deg); }

/* footer navlinkcolor */
div.footer_nav nav ul li a:hover {
  text-decoration: underline; }

/* bunner_footer --------------------------- */
div.bunner_footer {
  box-sizing: border-box; }

div.bunner_footer ul {
  width: 100%;
  display: flex;
  flex-wrap: wrap;
  box-sizing: border-box; }

div.bunner_footer ul li {
  background: #fff;
  overflow: hidden;
  margin-bottom: 12px;
  box-sizing: border-box; }

@media screen and (max-width: 767px) {
  div.bunner_footer ul {
    padding: 0 2.4%; }

  div.bunner_footer ul li {
    width: 70%;
    margin: 0 auto; } }
@media screen and (min-width: 768px) {
  div.bunner_footer ul {
    padding-right: 24px; }

  div.bunner_footer ul li {
    width: 100%; } }
div.bunner_footer ul li img {
  width: 100%;
  height: 100%;
  min-height: 96px; }

/* copyright ------------------------------- */
#copylight {
  width: 100%;
  background: #FFF;
  font-size: 0.9em;
  color: #11100F;
  height: 60px;
  line-height: 60px;
  padding-left: 4.8%;
  box-sizing: border-box; }

@media screen and (min-width: 768px) {
  #copylight {
    text-align: center;
    padding-left: 0 !important; } }
/* footer content nouse -------------------- */
/* SNS */
.snslinks {
  width: 100%;
  box-sizing: border-box;
  padding: 0 6.4%;
  margin-top: 8%; }

.snslinks ul {
  width: 100%;
  display: flex;
  flex-wrap: wrap; }

.snslinks ul li {
  width: calc(100% / 3); }

.snslinks ul li:nth-child(-n+3) {
  margin-bottom: 12px; }

.snslinks ul li a {
  width: 100%;
  display: block;
  color: #FFF;
  font-size: 0.5em;
  text-align: center; }

/* serchbox */
#serchbox {
  width: 87.2%;
  margin: 1.2% auto 4.8%;
  box-sizing: border-box;
  height: 36px;
  font-size: 14px;
  line-height: 36px;
  background: #FCFCFC; }

/* post ------------------------------------ */
div.post {
  width: 100%;
  box-sizing: border-box;
  font-size: 14px;
  line-height: 1.2em;
  display: flex;
  align-items: stretch;
  flex-wrap: wrap;
  justify-content: flex-start; }

.postmgn {
  margin-bottom: 12%; }

@media (max-width: 767px) {
  .postbox {
    width: calc(( 100% - 6.4% ) / 2 );
    padding-top: 6.4%;
    box-sizing: border-box; }

  .postbox:nth-child(odd) {
    margin-right: 6.4%; } }
@media (min-width: 768px) {
  div.post {
    justify-content: flex-start;
    gap: 4.8%; }

  .postbox {
    width: calc(( 100% - 14.4% ) / 4 );
    border-top: solid 1px #efefef;
    padding-top: 12px;
    padding-bottom: 12px;
    box-sizing: border-box; } }
a.postlink {
  width: 100%;
  display: block;
  box-sizing: border-box;
  padding-bottom: 4.8%; }

a.postlink:hover {
  background: #4F6BD7;
  box-sizing: border-box; }

/* post_thumbnail */
.postbox p {
  font-size: 0;
  overflow: hidden; }

p.no_image {
  width: 100%;
  position: relative;
  padding-bottom: 4.8%; }

p.no_image img {
  font-size: 0;
  display: block; }

.hover_zoom img {
  width: 100%;
  transition: 0.5s all; }

.hover_zoom img:hover {
  display: block;
  transform: scale(1.3, 1.3); }

/* date */
.pagetitle {
  padding-top: 5px;
  line-height: 1;
  position: relative;
  padding: 0px 0px 5px;
  box-sizing: border-box;
  font-size: 11px;
  color: #9C9C9C; }

/* title */
.pagecontent h3 {
  font-weight: bold;
  min-height: 32px;
  line-height: 1.2em;
  font-size: 11px;
  border-bottom: solid 1px #efefef; }

@media (min-width: 769px) {
  .pagecontent {
    box-sizing: border-box;
    min-height: 32px;
    line-height: 1.2em;
    position: relative;
    overflow: hidden;
    font-size: 12px; } }
/* category page */
.category_box {
  width: 100%;
  padding-top: 4.8%;
  display: flex;
  justify-content: space-between;
  align-items: flex-start;
  flex-wrap: wrap;
  box-sizing: border-box;
  flex: 2; }

.category_titlebox {
  width: 100%;
  margin-bottom: 2.4%; }

.category_titlebox h1 {
  font-size: 12px; }

.category_postbox {
  width: calc((100% - 4.8% ) / 2 );
  margin-bottom: 4.2%; }

.category_postbox a p {
  font-size: 0;
  margin-bottom: 3.2%;
  overflow: hidden; }

.category_postbox ol li:nth-child(1) {
  font-size: 0.8em;
  line-height: 1.2em;
  color: #9C9C9C;
  margin-bottom: 1.2%; }

.category_postbox ol li h2 {
  font-size: 1em;
  line-height: 1.2em; }

/* 404 ------------------------------------- */
div.page404 ol {
  width: 100%;
  padding: 8% 0 8%;
  min-height: 700px;
  background-size: 92% auto;
  background-position: top center;
  position: relative;
  box-sizing: border-box; }

div.page404 ol li a {
  width: 240px;
  text-align: center;
  box-sizing: border-box;
  padding: 3.2%;
  display: block;
  position: relative;
  background: #090909;
  color: #FFF; }

/* animation */
.msg {
  color: whitesmoke;
  text-align: center;
  font-family: 'Bree Serif', Courier, monospaced;
  font-size: 1em;
  width: 20%;
  position: absolute;
  margin: 35px 0 0 2px;
  pointer-events: none; }

/* SP&Tab floating menu p a des */
@media screen and (max-width: 767px) {
  #mybtn {
    width: 60px;
    display: none;
    position: fixed;
    right: 6.4%;
    bottom: 16px;
    z-index: 50;
    border: 0;
    background: none; }

  #mybtn a {
    width: 60px;
    height: 60px;
    line-height: 60px;
    border-radius: 50%;
    background: #efefef;
    border: 1px solid #efefef;
    display: block;
    box-sizing: border-box;
    font-size: 0.8em;
    letter-spacing: -0.015em;
    text-align: center; }

  #mybtn a:hover {
    color: #fff;
    background: #11100F; } }
/* PC floating menu p a des */
@media screen and (min-width: 768px) {
  #mybtn {
    display: none;
    position: fixed;
    bottom: 48px;
    right: 64px;
    z-index: 60;
    border: 0;
    background: none;
    clear: both;
    overflow: hidden;
    animation: fadeIn 1s ease-in-out; }

  #mybtn a {
    float: left;
    width: 74px;
    height: 74px;
    line-height: 74px;
    background: #fff;
    border: 1px solid #efefef;
    display: block;
    box-sizing: border-box;
    border-radius: 50%;
    font-size: 0.7em;
    text-align: center; }

  #mybtn a:hover {
    color: #fff;
    background: #11100F; }

  #mybtn a:nth-child(2) {
    margin-left: 36px; } }
@keyframes fadeIn {
  from {
    opacity: 0; }
  to {
    opacity: 1; } }
