@charset "UTF-8";
/********** 取り込み時に消えることがあるので、同じものをコメントアウトしておく **********/
@import url("https://fonts.googleapis.com/css2?family=Lora:ital,wght@0,400;0,700;1,400;1,700&display=swap");
/*===================================
  基本設定
===================================*/
.color01 {
  color: #3d4070;
}

.color02 {
  color: #333333;
}

.color03 {
  color: #333333;
}

.color04 {
  color: #333333;
}

.bgcolor01 {
  background-color: #3d4070;
}

.bgcolor02 {
  background-color: #f7f8f9;
}

.bgcolor03 {
  background-color: #f3efe9;
}

.bgcolor04 {
  background-color: #333333;
}

/********** font **********/
.lora {
  font-family: 'Lora', serif;
}

.pic img {
  width: 100%;
}

.alt01 {
  display: none;
}

[data-element-id] .alt01 {
  display: block;
}

/* 共通コンテンツ間隔 */
.area {
  padding-top: 100px;
  padding-bottom: 100px;
}

@media (max-width: 1024px) {
  .area {
    padding-top: 80px;
    padding-bottom: 80px;
  }
}

@media (max-width: 599px) {
  .area {
    padding-top: 50px;
    padding-bottom: 50px;
  }
}

.area2 {
  padding-top: 80px;
  padding-bottom: 80px;
}

@media (max-width: 599px) {
  .area2 {
    padding-top: 50px;
    padding-bottom: 50px;
  }
}

/* 共通要素読み込みコメント（取り込み後削除） */
[class*='load-'] {
  position: relative;
  min-height: 50px;
  border: 3px solid #00bcd4;
}

[class*='load-']:before {
  position: absolute;
  z-index: 100;
  display: block;
  background: #00bcd4;
  color: #ff0;
  content: '共通要素';
  text-align: center;
  font-weight: bold;
}

/*===================================
  共通ブロック　block-cmn
==================================*/
.block-cmn01 {
  position: relative;
  background: #fcf7ca;
  margin-top: 100px;
  margin-bottom: 200px;
}
.block-cmn01:last-child{
  margin-bottom: 0;
}

.block-cmn01 .pic-side {
  margin-top: -100px;
}

.block-cmn01:after {
  content: "";
  width: 600%;
  height: 100%;
  background: #fcf7ca;
  top: 0;
  left: 0;
  position: absolute;
  z-index: -1;
  margin-left: -300%;
}

/*===================================
  共通タイトル　ttl-cmn
===================================*/
.ttl-cmn01 {
  font-size: 36px;
  font-family: 'Lora', serif;
  font-weight: 400;
}

.ttl-cmn02 {
  text-align: center;
  font-size: 36px;
  font-family: 'Lora', serif;
  font-weight: 400;
  letter-spacing: 1px;
  padding-bottom: 80px;
  position: relative;
}

.ttl-cmn02:after {
  content: "";
  width: 104px;
  height: 1px;
  background: #000000;
  display: block;
  margin: 0 auto 0 auto;
}

.ttl-cmn02.sub {
  font-size: 30px;
}

.ttl-cmn02 .s {
  position: absolute !important;
  left: 50%;
  font-size: .5em;
  font-family: "游ゴシック", YuGothic, Hiragino Sans, "ヒラギノ角ゴ ProN W3", "Hiragino Kaku Gothic Pro", Hiragino Kaku Gothic ProN, "メイリオ", Meiryo, 'ＭＳ Ｐゴシック', sans-serif;
  -webkit-transform: translate(-50%, 0);
          transform: translate(-50%, 0);
  text-align: center;
  font-weight: bold;
  display: block;
  bottom: 45px;
}

.ttl-cmn03 {
  text-align: center;
  font-size: 30px;
  font-family: "游ゴシック", YuGothic, Hiragino Sans, "ヒラギノ角ゴ ProN W3", "Hiragino Kaku Gothic Pro", Hiragino Kaku Gothic ProN, "メイリオ", Meiryo, 'ＭＳ Ｐゴシック', sans-serif;
  font-weight: bold;
  letter-spacing: 1px;
  padding-bottom: 80px;
  position: relative;
}

.ttl-cmn03:after {
  content: "";
  width: 104px;
  height: 1px;
  background: #000000;
  display: block;
  margin: 0 auto 0 auto;
}

@media (max-width: 1024px) {
  .ttl-cmn01,
  .ttl-cmn02,
  .ttl-cmn03 {
    font-size: 24px;
  }
  .ttl-cmn02,
  .ttl-cmn03 {
    padding-bottom: 40px;
  }
  .ttl-cmn02.sub {
    font-size: 20px;
  }
  .ttl-cmn02 .s {
    bottom: 15px;
  }
}
.imgfit {
  display: block;
  position: relative;
  overflow: hidden;
}

.imgfit img {
  width: 100%;
  height: 100% !important;
  -o-object-fit: cover;
  object-fit: cover;
  -o-object-position: center center;
  object-position: center center;
  font-family: 'object-fit: cover; object-position: center center;';
  position: absolute;
  top: 0;
  left: 0;
  bottom: 0;
  right: 0;
}

.imgfit:before {
  content: "";
  display: block;
}

.home-concept .repeat:nth-of-type(2n) .conceptbg {
  left: auto;
  right: 0;
}

.home-concept .repeat:nth-of-type(2n) .pic {
  right: auto;
  left: 0;
}

.home-concept .repeat:nth-of-type(2n) .tbox {
  margin-left: auto;
}
/*===================================
  共通リスト　list-cmn
==================================*/
/* 共通リスト１ */
/*===================================
  共通ボタン btn-cmn
===================================*/
/*ボタン、ホバー時の装飾*/
.hmore {
  width: 240px;
  margin-top: 50px;
  margin-bottom: 50px;
}

.canm .hmore {
  width: 100%;
  text-align: center;
}

.canm.new .hmore {
  width: 45%;
  text-align: center;
}

.c-p8{
  color: #858584;
}

.hmore a,
.hmore button{
  display: inline-block !important;
  max-width: 240px;
  width: 100%;
  -webkit-box-sizing: border-box;
          box-sizing: border-box;
  border: 1px solid #dddddd;
  padding: 15px 25px;
  font-size: 16px;
  font-family: 'Lora', 'YuMincho', 'Yu Mincho', '游明朝体', 'ヒラギノ明朝 ProN', 'Hiragino Mincho ProN', serif;
  font-style: italic;
  font-weight: bold;
  position: relative;
  background: #fff;
  text-align: center;
}

.hmore span,
.MoveBtn span {
  display: inline-block;
  position: relative;
  padding-right: 1em;
  -webkit-transition: all .3s;
  transition: all .3s;
      letter-spacing: 0px;
}
.hmore.back span{
  padding-right: 0em;
  padding-left: 1em;
}

.hmore span::after,
.MoveBtn span::after {
  display: block;
  font-family: "Font Awesome 5 Free";
  content: "\f054";
  font-weight: 900;
  font-style: normal;
  position: absolute;
  top: 50%;
  right: -10px;
  -webkit-transition: all .3s;
  transition: all .3s;
  -webkit-transform: translateY(-50%);
          transform: translateY(-50%);
}

.hmore.back span::after{
  right: initial;
  left: -10px;
  content: "\f053";
}

.hmore:hover span,
.MoveBtn:hover span {
  padding: 0 .5em;
}

.hmore:hover span::after,
.MoveBtn:hover span::after {
  right: 0;
  opacity: 0;
}

.hmore.back:hover span::after{
  left: 0px;
  right: initial;
}

/*ボタン、ホバー時の装飾(バック)*/
.MoveBackBtn {
  width: 240px;
}

.MoveBackBtn span {
  position: relative;
  padding-left: 1em;
  -webkit-transition: all .3s;
  transition: all .3s;
}

.MoveBackBtn span::after {
  position: absolute;
  left: -12px;
  margin-top: -6px;
  border: 7px solid transparent;
  -webkit-transition: all .3s;
  transition: all .3s;
  font-family: "Font Awesome 5 Free";
  content: "\f053";
  font-weight: 900;
  font-style: normal;
}

.MoveBackBtn:hover span {
  padding: 0 .5em;
}

.MoveBackBtn:hover span::after {
  right: 0;
  opacity: 0;
}

/* 共通ボタン１ */
.btn-cmn01 {
  max-width: 180px;
  margin-top: 50px;
}

.btn-cmn01 a {
  display: block;
  padding: 5px 20px;
  background: #333333;
  color: #fff;
  text-align: center;
  position: relative;
}

.btn-cmn01 a:after {
  position: absolute;
  right: 5px;
  top: 50%;
  -webkit-transform: translateY(-50%);
          transform: translateY(-50%);
  content: "\f054";
  font-weight: 600;
  font-family: 'Font Awesome 5 Free';
}

.btn-cmn01.btn-back a:after {
  content: "\f053";
  right: inherit;
  left: 5px;
}

/*===================================
  他共通エレメント -cmn
===================================*/
/*===================================
  共通要素
===================================*/
/*h1ページタイトル */
.pagettl {
  display: none;
}

[data-element-id] .pagettl {
  display: none;
}

/**
ヘッダー
header
*/
.header {
  box-sizing: border-box;
  height: 100vh;
  width: 60px;
  display: block;
  position: absolute;
  top: 0;
  left: 0;
  z-index: 2;
}

[data-element-id]#header {
height: auto;
    margin-top: 0;
    text-indent: inherit;
    margin-left: 0%;
    position: relative;
    width: 100%;
    border: solid 3px #0043ff;
}
[data-element-id]#header:before{
  content: "メニュー内のテキスト";
  background: #0043ff;
  color: #fff;
      display: block;
    text-align: center;
}

/* 下部固定コンテンツ */
.fix-bottom {
  display: none;
}

@media (max-width: 1024px) {
  .fix-bottom {
    position: fixed;
    bottom: 0;
    left: 0;
    z-index: 250;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    width: 100%;
  }
  .fix-bottom .item {
    width: 50%;
    text-align: center;
  }
  .fix-bottom a {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: center;
        -ms-flex-pack: center;
            justify-content: center;
    -webkit-box-align: center;
        -ms-flex-align: center;
            align-items: center;
    height: 100%;
    padding: 10px 5px;
  }
  .fix-bottom .tel {
    background: #333333;
    color: #fff;
    font-size: 14px;
  }
  .fix-bottom .tel a:before {
    margin-right: 5px;
    content: '\f879';
    font-weight: 600;
    font-family: 'Font Awesome 5 Free';
  }
  .fix-bottom .contact {
    background: #eee;
    color: #333333;
  }
  .fix-bottom .contact a:before {
    margin-right: 5px;
    content: '\f0e0';
    font-weight: 600;
    font-family: 'Font Awesome 5 Free';
  }
}

/**
グローバルナビ
gnav
*/
#gnav {
  overflow: hidden;
  display: block;
  position: fixed;
  top: 0;
  left: 0;
  height: 100%;
  background: none;
  -webkit-transition: ease .5s;
  transition: ease .5s;
  padding: 0;
  z-index: 251;
  border: none;
}

#gnav .in {
  position: relative;
  /* width: calc(100% + 17px); */
  height: 100vh;
  overflow-y: scroll;
  background: rgb(255 255 255);
}

#gnav li{
  padding: 5px 20px;
  border-bottom: 1px dotted #cacad9;
}
#gnav li ul li{
  border-bottom:none;
  position: relative;
  padding: 2px 0 2px 20px;
}
#gnav li ul li:before {
  position: absolute;
  top: 13px;
  left: 0;
  display: block;
  width: 10px;
  height: 2px;
  background: #828cf7;
  content: '';
}
#gnav.action {
  -webkit-transform: translateX(0px);
          transform: translateX(0px);
}

#gnav {
  width: 450px;
  -webkit-transform: translateX(-100%);
          transform: translateX(-100%);
}

#gnav .item01 {
  padding-left: 30px;
  font-size: 14px;
  padding-bottom: 10px;
  font-family: 'Lora', serif;
  font-style: italic;
}
.overlay{
  -webkit-overflow-scrolling: none;
    overflow: hidden;
    overscroll-behavior: none;
}
.overlay .nb {
  display: block;
  width: 38px;
  height: 38px;
  z-index: 102;
}

#gnav .logo {
  padding: 120px 20px 10px;
  width: 100%;
  max-width: 200px;
  margin: auto;
}

#gnav dl {
  padding: 20px;
}

#gnav dt {
  font-family: 'Lora', serif;
  font-weight: bold;
}

#gnav dd {
  font-family: 'Lora', serif;
}

.overlay:after {
  content: "";
  width: 100%;
  height: 100%;
  background: #000;
  position: fixed;
  top: 0;
  left: 0;
  opacity: 0.3;
  z-index: 141;
}
.overlay .main,
.overlay .h1,
.overlay .footer{
  filter: blur(5px);
  -webkit-transition: 0.4s ease;
  transition: 0.4s ease;
}

[data-element-id] .gnav.fixed {
  position: relative;
}

/* ハンバーガーメニュー  */
.toggle {
  position: absolute ;
  top: 35px;
  left: 20px;
  z-index: 251;
  width: 60px;
  height: 60px;
  background: #fff;
  opacity: 0.8;
  cursor: pointer;
}

.toggle .bar {
  position: absolute;
  top: 48%;
  left: 12px;
  display: block;
  margin-top: -3px;
  padding: 0;
  width: 35px;
  height: 2px;
  background: #000;
  text-indent: 9999px;
  transition: ease 0.4s;
  -webkit-transition: ease 0.4s;
}

.toggle .bar:before{
  position: absolute;
  left: 0;
  display: block;
  width: 35px;
  height: 2px;
  background: #000;
  content: '';
}

.toggle .bar:before {
  top: -8px;
}

.toggle .bar:after {
  top: 10px;
}

.toggle .text{
  position: absolute;
  bottom: 0;
  font-size: 14px;
  color: #000;
  font-weight: bold;
  width: 100%;
  text-align: center;
  font-family: "游明朝", YuMincho, "Hiragino Mincho ProN W3", "ヒラギノ明朝 ProN W3", "Hiragino Mincho ProN", "HG明朝E", "ＭＳ Ｐ明朝", "ＭＳ 明朝", serif;
}

.toggle.active .bar {
  transform: rotate(-45deg);
  -webkit-transform: rotate(-45deg);
  -ms-transform: rotate(-45deg);
}

.toggle.active .bar:after,
.toggle.active .bar:before {
  top: 0;
  left: 0;
  transform: rotate(90deg);
  -webkit-transform: rotate(90deg);
  -ms-transform: rotate(90deg);
}

