@charset "utf-8";
.tk-source-han-sans-japanese{font-family:"source-han-sans-japanese",sans-serif;}.tk-kinuta-mincho-stdn{font-family:"kinuta-mincho-stdn",sans-serif;}.tk-yu-gothic-pr6n{font-family:"yu-gothic-pr6n",sans-serif;}

#loader_wrap{
  z-index: 9999;
}
body{

font-weight: 400;
font-style: normal;
color: #343434;
letter-spacing: 0.1em;
line-height: 1.6em;

font-size: 14px;
font-family: source-han-sans-japanese, sans-serif;
font-weight: 400;

font-style: normal;
}

html, body {
    /* scroll-behavior: smooth; */
    /* height: 100%; */
    margin: 0px;
    padding: 0px;
}

.serif {
 font-: 'Noto Serif JP', serif;
}

.pc {
 display: block;
}

.sp{
 display: none!important;
}

.bevelgreen {
  background:
    linear-gradient(45deg,  transparent 10px, #4a8362 10px),
    linear-gradient(315deg, transparent 10px, #4a8362 10px),
    linear-gradient(225deg, transparent 10px, #4a8362 10px),
    linear-gradient(135deg, transparent 10px, #4a8362 10px);
  background-position: bottom left, bottom right, top right, top left;
  background-size: 50% 50%;
  background-repeat: no-repeat;
}

.hover{
  transition: 0.2s;
}
.hover:hover{
  opacity: .8;
}
#housei,#tacker,#asktoiawase,#askuchiawase,#asksatei,
#aisatsu,#info,#map,#garelly{
  padding-top: 130px;
  margin-top: -130px;
}

/* ロゴローディング */

/* 画面全体の設定 */
#loader_wrap {
position: fixed;
display: flex;
align-items: center;
justify-content: center;
width: 100vw;
height: 100vh;
top: 0;
background: #fff;
}
/* ローディングアニメーションの設定 */
.loader {
width: 150px;
height: 150px;
background: url("../img/logo.svg") no-repeat;
opacity: 0;
animation: blink 1.5s infinite linear;
}

@keyframes blink {
50% {
opacity: 1;
}
}

/* ローディング終了後 */
.loaded {
opacity: 0;
visibility: hidden;
}

/*

breadcrumb
*/

.topic-path {
 padding: 10px 50px 60px;

}

.topic-path .post-page,
.topic-path .post-root,
.topic-path .archive,
.topic-path .taxonomy,
.topic-path .post {
 display: inline-block;
 padding: 0 0 0 2em;
 position: relative;
 font-size: 12px;
}

.topic-path .post-page::before,
.topic-path .post-root::before,
.topic-path .archive::before,
.topic-path .taxonomy::before,
.topic-path .post::before {
 content: '';
 position: absolute;
 width: .5em;
 height: .5em;
 border: 1px solid #3c3c3c;
 border-style: none solid solid none;
 transform: translateY(-50%) rotate(-45deg) skew(20deg, 20deg);
 top: 50%;
 left: 0;
 z-index: 0;
}

.topic-path .top {
 display: inline-block;
}

.topic-path .top a {
 font-size: 12px !important;
}

.topic-path .top:before {
 display: none;
}

.topic-path a:after {
 content: "";
 display: block;
 width: 100%;
 height: 1px;
 background-color: #e47268;
 margin: 1px auto 0;
}
 .floating {display: none;}
@media screen and (max-width:768px) {
  body{



  font-size: 13px;
}
  .pc {
   display: none;
  }

  .sp{
   display: block!important;
  }
 .topic-path {
  padding: 7px 30px 30px;
  font-size: 80%;
 }
 #biz_sect .topic-path {
  padding: 0px 0px 20px;
  font-size: 80%;
 }

 .floating {
position: fixed;
right: 0px;
left:0px;
bottom: 0px;
display: none;
z-index:10;
width:100%;
height: 75px;
background: #eee;
}

.fl_box{
  display: flex;
  justify-content: center;
}.fl_box .inner{
margin: 10px ;}

}





/*********************
HEADER STYLES
*********************/
.header {
  position: fixed;
  width: 100%;
  padding: 0 0px;
  z-index: 111;

}
.header nav.pc{
  background: rgba(255,255,255,.8);

}
.header_inner{  display: flex;
  justify-content: space-between;
    align-items: center;
  margin-top: 35px;
  margin-bottom: 0px;
  padding: 15px 0;
  }

  .header_inner ul{  display: flex;
    justify-content: flex-end;
    align-items: center;
  }
    .header_inner ul li a{
      padding: 0 10px;
      display: block;
    }

      .header_inner ul li  a span {
        position: relative;
        height: 100%;
    }
  .header_inner ul li a span:before {
        content: "";
        position: absolute;
        bottom: -8px;
        right: 0;
        width: 100%;
        height: 1px;
        background: #000;
        -webkit-transform: scaleX(0);
        transform: scaleX(0);
        opacity: .5;
        -webkit-transition: all .4s cubic-bezier(1,0,0,1);
        transition: all .4s cubic-bezier(1,0,0,1);
        -webkit-transition-timing-function: cubic-bezier(1,0,0,1);
        transition-timing-function: cubic-bezier(1,0,0,1);
    }
    .header_inner ul li a:hover span:before{
      transform: scaleX(1);
    }
  .header_inner ul li a:hover span{
    opacity: .8;
  }

 ul li.raikan a{
          background: #e7e4d6;
            border: 1px solid #e7e4d6;
          padding: 12px 20px ;
          margin-right: 10px;
          transition: .4s;
          border-radius: 5px;
          box-shadow: 0px 2px 2px 1px rgb(0 0 0 / 10%);
        }
         ul li.raikan a i{
           color:#343435;
         }
         ul li.raikan a:hover i{
           color:#333;
         }
 ul li.raikan:hover a{
          background: #fff;
          border: 1px solid #343435;
          padding: 12px 20px ;
          margin-right: 10px;

        }
        .header_inner ul li i{
          margin-right: 5px;
        }
 ul li.soudan a{
   background: #343435;
 padding: 12px 20px;
 color: #fff;
 position: relative;
 z-index: 1;
 transition: .3s;
 border-radius: 5px;
 box-shadow: 0px 2px 2px 1px rgb(0 0 0 / 10%);
 }
ul li.soudan a:before {
  content: "";
  width: 100%;
  height: 100%;
  position: absolute;
  top: 0;
  left: 0;
  z-index: -1;
  background: #ccc;
  transform-origin: 100% 0%;
  transform: scaleX(0);
  transition: transform ease .3s;border-radius: 5px;
}
 ul li.soudan a:hover{
    color: #333;
  }
 ul li.soudan a:hover::before {
  transform-origin: 0% 100%;
  transform: scaleX(1);
}


nav.sp{
  display: flex;
  align-items: center;
  justify-content: space-between;
}

header h1{
  font-size: 12px;
  padding-top: 3px;
  color: #333333;
  /* font-weight: bold; */
  /* text-align: center; */
  /* margin-bottom: 0px; */
}
/* 2021..3.01　追加 */
.header_logo_link {
  /* display: block; */
  /* width: 290px; */
  /* padding: 1% 32.14% 0; */
  }
.header_logo_link img{
  width: 100px;
}
/*------------------------------

  ここから下がハンバーガーメニュー
  に関するCSS

------------------------------*/

/* チェックボックスは非表示に */
.drawer-hidden {
  display: none;
}

/* ハンバーガーアイコンの設置スペース */
.drawer-open {
  display: flex;
  height: 60px;
  width: 60px;
  justify-content: center;
  align-items: center;
  position: relative;
  z-index: 100;/* 重なり順を一番上に */
  cursor: pointer;
}

/* ハンバーガーメニューのアイコン */
.drawer-open span,
.drawer-open span:before,
.drawer-open span:after {
  content: '';
  display: block;
  height: 3px;
  width: 25px;
  border-radius: 3px;
  background: #333;
  transition: 0.5s;
  position: absolute;
}

/* 三本線のうち一番上の棒の位置調整 */
.drawer-open span:before {
  bottom: 8px;
}

/* 三本線のうち一番下の棒の位置調整 */
.drawer-open span:after {
  top: 8px;
}

/* アイコンがクリックされたら真ん中の線を透明にする */
#drawer-check:checked ~ .drawer-open span {
  background: rgba(255, 255, 255, 0);
}

/* アイコンがクリックされたらアイコンが×印になように上下の線を回転 */
#drawer-check:checked ~ .drawer-open span::before {
  bottom: 0;
  transform: rotate(45deg);
}

#drawer-check:checked ~ .drawer-open span::after {
  top: 0;
  transform: rotate(-45deg);
}