.toggle.active + .top-con{
  visibility: hidden;
  opacity: 0;
  -webkit-transition: 0.4s ease;
    transition: 0.4s ease;
}

.overlay:after {
  position: fixed;
  top: 0;
  left: 0;
  z-index: 249;
  width: 100%;
  height: 100vh;
  background: #333333;
  content: '';
  opacity: 0.3;
  transform: translate3d(0, 0, 0) !important;
  -webkit-transform: translate3d(0, 0, 0) !important;
}

/*トップへ戻る*/
.totop {
  position: fixed;
  right: 0;
  bottom: 0;
  z-index: 200;
  width: 68px;
  height: 68px;
  background: #b6baef;
  color: #fff;
  text-align: center;
  font-size: 30px;
  line-height: 68px;
  cursor: pointer;
  border-radius: 50%;
}

.totop:before {
  content: '\f077';
  font-weight: bold;
  font-family: 'Font Awesome 5 Free';
}

@media (max-width: 1024px) {
  #gnav .logo{
    max-width: 150px;
  }
  .totop {
    right: 10px;
    bottom: 50px;
  }
}

/**
フッター
footer
*/
.footer {
  border-top: #eeeeee 1px solid;
  padding: 30px 0;
}

.footer .footinfo {
  width: 40%;
  text-align: right;
}

#footer .footinfo .in {
  display: inline-block !important;
  padding: 0 5%;
  text-align: left;
}

.footer .footnav {
  width: 60%;
  text-align: center;
}

.footer .footnav .footnav-li {
  margin: 0 auto;
  max-width: 300px;
  width: 100%;
  -webkit-box-sizing: border-box;
          box-sizing: border-box;
  padding: 0 5%;
}

.footer .footnav ul {
  width: 50%;
}

.footer .footnav li {
  color: #333333;
  text-indent: -1em;
  padding: 0 0 3px 15px;
  font-family: 'Lora', serif;
  font-style: italic;
  width: 50%;
  text-align: left;
}

.footer .footnav li:before {
  font-style: normal;
  padding-right: 5px;
  font-family: "Font Awesome 5 Free";
  content: "\f054";
  font-weight: 900;
}


.footer .footinfo dt {
  font-size: 16px;
  font-weight: bold;
  font-family: 'Lora', serif;
  font-weight: 700;
}

.footer .footinfo dd {
  font-family: 'Lora', serif;
}

.footer .footinfo dl {
  padding: 0 0 20px 0;
}

.footer .footinfo li {
  font-family: 'Lora', serif;
}

.footer .footinfo p {
  font-family: 'Lora', serif;
}

.footer .footinfo li .st {
  width: 3em;
  margin-right: 1em;
  font-size: 16px;
}

.footer .copy {
  text-align: center;
  font-size: 12px;
  font-family: 'Lora', serif;
  font-style: italic;
  padding: 20px 0 20px 0;
}

@media (max-width: 1024px) {

  .footer .footnav,
  .footer .footinfo,
  #footer .footinfo .in{
    width: 100%;
  }
}

@media (max-width: 599px) {
  .footer .footinfo {
    width: 100%;
    text-align: center;
    padding: 0 0 30px 0;
  }
  .footer .footinfo .in {
    display: block !important;
  }
  .footer .footnav {
    width: 100%;
  }
  .footer .footnav .flex {
    padding: 0 5%;
  }
  .footer .footinfo li .st {
    width: 100%;
  }
}

/**
フッターナビ
fnav
*/
.fnav {
  padding: 50px 0;
  background: #eee;
}

.fnav .wrap {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
}

.fnav .list01 {
  width: 50%;
  -webkit-column-count: 3;
          column-count: 3;
}

.fnav .item {
  margin-bottom: 10px;
  padding-right: 10px;
  -moz-column-break-inside: avoid;
  -webkit-column-break-inside: avoid;
          break-inside: avoid;
}

.fnav .item a {
  position: relative;
  display: block;
  padding-left: 12px;
}

.fnav .item a:before {
  position: absolute;
  top: 10px;
  left: 0;
  display: block;
  width: 4px;
  height: 4px;
  border-radius: 50%;
  background: #333333;
  content: '';
}

.fnav .list02 {
  width: 50%;
}

.fnav .datawrap {
  -webkit-column-count: 3;
          column-count: 3;
}

.fnav .datattl {
  position: relative;
  margin-bottom: 10px;
  padding-left: 12px;
}

.fnav .datattl:before {
  position: absolute;
  top: 10px;
  left: 0;
  display: block;
  width: 4px;
  height: 4px;
  border-radius: 50%;
  background: #333333;
  content: '';
}

.fnav .data {
  margin-bottom: 5px;
  padding-right: 10px;
  -moz-column-break-inside: avoid;
  -webkit-column-break-inside: avoid;
          break-inside: avoid;
}

.fnav .data a {
  position: relative;
  padding-left: 12px;
}

.fnav .data a:before {
  position: absolute;
  top: 7px;
  left: 0;
  display: block;
  width: 5px;
  height: 1px;
  background: #333333;
  content: '';
}

@media (max-width: 1024px) {
  .fnav .wrap {
    -ms-flex-wrap: wrap;
        flex-wrap: wrap;
  }
  .fnav .list01 {
    margin-bottom: 10px;
    width: 100%;
  }
  .fnav .list02 {
    width: 100%;
  }
}

@media (max-width: 599px) {
  .fnav .list01 {
    -webkit-column-count: 2;
            column-count: 2;
  }
  .fnav .datawrap {
    -webkit-column-count: 2;
            column-count: 2;
  }
  .footer .footnav .footnav-li {
    max-width: none;
  }
}

/*===================================
  各個別コンテンツ
===================================*/
/**
トップ
*/
/*ホームビジュアル（トップ）*/
.home-main {
  margin-bottom: 80px;
}

.home-main .center {
  width: 86%;
  position: relative;
}

.home-main .slide img {
  width: 100%;
  height: auto;
}

.home-main .center .logo {
  position: absolute;
  top: 50%;
  right: 0;
  width: 50%;
  text-align: center;
  padding: 0 10%;
  -webkit-box-sizing: border-box;
          box-sizing: border-box;
  -webkit-transform: translateY(-50%);
          transform: translateY(-50%);
}

.home-main .left {
  position: relative;
  width: 7%;
}

.home-main .right {
  position: relative;
  width: 7%;
}

.home-main .left .w {
  display: inline-block !important;
  text-align: center;
  -webkit-transform: rotate(-90deg);
          transform: rotate(-90deg);
  width: 600px;
  -webkit-transform-origin: left top 0;
          transform-origin: left top 0;
  z-index: 1;
  position: absolute;
  bottom: -7%;
  left: 0;
  padding: 25% 0 0 0;
  font-family: Arial, Helvetica, sans-serif;
  font-size: 12px;
  line-height: 150%;
}

.home-main .right .w {
  display: inline-block !important;
  text-align: center;
  -webkit-transform: rotate(90deg);
          transform: rotate(90deg);
  width: 600px;
  -webkit-transform-origin: right top 0;
          transform-origin: right top 0;
  z-index: 1;
  position: absolute;
  bottom: -7%;
  right: 0;
  padding: 25% 0 0 0;
  font-family: Arial, Helvetica, sans-serif;
  font-size: 12px;
  line-height: 150%;
}

.homevisual {
  position: relative;
}

.homevisual .img {
  position: relative;
  min-height: 300px;
  max-height: 700px;
}

.homevisual .img:before {
  position: relative;
  z-index: -1;
  display: block;
  padding-top: 50%;
  content: '';
}

.homevisual .img img {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  /*IE対策*/
  font-family: 'object-fit: cover; object-position: 50% 50%;';
  -o-object-fit: cover;
  object-fit: cover;
  -o-object-position: 50% 50%;
  object-position: 50% 50%;
}

/*IE対策*/
.homevisual .head {
  position: absolute !important;
  top: 50%;
  left: 50%;
  font-weight: bold;
  font-size: 40px;
  -webkit-transform: translate(-50%, -50%);
          transform: translate(-50%, -50%);
}

@media (max-width: 599px) {
  .homevisual .head {
    font-size: 28px;
  }
}

/* A-BiSUスライダー用 */

.slide img {
  width: 100%;
}

.slide .uk-slidenav-position {
  position: relative;
  overflow: hidden;
  min-height: 300px;
}
.uk-slideshow {
  height: auto !important;
  position: relative;
}

.uk-slideshow:before {
  display: block;
  content: "";
  padding-top: 60%;
}

.slide .uk-slideshow li {
  position: absolute;
  top: 0;
  width: 100%;
  height: 100% !important;
}

.slide .uk-slideshow .uk-flex {
  height: 100%;
}

.slide .uk-slideshow img {
  width: 100%;
  height: 100%;
  /*IE対策*/
  font-family: 'object-fit: cover; object-position: 50% 50%;';
  -o-object-fit: cover;
  object-fit: cover;
  -o-object-position: 50% 50%;
  object-position: 50% 50%;
}

.home-news .tbox {
  width: calc(100% - 130px);
  max-width: 80%;
}

.home-news.new .tbox {
  width: 100%;
  max-width: 100%;
}

.home-news dt {
  font-size: 16px;
  font-weight: bold;
  /* width: 8rem;
  margin-right: 4rem;
  -ms-flex-negative: 0;
      flex-shrink: 0; */
}

.home-news dd {
  font-size: 16px;
}
/* 
.home-news dl {
  padding: 12px 0;
  border-bottom: 1px solid #ddd;
} */

.home-news .hmore {
  margin-right: 0;
}

.home-concept {
  margin-bottom: 150px;
  position: relative;
}

.home-concept:after {
  position: absolute;
  content: "";
  height: 100%;
  width: 20%;
  top: 0;
  right: 0;
  background: #fff;
  z-index: -2;
}

.home-feature {
  margin-bottom: 150px;
  position: relative;
}

.home-feature:before {
  position: absolute;
  content: "";
  height: 100%;
  top: 0;
  left: 0;
  width: 100%;
  background: #ECF7FF;
  z-index: -3;
}

.home-feature:after {
  position: absolute;
  content: "";
  height: 100%;
  width: 20%;
  top: 0;
  left: 0;
  background: #fff;
  z-index: -2;
}

.home-topics .repeat {
  margin: 100px 0;
  padding-top: 80px;
  padding-bottom: 50px;
  position: relative;
}

.home-topics .conceptbg {
  content: "";
  width: 88%;
  max-width: 1460px;
  height: 100%;
  background: #f3efe9;
  z-index: -1;
  position: absolute;
  top: 0;
  left: 0;
}

.home-topics .tbox .in {
  max-width: 500px;
  width: 100%;
  margin-left: auto;
  padding: 0 0 0 4%;
  -webkit-box-sizing: border-box;
          box-sizing: border-box;
}

.home-topics .pic {
  width: calc(50% - 40px);
  height: calc(100% - 130px);
}

.home-topics .h {
  margin-bottom: 0;
  position: absolute !important;
  top: 0;
  -webkit-transform: translateY(-50%);
          transform: translateY(-50%);
}

.home-topics .tbox {
  max-width: 480px;
  margin-left: auto;
  padding-right: 5%;
}

.home-topics .tbox .txt {
  padding: 0 0 20px 0;
  line-height: 200%;
}

.home-topics .tbox .hmore {
  padding: 0;
  margin: 30px auto 0 0;
}

.home-topics > div:nth-of-type(even) .repeat {
  -webkit-box-orient: horizontal;
  -webkit-box-direction: reverse;
      -ms-flex-direction: row-reverse;
          flex-direction: row-reverse;
}

.home-topics > div:nth-of-type(even) .repeat .tbox {
  margin-right: auto;
  padding-left: 5%;
}

.home-topics > div:nth-of-type(even) .repeat .tbox .in {
  margin-right: auto;
  padding: 0 4% 0 0;
}

.home-style {
  position: relative;
}

.home-style .h {
  position: absolute !important;
  top: 0px;
  z-index: 10;
}

.home-style:before {
  content: "";
  display: block;
  padding-top: 130%;
}

.home-style li:after {
  content: "";
  display: block;
}

.home-style li img {
  position: absolute;
  -o-object-fit: cover;
  object-fit: cover;
}

.home-style li:nth-of-type(5n+1) {
  top: -50px;
  right: 0;
  width: 58.2%;
  position: absolute;
}

.home-style li:nth-of-type(5n+2) {
  width: 50%;
  max-width: 32.8%;
  position: absolute;
  top: 9%;
  left: 0;
}

.home-style li:nth-of-type(5n+3) {
  width: 40%;
  position: absolute;
  top: 25%;
  left: 41.8%;
}

.home-style li:nth-of-type(5n+4) {
  position: absolute;
  top: 48%;
  left: 0%;
  max-width: 32.8%;
  width: 32.8%;
}

.home-style li:nth-of-type(5n+5) {
  width: 58.2%;
  position: absolute;
  top: 69%;
  right: 0;
}

/****/
.home-style .hmore {
  max-width: 32.8%;
  margin-top: -54px;
  position: absolute;
  top: 91%;
}

.home-menu {
  padding: 65px 0 55px 0;
}

.home-menu .tbox {
  padding: 0 0 45px 0;
  width: calc(100% - 130px);
  max-width: 80%;
}

.home-menu .tbox .table {
  width: 47.5%;
  margin: 0 5% 0 0;
}

.home-menu .tbox .table:nth-child(2n+2) {
  margin-right: 0;
}

.home-menu .tbox .table dt {
  width: 100%;
  font-size: 16px;
}

.home-menu .tbox .table dd {
  width: 100%;
  text-align: right;
  font-size: 16px;
  font-weight: bold;
}

.home-menu .tbox dl {
  border-bottom: 1px solid #ddd;
  padding: 10px 0;
}

.home-menu .hmore {
  text-align: right;
  padding: 0 0 20px 0;
  margin-left: auto;
}

.home-menu .hmore a {
  text-align: center;
}

.home-menu .hmore {
  text-align: right;
  padding: 0 0 20px 0;
  margin-left: auto;
  margin-right: 0;
}

.home-menu .hmore a {
  text-align: center;
}

.home-sab .h {
  width: 150px;
  text-align: right;
}

.home-sab .tbox {
  width: calc(100% - 150px);
}

.home-sab dl {
  width: 18%;
  margin: 1%;
  max-width: 31.333%;
  -webkit-box-flex: 1;
      -ms-flex-positive: 1;
          flex-grow: 1;
}

.home-sab dd {
  margin-top: 10px;
}

.home-sab .tit {
  font-size: 16px;
  font-weight: bold;
}

.home-blog{
padding: 80px 0;  
}

.home-blog .tbox {
  width: calc(100% - 150px);
}