/* メニューのデザイン*/
.drawer-content {
  width: 80%;
  height: 100%;
  position: fixed;
  top: 0;
  left: 100%;/* メニューを画面の外に飛ばす */
  z-index: 99;
  background: #fff;
  transition: .5s;
}

/* アイコンがクリックされたらメニューを表示 */
#drawer-check:checked ~ .drawer-content {
  left: 20%;/* メニューを画面に入れる */
}
/* ===================
 side-sp-menu
=================== */
.js-offcanvas h3{
  margin: 5% auto 5%;
      max-width: 270px;
  }
.js-offcanvas h3 + ul li{
width: 100%;
font-weight: bold;
}
.js-offcanvas h3 + ul li a{
  display: block;
  padding: 15px 10px;
  color: #333333;
  }
.js-offcanvas ul + p {
padding: 5px 5% 20px;
}
.js-offcanvas ul.cf li{
display: inline-block;
width: 28px;
padding: 0 0 20px 0;
margin: 0 5px;
}
.js-fixed-header{
  height: 0;
}
.js-offcanvas ul.cf li img{
  max-height: 28px;
}
.js-fixed-header{
position: relative;

height: 70px;
z-index: 50;
/* box-shadow:0 -10px 10px 10px rgba(0,0,0,0.6); */

}
.navbar-toggle {
/* float: left;
margin-left: 10px; */
}
.js-offcanvas-btn{
text-indent: -999px;
width: 40px;
text-align: left;
background-color: transparent;
border: none;
cursor: pointer;
outline: none;
padding: 20px 0 20px 5px;
appearance: none;
}
.js-fixed-header h1{
height: auto;
padding: 0;


}
.js-fixed-header h1 img{
  height: 35px;
  width: auto;
  padding-top: 0;
  margin-top: 10px;
}

.off{
padding: 50px 40px 0;
text-align: left;
}
.off li{
  width: 100%;
}
.off li a {
width: 100%;
display: inline-block;
padding: 20px 10px 0px;
font-size: 0.8rem;
}
.off li a.text {font-size: 1rem;
padding: 30px 0 30px 10px;
border-bottom: solid 1px #212121;
box-sizing: border-box;
}
.off li a.text i{
  margin-right: 10px;
}
.off li a.btn {
background-color: #e7e4d6;
color: #333;
border: solid 1px #e7e4d6;
width: 100%;
padding: 15px;
display: block;
text-align: center;
transition: .4s all;
-webkit-backface-visibility: hidden;
backface-visibility: hidden;
position: relative;
box-sizing: border-box;
}
.off li a.btn:hover {
opacity: .8;
}
.off li a.btn svg{
  fill: #fff;
vertical-align: middle;
width: 20px;
}
.off li a.btn svg.arrow {
position: absolute;
right: 20px;
}
@media only screen and (max-width: 768px) {
ul li.raikan a
{
  margin-right: 0;
}
  .header_logo_link img {
    width: 80px;
}
  #feas-searchform-0{
    display: block;
  }
  .off {
    padding: 30px 20px 0;
    text-align: left;
}

.off li a.text {
  font-size: 14px;
padding: 13px 0 13px 10px;
border-bottom: solid 1px #999;
box-sizing: border-box;
}
#feas-searchform-0 article{
  margin-bottom: 0;
}
.js-fixed-header {
 position: fixed;
  }
nav.sp{
  display: flex!important;
  background: rgba(255,255,255,0.6);

}
.sp_logo{
  padding: 20px;
      margin-top: 5px;
  }

  .js-offcanvas-btn {
    text-indent: -999px;
    width: 55px;
    margin-right: 10px;
    text-align: center;
    background-color: #fff;
    border: 1px solid #999;
    cursor: pointer;
    outline: none;
    padding: 20px 0 20px 13px;
    appearance: none;
    border-radius: 3px;
  }
  .off li a.btn {
  padding: 12px;}
  .off li a {
      width: 100%;
      display: inline-block;
      padding: 12px 10px 0px;
  }
  .js-hiraku-offcanvas-btn-active{
    padding: 18px  0 20px 15px;
    margin-right: 10px;
position: relative;
  }
.off .footer-sns li a {
  padding: 10px 12px 12px;}
}

/* 画面全体の設定 */
#loader_wrap {
position: fixed;
display: flex;
align-items: center;
justify-content: center;
width: 100vw;
height: 100vh;
top: 0;
background: #fff;
}
/* ローディングアニメーションの設定 */
.loader {
width: 130px;

background: url("../img/logo.svg") no-repeat;
opacity: 0;
background-size: contain;
animation: blink 1.5s infinite linear;
}

@keyframes blink {
50% {
opacity: 1;
}
}

/* ローディング終了後 */
.loaded {
opacity: 0;
visibility: hidden;
}



#container {
  min-height: calc(100vh - 250px);

}


footer {
  border-top: 1px solid #ccc;
 width: 100%;
 margin: 0px;
 padding: 0px;
 position: relative;

}
footer .nest{
  position: relative;
}

.copyright { padding-top: 10px;
 padding-bottom: 10px;
 font-size: 12px;
text-align: center;
}

#f_box01 {
  padding-top: 50px;
  padding-bottom: 15px;
  text-align: center;
}


#f_logo {
  flex-basis: 25%;
 margin-bottom: 20px;
}
#f_logo img{
  max-width: 115px;
}
.footer-tel {
    width: 255px;
    position: absolute;
    right: 0;
    top:75px; font-family: ;
}
.footer-tel .tel span {
    color: #222;
    font-size: 20px;

    line-height: 1.4;
}
.footer-tel .tel span:before {
    color: #e1a7a9;
    font-size: 70%;
    margin-right: 5px;
}
.footer-tel .tel i{
  margin-right: 5px;
  font-size: 16px;
}


.f_banner{
padding: 20px 0 ;
}
.f_banner ul
{
  display: flex;
  justify-content: space-between;
  flex-wrap: nowrap;
}
.f_banner ul li{
  flex-basis: 30%;
}
.f_banner ul li a{
  display: block;
}
.f_banner ul li a i{
  margin-right: 5px;
}
.f_link{
}
.f_link ul{
  display: flex;
  flex-wrap: wrap;

  justify-content: flex-start;
}
.f_link ul li {
  flex-basis: 25%;
  text-align: left;
}
.f_link ul li a{

  padding: 0 20px 15px;
  display: block;
}
.f_link ul li a i{
  color: #343435;
  margin-right: 10px;
  height: 3px;
}
.f_link .footer_btn{
  border: 1px solid #343435;
  border-radius: 30px;
  display: table;
  padding: 10px 30px;
  display: inline-flex;
  justify-content: center;
  align-items: center;
  padding: 1em 2em;
  transition: .4s;
}
.f_link .footer_btn::before {
content: '';
width: 5px;
height: 5px;
border-top: 1px solid #333;
border-right: 1px solid #333;
transform: rotate(
45deg);
margin-right: 20px;
}

.f_link .footer_btn:hover {
color: #333333;
text-decoration: none;
background-color: #feded3;
}
.footer-sns {
    margin-bottom: 40px;
    display: -ms-flexbox;
    display: flex;
    -ms-flex-pack: center;
    justify-content: center;
}

.footer-sns>li {
    width: 37px;
    height: 37px;
    margin: 0 5px;
    display: -ms-flexbox;
    display: flex;
}

.footer-sns>li a {box-shadow: 0px 2px 2px 1px rgb(0 0 0 / 10%);

    width: 100%;
    height: 100%;
    background: #343435;
    border-radius: 100px;
    color: #FFF;
    font-size: 14px;
    line-height: 1;
    display: -ms-flexbox;
    display: flex;
    -ms-flex-align: center;
    align-items: center;
    -ms-flex-pack: center;
    justify-content: center;
    transition: .2s;
}
.footer-sns>li a:hover {
color: #999;
background: #feded3;
}
.footer-sns>li a span:before {
    margin: 0;
}
.footer-sns>li a span{

}
[class^=icon-]:before, [class*=" icon-"]:before {

 }

.icon-insta,.icon-tw,.icon-youtube {
  text-align: center;
font-size:18px;
}
.footer-sns i{
  margin-left: 3px;
}
.topTtl{
  text-align: center;
}
.topTtl h2{

  margin:0 auto 45px;
      font-size: 32px;
      display: inline-block;
      position: relative;
      line-height: 1.2em;
  }
  .topTtl h2 span{
    display: block;
    font-size: 65%;
  }
  /* .topTtl h2:before{
    position: absolute;
      bottom: -45px;
      left: 50%;
      transform: translateX(-50%);
      width: 240px;
      height: 35px;
      content: '';
      background: url(../img/ttl.svg) no-repeat;
      border-radius: 5px;
      opacity: 0.7;
  } */
  .footersvg{
    width: 300px;
      margin: 0px auto;
      opacity: .8;
  }