.home-blog .tbox dl {
  width: 23%;
  max-width: 46%;
  margin: 1%;
  -webkit-box-flex: 1;
      -ms-flex-positive: 1;
          flex-grow: 1;
}

.home-blog .tbox dt {
  font-size: 16px;
  font-weight: bold;
  padding: 0 2px;
  margin: 10px 0;
}

.bg-gnav {
  background: #f6f0ff;
  padding: 10px;
  border-radius: 10px;
}

.home-blog .hmore {
  margin-right: 0;
}
.home-blog .hmore.new2 {
  margin-right: auto;
}
.home-shop .h {
  width: 150px;
  text-align: right;
}

.home-shop .tbox {
  width: calc(100% - 150px);
}

.home-shop dl {
  width: 23%;
  margin: 1%;
  max-width: 31.333%;
  -webkit-box-flex: 1;
      -ms-flex-positive: 1;
          flex-grow: 1;
}

.home-shop dd {
  margin-top: 10px;
}

.home-shop .ttl {
  font-size: 16px;
  font-weight: bold;
}

.home-shop .tel {
  font-size: 18px;
}

.home-shop .hmore {
  width: 80%;
}

.home-shop .hmore a {
  font-size: 16px;
  padding: 8px 10px;
}

.home-rec {
  position: relative;
  overflow: hidden;
  background: rgb(163, 134, 192);
}

.home-rec .bg {
  width: 100%;
  height: 100%;
  position: absolute;
  top: 0;
  left: 0;
  opacity: 0.6;
}

.home-rec .box {
  position: relative;
  z-index: 2;
  padding: 100px 0;
}

.home-rec .tbox {
  width: 65%;
}

.home-rec .h {
  color: #fff;
  margin-bottom: 20px;
}

.home-rec .tbox .text {
  color: #fff;
  font-size: 16px;
  line-height: 250%;
}

.home-rec .hmore {
  margin-top: 0;
}

.home-rec .inner{
  position: relative;
  z-index: 1;
  padding: 100px 0;
}

.home-access .map:after {
  padding-top: 30%;
}

.home-access .add {
  width: 50%;
  text-align: center;
}

.home-access .right {
  width: 50%;
  text-align: center;
}

.home-access .in {
  display: inline-block !important;
  text-align: left;
}

.home-access .in .t {
  font-size: 30px;
  font-family: 'Lora', 'YuMincho', 'Yu Mincho', '游明朝体', 'ヒラギノ明朝 ProN', 'Hiragino Mincho ProN', serif;
  font-style: italic;
  font-weight: bold;
  margin-bottom: 5px;
}

.home-access .in dd {
  font-size: 16px;
}

.home-access .in .p {
  padding: 0 0 20px 0;
}

.home-access dl {
  padding: 0 0 20px 0;
}

.home-access .hmore {
  text-align: center;
}

.home-concept .repeat {
  min-height: 400px;
  margin: 100px 0;
  padding-top: 80px;
  padding-bottom: 50px;
  position: relative;
  box-sizing: border-box;
}
.home-concept .repeat.new2{
  margin: 30px 0 100px;
}
.maint .home-concept .repeat:last-child{
  margin: 100px 0 0;
}

.home-concept .pic {
  width: calc( 50% - 40px );
  height: calc(100% - 130px);
  position: absolute;
  top: 80px;
  right: 0;
}

@media (max-width: 1024px) {
  .home-main .left,
  .home-main .right {
    width: 100%;
    text-align: center;
  }
  .home-main .left .w,
  .home-main .right .w {
    position: relative;
    -webkit-transform: rotate(0);
            transform: rotate(0);
    width: auto;
    bottom: auto;
    left: auto;
    padding: 5px 0;
  }
  .home-main .center {
    width: 100%;
  }
  .home-news {
    max-width: none;
  }
  .home-news dt {
    font-size: 14px;
  }
  .home-news dd {
    padding-left: 0;
  }
  .home-style li:nth-of-type(5n+5) {
    top: 67%;
  }
  .home-menu h3 {
    width: 100%;
    margin-bottom: 20px;
  }
  .home-menu .tbox {
    width: 100%;
    max-width: none;
  }
  .home-menu .tbox .table dt {
    font-size: 14px;
  }
  .home-menu .tbox .table dd {
    font-size: 14px;
  }
  .home-rec .inner {
    padding-bottom: 70px;
    padding-top: 50px;
  }
  .home-rec .inner .tbox .text {
    font-size: 14px;
  }
  .home-access .inner .in dt,
  .home-access .inner .in h4 {
    font-size: 20px;
  }
  .home-access .inner .add {
    width: 100%;
  }
  .home-access .inner .right {
    width: 100%;
  }
}

@media (max-width: 599px) {
  .maint .home-concept .repeat:last-child,
  .home-concept .repeat.new2{
    margin: 10px auto;
  }
  
  .home-news {
    padding-bottom: 40px;
  }
  .home-news dl a{
    -ms-flex-wrap: wrap;
        flex-wrap: wrap;
  }
  .home-news dt {
    width: 100%;
    margin-bottom: 10px;
  }
  .home-news .h {
    width: 100%;
    margin-bottom: 20px;
  }
  .home-news .tbox {
    max-width: none;
    width: 100%;
  }
  .home-topics .tbox {
    max-width: none;
    width: 80%;
    margin: auto !important;
  }
  .home-concept:after,
  .home-feature:after {
    height: 20%;
    width: 100%;
  }
  .home-concept,
  .home-feature {
    margin-bottom: 0;
  }
  .home-concept .h,
  .home-feature .h {
    left: 10%;
  }
  .home-concept .pic,
  .home-feature .pic {
    width: 92%;
    padding-bottom: 70%;
    margin: auto;
    -webkit-box-ordinal-group: 0;
    -ms-flex-order: 0;
    order: 0;
    position: relative;
    border-radius: 15px;
    height: auto;
    top: 0;
    margin-bottom: 10px;
  }
  .home-concept .w50,
  .home-feature .w50 {
    margin-top: 0;
  }
  .home-concept .w50 .in,
  .home-feature .w50 .in {
    width: auto;
    width: 100%;
  }
  .home-style {
    margin-bottom: 150px;
  }
  .home-style .h {
    top: -50px;
  }
  .home-style li:nth-of-type(5n+1) {
    top: 3%;
  }
  .home-style li:nth-of-type(5n+3) {
    top: 50%;
    -webkit-transform: translate(0, -50%);
            transform: translate(0, -50%);
  }
  .home-style li:nth-of-type(5n+5) {
    top: 75%;
  }
  .home-style .hmore {
    max-width: none;
    top: auto;
    bottom: -100px;
  }
  .home-menu .tbox .table {
    width: 100%;
    margin-right: 0;
  }
  .home-sab .h,
  .home-blog .h,
  .home-shop .h {
    width: 100%;
    text-align: left;
    margin-bottom: 20px;
  }
  .home-sab .tbox,
  .home-blog .tbox,
  .home-shop .tbox {
    max-width: none;
    width: 100%;
    -ms-flex-wrap: wrap;
        flex-wrap: wrap;
  }
  .home-sab .tbox dl,
  .home-blog .tbox dl,
  .home-shop .tbox dl {
    width: 48%;
    max-width: none;
    margin-left: 1%;
    margin-right: 1%;
    margin-bottom: 5%;
    -webkit-box-flex: 0;
        -ms-flex-positive: 0;
            flex-grow: 0;
  }
  .home-sab .tbox dl:nth-of-type(odd):last-of-type,
  .home-blog .tbox dl:nth-of-type(odd):last-of-type,
  .home-shop .tbox dl:nth-of-type(odd):last-of-type {
    margin-left: auto;
    margin-right: auto;
  }
  .home-blog .tbox dd.img {
    text-align: center;
  }
  .home-blog .hmore {
    margin-right: auto;
  }
  .home-rec .box {
    padding: 60px 0;
  }
  .home-rec .tbox,
  .home-rec ul {
    width: 100%;
  }
  .home-rec .tbox {
    margin-bottom: 15px;
  }
  .home-access .in .t {
    font-size: 22px;
  }
  .home-access .map:after {
    padding-top: 75%;
  }
  .home-access .add {
    width: 100%;
  }
}

/**
下層共通
*/
/* トップビジュアル（下層共通） */
/* パンくずリスト */
.breadcrumb {
  margin-top: 10px;
}

.breadcrumb .item {
  display: inline-block;
}

.breadcrumb .item:not(:last-of-type):after {
  content: '\f054';
  font-weight: 600;
  font-family: 'Font Awesome 5 Free';
  display: inline-block;
  margin-right: 5px;
  margin-left: 10px;
}

.breadcrumb .home {
  color: #333333;
}

.breadcrumb .now {
  color: #333333;
}

/**
各下層ページ
*/
/**
2カラムページ

ニュース（一覧・詳細）
ブログ（一覧／詳細）
*/
.column2 .side {
  width: 250px;
}

.column2 .mainwrap {
  width: calc(100% - 300px);
}

@media (max-width: 1024px) {
  .column2 .inner {
    -ms-flex-wrap: wrap;
        flex-wrap: wrap;
  }
  .column2 .side {
    -webkit-box-ordinal-group: 4;
        -ms-flex-order: 3;
            order: 3;
    margin-bottom: 50px;
    width: 100%;
  }
  .column2 .mainwrap {
    -webkit-box-ordinal-group: 3;
        -ms-flex-order: 2;
            order: 2;
    margin-bottom: 50px;
    width: 100%;
  }
}

/* サイドメニュー */
.side .list {
  margin-bottom: 30px;
}

@media (max-width: 1024px) {
  .side {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: justify;
        -ms-flex-pack: justify;
            justify-content: space-between;
    -ms-flex-wrap: wrap;
        flex-wrap: wrap;
  }
  .side .list {
    width: 48%;
  }
}

@media (max-width: 599px) {
  .side .list {
    width: 100%;
  }
}

.list-side .datattl {
  background: #828cf7;
  text-align: center;
  font-size: 18px;
  font-family: 'Lora', serif;
  font-weight: bold;
  padding: 10px 0;
  margin-bottom: 15px;
  color: #fff;
}

.list-side .data {
  margin-bottom: 10px;
  padding-left: 10px;
  font-size: 16px;
  font-weight: bold;
}

.list-side a {
  position: relative;
  display: inline-block;
  padding-left: 20px;
}

.list-side a:before {
  position: absolute;
  left: 0;
  color: #333333;
  content: '>';
}

@media (max-width: 1024px) {
  .list-side.type-archive .datawrap {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -ms-flex-wrap: wrap;
        flex-wrap: wrap;
    -webkit-box-pack: justify;
        -ms-flex-pack: justify;
            justify-content: space-between;
  }
  .list-side.type-archive .datawrap .datattl {
    width: 100%;
  }
  .list-side.type-archive .datawrap .data {
    width: 48%;
  }
}

/********** ページネーション **********/
.pagenav li {
  font-size: 20px;
  font-weight: bold;
  padding: 0 10px;
}

.pagenav li.current {
  position: relative;
}

.pagenav li.current:after {
  position: absolute;
  content: "";
  width: 20px;
  height: 2px;
  background: #3344ff;
  bottom: -3px;
  left: 50%;
  -webkit-transform: translate(-50%, 0);
          transform: translate(-50%, 0);
}

@media (max-width: 599px) {
  .stylelist dl {
    width: 48%;
    margin-left: 1%;
    margin-right: 1%;
  }
}

/* 記事一覧ページ */
.list-article .cate span {
  display: inline-block;
  background: #333333;
  color: #fff;
  padding: 0 5px;
  margin: 0 5px 2px 0px;
  font-size: 14px;
}

.list-article .cate .cate1 {
  background: #00f;
}

.list-article .head {
  padding-bottom: 10px;
  margin-bottom: 10px;
  border-bottom: 1px solid #ddd;
}

.list-article .head.up-reader2 {
  -webkit-box-sizing: content-box;
          box-sizing: content-box;
}

.list-article .MoveBtn {
  text-align: right;
  padding-top: 5px;
}

.list-article .MoveBtn a {
  display: inline-block !important;
  border: 1px solid #ddd;
  font-family: 'Lora', serif;
  font-weight: 700;
  font-style: italic;
  padding: 3px 30px;
}

/* 記事詳細ページ */
.articledtl01 .cate span {
  display: inline-block;
  background: #333333;
  color: #fff;
  padding: 0 5px;
  margin: 0 5px 2px 0px;
}

.articledtl01 .ttl {
  padding: 15px 0 10px 0;
  font-size: 24px;
  font-weight: bold;
  border-bottom: 1px solid #ddd;
  margin-bottom: 20px;
}
/* 
.articledtl01 .back {
  text-align: right;
}

.articledtl01 .back a {
  border: 1px solid #dddddd;
  display: inline-block !important;
  width: 100%;
  max-width: 240px;
  text-align: right;
  font-weight: 700;
  font-family: 'Lora', serif;
  padding: 15px 25px;
  -webkit-box-sizing: border-box;
          box-sizing: border-box;
  position: relative;
}

.articledtl01 .back a:before {
  font-family: "Font Awesome 5 Free";
  content: "\f053";
  font-weight: 900;
  top: 50%;
  left: 25px;
  position: absolute;
  -webkit-transform: translateY(-50%);
          transform: translateY(-50%);
} */

.articledtl01 .cate .cate1 {
  background: #00f;
}
.blog-recommend.n-blo .date{
      position: absolute;
    top: 0;
    background: #cacefc;
    padding: 0 5px;
    color: #444;
    font-size: 14px;
}

@media (max-width: 1024px) {
  .recommend.blog-recommend li:last-child:nth-child(odd) {
    margin-left: auto;
    margin-right: auto;
  }
}

/********** スタッフ **********/
.stylelist dt .p {
  display: block;
  font-family: 'Lora', serif;
  font-style: italic;
  border-bottom: 1px solid #ddd;
  padding: 5px 0;
  text-align: left;
  font-weight: normal;
  font-size: 14px;
  -webkit-box-sizing: content-box;
          box-sizing: content-box;
}

.stylelist dt {
  text-align: center;
  font-size: 18px;
  font-weight: 700;
  font-family: 'Lora', serif;
}

.stylelist dd {
  text-align: center;
}

.catalog-detail .tit {
  width: 28%;
  padding: 0 0 10px 0;
}

.catalog-detail .right {
  width: 100%;
}
.catalog .right li{
  list-style: none;
}

.catalog-detail .pic {
  width: 40%;
}

.catalog-detail .cataloginfo {
  width: 55%;
}