@media only screen and (max-width: 768px) {
  #f_box01 {
    padding-top: 30px;
    padding-bottom: 0;
}
footer{
  padding-bottom: 75px;
}
.fl_box {
align-items:center;
}
.fl_box .inner{
  min-width: 140px;
min-height: 52px;
margin-top: 13px;
  padding: 10px 25px;
  border-radius: 5px;
}
.fl_box .inner a{
  transition: .2s;
  color: #ffffff;
}
.fl_box .inner a {
  line-height: 1.2em;
}
.fl_box .inner a span{line-height: 1em;
  display: block;
  font-size: 11px;

}
.fl_box .inner a:hover{
  opacity: .8;
}
.fl_box .inner i{
  font-size: 120%;
  margin-right: 5px;
}
.contact-btn {padding: 15px 25px!important;
  background-color: #ff8b64;
  color: #fff;
  text-align: center;
}

.phone-btn {
  background: #54af30;
  color: #fff;
  text-align: center;
}

.footer-sns {
    margin-bottom: 5px;
}
.f_banner ul {
    display: block;
  }
  .f_banner ul li{
    margin-bottom: 15px;
  }
  .f_link ul li {
    flex-basis: 50%;
    text-align: left;
}
  .footer-tel {
    width: 255px;
    position: relative;
    right: auto;
    top: 0;
    margin: auto;
     font-family: ;
    text-align: center;
}
}
/**************MV**************/
#mv {
    position: relative;
    margin-bottom: 0px;
    height: 800px;
    background-size: cover;
    background-position: center;
}
#mv .mvbox img{
  height: 800px;
  width: 100%;
  object-fit: cover;
}
.mv_inner{
  position: absolute;
  top: 55%;
  left: 10%;
  transform: translateY(-50%);
}
.mv_inner img{
opacity: .8;
}

#main{

}
.nest{
  width: 1200px;
  margin: 0 auto;
}

a.scrollpagetop {
 background-attachment: scroll;
 background-image: url("../img/page_up.png");
 background-position: 0 0;
 background-repeat: no-repeat;
 display: block;
 height: 0;
 overflow: hidden;
 padding-top: 50px;
 width: 50px;
}


.center {
 margin: 0 auto;
 text-align: center;
}

/*ボタン*/

.btn {
 background: #da482d;
 background-size: contain;
 width: 260px;
 /* height: 50px; */
 display: block;
 box-sizing: border-box;
 padding: 14px 0 15px;
 transition: .4s;
 text-decoration: none;
 color: #ffffff;
}

.btn span {
 background: url(../img/ico01.png) no-repeat left center;
 padding-left: 20px;
}

.btn:hover {
 opacity: .7;
}
#topcontrol{
  z-index: 1;
}
@media screen and (max-width:768px) {

  #main{
    padding-top: 70px;
    margin-top: -70px;
  }
.nest{
  width: 90%;
  margin: 0 auto;
}

#mv {
position: relative;
    height: 65vh;

}
#mv .mvbox img{
object-position: 60% center;
    height: 65vh;
  object-fit: cover;
}

#mv a {
  padding-top: 50px;
    position: absolute;
    bottom:0px;
    left: 50%;
    z-index: 2;
    display: inline-block;
    -webkit-transform: translate(-50%, -30%);
    transform: translate(-50%, -30%);
    text-decoration: none;
  }

#mv a span {
  position: absolute;
  top: 0;
  left: 50%;
  width: 46px;
  height: 46px;
  margin-left: -23px;
  border: 1px solid #333;
  border-radius: 100%;
  box-sizing: border-box;
}
#mv a span::after {
  position: absolute;
  top: 50%;
  left: 50%;
  content: '';
  width: 16px;
  height: 16px;
  margin: -12px 0 0 -8px;
  border-left: 1px solid #333;
  border-bottom: 1px solid #333;
  -webkit-transform: rotate(-45deg);
  transform: rotate(-45deg);
  box-sizing: border-box;
}
#mv a span::before {
  position: absolute;
  top: 0;
  left: 0;
  z-index: -1;
  content: '';
  width: 44px;
  height: 44px;
  box-shadow: 0 0 0 0 rgba(255,255,255,.1);
  border-radius: 100%;
  opacity: 0;
  -webkit-animation: sdb 3s infinite;
  animation: sdb 3s infinite;
  box-sizing: border-box;
}
@-webkit-keyframes sdb {
  0% {
    opacity: 0;
  }
  30% {
    opacity: 1;
  }
  60% {
    box-shadow: 0 0 0 60px rgba(255,255,255,.1);
    opacity: 0;
  }
  100% {
    opacity: 0;
  }
}
@keyframes sdb {
  0% {
    opacity: 0;
  }
  30% {
    opacity: 1;
  }
  60% {
    box-shadow: 0 0 0 60px rgba(255,255,255,.1);
    opacity: 0;
  }
  100% {
    opacity: 0;
  }
}

.topTtl h2 {
    margin: 0 auto 30px;
    font-size: 22px;
    display: inline-block;
    position: relative;
    line-height: 1.2em;
}

.topTtl h2:before {
  bottom: -35px;
    width: 180px;
    height: 30px;
}

}

/*---------------------------------------------------------------------------

TOP

---------------------------------------------------------------------------*/

/*----news----*/

#top_news {

 padding:80px 0 20px;

}
#top_news .boxbox{

}
#top_news  .boxz {

    margin: 0 10px 40px;
    transition: 0.2s;
}
#top_news .boxz a {
    display: block;
    transition: 0.3s;
}
#top_news .trec_box {
    background: #ffffff;

}
.trec_photo {
    overflow: hidden;
    width: 100%;
    height:auto;
    position: relative;
}
.trec_photo img {
    object-fit: cover;
    height: 100%;
    width: 100%;
    transition: 0.8s;
}

.trec_text {

    text-align: left;
    padding: 15px 10px 20px;
    transition: .4s;
}


#top_selection{
  height: 450px;
  padding: 100px 0;
  background: url(../img/top_s_bg.jpg)no-repeat;
  background-size: cover;
  background-position: center;
  text-align: center;
 }
 #top_selection h3{
   font-size: 24px;
   margin-bottom: 30px;
 }
  #top_selection p{
    font-size: 14px;
        line-height: 1.8em;
    }
    .comingsoon{
      background: #999;
      color: #ffffff;
      border-radius: 30px;
      padding: 15px 30px 15px 30px!important;
      line-height: 1.4em!important;
      font-size: 16px;
      margin: 20px auto;
      /* white-space: nowrap; */
      display: table;
      justify-content: center;
      align-items: center;
      padding: 1em 0em;
      transition: .4s;
  }
  a.btn{
    background: #48453d;
    color: #ffffff;
    border-radius: 30px;
    padding: 15px 30px 15px 60px;
    font-size: 16px;
    margin: 20px auto;
    /* white-space: nowrap; */
    display: flex;
    justify-content: center;
    align-items: center;
    padding: 1em 0em;
    transition: .4s;
}
  a.btn::before {
content: '';
width: 5px;
height: 5px;
border-top: 2px solid #fff;
border-right:2px solid #fff;
transform: rotate(
45deg);
margin-right: 20px;
}
.js-offcanvas  a.btn::before {
content: none;

}

#top_selection a.btn::before {
    content: '';
    width: 5px;
    height: 5px;
    border-top: 2px solid #333;
    border-right: 2px solid #333;
    transform: rotate(
45deg);
    margin-right: 20px;
}
a.btn.reverse::before {
content: '';
width: 5px;
height: 5px;
border-top: 2px solid #fff;
border-right:2px solid #fff;
transform: rotate(
225deg);
margin-right: 20px;
}

  /* a.btn:before{
    position: absolute;
  font-: "Font Awesome 5 Free";
  content: '\f054';
  font-size: 14px;
  font-weight: 600;
  /* margin-right: 4px; */
  /* color: #fff; */
  /* width: 10px; */
  /* height: 10px; */
  /* left: 25px;
  } */

    #top_selection a.btn{
      background: #ffffff;
      color:#333333;
    }

    #top_plan{ padding: 80px 0;

    }


    .tp_box,  .tp_box2{
      display: flex;
      flex-wrap: wrap;
    }
    .tp_box a,  .tp_box2 a{width: 100%;
      position: relative;overflow: hidden;

    }.tp_box a .inner,.tp_box2 a .inner{
      height: 100%;
      width: 100%;
      display: block;
    }
    .tp_box a,  .tp_box2  a{
            display: block;
    }
    .tp_box a:hover:after,.tp_box2 a:hover:after{
      transform: scale(1.1);
      opacity: .8;
    }
        .tp_box a:after,.tp_box2 a:after{
          transition: 0.5s;
          position: absolute;
content: "";
display: block;
width: 100%;
height: 100%;
top: 0;      background-size: cover!important;
        }
    .tp_box a:first-child:after{

      background: url(../img/tp_00.jpg)no-repeat;
    background-position: center;

    }
    .tp_box a:nth-child(2):after{
      background: url(../img/tp_01.jpg)no-repeat;
    }
    .tp_box a:nth-child(3):after{
      background: url(../img/tp_02.jpg)no-repeat;
    }
    .tp_box a:nth-child(4):after{    background-position: center;
      background: url(../img/tp_03.jpg)no-repeat;
    }
    .tp_box2 a:first-child:after{
      background: url(../img/tp_04.jpg)no-repeat;
    }
    .tp_box2 a:nth-child(2):after{
      background: url(../img/tp_05.jpg)no-repeat;
    }
    .tp_box2 a:nth-child(3):after{
      background: url(../img/tp_06.jpg)no-repeat;
    }
    .tp_box2 a:nth-child(4):after{
      background: url(../img/tp_07.jpg)no-repeat;
    }
        /* .tp_box li:first-child{
            height: 500px;      flex-basis: 100%;
        } */
      .tp_box a:first-child,.tp_box a:nth-child(2),.tp_box a:nth-child(3),.tp_box a:nth-child(4){
      height: 330px;
flex-basis: 50%;
        }
        .tp_box2 a{
          height: 250px;
    flex-basis: 25%;
    margin-top: 50px;
            }
            .tp_box a .tp_text,.tp_box2 a .tp_text{z-index: 1;
              position: absolute;
              bottom: 0;
              background: rgba(255,255,255,0.8);
              text-align: center;
              height: 70px;width: 100%;
              font-size: 24px;

            }

            .tp_box a .tp_text img,  .tp_box2 a .tp_text img{
              max-height: 40px;
            }
              .tp_box a .tp_text p,.tp_box2 a .tp_text p{
                padding-top: 23px;
}
.tp_box a .tp_text.imgs p{
  /* padding-top: 5px!important;
  display: flex;
  align-items: center;
  justify-content: center; */

}
.tp_box a .tp_text.imgs p img ,.tp_box2 a .tp_text.imgs p img{
  margin-right: 5px;
}
                .tp_box2 a .tp_text{
                    height: 50px;width: 100%;
                    font-size: 17px;
                }
                    .tp_box2 a .tp_text p{
                      padding-top: 13px;
                    }
                .tp_box a .tp_text  span{
                  border: 1px solid #000;
  padding: 10px 5px;
  font-size: 24px;
  letter-spacing: 0em;
  margin-right: 10px;
}
.tp_box2 a .tp_text span{
  font-size: 16px;
  padding: 8px 5px;
}


#top_column
{padding: 30px 0;
background: #f4f8fc;}
#top_column .inner{
  background: #fff;
  padding: 20px 0;
}
#top_column h2{ font-family: ;
  display: table;
      justify-content: center;
      font-size: 24px;
      text-align: center;
      color: #333;
      margin: auto;
      padding-bottom: 15px;
      /* border-bottom: 1px solid #343435; */
  }
#top_column h2 img{
  margin: 0 8px;
  height: 24px;
}
#top_column ul{

}
#top_column ul li a{

}
#top_column ul li a dl{
  display: flex;
  justify-content: flex-start;
  align-items: center;
}
#top_column ul li a dl dt{    flex-basis: 18%;
    margin-right: 2%;
}
#top_column ul li a dl dd.first{
     flex-basis: 32%;
    margin-right: 2%;
}
#top_column ul li a dl dt  img{
height: 100%;
width: auto;
object-fit: cover;
}
#top_access
{padding: 80px 0;
background:url(../img/ta_bg.jpg);
background-size: cover;
background-position: top;}

#top_access .nest{
  padding: 30px;
  background: #ffffff;
}
.ta_inner{
  padding: 20px;

}
#top_access .nest h3{ font-family: ;
  text-align: center;
  font-size: 24px;
  margin-bottom: 20px;
}
#top_access .nest img{
  width: 100%;
}
#top_access .nest .two_box .inner:last-child{
  padding-left: 0;
}
#top_link{
  padding: 30px 0;
  background:#fff);

}
#top_link .nest{
  display: flex;
  justify-content: space-around;
}
#top_link .nest a{

  border-radius: 50%;
  transition: .2s;
  box-shadow: 5px 5px 5px 3px rgb(0 0 0 / 2%);
}
#top_link .nest a img{
  width: 80%;
}
#top_link .nest a:hover{
  opacity: .8;
}


/* よくある質問 */

.faq h3{
  text-align: center;
  margin: 30px auto;
  font-size: 24px; font-family: ;
}
.qa-list {
  margin-bottom: 60px;
}
.qa-list dl {
    position: relative;
    margin: 0;
    padding: 28px 80px 28px 30px;
    cursor: pointer;
    border-bottom: 1px dashed #ccc;


}
.qa-list dl:first-child {

}
.qa-list dl::before {
    position: absolute;
    top: 35px;
    right: 35px;
    display: block;
    width: 7px;
    height: 7px;
    margin: auto;
    content: '';
    transform: rotate(135deg);
    border-top: 2px solid #000;
    border-right: 2px solid #000;
}
.qa-list .open::before {
    transform: rotate(-45deg);
}
.qa-list dl dt {
    position: relative;
    margin: 0;
    padding: 0 0 0 50px;
    font-weight: bold;
    font-size: 20px; font-family: ;
}
.qa-list dl dt::before {
    font-size: 22px;
    line-height: 1;
    position: absolute;
    top: 3px;
    left: 0;
    display: block;
    content: 'Q.';
    color: #3285bf;
}
.qa-list dl dd::before {
  font-size: 22px;
line-height: 1;
position: absolute;
top: 3px;
left: 35px;
display: block;
content: 'A.';
font-weight: bold;
color: #343435;
}
.qa-list dl dd {
  position: relative;
    display: none;
    height: auto;
    margin: 30px 0 0;
    padding: 0 0 0 80px;
}
.qa-list dl dd p {
    margin: 30px 0 0;
}
.qa-list dl dd p:first-child{
    margin-top: 0;
}

@media screen and (max-width: 767px) {
  .tp_box a:nth-child(4):after{    background-position: center;

  }
  a.btn {

    padding: 13px 0px 13px 0px;
    font-size: 14px;
    margin: 20px auto;
    /* white-space: nowrap; */
    display: flex;
    justify-content: center;
    align-items: center;
    transition: .4s;
}

  #top_news {
    padding: 30px 0 20px;
}
#top_news .boxz {
    margin: 0 10px 0px;
    transition: 0.2s;
}

#top_selection {
    height: auto;
    padding: 40px 0 20px;
    background-position: -160px center;
  }
#top_selection p{

}
#top_plan {
    padding: 30px 0;
}
.tp_box{
    display: block;
    flex-wrap: wrap;
}
.tp_box2 a {
    height: 200px;
    flex-basis: 50%;
    margin-top: 0px;
}

.tp_box a:first-child, .tp_box a:nth-child(2), .tp_box a:nth-child(3), .tp_box a:nth-child(4) {
    height: 250px;
    flex-basis: 50%;
}

.tp_box a .tp_text {

    height: 50px;

    font-size: 20px;
}
.tp_box2 a .tp_text {
    height: 50px;
    width: 100%;
    font-size: 13px;
    line-height: 1.4em;
}
.tp_box2 a .tp_text small{

    font-size: 12px;
}
.tp_box2 a .tp_text p{
  padding-top: 8px;

}
.tp_box2 a:nth-child(3) .tp_text p,.tp_box2 a:nth-child(4) .tp_text p{
  padding-top: 16px;

}
.tp_box a .tp_text p {
    padding-top: 15px;
}


#top_access {

padding: 30px 0;
}
#top_access .two_box .inner:first-child
{
  margin-bottom: 50px;
}
.ta_inner {
    padding: 0px;
}
#top_access .nest h3 {

    font-size: 20px;
    margin-bottom: 15px;
}
#top_access .nest {
    padding: 25px 20px 20px;
    background: #ffffff;
}
#top_link .nest {
    display: block;
    text-align: center;
    justify-content: space-around;
}
#top_link {

}
#top_link .nest a {
    display: block;
    margin-bottom: 20px;
}
#top_link .nest a:last-child{
  margin-bottom: 0;
}
.qa-list dl {
    position: relative;
    padding: 15px 40px 15px 10px;
}
.qa-list dl::before {
    top: 20px;
    right: 20px;
    width: 7px;
    height: 7px;
}
.qa-list dl dt {
    padding: 0 0 0 30px;
    font-size: 14px;
}
.qa-list dl dt::before {
    font-size: 14px;
    top: 3px;
    left: 5px;
    content: 'Q.';
}
.qa-list dl dd::before {
    font-size: 14px;
    top: 5px;
    left: 5px;
    content: 'A.';
}
.qa-list dl dd {
    margin: 10px 0 0;
    padding: 0 0 0 30px;
    font-size: 14px;
}
.qa-list dl dd p {
    margin: 30px 0 0;
}
.qa-list dl dd p:first-child{
    margin-top: 0;
}
}