.catalog-detail .tit .h {
  font-family: 'Lora', serif;
  font-weight: 700;
  border-bottom: 1px solid #dddddd;
  margin-bottom: 18px;
}

.catalog-detail .tit li:last-child {
  margin-left: 10px;
}

.catalog-detail .tit li a {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -ms-flex-wrap: wrap;
      flex-wrap: wrap;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  -webkit-box-pack: center;
      -ms-flex-pack: center;
          justify-content: center;
  background: #3d4070;
  color: #ffffff;
  width: 2.5em;
  height: 2.5em;
  border-radius: 50%;
  text-align: center;
}

.catalog-detail .cataloginfo dt {
  font-weight: bold;
  border-bottom: 1px solid #dddddd;
  padding: 0 0 5px 0;
  margin-bottom: 10px;
}

.catalog-detail .cataloginfo dl {
  padding: 0 0 30px 0;
}
/* 
.catalog-detail .back a {
  border: 1px solid #dddddd;
  display: inline-block !important;
  width: 100%;
  max-width: 240px;
  text-align: right;
  font-weight: 700;
  font-family: 'Lora', serif;
  padding: 15px 25px;
  -webkit-box-sizing: border-box;
          box-sizing: border-box;
  position: relative;
} */

/* .catalog-detail .back a:before {
  font-family: "Font Awesome 5 Free";
  content: "\f053";
  font-weight: 900;
  top: 50%;
  left: 25px;
  position: absolute;
  -webkit-transform: translateY(-50%);
          transform: translateY(-50%);
} */
/* 
.catalog-detail .back {
  margin-top: -56px;
} */

@media (max-width: 1024px) {
  /* .catalog-detail .back {
    margin-top: 0;
  } */
  .catalog-detail .tit {
    width: 100%;
  }
  .catalog-detail .right {
    width: 100%;
  }
  .catalog-detail .pic {
    padding: 0 0 20px 0;
  }
}

@media (max-width: 599px) {
  .catalog-detail .pic {
    width: 100%;
    margin: auto;
  }
  .catalog-detail .cataloginfo {
    width: 100%;
  }
}

/********** スタイル **********/
.style-single .tbox {
  width: 40%;
  padding: 0;
}

.style-single .tbox .h {
  font-family: 'Lora', serif;
  font-weight: 700;
  border-bottom: 1px solid #dddddd;
  margin-bottom: 55px;
  text-align: right;
}

.style-single .tbox .s {
  display: block;
  text-align: left;
}

.style-single .img {
  width: 57%;
}

.style-single .back a {
  border: 1px solid #dddddd;
  display: inline-block !important;
  width: 100%;
  max-width: 240px;
  text-align: right;
  font-weight: 700;
  font-family: 'Lora', serif;
  padding: 15px 25px;
  -webkit-box-sizing: border-box;
          box-sizing: border-box;
  position: relative;
}

.style-single .back a:before {
  font-family: "Font Awesome 5 Free";
  content: "\f053";
  font-weight: 900;
  top: 50%;
  left: 25px;
  position: absolute;
  -webkit-transform: translateY(-50%);
          transform: translateY(-50%);
}

.style-single .back {
  text-align: right;
}

.style-single .tbox .box1 .sh {
  font-size: 16px;
  margin-bottom: 5px;
  font-weight: bold;
}

.style-single .tbox .box1 p {
  padding: 0 0 20px 0;
}

.style-single .tbox .box1 .table {
  padding: 25px 0 0 0;
}

.style-single .tbox .box1 dt {
  font-weight: bold;
  width: 20.56%;
}

.style-single .tbox .box1 dd {
  width: 20.54%;
  background: #c9cdcc;
  font-weight: bold;
  color: #fff;
  text-align: center;
  margin: 0 0 0 5.94%;
}

/*style_detail*/
.style-single .tbox .box1 dl.list1.少ない dd:nth-of-type(1) {
  background: #333;
}

.style-single .tbox .box1 dl.list1.普通 dd:nth-of-type(2) {
  background: #333;
}

.style-single .tbox .box1 dl.list1.多い dd:nth-of-type(3) {
  background: #333;
}

.style-single .tbox .box1 dl.list2.柔らかい dd:nth-of-type(1) {
  background: #333;
}

.style-single .tbox .box1 dl.list2.普通 dd:nth-of-type(2) {
  background: #333;
}

.style-single .tbox .box1 dl.list2.硬い dd:nth-of-type(3) {
  background: #333;
}

.style-single .tbox .box1 dl.list3.細い dd:nth-of-type(1) {
  background: #333;
}

.style-single .tbox .box1 dl.list3.普通 dd:nth-of-type(2) {
  background: #333;
}

.style-single .tbox .box1 dl.list3.太い dd:nth-of-type(3) {
  background: #333;
}

.style-single .tbox .box1 dl.list4.なし dd:nth-of-type(1) {
  background: #333;
}

.style-single .tbox .box1 dl.list4.少ない dd:nth-of-type(2) {
  background: #333;
}

.style-single .tbox .box1 dl.list4.強い dd:nth-of-type(3) {
  background: #333;
}

.style-single .tbox .box1 dl {
  padding-bottom: 16px;
}

.style-single .tbox .box1 {
  padding-bottom: 34px;
}

.style-single .tbox .box1 dd.st {
  background: #333;
}

.style-single .tbox .box2 .sh {
  font-size: 18px;
  font-weight: bold;
  border-bottom: 1px solid #ddd;
  padding-bottom: 5px;
  margin-bottom: 15px;
}

.style-single .tbox .box2 {
  padding-bottom: 40px;
}

.style-single .tbox .box2 .p {
  padding: 0 0 20px 0;
}

@media (max-width: 1024px) {
  .style-single .tbox .box1 dl {
    -ms-flex-wrap: wrap;
        flex-wrap: wrap;
  }
  .style-single .tbox .box1 dt {
    width: 100%;
  }
  .style-single .tbox .box1 dd {
    width: 30%;
    margin-left: 0;
  }
  .style-single .tbox .box1 dd:not(:last-of-type) {
    margin-right: 3.33333%;
  }
}

@media (max-width: 599px) {
  .style-single .img {
    width: 100%;
    margin-bottom: 20px;
  }
  .style-single .tbox {
    width: 100%;
  }
}

/********** プロダクト **********/
.productlist dt .p {
  display: block;
  font-family: "游ゴシック", YuGothic, Hiragino Sans, "ヒラギノ角ゴ ProN W3", "Hiragino Kaku Gothic Pro", Hiragino Kaku Gothic ProN, "メイリオ", Meiryo, 'ＭＳ Ｐゴシック', sans-serif;
  border-bottom: 1px solid #ddd;
  padding: 15px 0;
  text-align: left;
  font-weight: normal;
  font-size: 14px;
  -webkit-box-sizing: content-box;
          box-sizing: content-box;
}

.productlist dt + dd {
  text-align: center;
  font-family: "游明朝", "YuMincho", "ヒラギノ明朝 ProN W3", "Hiragino Mincho ProN", "HG明朝", "Sawarabi Mincho", serif;
  font-size: 16px;
  font-weight: bold;
  padding: 10px 0;
}

/* ギャラリー */
.list-gallery01 a {
  display: block;
  position: relative;
}

.list-gallery01 .img {
  opacity: 1;
  -webkit-transition: 0.5s;
  transition: 0.5s;
}

.list-gallery01 .block-txt {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: center;
      -ms-flex-pack: center;
          justify-content: center;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
      -ms-flex-direction: column;
          flex-direction: column;
  opacity: 0;
  -webkit-transition: 0.5s;
  transition: 0.5s;
  padding: 10px;
  overflow: hidden;
  visibility: hidden;
}

.list-gallery01 .cate {
  font-size: 14px;
  margin-bottom: 5px;
}

.list-gallery01 .head {
  font-size: 18px;
}

.list-gallery01 a:hover {
  opacity: 1;
}

.list-gallery01 a:hover .img {
  opacity: 0.5;
}

.list-gallery01 a:hover .block-txt {
  opacity: 1;
  visibility: visible;
}

@media (max-width: 599px) {
  .list-gallery01 .block-txt {
    display: none;
  }
  .list-gallery01 .head {
    font-size: 14px;
  }
}

/* ギャラリー詳細 */
.gallerydtl01 .thumbnail {
  cursor: pointer;
}

/********** メニュー **********/
.menulist dl {
  border-bottom: 1px solid #ddd;
  padding: 17px 0 12px;
}

.menulist dt,
.menulist dd {
  font-weight: bold;
}

.menulist dd {
  text-align: right;
}

.menulist dd + dd {
  font-weight: normal;
  text-align: left;
}

/********** リクルート **********/
.home-rec.type02 {
  background: transparent;
}

.home-rec.type02 li {
  text-align: right;
  margin-bottom: 12px;
}

.home-rec.type02 li a {
  width: 100%;
  background: #fff;
  text-align: left;
  padding: 15px 25px;
  -webkit-box-sizing: border-box;
          box-sizing: border-box;
  font-size: 18px;
  position: relative;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -ms-flex-wrap: wrap;
      flex-wrap: wrap;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  -webkit-box-pack: justify;
      -ms-flex-pack: justify;
          justify-content: space-between;
}

.home-rec.type02 li .st {
  font-weight: bold;
}

.home-rec.type02 li .e {
  font-size: 14px;
  font-family: 'Lora', serif;
  font-style: italic;
  padding-right: 20px;
  display: inline-block !important;
}

/********** 新卒採用・中途採用 **********/
.rec-box01 .box:not(:last-of-type) {
  margin-bottom: 75px;
}

.rec-box01 .h {
  width: 290px;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -ms-flex-wrap: wrap;
      flex-wrap: wrap;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  -webkit-box-pack: center;
      -ms-flex-pack: center;
          justify-content: center;
  -webkit-box-sizing: border-box;
          box-sizing: border-box;
  background: #f3efe9;
  font-size: 20px;
  min-height: 150px;
  position: relative;
  font-weight: bold;
}

.rec-box01 .h:before {
  content: "";
  position: absolute;
  width: 10000%;
  right: 0;
  top: 0;
  bottom: 0;
  background: #f3efe9;
  z-index: -1;
}

.rec-box01 .h.big {
  font-size: 36px;
  font-family: 'Lora', serif;
  font-weight: 700;
  letter-spacing: 2px;
  -webkit-box-pack: start;
      -ms-flex-pack: start;
          justify-content: flex-start;
}

.rec-box01 .tbox {
  width: calc(100% - 320px);
}

.rec-box01.alt .h {
  background: #f0f2ed;
}

.rec-box01.alt .h:before {
  background: #f0f2ed;
}

.rec-box02 {
  margin-top: 200px;
}

.rec-box02 .wrap {
  position: relative;
}

.rec-box02 .wrap:before {
  content: "";
  width: 300%;
  left: 25%;
  top: 0;
  bottom: 0;
  background: #f7f8f9;
  position: absolute;
  z-index: -1;
}

.rec-box02 .pic {
  width: 46%;
  margin-top: -60px;
}

.rec-box02 .tbox {
  width: 50%;
}

.rec-box02 .txt {
  position: relative;
  padding-top: 50px;
}

.rec-box02 .txt dl + dl {
  margin-top: 50px;
}

.rec-box02 .h {
  position: absolute !important;
  top: -60px;
  text-align: center;
  width: 100%;
  font-size: 30px;
  font-family: "游ゴシック", YuGothic, Hiragino Sans, "ヒラギノ角ゴ ProN W3", "Hiragino Kaku Gothic Pro", Hiragino Kaku Gothic ProN, "メイリオ", Meiryo, 'ＭＳ Ｐゴシック', sans-serif;
  font-weight: bold;
}

.rec-box02 .box {
  padding-bottom: 60px;
}

.rec-box02 .box:nth-of-type(even) {
  padding-bottom: 120px;
}

.rec-box02 .box:nth-of-type(even) .pic {
  width: 57%;
  margin-top: 0;
}

.rec-box02 .box:nth-of-type(even) .tbox {
  width: 39%;
  padding-top: 35px;
}

.rec-schedule01 .h {
  font-size: 30px;
  font-family: "游ゴシック", YuGothic, Hiragino Sans, "ヒラギノ角ゴ ProN W3", "Hiragino Kaku Gothic Pro", Hiragino Kaku Gothic ProN, "メイリオ", Meiryo, 'ＭＳ Ｐゴシック', sans-serif;
  font-weight: bold;
}

.rec-schedule01 .time + div {
  width: calc(100% - 180px);
}

.rec-schedule01 .img {
  width: 48%;
}

.rec-schedule01 .time {
  position: relative;
  font-size: 30px;
  font-weight: 700;
  font-family: 'Lora', serif;
}

.rec-schedule01 .box {
  margin-bottom: 30px;
  padding-bottom: 30px;
}

.rec-schedule01 .box:not(:last-of-type) .time:before {
  content: "";
  width: 20px;
  height: 100%;
  position: absolute;
  top: 0;
  left: 50%;
  background: #f3efe9;
  -webkit-transform: translateX(-50%);
          transform: translateX(-50%);
}

.rec-schedule01 .box:not(:last-of-type) .time:after {
  content: "";
  width: 0;
  height: 0;
  border-style: solid;
  border-width: 32px 25px 0 25px;
  border-color: #f3efe9 transparent transparent transparent;
  bottom: -30px;
  left: 50%;
  -webkit-transform: translateX(-50%);
          transform: translateX(-50%);
  position: absolute;
  height: 32px !important;
}

.rec-schedule01 .box .time .w {
  position: relative;
  z-index: 1;
  background: #fff;
  display: block;
  padding-bottom: 10px;
}

.rec-schedule01.alt .box:not(:last-of-type) .time:before {
  background: #f0f2ed;
}

.rec-schedule01.alt .box:not(:last-of-type) .time:after {
  border-color: #f0f2ed transparent transparent transparent;
}

.rec-box03 {
  -webkit-box-sizing: border-box;
          box-sizing: border-box;
  margin: 0 auto;
  border: 1px solid #dddddd;
  width: 73%;
  padding: 0 70px 0px;
}

.rec-box03 dl {
  border-bottom: 1px solid #dddddd;
  padding-bottom: 18px;
  margin: 0 auto;
  padding-top: 28px;
}

.rec-box03 dl:last-child {
  margin-bottom: 43px;
}

.rec-box03 dl {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -ms-flex-wrap: nowrap;
      flex-wrap: nowrap;
}

.rec-box03 dt {
  width: 130px;
  -ms-flex-negative: 0;
      flex-shrink: 0;
  font-weight: bold;
  font-size: 16px;
  margin-right: 1rem;
}

.rec-box03 dd {
  font-size: 16px;
}