/*---------------------------------------------------------------------------

SUBPAGE

---------------------------------------------------------------------------*/


.ud {
  background-size: cover;
 height: 650px;
 background-position: top center;
 margin-top: 0px;
 z-index: -1;
 width: 100%;
 margin: 0 auto;
 background-repeat: no-repeat;
 position: relative;
}

.ud_cach {
  text-align: center;
  position: absolute;
  left: 50%;
  top: 55%;
  transform: translateX(-50%) translateY(-50%);
  -webkit- transform: translateX(-50%) translateY(-50%);
}

.ud_cach h1,
.ud_cach p,
.ud_cach>div {

margin-bottom: 30px;

 letter-spacing: 0.1em;
 opacity: 1;
  font-family: ;
 margin:0 auto 15px;
     font-size: 32px;
     display: inline-block;
     position: relative;
     line-height: 1.2em;
   }
.ud_cach h1    span,
.ud_cach p    span,
.ud_cach>div   span {
       display: block;
       font-size: 65%;
   }
.ud_cach h1:before
,.ud_cach>div:before {
    /* position: absolute;
    bottom: -45px;
    left: 50%;
    transform: translateX(-50%);
    width: 240px;
    height: 35px;
    content: '';
    background: url(../img/ttl.svg) no-repeat;
    border-radius: 5px;
    opacity: 0.7; */
}


/* .ud_cach p{
  font-size: 16px;
  line-height: 2em;

} */


#ud_sect{

}
#ud_sect h3.ttl{
  margin-top: 100px;

}
/* pagenav */

.wp-pagenavi{text-align:center;padding-bottom:30px;padding-top:30px;width:100%
  }.wp-pagenavi>a,.wp-pagenavi>span{vertical-align:middle;display:inline-block;padding:0 11px;margin-right:5px;line-height:32px;background:#fff;color:#ff8b64;
    border-radius:2px;font-size:.9rem;
    border:1px solid #eee;
    text-decoration:none;
  }



.wp-pagenavi span.current ,.wp-pagenavi span.pages{
 color: #fff;
 background-color: #ff8b64;
      border:1px solid #eee;
}
.wp-pagenavi>a:active{

}
.wp-pagenavi>a:hover{
   background-color: #feded3;
       border:1px solid #eee;
}

.pagebox{
  text-align: center;
}
.pagenav {
 margin: 0 auto 0px;
 text-align: center;
 font-size: 0;
}

.pagenav ul {

 display: inline-block;
 vertical-align: middle;


}

.pagenav ul li {
 display: inline-block;
 border: 1px solid #e0e0e0;
 margin-left: -1px;
}

.pagenav ul li a {
  background: #ffffff;

 padding: 17px 22px;
 font-size: 13px;


 -webkit-transition: color .3s, background-color .3s;
 transition: color .3s, background-color .3s;
}

.pagenav ul li a:hover {
 color: #fff;
 background-color: #ff8b64;
}



p.ttl_text{
  text-align: center;
  margin-bottom: 60px;
}


.two_box {
 display: flex;
 justify-content: space-between;
}

.two_box .inner {
 text-align: left;
 flex-basis:48%;
}


.two_box .inner:last-child {
 padding-left: 4%;
}

.two_box .inner p {
 margin-bottom: 0px;
 line-height: 160%;
}
.two_block{  flex-wrap: wrap;
  display: flex;
  justify-content: space-between;
  margin-bottom: 60px;
}

.two_block.versa{
  flex-direction: row-reverse;
}
.two_block li{
  flex-basis: 46%;
}

.two_block li.first{
  flex-basis: 50%;
}
.two_block li h3{ font-family: ;
  font-size: 28px;
  color: #333;
  /* padding-bottom: 10px;
  border-bottom: 6px double #999; */
  margin-bottom: 25px;
  display: table;
}
.two_block li img{
  height: 100%;
  object-fit:cover;
  width: 100%;

}
.two_block li h4{ font-family: ;
  font-size: 24px;
  line-height: 1.4em;
  margin-bottom: 20px;
}

.two_block li p{
line-height: 2em;
}
.two_block a.btn{
  margin-left: 0;

}
.ud_about .two_block li:first-child,.plan .two_block li:first-child{
  height: 450px;

}
.plan .two_block .price{
  text-align: left;
}
.clothttl{
  text-align: center;
  margin-bottom: 60px;
}
.clothttl h3{
  font-size: 24px;
  margin-bottom: 30px;
  line-height: 2em;
}
.clothbox{  flex-wrap: wrap;
  display: flex;
  justify-content: space-between; 
  /* justify-content: flex-start;*/
  align-items: flex-start;
  margin-bottom: 100px;
 gap:2.5%;
}
.clothbox li{
  flex-basis: 23%;
  margin-bottom: 30px;
}
.clothbox li img{width: 100%;
height: 300px;
/* object-fit: cover;*/}
.clothbox li p{
text-align: center;font-size: 16px;}

.camera_block{  flex-wrap: wrap;
  display: flex;
  justify-content: space-between;
  margin-bottom: 150px;
}

.camera_block.versa{
  flex-direction: row-reverse;
}
.camera_block li{
  flex-basis: 30%;
  text-align: center;
}

.camera_block li.first{
  flex-basis: 65%;
}
.camera_block li h3{ font-family: ;
  font-size: 28px;
  color: #333;
  /* padding-bottom: 10px;
  border-bottom: 6px double #999; */
  margin-bottom: 25px;
  display: table;
  margin: 0 auto 20px;
}
.camera_block li.first img.fstimg{
height: 400px;
  width: 100%;
  object-fit: cover;

}
.camera_block li.first>.inner{
  display: flex;
  justify-content: space-between;
}
.camera_block li.first>.inner div{
  flex-basis: 32.8%;
}
.camera_block li.first>.inner div img{
  height: 180px;
  object-fit: cover;
  width: 100%;
}

.camera_block>li a {box-shadow: 0px 2px 2px 1px rgb(0 0 0 / 10%);

    width: 40px;
    height: 40px;
    background: #343435;
    border-radius: 100px;
    margin: 10px auto 10px;
    color: #FFF;
    font-size: 14px;
    line-height: 1;
    display: -ms-flexbox;
    display: flex;
    -ms-flex-align: center;
    align-items: center;
    -ms-flex-pack: center;
    justify-content: center;
    transition: .2s;
}
.camera_block>li a:hover {
color: #999;
background: #feded3;
}
.camera_block li img.cameraman{
max-width: 180px;
margin-bottom: 20px;
}
.camera_block li h5{ font-family: ;
  font-size: 18px;
  line-height: 1.4em;
  margin-bottom: 20px;
}

.camera_block li p{
line-height: 1.8em;
text-align: left;
}
.two_block a.btn{
  margin-left: 0;

}


ul.three_box,ul.sixbox{
  display: flex;
  justify-content: flex-start;
  margin-bottom: 60px;
  flex-wrap: wrap;
}
ul.sixbox{
  justify-content: space-between;
}
ul.sixbox li{
  flex-basis: 16.5%;
}
ul.three_box li{
  flex-basis: 33.32%;
margin-right: 0.01%;
}
.holiday{
  margin-bottom: 60px;
}
.holiday h4 {
    color: #343435;
    font-size: 20px;
    padding: 15px 0 5px;
    text-align: center;
}
h3.ttl{
  font-size: 28px;
  color: #333333;
  /* padding-bottom: 10px;
  border-bottom: 6px double #fd8a62; */
  margin-bottom: 15px;
  display: table;margin: 30px auto;
   font-family: ;
   font-weight: bold;
}
ul.three_box img{
  width: 100%;
  height: 330px;
  object-fit: cover;
}
ul.three_box h3{
font-weight: bold;
  font-size: 20px;
  padding: 15px;
  text-align: center;    margin-top: -6px;
}
ul.three_box h4{
  color: #343435;
  font-size: 20px;
  padding: 15px 0 5px;
  text-align: center;
}
ul.three_box li .inner{
  padding: 0 20px;
}

ul.two_btn{
  display: flex;
  justify-content: space-between;
  margin-bottom: 60px;
}
ul.two_btn li{
  flex-basis: 48%;
}
ul.two_btn li a{
  font-size: 16px;
  border: 1px solid #333333;
  padding: 15px ;
  text-align: center;
  display: block;

  display: flex;
  justify-content: center;
  align-items: center;
  padding: 1em 2em;
  transition: .4s;
}
ul.two_btn li a::before {
  content: '';
  width: 5px;
  height: 5px;
  border-top: 1px solid #333;
  border-right: 1px solid #333;
  transform: rotate(
45deg);
  margin-right: 20px;
}

ul.two_btn li a:hover {
  color: #333333;
  text-decoration: none;
  background-color: #feded3;
}

ul.two_btn li a:hover::after {
  border-top: 3px solid #333333;
  border-right: 3px solid #333333;
}
 .price{
 font-family: ;
  margin: 20px auto;
  text-align: center;
}
 .price.left{
     text-align: left;
 }
 .price.flex{
   display: flex;
   align-items: baseline;
 }
 .price b{
  font-weight: normal;
  background: linear-gradient(180deg, #fff 0%, #fff 50%, #feded3 50%, #feded3 100%);
width: 100%;
font-size: 40px;
display: inline;

}
 .price.flex b
 {
   width: auto;
    margin-right: 15px;

 }
 .price b span{
  font-size: 30px;
}
 .price small{    margin-top: 10px;
  display: block;
  font-size: 14px;
}
.two_plan{
  flex-wrap: wrap;
  display: flex;
  justify-content: space-between;
}
.two_plan li{
  flex-basis: 48%;
  margin-bottom: 60px;
}
.two_plan li img{
  width: 100%;
  height: 350px;
  object-fit: cover;
}
.two_plan li h3{ font-family: ;
  font-size: 28px;
  color: #333;
  /* padding-bottom: 10px;
  border-bottom: 6px double #999; */
  margin: 15px auto 25px;
  display: table;
  text-align: center;
}
.two_plan  .price{
  margin: 20px auto;justify-content: center;

}
.two_plan  p{
  line-height: 2em;
}

.flowbox{
  display: flex;
  justify-content: space-between;

}
.flowbox .finner{
  flex-basis: 48%;
}
.flowchart{

}

.flowchart i{
color: #fd8a62;
}


.flowchart li{
  display: flex;
  justify-content: space-between;
  flex-wrap: wrap;  margin-bottom: 60px;


}
.flowchart p.subt{
  flex-basis: 100%;
  font-size: 20px;
  color: #fff;
  background: #fd8a62;
  padding: 10px 40px;
text-align: center;
  border-radius: 5px;
  margin-bottom: 30px;
}
.flowchart li .inner{
  flex-basis: 60%;
}
.flowchart li .inner:first-child{
  flex-basis: 35%;
}
.flowchart li .inner img{
  height: 150px;
  width: 100%;
  object-fit: cover;c
}
.flowimg{position: relative;}
.flowimg span{ font-family: ;
  position: absolute;
  top: -8px;
  left: -8px;
  display: block;
  background: #feded3;
  width: 50px;
  height: 50px;
  /* padding: 5px 15px; */
  font-size: 25px;
  text-align: center;
  padding-top: 15px;
}
.flowchart h3{
  font-size: 20px;
  text-align: left;
  margin: 5px auto 15px;
  font-family: ;
}

table.table{
width: 100%;
margin: 10px 0 60px;
border-top: 1px solid #ccc;
font-size:auto;
}
table.table th{
padding: 20px;
width: 220px;
background: #f4f4f4;
border-bottom: 1px solid #ccc;
}
table.table td{
padding: 20px 20px;
border-bottom: 1px solid #ccc;
background: #fff;
}
.company dt{
font-weight: bold;
}
.company dl{
}
.company dd{
margin: 0 0 4% 0;
}
.company dd:last-child{
margin: 0;
}
.gmap{margin-bottom: 30px;}

.online_firstclm{
  text-align: center;
  padding-bottom: 50px;
}
.online_firstclm h3{
  font-size: 26px;
  font-weight: normal;
  margin-bottom: 30px;
    color:#fd8a62;
}
.online_firstclm img{
  margin-bottom: 20px;
}
.online_firstclm p{
  font-size: 16px;
  line-height: 2em;
  margin-bottom: 30px;
}
ul.of_clm {
  display: flex;
  justify-content: center;
  padding: 30px 0 0;

}
ul.of_clm li{
text-align: center;
  padding: 0 1%;
}
ul.of_clm li img{
  height: 180px;
  width: 180px;
  object-fit: cover;
  border-radius: 50%;
}
ul.of_clm li p{

}
h3.onttl{
  text-align: center;
  font-size: 28px;
  font-weight: normal;
  margin-bottom: 50px;
}
h3.onttl span{
  display: block;
  font-size: 18px;
  color:#fd8a62;
  margin-top: 10px;
}
.online_secondclm{

}
.online_secondclm .three_box li{
  padding: 0 1%;
}
.online_secondclm .three_box li h3{
  display: block;
  background: #feded3;
  width: 50px;
  height: 50px;
  font-size: 25px;
  text-align: center;
  padding: 15px 0;
  margin: 10px auto;

}
.online_secondclm .inner{
  text-align: center;
  /* display: flex; */
  justify-content: center;
  align-items: center;
}
.online_thirdclm{
  padding: 150px 0;
  position: relative;
  z-index: 2;
  background: url(../img/online_bg.jpg) center center / cover no-repeat;
  margin-left: calc(-50vw + 50%);
margin-right: calc(-50vw + 50%);
color: #FFF;
}
.online_thirdclm::after{
  content: "";
  position: absolute;
  z-index: 1;
  display: block;
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
  width: 100%;
  height: 100%;
  background: #000;
  opacity: 0.3;
}

.online_thirdclm .inner{
  text-align: center;
  position: relative;
  z-index: 3;

}
.online_thirdclm .inner h3{
  font-size: 24px;
  margin-bottom: 30px;

}

.online_fourthclm{
padding: 60px 0;
}
.online_fourthclm{

}
.online_fourthclm .two_block li img{
  height: 350px;
  margin-bottom: 20px;

}
.online_fourthclm .two_block li h3{
  line-height: 1.4em;
  font-size: 23px;
  margin-bottom: 15px;
}
.page-nav{
  margin: 50px auto;
  border-top: 1px solid #999;
    border-bottom: 1px solid #999;
  display: flex;
  justify-content: center;

}
.page-nav a span,.page-nav a i{
  font-size: 120%;
}
.page-nav a.prev-link{
  margin-right:auto ;
}
.page-nav a.next-link{
  margin-left:auto ;
}
.page-nav a{padding: 30px 50px; max-width: 50%;}
@media only screen and (max-width: 768px) {

  ul.of_clm {
    display: block;
    justify-content: center;
    padding: 30px 0 0;

  }
  ul.of_clm li{
  text-align: center;
    padding: 0 1%;
  }
  ul.of_clm li img{
    height: 250px;
    width: 250px;
    object-fit: cover;
    border-radius: 50%;
    margin-bottom: 10px;
  }
h3.onttl{
  line-height: 1.6em;
}
.online_thirdclm .inner {
    text-align: center;
    margin: 0 20px;
}
.online_thirdclm .inner h3 {
line-height: 1.6em;}
.online_thirdclm {
    padding: 50px 0;
    background-position: center;
  }
.online_fourthclm .two_block li h3 {
    padding: 0px 0;
    font-size: 20px;
    text-align: left;
  }
  .online_fourthclm .two_block li  p{
      margin-bottom: 30px;
    }
.page-nav a{padding: 30px 10px;}
  .ud.news{
        background-position: 75% 0!important;
  }
  .ud.clothhd{
        background-position: 75% 0!important;
  }
  .ud.beforehall{
        background-position: 85% 0!important;
  }
    #ud_sect h3.ttl{
    margin-top: auto;

  }

  .flowbox{
    display: block;
  }
  h3.ttl {
    font-size: 25px;
    font-weight: normal;
      }.ud {
      background-size: cover;
      height: 280px;
}
.ud.t_about {

  background-position: 46% center!important;
}
  .ud_cach {
      width: 85%;
      top: 55%;
  }
  .ud_cach h2 {

      font-size: 24px;

  }
  .ud_cach h2:before {
    bottom: -30px;
  }
  .ud_cach p {
    text-align: left;
    font-size: 14px;
    line-height: 2em;
}

  .two_box {
    display: block;

}

.two_block {

    display: block;
    justify-content: space-between;
    margin-bottom: 30px;
}
.two_block li p {
    line-height: 1.6em;
}
.ud_about .two_block li:first-child, .plan .two_block li:first-child {
    height: 250px;
    margin-bottom: 20px;
}
.plan .two_block .price{
  text-align: center;
}
.two_block li h3 {
     font-family: ;
    font-size: 20px;
    text-align: center;
    margin: 0 auto 20px;
}
  .two_block li h4 {
       font-family: ;
      font-size: 18px;
      line-height: 1.4em;
      margin-bottom: 10px;
      text-align: center;
  }

  .camera_block {

      display: block;
      justify-content: space-between;
      margin-bottom: 100px;
  }
  .camera_block li:first-child{
    margin-bottom: 30px;
  }
  .camera_block li p {
      line-height: 1.6em;
  }
  .camera_block li.first img.fstimg{
  height: 300px;
    width: 100%;
    object-fit: cover;

  }
    .camera_block li.first{
      margin-bottom: 30px;
    }
  .camera_block li.first>.inner{
    display: flex;
    justify-content: space-between;
  }
  .camera_block li.first>.inner div{
    flex-basis: 32%;
  }
  .camera_block li.first>.inner div img{
    height: 100px;
    object-fit: cover;
    width: 100%;
  }
  .price {
     font-family: ;
    margin: 15px auto;
    text-align: center;
}
.price.flex {
    display: block;
    align-items: baseline;
    text-align: center;
}
.price b {

    font-size: 30px;
}
.two_plan {
    flex-wrap: wrap;
    display: block;
    justify-content: space-between;
}
.two_plan li {

    margin-bottom: 30px;
}
.two_plan li img {
    width: 100%;
    height: 250px;
    object-fit: cover;
}
.two_plan li h3 {
     font-family: ;
    font-size: 20px;
    color: #333;
    padding-bottom: 8px;
    /* border-bottom: 6px */
 double #999;
 margin: 10px  auto 10px;
     display: table;
     text-align: center;
   }
.two_block a.btn {
    margin-left: auto;
}

ul.three_box {
    display: block;
    justify-content: space-between;
    margin-bottom: 30px;
}
ul.three_box img {
    width: 100%;
    height: 250px;
    object-fit: cover;
}
ul.three_box li {
  margin-bottom: 30px;
}
ul.three_box h4 {
    padding: 15px 0 5px;

}
p.ttl_text {
    text-align: left;
    margin-bottom: 30px;
}
ul.two_btn {
    display: block;
    justify-content: space-between;

}
ul.two_btn li{
      margin-bottom: 20px;
}



.access_blk{
  margin-bottom: 60px;
}


.cblog_box{
margin-bottom: 60px;
}
.cblog_box li{
  margin-bottom: 10px;
  padding-bottom: 10px;
}


.flowchart li {
    display: block;
    margin-bottom: 30px;
}
.flowchart li .inner img {
    height: 250px;
}
.flowchart h3 {
    font-size: 20px;
    text-align: left;
    margin: 10px auto 10px;
     font-family: ;
}
.faq h3 {
    text-align: center;
    margin: 10px auto;
    font-size: 20px;
     font-family: ;
}
.qa-list {
    margin-bottom: 30px;
}
table.table {
border-top: none;
}
table.table tr{
  display: flex;
  flex-direction: column;

}
table.table tr th{
  width: 100%;
  border: none;
  text-align: center;
}
table.table tr td{
  border: none;
}
.access_blk .two_plan li h3{
  margin: 10px auto 10px;
}
}