.rec-box03 .h {
  width: 35.3%;
  background-color: #fff;
  margin: -20px auto 0;
  padding-bottom: 50px;
}

.rec-box04 .head {
  border-right: 1px solid #000;
  padding: 10px 30px;
}

.rec-box04 .head .h {
  padding-bottom: 0;
}

.rec-box04 .body {
  padding-left: 30px;
}

.rec-box04 .body li {
  margin-bottom: 1rem;
}

.rec-banner01 {
  position: relative;
  margin: auto;
}

.rec-banner01 a {
  display: block;
}

.rec-banner01 .h {
  color: #fff;
  position: absolute !important;
  width: 95%;
  top: 50%;
  left: 50%;
  -webkit-transform: translate(-50%, -50%);
          transform: translate(-50%, -50%);
  line-height: 120%;
  font-weight: bold;
  font-family: "游ゴシック", YuGothic, Hiragino Sans, "ヒラギノ角ゴ ProN W3", "Hiragino Kaku Gothic Pro", Hiragino Kaku Gothic ProN, "メイリオ", Meiryo, 'ＭＳ Ｐゴシック', sans-serif;
  z-index: 8;
  padding-bottom: 0;
  font-size: 24px;
}

.rec-banner01 .h:after {
  background: #fff;
  margin-top: 10px;
}

.rec-banner01 .pic:before {
  display: block;
  content: "";
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  z-index: 5;
  background: rgba(0, 0, 0, 0.6);
}

.rec-banner01[data-element-id] .pic:before {
  display: none;
}

@media (max-width: 1024px) {
  .rec-box01 .h.big {
    font-size: 26px;
  }
  .rec-box02 .h,
  .rec-schedule01 .h {
    font-size: 24px;
  }
  .rec-schedule01 .time {
    font-size: 20px;
  }
  .rec-schedule01 .time + div {
    width: calc(100% - 70px);
  }
  .rec-box01 .h {
    font-size: 24px;
  }
  .rec-box03 {
    width: 100%;
    padding: 0 30px;
  }
  .rec-box03 dl {
    -ms-flex-wrap: wrap;
        flex-wrap: wrap;
  }
  .rec-box03 dt {
    width: 100%;
  }
  .recruit_new06 .h {
    font-size: 20px;
  }
}

@media (max-width: 599px) {
  .rec-box01 .h {
    width: 100%;
    min-height: auto;
    padding: 1rem;
    font-size: 20px;
  }
  .rec-box01 .tbox {
    width: 100%;
  }
  .rec-box01 .box:not(:last-of-type) {
    margin-bottom: 50px;
  }
  .rec-box02 {
    margin-top: 0;
  }
  .rec-box02 .h {
    position: relative !important;
    top: 0;
  }
  .rec-box02 .tbox,
  .rec-box02 .box:nth-of-type(even) .tbox {
    width: 100%;
    margin-bottom: 30px;
  }
  .rec-box02 .pic,
  .rec-box02 .box:nth-of-type(even) .pic {
    width: 80%;
    margin: 0 auto;
    -webkit-box-ordinal-group: 4;
        -ms-flex-order: 3;
            order: 3;
  }
  .rec-box02 .box:nth-of-type(even) {
    padding-bottom: 60px;
  }
  .rec-schedule01 .time + div {
    -ms-flex-wrap: wrap;
        flex-wrap: wrap;
  }
  .rec-schedule01 .img {
    width: 100%;
    margin-bottom: 10px;
  }
  .rec .rec2 {
    padding: 0;
  }
  .rec2 h3 {
    padding-bottom: 80px;
  }
  .rec2 .pic {
    width: auto;
  }
  .rec2 .w50 {
    padding-top: 20px;
  }
  .rec2 .flexb:nth-child(2n+2) .pic {
    width: auto;
  }
  .rec2 .flexb:nth-child(2n+2) .tbox {
    width: auto;
    padding-top: 20px;
  }
  .rec2 .flexb:nth-child(2n+2) {
    padding-top: 0;
  }
  .rec-box04 .head {
    border-right: none;
  }
}

/********** アクセス **********/
.access-map01:after {
  padding-top: 30%;
}

@media (max-width: 1024px) {
  .access-map01:after {
    padding-top: 50%;
  }
}

@media (max-width: 599px) {
  .access-map01:after {
    padding-top: 70%;
  }
}

/********** クーポン **********/
/*coupon*/
.couponlist .box {
  padding: 20px 35px 15px;
  -webkit-box-sizing: border-box;
          box-sizing: border-box;
  position: relative;
  height: 286px;
}

.couponlist .box a {
  display: block;
}

.couponlist .box:before, .couponlist .box:after {
  content: "";
  display: block;
  height: 100%;
  position: absolute;
  width: 32px;
  top: 0;
}

.couponlist .カテゴリー1 .box {
  background: #f3efe9;
}

.couponlist .カテゴリー1 .box:before {
  background: url(../images/coupon/coupon1_left.gif);
  left: 0;
}

.couponlist .カテゴリー1 .box:after {
  background: url(../images/coupon/coupon1_right.gif);
  right: 0;
}

.couponlist .カテゴリー2 .box {
  background: #F7F8F9;
}

.couponlist .カテゴリー2 .box:before {
  background: url(../images/coupon/coupon2_left.gif);
  left: 0;
}

.couponlist .カテゴリー2 .box:after {
  background: url(../images/coupon/coupon2_right.gif);
  right: 0;
}

.couponlist .type {
  background: #fff;
  max-width: 222px;
  margin: 0 auto;
  text-align: center;
  font-size: 18px;
  font-weight: bold;
  margin-bottom: 15px;
}

.couponlist .h {
  font-size: 16px;
  margin-bottom: 15px;
  font-weight: bold;
}

.couponlist .h:after {
  content: "";
  width: 104px;
  height: 1px;
  background: #000000;
  display: block;
  margin: 15px auto 0 auto;
}

.couponlist .pr {
  text-align: center;
  font-size: 30px;
  font-weight: bold;
  padding: 0 0 20px 0;
}

.couponlist dt {
  width: 80px;
  font-weight: bold;
  padding-right: 10px;
}

.couponlist dl {
  padding-bottom: 5px;
}

@media (max-width: 599px) {
  .couponlist .box {
    width: 100%;
    margin-right: 0;
  }
  .couponlist .h {
    height: auto !important;
  }
}

/********** Q&A **********/
.faqlist .faqbox {
  position: relative;
  padding-bottom: 60px;
}

.faqlist .faqbox .h {
  margin-bottom: 0;
  font-size: 36px;
}

.faqlist .faqbox .q {
  display: block;
  width: 95px;
  line-height: 84px;
  -webkit-box-sizing: border-box;
          box-sizing: border-box;
  color: #fff;
  text-align: center;
  background-color: #3d4070;
  left: 0;
  font-size: 36px;
  position: absolute;
  font-weight: bold;
}

.faqlist .faqbox .tbox {
  /*width: 87.8%;*/
  padding-left: 123px;
  padding-top: 28px;
}

.faqlist .faqbox .sh {
  border-bottom: 1px solid #ddd;
  padding-bottom: 15px;
  font-size: 20px;
  font-weight: bold;
  margin-bottom: 20px;
}

.faqlist .faqbox .tbox .p {
  padding-bottom: 20px;
}

@media (max-width: 599px) {
  .faqlist .faqbox .tbox {
    width: 98%;
    margin-left: 1%;
    margin-right: 1%;
    padding-left: 0;
  }
  .faqlist .faqbox .q {
    position: relative;
    margin: 0 auto;
  }
}

/********** お問い合わせ **********/
/*contact*/
.contactwrap {
  margin-bottom: 130px;
}

.contactwrap .ch {
  margin: 0 auto 20px;
  color: red;
}

.contactwrap .table {
  max-width: 677px;
  margin: 0 auto;
}

.contactwrap dt {
  font-size: 20px;
  font-weight: bold;
  width: 250px;
  -ms-flex-negative: 0;
      flex-shrink: 0;
}

.contactwrap dd {
  -webkit-box-flex: 2;
      -ms-flex-positive: 2;
          flex-grow: 2;
}

.contactwrap dt span {
  color: red;
}

.contactwrap .size1 input {
  border: 1px solid #dddddd;
  width: 100%;
  -webkit-box-sizing: border-box;
          box-sizing: border-box;
  padding: 3px;
  line-height: 160%;
}

.contactwrap dl {
  padding: 0 0 45px 0;
}

.contactwrap .ItemWrap {
  position: relative;
}

.contactwrap .ItemWrap .uk-text-danger {
  position: absolute;
  left: 200px;
  padding-top: 3px;
}

.contactwrap dd .item {
  display: block;
  border: 1px solid #dddddd;
  padding: 3px;
  -webkit-box-sizing: border-box;
          box-sizing: border-box;
  width: 45%;
  text-align: center;
  background: #fff;
}

.contactwrap dd .ItemConfirm {
  display: block;
  padding: 3px;
  -webkit-box-sizing: border-box;
          box-sizing: border-box;
  text-align: center;
}

.contactwrap dd textarea {
  border: 1px solid #dddddd;
  width: 100%;
  height: 220px;
  -webkit-box-sizing: border-box;
          box-sizing: border-box;
  padding: 3px;
}

.contactwrap .table {
  padding-bottom: 25px;
}

.contactwrap .formbtn:first-child {
  margin-right: 30px;
}

.contactwrap .formbtn .BtnType {
  width: 200px;
  border: 1px solid #333333;
  background: #fff;
  font-weight: bold;
  font-size: 20px;
  padding: 5px 0;
  display: block;
  margin: 0 auto;
  line-height: 160%;
  text-align: center;
}

.contactwrap .formbtn .BtnType:hover {
  cursor: pointer;
  opacity: .6;
}

@media (max-width: 1024px) {
  .contactwrap dt {
    font-size: 14px;
  }
}

@media (max-width: 599px) {
  .contactwrap dl {
    -ms-flex-wrap: wrap;
        flex-wrap: wrap;
  }
  .contactwrap dt {
    width: 100%;
    padding-bottom: 10px;
  }
  .contactwrap dd {
    padding-left: 0;
  }
  .contactwrap dl {
    padding-bottom: 25px;
  }
  .contactwrap .formbtn {
    width: 100%;
    text-align: center;
  }
  .contactwrap .formbtn:first-child {
    margin-right: 0;
    margin-bottom: 15px;
  }
}

.contactwrap .completetxt {
  margin-bottom: 50px;
}

/********** 見たまま編集用 **********/
[data-element-id] .home-main .left,
[data-element-id] .home-main .right {
  width: 100%;
}

[data-element-id] .home-main .left .w,
[data-element-id] .home-main .right .w {
  position: relative;
  -webkit-transform: rotate(0);
          transform: rotate(0);
  display: block !important;
  padding: 1rem;
  bottom: 0;
  width: auto;
}

[data-element-id] .toggle {
  position: relative !important;
      top: 0;
    left: 0;
}
/*# sourceMappingURL=style.css.map */



h1{
position: relative;
}
.h1{
  width: 86%;
    padding: 10px;
        
}

.home-main .center .text {
       position: absolute;
    top: 65%;
    left: 10%;
    width: 85%;
    text-align: left;
    -webkit-transform: translateY(-50%);
    -ms-transform: translateY(-50%);
    transform: translateY(-50%);
        text-shadow: 0 0 4px white, 0 0 4px white, 0 0 4px white, 0 0 4px white, 0 0 4px white, 0 0 4px white, 0 0 4px white, 0 0 4px white;
}
.home-main .center .logo {
    position: absolute;
    top: 10%;
    width: 100%;
    filter: drop-shadow(0px 0px 1px #fff) drop-shadow(0px 0px 1px #fff) drop-shadow(0px 0px 1px #fff);
    
}
.home-main .center .logo .text{
  width: 100%;
  filter: drop-shadow(0px 0px 20px #fff);
  max-width: 150px;
}
.home-main .center .logo .add{
      text-shadow: 0 0 4px white, 0 0 4px white, 0 0 4px white, 0 0 4px white, 0 0 4px white, 0 0 4px white, 0 0 4px white, 0 0 4px white;
}
.home-sab h3 {
    width: 240px;
}

.home-sab .tbox {
    width: calc(100% - 220px);
}

.home-concept .tbox .in{
  padding: 0;
}
.home-concept{
  margin-bottom:0;
}
.catalog{
      position: relative;
    padding-bottom: 60px;
}
.catalog .inner{
     padding-top: 100px;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: justify;
    -ms-flex-pack: justify;
    justify-content: space-between;
    align-items: flex-start;
}
.catalog .left{
      width: 35%;
    display: flex;
    flex-wrap: wrap;
    justify-content: center;
}
.catalog .right{
  width: 70%;
}
.catalog .bgleft{
    position: absolute;
    top: 0;
    right: 0px;
    height: 100%;
    width: 100%;
    z-index: 0;
    background-color: rgba(163, 134, 192, 0.2);
    overflow: hidden;
}
.catalog .bgleft img{
  -o-object-fit: cover;
    object-fit: cover;
    -o-object-position: center;
    object-position: center;
    height: 100%;
    width: 100%;
    opacity: 0.3;
}
.home-blog .tbox dt{
  padding: 0;
}

.home-concept .repeat.new{
      margin: 100px 0 150px;
}
.home-concept.new .repeat.new{
  margin: 80px 0;
}
.home-concept .tbox .hmore{
      width: 360px;
}
.home-concept .tbox .hmore a{
  max-width: 100%;
}
.nb{
  padding: 0;
      top: -10px;
}
.hmore a,
#footer .footnav li{
  font-style: normal;
    
}
#footer .footnav li{
    padding: 0 0 13px 15px;
}
#footer .footnav ul{
  width: 100%;
  box-sizing: border-box;
  padding: 0 5%;
}
.home-blog .tbox dl{
  position: relative
}
.home-blog .tbox.new dl{
      box-shadow: 0 0 8px -2px #626262;
    padding: 10px;
}
.home-blog .tbox dl .date{
  position: absolute;
    top: 0;
    background: #cacefc;
    padding: 0 5px;
    color: #444;
    font-size: 14px;
}

.blog-detail .date{
  position: absolute;
    top: 0;
    background: #cacefc;
    padding: 0 5px;
    color: #444;
}
.home-news dd{
  padding: 0;
}
.home-news dd.cat{
      width: 140px;
    text-align: center;
}
.home-news .rit{
  display: flex;
    flex-wrap: wrap;
    width: calc(95% - 150px);
}
.home-news dl a{
      display: flex;
      border: 1px solid #ddd;
    margin-bottom: 10px;
    padding: 10px;
    align-items: center;
}
.home-news dt{
  width: 135px;
}
.home-sab .tit{
  font-weight: bold;
    margin-top: 0;
    width: calc(100% - 30px);
    height: calc(100% - 30px);
    background: #ffffffd4;
    display: flex;
    align-items: center;
    justify-content: center;
    flex-direction: column;
    font-size: 15px;
    letter-spacing: 4px;
    color: #421f00;
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    z-index: 1;
}
.home-sab dl{
  width: calc(80% / 3);
      position: relative;
    z-index: 0;
        margin: 0% 1% 2% 1%;
}

.home-main .center .text .m-ttl{
      text-shadow: 0px 0px 24px #ffffff, 0px 0px 24px #ffffff, 0px 0px 24px #ffffff, 0px 0px 24px #ffffff, 0px 0px 24px #ffffff, 0px 0px 24px #ffffff, 0px 0px 24px #ffffff, 0px 0px 24px #ffffff, 0px 0px 24px #ffffff, 0px 0px 24px #ffffff, 0px 0px 24px #ffffff, 0px 0px 24px #ffffff, 0px 0px 24px #ffffff, 0px 0px 24px #ffffff, 0px 0px 24px #ffffff, 0px 0px 24px #ffffff, 0px 0px 24px #ffffff, 0px 0px 24px #ffffff, 0px 0px 24px #ffffff, 0px 0px 24px #ffffff, 0px 0px 24px #ffffff, 0px 0px 24px #ffffff, 0px 0px 24px #ffffff;
    font-family: 'Noto Serif JP', serif;
    font-size: clamp(2rem, -0.929rem + 4.57vw, 2.5rem);
    font-weight: bold;
    margin-bottom: 30px;
}
.home-main .center .text .ms-ttl{
      text-shadow: 0px 0px 24px #ffffff, 0px 0px 24px #ffffff, 0px 0px 24px #ffffff, 0px 0px 24px #ffffff, 0px 0px 24px #ffffff, 0px 0px 24px #ffffff, 0px 0px 24px #ffffff, 0px 0px 24px #ffffff, 0px 0px 24px #ffffff, 0px 0px 24px #ffffff, 0px 0px 24px #ffffff, 0px 0px 24px #ffffff, 0px 0px 24px #ffffff, 0px 0px 24px #ffffff, 0px 0px 24px #ffffff, 0px 0px 24px #ffffff, 0px 0px 24px #ffffff, 0px 0px 24px #ffffff, 0px 0px 24px #ffffff, 0px 0px 24px #ffffff, 0px 0px 24px #ffffff, 0px 0px 24px #ffffff, 0px 0px 24px #ffffff;
    font-family: 'Noto Serif JP', serif;
    font-size: clamp(1.625rem, 0.161rem + 2.29vw, 1.875rem);
    font-weight: bold;
}
.cat{
      background: #828cf7;
    display: inline;
    padding: 2px 5px 0!important;
    color: #fff;
    font-size: 14px;
}
.card-content {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    -ms-flex-direction: column;
    flex-direction: column;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
    padding: 1em;
}
.card .category {
    width: -webkit-fit-content;
    width: -moz-fit-content;
    width: fit-content;
    margin: 0.5em 0;
    padding: 0.25em 1em 0;
    font-size: 14px;
    color: #828cf7;
    line-height: 1;
    border: 1px solid #828cf7;
    border-radius: 0.5em;
}
.card .card-title {
    font-weight: bold;
    color: #828cf7;
}
.home-blog .tbox {
    width: calc( 100% - 300px );
}
.home-blog .item{
      box-shadow: 0 0 8px -2px #626262;
    margin-bottom: 30px;
}
.btn-color-01{
      background-color: #828cf7;
}
.more01 .btn-icon,
.more01 .btn-txt{
  color: #fff;
}
.home-blog .hmore.new {
    margin-right: initial;
    margin-left: 0;
}
.home-concept .tbox .txt{
  line-height: 1.8;
}
.fa-square{
      transform: rotate(45deg);
    padding-right: 10px;
}
.fa-square:before{
      font-size: 22px;
          color: #3344ff;
}
.h3h{
      font-size: clamp(1.875rem, 1.143rem + 1.14vw, 2rem);
      margin-bottom: 50px;
      font-family: 'Lora','YuMincho','Yu Mincho','游明朝体','ヒラギノ明朝 ProN','Hiragino Mincho ProN',serif;
}
.h3h.deta{
   margin-bottom: 20px;
}
.h3h.min{
  font-size: 24px;
}
  .h3h.min2{
  font-size: 18px;
  margin-bottom: 0;
}
.home-concept h3 {
  margin-bottom: 0;
  position: absolute;
  top: 0;
  transform: translateY(-50%);
}
.home-concept .conceptbg {
  content: "";
  width: 88%;
  max-width: 1460px;
  height: 100%;
  background: #f3efe9;
  z-index: -1;
  position: absolute;
  top: 0;
  left: 0;
}
.home-concept .conceptbg{
  background: #fcf7ca;
}
.home-concept .repeat.new .conceptbg{
background: #f4f5fe;
}
.bg-pp{
  background: #f4f5fe;
}
#footer .logo a{
  display: block;
  width: 100%;
  max-width: 140px;
}
#footer .footinfo dt{
      margin-bottom: 10px;
    background-color: #828cf7;
    font-family: "游ゴシック",YuGothic,"メイリオ",Meiryo,Hiragino Sans,"ヒラギノ角ゴ ProN W3","Hiragino Kaku Gothic Pro",Hiragino Kaku Gothic ProN,'ＭＳ Ｐゴシック',sans-serif;
}
#footer .footinfo dt a{
      display: block;
    text-align: center;
    color: #fff;
}

.nb .n{
  background-size: cover;
    margin-top: 5px;
    width: 50px;
}
.slide{
  position: relative;
}
.top-con{
  position: absolute;
  bottom: 25%;
    left: 20px;
}
.top-con .bg a{
    background: #828cf7;
    border-radius: 50%;
    width: 50px;
    height: 50px;
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 24px;
    color: #fff;
        letter-spacing: 0px;
}
.top-con.ab .bg a{
  background: #aabfb6;
}
.top-con .bg.tel:hover a{
  width: auto;
  border-radius: 15px;
  padding: 0 10px;
}
.top-con .bg a .pc-hover{
  width: 200px;
  line-height: 1.5;
  display: none;
}
.top-con .bg:hover a .pc-hover{
display: block;
}
.top-con .bg.tel:hover a i{
  font-size: 20px;
  margin-right: 10px;
}
.r-ber{
  position: absolute;
  bottom: 0;
  right: -65px;
  height: 100%;
  display: flex;
  flex-direction: column-reverse;
  align-items: center;
}
.lef-ber{
  height: 100%;
  position: relative;
    z-index: 251;
    display: contents;
}
/* .top-i{
  position: absolute;
  bottom: 0;
  right: -65px;
} */
.top-i a{
    width: 50px;
    height: 50px;
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 24px;
}
.mv-left-text{
writing-mode: vertical-rl;
    font-size: 14px;
    height: 100%;
    text-align: center;
}
.name span{
      background-color: #828cf7;
      color: #fff;
      padding: 0.1em 1em;
}
.tel{
  font-weight: bold;
}

.border-rl{
    border-radius: 15px 0px 0px 15px;
}

.border-rr{
    border-radius: 0px 15px 15px 0px;
}

.border-rd{
  border-radius: 15px;
  overflow: hidden;
}

@media (max-width: 1024px) {
  #footer .logo a{
    max-width: 120px;
  }
  .top-con .bg.tel:hover a{
    width: 50px;
    border-radius: 50%;
    padding: 0;
  }
  .top-con .bg.tel:hover a i{
    font-size: 20px;
    margin-right: 0px;
  }
  .top-con .bg:hover a .pc-hover{
    display: none;
    }
  .h3h{
    font-size: clamp(1.625rem, 0.875rem + 1.56vw, 1.875rem);
  }
  .fa-square:before{
    font-size: 18px;
  }
  .catalog .inner{
    padding-top: 50px;
    flex-wrap: wrap;
  }
  .catalog .left{
    margin-bottom: 50px;
    width: 100%;
    align-items: center;
  }
  .catalog .h3h{
    margin-bottom: 0;
  }
  .catalog .hmore {
    margin: 0 0 0 auto;
}
.catalog .right {
  width: 100%;
}
.home-main .center .text .m-ttl{
  font-size: clamp(1.625rem, -0.25rem + 3.91vw, 2.25rem);
}
.home-main .center .text .ms-ttl{
  font-size: clamp(1.375rem, 0.625rem + 1.56vw, 1.625rem);
}
}

.breadcrumbs {
  padding: 30px 0;
  background-color: white;
}

.breadcrumbs-box {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -ms-flex-wrap: wrap;
  flex-wrap: wrap;
  -webkit-box-align: center;
  align-items: center;
  -ms-flex-align: center;
}

.breadcrumbs-list {
  width: -webkit-fit-content;
  width: -moz-fit-content;
  width: fit-content;
  padding-left: 1em;
}

.breadcrumbs-list li {
  display: inline;
  font-size: 14px;
  letter-spacing: 1px;
}

.breadcrumbs-list li.breadcrumbs-home,
.breadcrumbs-list li.breadcrumbs-prevpage {
  font-weight: bold;
  color: #828cf7;
}

.breadcrumbs-list li+li::before {
  content: "";
  width: 8px;
  height: 8px;
  display: inline-block;
  margin: 0 10px;
  border-top: 1px solid #000;
  border-right: 1px solid #000;
  -webkit-transform: rotate(45deg);
  transform: rotate(45deg);
}

.kvArea .fadeUp{
width: 100%;
max-width: 200px;
}

@media (max-width: 1024px) {  
#gnav.action {
  -webkit-transform: translateY(0px);
          transform: translateY(0px);
}

#gnav {
  width: 100%;
  -webkit-transform: translateY(-100%);
          transform: translateY(-100%);
}
  .breadcrumbs {
      padding: 20px 0;
      font-size: 14px;
  }

  .breadcrumbs-box {
      flex-direction: column;
      align-items: flex-start;
  }

  .breadcrumbs-list {
      width: 90%;
      margin-top: 1em;
  }

  .breadcrumbs li {
      font-size: 12px;
  }

  .breadcrumbs li+li::before {
      width: 8px;
      height: 8px;
      margin: 0 5px 1px;
  }
}

@media (max-width: 599px) {
  .h3h.min{
  font-size: 20px;
}
  .h3h.min2{
  font-size: 16px;
}
  .home-sab .tit{
    font-size: 12px;
        width: calc(100% - 20px);
    height: calc(100% - 20px);
        letter-spacing: 1px;
  }
  #footer .logo a{
    max-width: 100px;
  }
  .top-con .bg.tel:hover a{
    width: 35px;
  }
  .uk-slideshow:before {
    padding-top: 100%;
}
  .home-main .center .text .m-ttl{
    font-size: clamp(1.25rem, 0.963rem + 1.43vw, 1.5rem);
  }
  .home-main .center .text .ms-ttl {
    font-size: clamp(1rem, 0.57rem + 2.15vw, 1.375rem);
}
  .home-main .center .logo .text{
    font-size: 30px;
  }
  .footer .footnav li{
    width: 100%;
  }
  .home-blog .cat,
  .home-blog .tbox dl .date{
    font-size: 14px;
  }
  .home-blog .hmore{
    width: 100%;
    margin: 0px auto 0;
    text-align: center;
  }
  .catalog .hmore{
    margin: auto;
  }
  .hmore span, .MoveBtn span{
    font-size: 14px;
  }
  .catalog .left{
    display: contents;
  }
  .home-blog{
    padding: 50px 0;
  }
  .home-blog .tbox{
    width: 100%;
  }
  .home-sab dl{
    width: calc(90% / 2);
    max-width: 100%;
  }
  .fa-square{
    position: absolute;
    top: 0.5em;
    left: 0.25em;
    line-height: 1;
    padding: 0;
  }
  .h3h{
    font-size: clamp(1.25rem, 0.963rem + 1.43vw, 1.5rem);
    padding-left: 1.5em;
    margin-bottom: 30px;
  }
  .hmore{
    margin: 30px auto 0;
  }
  .catalog .h3h,
  .catalog .right{
    margin-bottom: 30px;
  }
  .home-concept .tbox .hmore{
    order: 3;
  }
  .home-concept .conceptbg{
    width: 100%;
  }
  .home-concept .tbox ,
  .home-concept .tbox .in{
    display: contents;
  }
  .home-concept .repeat,
  .home-concept .repeat.new{
    display: flex;
    flex-wrap: wrap;
    max-width: 768px;
    width: 96%;
    margin-left: auto;
    margin-right: auto;
    margin: 10px auto;
    padding: 50px 10px;
    padding-bottom: 30px;
  }
  .home-concept .repeat.new,
  .home-concept.new .repeat.new{
    margin: 50px auto;
  }
  .breadcrumbs {
      padding: 15px 0;
      font-size: 12px;
  }

  .breadcrumbs li+li::before {
      width: 6px;
      height: 6px;
  }
  .hmore a{
    padding: 10px 20px
  }
  .home-news dt{
    width: 100%;
    margin-right: 0rem;
  }
  .home-news .rit{
    width: 95%;
  }
  .home-news dd.cat{
    font-size: 14px;
  }
}

.up-left-1000 {
  margin-left: calc(50% - 500px);
}
.up-right-1000 {
  margin-right: calc(50% - 500px);
}
[class*=up-fxd-even]>.up-left-1000:nth-child(even),
[class*=up-fxd-odd]>.up-left-1000:nth-child(odd) {
  margin-left: 0;
  margin-right: calc(50% - 500px);
}
[class*=up-fxd-even]>.up-right-1000:nth-child(even),
[class*=up-fxd-odd]>.up-right-1000:nth-child(odd) {
  margin-right: 0;
  margin-left: calc(50% - 500px);
}
@media (max-width: 1024px) {
  .up-left-1000 {
    margin-left: 2%;
  }
  .up-right-1000 {
    margin-right: 2%;
  }
  [class*=up-fxd-even]>.up-left-1000:nth-child(even),
  [class*=up-fxd-odd]>.up-left-1000:nth-child(odd) {
    margin-left: 0;
    margin-right: 2%;
  }
  [class*=up-fxd-even]>.up-right-1000:nth-child(even),
  [class*=up-fxd-odd]>.up-right-1000:nth-child(odd) {
    margin-right: 0;
    margin-left: 2%;
  }
}
@media (max-width: 599px) {
  .up-left-1000 {
    margin-right: 2%;
  }
  .up-right-1000 {
    margin-left: 2%;
  }
  [class*=up-fxd-even]>.up-left-1000:nth-child(even),
  [class*=up-fxd-odd]>.up-left-1000:nth-child(odd) {
    margin-left: 2%;
    margin-right: 2%;
  }
  [class*=up-fxd-even]>.up-right-1000:nth-child(even),
  [class*=up-fxd-odd]>.up-right-1000:nth-child(odd) {
    margin-right: 2%;
    margin-left: 2%;
  }
}

 
.t-concept .lef{
  padding-bottom: 50px;
}
.t-concept .h3h{
  transform: translateY(-50%);
  margin-bottom: 0;
}
.t-concept .conceptbg{
  content: "";
  width: 88%;
  max-width: 1460px;
  height: 100%;
  background: #f4f5fe;
  z-index: -1;
  position: absolute;
  top: 0;
  left: 0;
}