/* ./////////////////////////////////////////////////////////////////////////その他 */

}
.slide_up {

}
.slide_up img{
  position: absolute;
bottom: 0;
width: 100%;
transform: translateY(100%);
transition: 1s;
transition-delay: 0;
z-index: -1;

}
.slide_up .starting {
transform: translateY(30%);
}


.contact_box{
  text-align: center;
  margin-bottom: 60px;
}
.confirm_btn{
  text-align: center;
  margin-bottom: 60px;
}

.contact_form {
 width: 860px;
 margin: 0 auto;
}
.contact_form p{

}
.mw_wp_form_confirm .contact_form {
 padding-top: 0px;
}

.mw_wp_form_confirm dd span,
.mw_wp_form_confirm h4 {
 display: none;
}

.contact_form .table {
 width: 100%;

 border-collapse: collapse;
 margin-bottom: 30px;
}
.contact_form dl{
  display: flex;

}
.contact_form dl:nth-child(2n)
{
    background-color: #fff;
}
.contact_form dt {
  flex-basis: 30%;
  /* width: 280px; */


  font-size: 14px;
  font-weight: normal;
  text-align: left;
  padding: 20px 30px;
  box-sizing: border-box;
  vertical-align: top;
  }

.contact_form dt span.required {
 color: #fff;
 font-size: 12px;
color: #CC0000;

}

.contact_form dt span.any {
 color: #fff;
 font-size: 12px;
 background-color: #999;
 float: right;
 padding: 3px 10px;
}

.contact_form dd {

  font-size: 14px;
  font-weight: normal;
  padding: 20px 30px;
  /* width: 100%; */
  flex-basis: 70%;
  text-align: left;
}

  /* .contact_form input {
  width: 320px;
  height: 34px;
  border: 1px solid #ccc;
  margin-bottom: 0px;
  font-size: 14px !important;
  padding: 0 8px;
  } */

.wpcf7-list-item input {
 width: auto;
 height: auto;
}
.form-control, input[type=date], input[type=email], input[type=tel], input[type=text], input[type=time], select, textarea {
    display: block;
    width: 100%;
    padding: .5rem .8rem;
    font-size: 1rem;
    line-height: 1.5;
    color: #495057;
    background-color: #fff;
    background-image: none;
    background-clip: padding-box;
    border: 1px solid #ddd;
    border-radius: 3px;
    -webkit-transition: border-color ease-in-out .15s,-webkit-box-shadow ease-in-out .15s;
    transition: border-color ease-in-out .15s,-webkit-box-shadow ease-in-out .15s;
    transition: border-color ease-in-out .15s,box-shadow ease-in-out .15s;
    transition: border-color ease-in-out .15s,box-shadow ease-in-out .15s,-webkit-box-shadow ease-in-out .15s;
}

.contact_form .free_input {
 width: auto !important;
 height: auto;
 border: none;
 margin-bottom: 10px;
}


.contact_form dl.tel input {
 width: 80px;
}

.contact_form input[type=tel] {
 width: 50%;
 line-height: 160%;
 border: 1px solid #ccc;
}

.contact_form h4 {
 margin-bottom: 50px;
}

.contact_form h4 a {
 font-size: 14px;
 text-decoration: none;
 background: url("../img/ico05.png") no-repeat left center;
 background-size: 15px;
 padding-left: 20px;
}

.contact03 {
 width: 860px;
 box-sizing: border-box;
 margin: 0 auto;
 background-color: #F3F3F3;
 border: 1px solid #ddd;
 margin-bottom: 30px;
 padding: 30px;
}

.contact03 li {
 font-size: 16px;
 font-weight: normal;
 background: url("../img/ico06.png") no-repeat left 5px;
 background-size: 13px;
 padding-left: 20px;
 margin-bottom: 20px;
}

.contact03 li a {
 background: url("../img/ico07.png") no-repeat right 5px;
 padding-right: 30px;
}

.contact03 li:last-child {
 margin-bottom: 0px;
}

.contact_inner .smallbtn {
 margin-top: 30px;


}

/*確認画面へ進むボタン用*/
.confirm_btn input[name="submitConfirm"] {
 display: inline-block;
 background-color: #f03828;
 opacity: 1;
 transition: .3s;
 width: 250px;
 height: 50px;
 color: #fff;
 font-size: 16px;
 font-weight: bold;
 border: none;
 margin: 0 auto;
 cursor: pointer;
}

.confirm_btn input[name="submitConfirm"]:hover {
 opacity: .8;
 transition: .3s;
}

/*送信するボタン用*/
.confirm_btn .submitConfirm {
  background: #ff8b64;
  padding: 15px 20px;
  color: #fff;
  position: relative;
  z-index: 1;
  transition: .3s;
  border-radius: 10px;
  border: 1px solid #fff;
      width: 300px;
      min-height: 50px;font-size: 16px;
}

.confirm_btn .submitConfirm:before {
    content: "";
    width: 100%;
    height: 100%;
    position: absolute;
    top: 0;
    left: 0;
    z-index: -1;
    background: #ccc;
    transform-origin: 100% 0%;
    transform: scaleX(0);
    transition: transform ease .3s;
    border-radius: 10px;
}

.confirm_btn .submitConfirm:hover{
   color: #333;
 }
.confirm_btn .submitConfirm:hover::before {
 transform-origin: 0% 100%;
 transform: scaleX(1);
}


/*戻るボタン用*/
.confirm_btn .submitback {
 display: inline-block;
 background-color: #999999;
 width: 200px;
 height: 50px;
 color: #333333;
 font-size: 16px;
 font-weight: bold;
 border: none;
 margin: 0 auto;
 margin-right: 0px;
 cursor: pointer;
}