.wrapper{
  width: calc(100% - 90px);
    margin-left: auto;
}
.h1,
.home-main .center {
  width: calc(100% - 90px);
  margin-right: auto;
}
.h1{
  width: 100%;
}
.header{
  box-sizing: border-box;
  height: 100vh;
  width: 90px;
  display: block;
  position: fixed;
  top: 0;
  left: 0;
  z-index: 251;
  background: #fff;
  /* opacity: 0.8; */
}

@media (max-width: 1024px) {
  .logo-hed{
    position: absolute;
    top: 50%;
    transform: translateY(-50%);
    margin-left: 5px;
    width: 100%;
    max-width: 120px;
    z-index: 1;
  }
  .logo-hed .text{
    font-family: 'Raleway','YuMincho','Yu Mincho','游明朝体','ヒラギノ明朝 ProN','Hiragino Mincho ProN',serif;
    font-weight: bold;
    font-size: 30px;
  }
  .header{
    background: #fff;
    height: 60px;
    width: 100%;
    position: relative;
  }
  .header.fixed{
    position: fixed;
  }
  .toggle{
    top: 0;
    left: 0;
  }
  .wrapper {
    width: 100%;
}
.h1, .home-main .center {
  width: 100%;
  margin-right: auto;
}
.lef-ber {
  height: auto;
  position: relative;
  display: flex;
  align-items: center;
  background: #fff;
  flex-direction: row-reverse;
}
/* .lef-ber::after{
  content: "";
  width: 100%;
  background: #fff;
} */
.top-con {
  position: absolute;
  bottom: 0;
  left: 0;
  right: 0;
  top: 0;
  display: flex;
  margin-right: 85px;
  justify-content: flex-end;
  align-items: center;
}
.toggle {
  position: relative;
  top: 0;
  left: initial;
  margin-left: auto;
}
}
#loading {
  width: 100vw;
  height: 100vh;
  -webkit-transition: 1s ease;
  transition: 1s ease;
  background-color: #FFF;
  position: fixed;
  top: 0;
  left: 0;
  z-index: 9999;
  opacity: 1;
  visibility: visible;
}

#loading.is-active {
  visibility: hidden;
  animation: fadeout-anim 1s linear forwards;
}
@keyframes fadeout-anim {
  100% {
    opacity: 0;
  }
}


#loading_box {
  width: 100vw;
  height: 100vh;
  transition: all 0s;

  z-index: 9999;
  display: flex;
  align-items: center;
  justify-content: center;
  opacity: 0;
  visibility: hidden;
}

#loading_box.is-active {
  opacity: 1;
  visibility: visible;
}
#loading .img{
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
    height: 100%;
    z-index: -1;
    opacity: .5;
}
.fadeUp {
  animation-name: fadeUpAnime;
  animation-duration: 1.2s;
  animation-delay: 1.2s;
  animation-fill-mode: forwards;
  opacity: 1;
}

@keyframes fadeUpAnime {
  from {
    opacity: 1;
    transform: translateX(0);
  }
  to {
    opacity: 0;
    transform: translateX(-100px);
  }
}
header.is-act{
  animation: Fade-In 2s;
  }
@keyframes Fade-In {
  0% {
  opacity: 0;
  transform: translateX(-30px);
  }
  100% {
  opacity: 1;
  transform: translateX(0);
  }
  }

 .r-ber.is-act{
    animation: Fade-In2 2s;
    }
  @keyframes Fade-In2 {
    0% {
    opacity: 0;
    transform: translateX(30px);
    }
    100% {
    opacity: 1;
    transform: translateX(0);
    }
    }
    .fead-f.is-ac{
      animation-name:fadeInAnime;
      animation-duration:2s;
      animation-fill-mode:forwards;
      opacity:0;
      }
      
      @keyframes fadeInAnime{
        from {
          opacity: 0;
        }
      
        to {
          opacity: 1;
        }
      }
    @media (max-width: 1024px) {
      header.is-act{
        animation:none;
        background-color: #fff;
      }
    }
    @media (max-width: 599px) {
      .logo-hed{
        max-width: 100px;
      }
      .top-con{
        margin-right: 70px;
      }
      .top-con .bg a{
        width: 35px;
        height: 35px;
        font-size: 16px;
      }
      .totop{
        width: 40px;
        height: 40px;
        font-size: 20px;
    line-height: 40px;
    bottom: 10px;
      }
    }

    .topvisual {
      position: relative;
    }
    .topvisual .img {
      position: relative;
      min-height: 200px;
      max-height: 646px;
    }
    .topvisual .img:before {
      position: relative;
      z-index: -1;
      display: block;
      padding-top: 55%;
      content: '';
    }
    .topvisual .img img {
      position: absolute;
      top: 0;
      left: 0;
      width: 100%;
      height: 100%;
      font-family: 'object-fit: cover; object-position: 50% 50%;';
      -o-object-fit: cover;
      object-fit: cover;
      -o-object-position: 50% 50%;
      object-position: 50% 50%;
    }
    .topvisual .head {
      position: absolute !important;
      width: 96%;
      max-width: 1000px;
      text-align: center;
      top: 50%;
      left: 50%;
      font-weight: bold;
      font-size: 34px;
      -webkit-transform: translate(-50%, -50%);
              transform: translate(-50%, -50%);
              font-family: 'Noto Serif JP', serif;
              text-shadow: 0 0 4px white, 0 0 4px white, 0 0 4px white, 0 0 4px white, 0 0 4px white, 0 0 4px white, 0 0 4px white, 0 0 4px white, 0 0 4px white, 0 0 4px white, 0 0 4px white, 0 0 4px white, 0 0 4px white, 0 0 4px white;
    }
    @media only screen and (max-width: 599px) {
      .topvisual .head {
        font-size: 24px;
      }
    }
    .list-cmp03 .item {
      padding: 20px;
    }
    .list-cmp03 .item:not(:last-child) {
      border-bottom: 1px solid #808080;
    }
    .list-cmp03 .datattl {
      width: 230px;
      flex-shrink: 0;
      margin-right: 20px;
    }
    @media (max-width: 599px) {
      .list-cmp03 .item {
        flex-wrap: wrap;
        padding: 20px 10px;
      }
      .list-cmp03 .datattl {
        width: 100%;
        margin-bottom: 5px;
      }
      .list-cmp03 .data {
        width: 100%;
      }
    }
    .bg-g {
      background: #f2f2f2;
  }
  .bg-sg{
    background: #fbfbfb;
  }
  .title-left-deco {
    position: relative;
    margin-bottom: 15px;
    padding-bottom:  5px;
    border-bottom: solid 3px;
}
.title-left-deco::before {
  content: '';
  height: 3px;
  width: 50px;
  display:  block; 
  position:  absolute;
  background-color: #3344ff;
  bottom: -3px; 
  left:  0;
}
.cmn-flow-02 li+li {
  margin-top: 50px;
}

.cmn-flow-02 li .box {
  padding: 20px;
  position: relative;
  background: rgb(246 236 255);
}

.cmn-flow-02 li .arrow {
  width: 140px;
  margin: auto;
  border-top: 25px solid;
  border-left: 70px solid transparent;
  border-right: 70px solid transparent;
  position: absolute;
  top: 100%;
  bottom: auto;
  left: 0;
  right: 0;
  color: rgb(246 236 255);
}

.cmn-flow-02 li:last-of-type .arrow {
  display: none;
}

.cmn-flow-02 li .num {
  width: 50px;
  height: 50px;
  display: block;
  margin-right: 20px;
  font-size: 30px;
  text-align: center;
  border-radius: 50%;
  color: #fff;
  background: #b6baef;
}

.cmn-flow-02 li .tit {
  width: calc(100% - 50px);
  font-size: 20px;
  letter-spacing: 2px;
  font-family: 'Noto Serif JP', serif;
  font-weight: bold;
}

.check li {
  padding-left: 30px;
  position: relative;
  line-height: 2;
}

.check li:before {
  content: "";
  width: 25px;
  height: 25px;
  border-radius: 50%;
  background: #828cf7;
  position: absolute;
  top: 2px;
  left: 0;
}
.check li:after {
  content: "\f00c";
  font-family: "Font Awesome 5 Free";
  font-weight: 900;
  font-size: 16px;
  color: #fff;
  position: absolute;
  top: -1px;
  left: 5px;
}

.dot-list li{
  position: relative;
  line-height: 2;
  padding-left: 22px;
}
.dot-list li::before {
  content: '●';
  display: inline-block;
  font-size: 20px;
  line-height: 1;
  color: #828cf7;
  position: absolute;
  top: 7px;
  left: 0;
}

.border-15{
  border-radius: 15px;
}

.line-text{
 /*  border-left: 4px solid #3344ff; */
  padding-left: 12px;
}
.line-text:before{
 content: "";
    background: #3344ff;
    width: 3px;
    height: 1.5em;
    display: block;
    position: absolute;
    left: 0;
    top: 0;
}
.bg-img{
  background-image: url('/import/tenant_1/160.16.196.5/html/images/AdobeStock_105746004.webp');
  background-position: center;
    background-repeat: no-repeat;
    background-size: cover;
 
}

.bg-p{
  background: rgba(230,231,255,0.2);
}

.bg-pg{
  background: #828cf7;
}

.bg-ps{
  background: #b2b9ff;
}

.c-p{
  color: #828cf7;
}
@media (max-width: 1024px) {
  .cmn-flow-02 li .box {
      padding: 20px;
  }

  .cmn-flow-02 li .num {
      width: 40px;
      height: 40px;
      margin-right: 10px;
      font-size: 26px;
  }

  .cmn-flow-02 li .tit {
      font-size: 18px;
      width: calc(100% - 40px);
  }
}
.d-none-tb,
.d-none-sp{
  display: block;
}
.d-b-tb,
.d-b-sp{
  display: none;
}
.max-h300{
  max-height: 300px;
}

.catalog-box li{
text-align: center;
}

.catalog-box li a {
  position: relative;
  text-decoration: none;
}

.catalog-box li a::before {
  content: '';
  position: absolute;
  width: 20px;
  height: 2px;
  border-radius: 4px;
  background-color: #3344ff;
  bottom: 0;
  left: 50%;
  transform: translate(-50%, 5px);
  -webkit-transition: 0.4s ease;
  transition: 0.4s ease;
}

.catalog-box li a:hover::before {
  width: 100%;
}

.catalog-f li .box{
  position: relative;
}

.catalog-f li .box .cat{
  position: absolute;
  left: 0;
  top: 0;
  font-size: 14px;
}

.catalog-f li .ttl{
  font-size: 20px;
  font-weight: bold;
}

.price .ttl{
  font-size: 30px;
  text-align: center;
 background: rgb(246,211,101);
background: -moz-linear-gradient(90deg, rgba(246,211,101,1) 0%, rgba(253,160,133,1) 100%);
background: -webkit-linear-gradient(90deg, rgba(246,211,101,1) 0%, rgba(253,160,133,1) 100%);
background: linear-gradient(90deg, rgba(246,211,101,1) 0%, rgba(253,160,133,1) 100%);
filter: progid:DXImageTransform.Microsoft.gradient(startColorstr="#f6d365",endColorstr="#fda085",GradientType=1);
  color: #fff;
  line-height: 2;
}
.price .ttl.n2{
 background: rgb(251,194,235);
background: -moz-linear-gradient(90deg, rgba(251,194,235,1) 0%, rgba(166,193,238,1) 100%);
background: -webkit-linear-gradient(90deg, rgba(251,194,235,1) 0%, rgba(166,193,238,1) 100%);
background: linear-gradient(90deg, rgba(251,194,235,1) 0%, rgba(166,193,238,1) 100%);
filter: progid:DXImageTransform.Microsoft.gradient(startColorstr="#fbc2eb",endColorstr="#a6c1ee",GradientType=1);
}
.price .ttl.n3{
 background: rgb(247,112,98);
background: -moz-linear-gradient(90deg, rgba(247,112,98,1) 0%, rgba(254,81,150,1) 100%);
background: -webkit-linear-gradient(90deg, rgba(247,112,98,1) 0%, rgba(254,81,150,1) 100%);
background: linear-gradient(90deg, rgba(247,112,98,1) 0%, rgba(254,81,150,1) 100%);
filter: progid:DXImageTransform.Microsoft.gradient(startColorstr="#f77062",endColorstr="#fe5196",GradientType=1);
}
.price .ttl.n4{
background: rgb(132,250,176);
background: -moz-linear-gradient(90deg, rgba(132,250,176,1) 0%, rgba(143,211,244,1) 100%);
background: -webkit-linear-gradient(90deg, rgba(132,250,176,1) 0%, rgba(143,211,244,1) 100%);
background: linear-gradient(90deg, rgba(132,250,176,1) 0%, rgba(143,211,244,1) 100%);
filter: progid:DXImageTransform.Microsoft.gradient(startColorstr="#84fab0",endColorstr="#8fd3f4",GradientType=1);
}
.uk-lb:hover{
cursor: pointer;
opacity: 0.6;
}
@media (max-width: 1024px) {
  .d-b-tb{
    display: block;
  }
  .d-none-tb{
    display: none;
  }
}
@media (max-width: 599px) {
  .catalog-f li .ttl{
    font-size: 16px;
  }
  .price .ttl{
    font-size: 24px;
  }
  .catalog-box li a {
    font-size: 14px;
  }
  .block-cmn01{
      margin-top: 30px;
    margin-bottom: 30px;
  }
  .innersp{
    max-width: 768px;
    width: 96%;
    margin-left: auto;
    margin-right: auto;
  }
  .d-none-sp{
    display: none;
  }
  .d-b-sp{
    display: block;
  }
}

.detail-content-text h2 {
  font-size: 22px;
  margin-bottom: 20px;
  font-weight: bold;
  padding: 0.5em;
  border-bottom: 3px solid #3344ff;
}

.detail-content-text h3 {
  font-size: 20px;
  font-weight: bold;
  margin-bottom: 20px;
  color: #fff;
  padding: 0.5em 1em;
  background: #3344ff;
}

.detail-content-text h4 {
  font-size: 18px;
  font-weight: bold;
  margin-bottom: 10px;
  color: #3344ff;
}

.form .box {
  display: -webkit-box;
  display: flex;
  flex-wrap: nowrap;
  padding: 25px 0;
  border-bottom: 2px dashed #999;
}
.form .datattl {
  margin-right: 20px;
  display: -webkit-box;
  display: flex;
  flex-shrink: 0;
  -webkit-box-pack: space-between;
  justify-content: space-between;
  -webkit-box-align: center;
  align-items: center;
  width: 240px;
  font-weight: bold;
}
.form .require {
  display: inline-block;
  margin-left: 10px;
  padding: 0 10px;
  background: red;
  color: #fff;
  font-size: 14px;
  line-height: 1.6em;
  width: 60px;
    text-align: center;
}
.form .data {
  padding-left: 50px;
  width: 100%;
}
.form .data input {
  box-sizing: border-box;
  margin-top: 5px;
  margin-bottom: 5px;
  padding: 5px;
  width: 100%;
  border: 1px solid #999;
}
.form .data.new input {
  width:auto;
}
.form .btn {
  margin-top: 30px;
  margin-bottom: 30px;
}
.form .btn-b {
  width: 45%;
  max-width: 300px;
}
.form .btn-b button {
  margin-top: 30px;
  padding: 10px;
  display: flex;
  align-items: center;
  justify-content: center;
  height: 64px;
  position: relative;
  overflow: hidden;
  width: 100%;
  background: none;
}
.form .data textarea {
  box-sizing: border-box;
  padding: 5px;
  width: 100%;
  height: 170px;
  border: 1px solid #999;
  color: inherit;
  font-size: inherit;
  font-family: inherit;
}
.contel .box{
  display: flex;
  flex-wrap: wrap;
  justify-content: center;
  padding: 30px;
  border: solid 1px #000;
  border-radius: 15px;
      align-items: center;
}
.contel .tel-text{
  font-size: 30px;
  font-family: 'Noto Serif JP', serif;
}
.contel .tel-text i{
font-size: 24px;
}
#pp ol {
  list-style: decimal outside none;
  margin-left: 1.5em;
}
#pp .lintext{
margin: 2em 0 1em;
font-size: 22px;
}
.text-in-1{
    margin-left: 1em;
    text-indent: -1em;
}
.privacy-poricy {
/*   overflow-x: hidden;
overflow-y: scroll;
height: 300px; */
  padding: 1em;
  border: 1px solid #ddd;
  background: #fff;
}
.up-w-33\%{
  width: 33%;
}
@media (max-width:1024px) {
  .form .data {
      padding-left: 0;
  }
}
@media (max-width:599px) {
  .sp-img-l{
  margin-right: auto;
    max-width: 400px;
        width: calc(100% - 1em);
}
  .le-sp0{
    letter-spacing:0;
  }
  .contel .box{
    padding: 30px 15px;
  }
  #pp .lintext{
    font-size: 18px;
        padding-right: 40px;
  }
  .contel .tel-text{
    font-size: 28px;
  }
  .contel .tel-text i{
    font-size: 22px;
    }
  .form .box {
      flex-wrap: wrap;
  }
  .form .datattl{
      margin-bottom: 10px;
        width: 100%;
        display: flex;
    }
   
}

.box-sd{
  box-shadow: 0 0 5px 2px #ccc;
}

.dot {
    padding-left: 1em;
        text-indent: -0.8em;
}
.dot::before {
    content: "\f0c8";
    font-size: 90%;
    font-family: "font awesome 5 free";
    margin-right: 5px;
    font-weight: bold;
        font-size: 22px;
    color: #3344ff;
        position: relative;
    bottom: 3px;
}

.h4t{
     font-size: 21px;
    letter-spacing: 5px;
    text-align: left;
}
@media (max-width:1024px) {
  
.h4t{
     font-size: 18px;
}
  .dot::before {
     bottom: 0px;
  }
}
@media (max-width:599px) {
  .h4t{
     font-size: 16px;
     text-align: center;
     letter-spacing: 0;
}
  .dot {
    padding-left: 1em;
    text-indent: -1.1em;
}
}
.area-box li>* {
  display: block;
  overflow: hidden;
  padding: 30px 10px;
  border: 1px solid #f2f2f2;
  border-radius: 15px;
  background: #fff;
      box-shadow: 0 0 10px 1px #ccc;
}

.area-box li .icon {
/*   height: 100px; */
  display: -ms-flexbox;
  display: -webkit-box;
  display: flex;
  -webkit-box-align: center;
  align-items: center;
  -ms-flex-align: center;
  -webkit-box-pack: center;
  -ms-flex-pack: center;
  justify-content: center;
  padding: 5px;
}

.area-box li .icon img {
  width: auto;
  max-width: 100%;
  height: initial !important;
  max-height: 100%;
}

.area-box li .tit {
  margin-top: 10px;
  letter-spacing: 1px;
  text-align: center;
}

.jg-bg .box:nth-of-type(even) {
    background: #f5f5f5;
    padding: 30px;
}

.icon-wrap {
  position: absolute;
  right: 5px;
  top: 50%;
  transform: translatey(-50%);
  width: 38px;
  height: 38px;
  background: #999999;
}
.icons {
  position: relative;
  display: inline-block;
  width: 100%;
  height: 100%;
}
.icons:before,
.icons:after {
  position: absolute;
  content: "";
  display: block;
  transition: all 0.4s;
  background: #fff;
  left: 50%;
  top: 50%;
  width: 50%;
  height: 2px;
  transform: translate(-50%, -50%);
}
.icons:before {
  transform: translate(-50%, -50%) rotate(90deg);
}

/*＋、－切り替え*/
.is-parent .icon:before {
  transform: translate(-50%, -50%) rotate(0deg);
}
.js-toggle + *{
  display: none;
}

.js-toggle{
  position: relative;
}

@media (max-width: 1024px) {
/*   .area-box li .icon {
    height: 70px;
} */

  .area-box li>* {
      padding: 20px 10px;
  }
}
.bot-line{
   background:linear-gradient(transparent 60%, #dee0ff 60%);
}
.store-white .store-texts {
    margin-left: 50px;
    width: 50%;
}

.store-white2 .store-texts {
    margin-right: 0;
    width: 46%;
}


.store-texts h4 {
    font-size: 22px;
    letter-spacing: 2px;
}

.store-texts p {
    font-size: 15px;
    color: #001f3e;
    letter-spacing: 1px;
    line-height: 1.8em;
}
.store-white {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: justify;
    -ms-flex-pack: justify;
    justify-content: space-between;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    background-color: white;
    padding: 40px 0;
    width: 100%;
    margin-bottom: 30px;
}

.store-white2 {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: justify;
    -ms-flex-pack: justify;
    -webkit-box-orient: horizontal;
    -webkit-box-direction: reverse;
    -ms-flex-direction: row-reverse;
    flex-direction: row-reverse;
    justify-content: space-between;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    background-color: white;
    padding: 40px 0;
    width: 100%;
}

.store-map iframe {
    -o-object-fit: cover;
    object-fit: cover;
    -o-object-position: center;
    object-position: center;
    height: 100%;
}

.store-white .store-map {
    height: 290px;
    max-width: 460px;
    margin-right: 40px;
}

.store-white2 .store-map {
    height: 290px;
    max-width: 460px;
    margin-left: 40px;
}
#main{
  padding-bottom: 0;
}
.f-add{
      display: flex;
    align-items: flex-start;
    margin-bottom: 10px;
    justify-content: space-between;
    flex-wrap: wrap;
}
.f-add .m{
  text-align: center;
   width: 100px;
}
.f-add .m span{
  background: #828cf7;
    color: #fff;
    line-height: 1.8;
    padding: 0.1em 1em 0.1em;
    border-radius: 5px;
    font-size: 14px;
    margin-right: 10px;
    display: block;
    letter-spacing: 1.2px;
    width: 100%;
}
.f-add .bod{
      width: calc(100% - 110px);
}
@media (max-width: 1024px) {
  .store-white .store-map,
  .store-white .store-texts,
  .store-white2 .store-map,
  .store-white2 .store-texts{
    width: 100%;
    max-width: 100%;
    margin-left: 0;
    margin-right: 0;
  }
  .store-white,
  .store-white2{
    flex-wrap: wrap;
    padding: 30px;
  }
  .store-map iframe{
    width: 100%;
  }
}
@media (max-width: 599px) {
  .block-cmn01 .pic-side{
    margin-top:0;
    margin-bottom: 10px;
  }
  .f-add{
    margin-bottom: 30px;
    width: 100%;
  }
  .f-add .m{
    margin-bottom: 10px;
  }
  .f-add .bod,
  .f-add .m{
    width: 100%;
  }
}
.c-b{
  color: #3344ff;
}
[data-element-id] .topadd .name a{
  display: inline-block!important;
}
[data-element-id] .topadd .name a i{
margin: auto;
    padding: 10px;
}
[data-element-id] .js-toggle + *{
  display:block;
}
[data-element-id] .top-con .bg a .pc-hover {
    display: block;
}
[data-element-id] #gnav{
      -webkit-transform: translateX(0px);
    transform: translateX(0px);
        position: relative;
    width: 100%;
}
[data-element-id] #loading{
      opacity: 1;
          width: 100%;
    height: 300px;
    max-width: 500px;
    position: relative;
    z-index: 0;
    border: solid 3px #f00;
        margin: auto;
}
[data-element-id] #loading:before{
  content: "ローディング画面";
  background: #f00;
  color: #fff;
      display: block;
    text-align: center;
}
[data-element-id] .fadeUp{
  animation: none;
      opacity: 1;
    position: absolute;
    z-index: 1;
}
[data-element-id] #loading_box{
  width: 100%;
  height: 100%;
  opacity: 1;
  visibility: visible;
}
[data-element-id] #gnav .in{
   width: 40%;
}
[data-element-id] #loading .img{
      position: relative;
          z-index: 0;
}
[data-element-id] .top-con{
      position: relative;
    bottom: 0px;
    left: 0px;
        display: inline-block;
}
[data-element-id] .top-con .bg.tel a{
      border-radius: 15px;
    padding: 0 10px;
    width: 100%;
}
[data-element-id] .top-con .bg.tel a i {
    font-size: 20px;
    margin-right: 10px;
}
[data-element-id] .privacy-poricy{
  height: 100%;
}
[data-element-id] .fead-order > *{
      opacity: 1;
    -webkit-transform: translateY(0);
    transform: translateY(0);
}

[data-element-id] #header .logo-hed {
	display: block;
	padding: 2em 1em 1em;
	border: 2px solid green;
	position: relative;
}

[data-element-id] #header .logo-hed::before {
	content: "タブレット・スマホ用ロゴ";
	width: 100%;
	display: block;
	padding: 0.5em;
	font-size: 10px;
	color: white;
	line-height: 1.2;
	text-align: center;
	background-color: green;
	position: absolute;
	top: 0;
	left: 0;
	z-index: 1;
}

.t-page a p {
  color: #828cf7;
}
[data-element-id].t-page a p {
  color: #000;
}

/* 2024/10/25追記 */
.catalog.ver02 .inner{
  flex-direction: column;
}

.catalog.ver02 .left,
.catalog.ver02 .right{
  width: 100%;
}

.catalog.ver02 .bgleft img {
  filter: brightness(0.2);
  opacity: 1;
}

.h3h.shadow{
  text-align: center;
  color: #fff;
  text-shadow: #ffffff 2px 0 10px;
  font-size: 38px;
}

.list-newproduct li .img{
  margin-bottom: 10px;
}

.list-newproduct li .ttl{
  color: #fff;
  text-align: center;
  text-shadow: #ffffff 2px 0 10px;
  margin-bottom: 10px;
}

.list-newproduct li .txt{
  height: 125px;
  color: #fff;
  text-align: left;
  text-shadow: #ffffff 2px 0 10px;
  font-size: 14px;
  margin-bottom: 10px;
  overflow: hidden;
}

.list-newproduct li .txt div{
  color: #fff;
  text-align: left;
  text-shadow: #ffffff 2px 0 10px;
  font-size: 14px;
}

.list-newproduct li .circle_btn02 {
  color: #fff;
  text-align: center;
  font-size: 14px;
}

.list-newproduct li .circle_btn02 a::before {
    font-style: normal;
    font-family: "Font Awesome 5 Free";
    content: "\f054";
    font-weight: 900;
    color: #666;
    background: #fff;
    border-radius: 50%;
    display: inline-block;
    width: 2em;
    height: 2em;
    margin-right: 0.5em;
    line-height: 2em;
}

.sp-br{
  display: none;
}

@media(max-width:1024px){
.h3h.shadow{
  font-size: 24px;
}    
}

@media(max-width:599px){
.h3h.shadow{
  font-size: 16px;
  padding-left: 0;
}

.sp-br{
  display: block;
}
}

@media screen and (max-width:599px) {
 .home-main .slide ul li:nth-of-type(2) img{
    width: 100%;
    object-position: 0% 50%;
}
}

/* 2025/06/30 */
.catalog_new{
  padding-top: 100px;
}

.catalog.newver02{
  margin-top: 100px;
}

.catalog.ver02.new.newver02 .inner {
  flex-direction: column;
}

.h3h.tal{
  text-align: left;
  display: block;
}

.h3h.tal .mini{
  display: block;
  font-size: 50%;
}

.h3h.black{
  color: #444;
}

.catalog.ver02.new .inner {
  flex-direction: row;
  flex-wrap: wrap;
  position: relative;
  z-index: 1;
}

.catalog.ver02.new .left,
.catalog.ver02.new .right {
  width: 45%;
}

.icon-box{
  background-color: #fff;
  padding: 10px;
}

.icon-box .icon{
  width: 75px;
  height: 75px;
}

.icon-box .ttl{
  font-weight: bold;
}

.icon-box-wrap{
  display: flex;
  justify-content: space-between;
  flex-wrap: wrap;
  gap: 20px;
}

.icon-box-wrap li{
  width: calc((100% - 40px) / 3);
}

.whitebtn{
  margin: 0 auto;
}

.whitebtn a{
  display: block;
  width: 100%;
  height: 100%;
  background-color: #fff;
  border-radius: 5px;
  padding: 0.5em 1em;
}


@media(max-width:599px) {
.catalog.ver02.new .left,
.catalog.ver02.new .right {
  width: 100%;
}   
}