.thanks01 {
 width: 600px;
 margin: 0 auto;
}

.thanks01 p {
 font-size: 16px;
 line-height: 200%;
 text-align: center;
}

.wpcf7c-conf {
 background-color: #eeeeee !important;

}
  .contact_box {
background: #feded3;
display: table;
padding: 20px 60px;
margin: 0 auto 30px;
}
@media only screen and (max-width: 768px) {
  .clothbox li{
    flex-basis: 48%;
  }
  .clothbox li img {
    width: 100%;
   /* height: 170px; */
    object-fit: cover;
}
  .confirm_btn .submitConfirm{
    width: 100%;
        min-height: 50px;
  }
  .contact_box {
      text-align: center;
      margin-bottom: 30px;
      background: #feded3;
      padding: 20px;
  }
.contact_form {
    width: 100%;
    margin: 0 auto;
}
.contact_form dl {
    display: block;
}
.contact_form dt {

    font-size: 14px;
    font-weight: normal;
    text-align: left;
    padding: 15px 10px;
    background: #eee;
}
.contact_form dd {
    font-size: 14px;
    font-weight: normal;
    padding: 20px 0px;
  }
  .contact_form .table {
    width: 100%;
    border-collapse: collapse;
    margin-bottom: 0px;
}.confirm_btn {
    text-align: center;
    margin-bottom: 30px;
}

}
/*---------------------------------------------------------------------------

news

---------------------------------------------------------------------------*/

.pagenav.sides{
  margin-bottom: 60px;
}
#sidebar h2 {
 display: none;
}

.contact_inner .pagenav {
 margin-bottom: 30px;
}


/*----- blog-list ------*/
.list-blog {
 display: -webkit-box;
 display: -ms-flexbox;
 display: flex;
 -webkit-box-pack: justify;
 -ms-flex-pack: justify;
 justify-content: flex-start;
 -ms-flex-wrap: wrap;
 flex-wrap: wrap;
 opacity: 1;
 -webkit-transform: translateY(20px);
 transform: translateY(20px);
 -webkit-transition: opacity .6s ease .4s;
 transition: opacity .6s ease .4s;
 -webkit-transition-property: opacity, -webkit-transform;
 transition-property: opacity, -webkit-transform;
 transition-property: opacity, transform;
 transition-property: opacity, transform, -webkit-transform;
}

.list-blog li {
 flex-basis: 30%;
 margin-right: 1%;
 margin-left: 1%;
 height: 350px;
 background-color: #fff;
 margin-bottom: 60px;
 -webkit-box-shadow: 11px 13px 27px 6px rgba(0, 0, 0, 0.08);
 box-shadow: 11px 13px 27px 6px rgba(0, 0, 0, 0.08);
}

.list-blog li:hover img {

 transform: scale(1.1);
}



.list-blog li .thumb {
 overflow: hidden;
 height: 230px;
 position: relative;
 background: #ffffff;
 margin: 0;
}

.list-blog li img {
object-fit: cover;
 transition: 1s;
 height: 100%;
 width: 100%;

}

.list-blog li a {
 position: relative;
 text-decoration: none;
 color: #111;
 width: 100%;
 height: 100%;
 display: block;
 position: relative;
}

.list-blog li a:before {
 content: "";
 background: url(/assets/img/icon-arrow-black.png) no-repeat;
 width: 32px;
 height: 11px;
 background-size: 100%;
 position: absolute;
 z-index: 50;
 left: 32px;
 bottom: 32px;
 -webkit-transition: -webkit-transform .3s ease-out;
 transition: -webkit-transform .3s ease-out;
 transition: transform .3s ease-out;
 transition: transform .3s ease-out, -webkit-transform .3s ease-out;
 left: initial;
 right: 32px;
 bottom: 37px;
}



.list-blog .detail-box {
 margin: 0 32px;
}

.list-blog .text-content {
 font-size: 14px;
 line-height: 21px;
word-break:break-all;    padding-bottom: 15px;
}

.list-blog .state-box {
 display: -webkit-box;
 display: -ms-flexbox;
 display: flex;

    margin: 10px 0px 10px;
}

.list-blog .date {
 color: #888888;
 font-size: 12px;

 letter-spacing: 1.5px;
}

.list-blog .category {
 color: #888888;
 font-size: 12px;

 letter-spacing: 1.5px;
}


@media screen and (max-width:768px) {
  #top_column{
    padding: 10px 0 20px;
  }
#top_column h2{
  padding: 15px;
}
  .list-blog {
margin-bottom: 50px;
      display: block;
}

  .list-blog li{
    height: auto;
    margin-bottom: 30px;
  }
    .list-blog li:last-child{
      margin-bottom: 0;
    }
  .list-blog .detail-box {
    margin: 10px 15px;
}
.cblog_box {
    margin-bottom: 40px;
}

.online_firstclm > p,.online_thirdclm >.inner > p{
  text-align: left;
}
}

/*single*/
.single_box {
 margin-bottom: 50px;
}

.single_content {
 text-align: auto;
 word-break: break-all;

}

h1.newstitle {
 font-size: 24px;
 text-align: left;
 font-weight: normal;word-break: break-all;
}

h1.newstitle b {
 /*    margin-left: 10px;
 */
 font-weight: normal;
 /*    max-width: 800px;*/
 display: block;
 line-height: 1.6em;
}

h1.newstitle:after {
 content: "";
 display: block;
 width: 100%;
 height: 1px;
 background-color: #e47268;
 margin: 15px auto 30px;
}

div.newsdate {
 font-size: 13px;
 /* margin-left: 10px; */
 text-align: left;
 display: block;
 margin-bottom: 10px;
}

div.newsdate span {
 display: inline-block;
 margin-left: 20px;
 display: inline-block;
 /* height: 20px; */
 color: #fff;
 font-size: 11px;
 text-align: center;
 line-height: 100%;
 padding: 7px;
 box-sizing: border-box;
 width: 100px;
 flex-basis: 15%;
 background: #e47268;
}

.single_box img {
 margin-bottom: 20px;
}

/*---------------------------------------------------------------------------

404

---------------------------------------------------------------------------*/

.page404 {
 width: 980px;
 margin: 0 auto;
 padding-top: 70px;
 padding-bottom: 70px;
}

.page404 h2 {
 font-size: 24px;
 font-weight: bold;
 margin-bottom: 20px;
}

.page404 p {
 font-size: 18px;
 margin-bottom: 40px;
}

.page404 p.sub_en {
 font-size: 20px;
 font-weight: bold;
}

.page404 a {
 font-size: 18px;
}


#f_sns {
 float: left;
}

#f_bnr01 {
 float: left;
 margin-left: 30px;
 width: 200px;
}

#f_bnr01 a img {
 transform: scale(1);
 transition: all 0.1s ease 0s;
}

#f_bnr01 a:hover img {
 transform: scale(1.1);
}

.iso_txt01 {
 font-size: 14px !important;
}

.subloan h2 {
 font-size: 26px;
 margin-bottom: 20px;
 font-weight: bold;
}

.subloan h2 span {
 font-size: 16px;
}

.subloan h3 {
 margin-top: 20px;
 font-size: 18px;
 font-weight: bold;

 margin-bottom: 10px;
}

.subloan p {
 margin-bottom: 10px;
}

.subloan .inner {
 background-color: #fce7e5;
 padding: 30px;
}

.subloan .inner i {
 color: #f03828;
 margin-right: 8px;
}

.subloan .inner.last i {
 color: #4f9f0e;
}

.subloan .inner.last {
 background-color: #f3fce5;

}

.subloan a {
 color: #f03828;
}

/******************************************************************
コラム
******************************************************************/
.single_content h1{
  font-size: 30px;
  font-weight: bold;
  margin: 20px 0 30px;
  padding: 13px 0px;
  /* border-left: 4px solid #e47268; */
  line-height: 1.4em;
}

.single_content h2{
  font-size: 26px;
  margin: 20px 0 30px;
  padding: 13px 20px;
    border-left: 4px solid #e47268;line-height: 1.4em;
}

.single_content h3{
font-size: 20px;
  margin: 15px 0 ;
  position: relative;
  padding-left: 1.2rem;line-height: 1.4em;

}

.single_content h3::after {
     position: absolute;
     top: 50%;
     left:0;
     transform:translateY(-50%);
     content: '';
     width: 10px;
     height:10px;
  background-color: #e47268;
     border-radius:100%;
}
.single_content strong{
  font-weight: bold;
}

/* 2020/1/20追記 サンクスページ  */
#contact_sect{
  text-align: center;
}


.grecaptcha-badge {
visibility: hidden;
}

footer{
  background-color: #FFF;
}