@charset "utf-8";

/*WEBフォント読み込み（HTML内で実行）*/
@import url('https://fonts.googleapis.com/css2?family=Noto+Sans+JP:wght@400;700;900&display=swap');
@import url('https://fonts.googleapis.com/css2?family=Oswald:wght@500&display=swap');


.base_fontstyles {
  font-family: "Oswald";
}
.base_color_codes {
  color: #112c6a;
  color: #2e66a2;
  background: #eff9fc;/*濃*/
  background: #f4fbfd;/*薄*/
  color: #5ca3f2;/*ポイント：ブルー*/
  color: #f3585b;/*ポイント：レッド*/
  color: #0035ae;/*ホバーカラー基本*/
}


/*ブレイクポイント基本*/
@media screen and (min-width: 800px) {

}/*PC*/


/*基本設定
---------------------------------------*/

html {
  font-size: 62.5%;/* 標準の文字サイズを10pxに設定 */
  scroll-behavior: smooth;
  /* scroll-padding-top: 10px; */
}


body {
  color: #000;
  font-size: 1.5rem;
  line-height: 1.75;
  font-family:"Noto Sans JP","Helvetica Neue",Arial,"Hiragino Kaku Gothic ProN","Hiragino Sans",Meiryo,sans-serif;
  -webkit-text-size-adjust: 100%;/* フォントサイズ自動調整OFF */
}


/*画像の自動リサイズ
---------------------------------------*/
img {
  max-width: 100%;
  height: auto;
}

/*SP/PC表示切り替え
---------------------------------------*/
.is_sp { display: block !important; }
.is_pc { display: none  !important; }

@media screen and (min-width: 800px) {
.is_sp { display: none  !important; }
.is_pc { display: block !important; }
}/*PC*/

/*リンク
---------------------------------------*/
a:link    {color: #2e66a2;text-decoration: none;}
a:visited {color: #2e66a2;text-decoration: none;}
a:hover   {color: #0035ae;text-decoration: underline;}
a:active  {color: #f3585b;text-decoration: underline;}


/*構造
---------------------------------------*/



#wrapper {}



/* ###################################################################### */
/* ヘッダー */
/* ###################################################################### */



header {
  position: relative;
  z-index: 999;
}

/*SPヘッダー
---------------------------------*/
.sp_header {
  padding: 15px 20px;
  background: #fff;
  box-shadow: 0px 0px 10px 0px rgba(0, 0, 0, 0.1);
}
/*ロゴ*/
.sp_header .logo{
  width: 200px;
}
/*三本線*/
.sp_menu_btn {
  position: absolute;
  z-index: 9999;
  width: 30px;
  height: 70px;
  cursor: pointer;
  right: 20px;
  top: 0;
  /* background: #f0f; */
}
.sp_menu_icon,
.sp_menu_icon span {
  display: inline-block;
  transition: all 0.5s;
}
.sp_menu_icon {
  position: relative;
  width: 30px;
  height: 16px;
  margin: 25.5px 0 0 0;
}
.sp_menu_icon span {
  position: absolute;
  left: 0;
  width: 100%;
  height: 2px;
  background: #000;
}
.sp_menu_icon.active span {
  background: #fff;
}
.sp_menu_icon span:nth-of-type(1) {top: 0;}
.sp_menu_icon span:nth-of-type(2) {top: 7px;}
.sp_menu_icon span:nth-of-type(3) {bottom: 0;}
.sp_menu_icon.active span:nth-of-type(1) {
  transform: translateY(7px) rotate(-45deg);
}
.sp_menu_icon.active span:nth-of-type(2) {
  opacity: 0;
}
.sp_menu_icon.active span:nth-of-type(3) {
  transform: translateY(-7px) rotate(45deg);
}
/*パネル@本体*/
.sp_menu {
  color: #fff;
  position: absolute;
  z-index: 999;
  top: 0;
  left: 0;
  width: 100%;
  background: #112c6a;
  opacity: 0;
  visibility: hidden;
  height: 100vh;
  overflow: auto;
  padding: 40px 30px 150px 30px;
}
/*パネル@インナー（アニメーション用）*/
.sp_menu_inner {
  position: relative;
  left: -30px;
  opacity: 0;
  transition: all .7s;
}
/*パネル@展開時*/
.open.sp_menu  {
  opacity: 1;
  visibility: visible;
}
.open.sp_menu .sp_menu_inner {/*内容物も展開*/
  opacity: 1;
  left: 0px
}
body.is-scroll-lock {/*bodyスクロール制御*/
  overflow: hidden;
}
/*パネル@内容物*/
/*Ｇナビ*/
.sp_menu .gnav > ul{
  margin-bottom: 25px;
}
.sp_menu .gnav ul li{
  padding: 10px 0;
}
.sp_menu .gnav a{
  color: #fff;
  text-decoration: none;
}
/* 拠点アコーディオン */
.sp_menu .ac-menu {
  display: none;
  padding: 1em;
}
.sp_menu .ac-trigger {
  position: relative;
  display: inline-block;
}
.sp_menu .ac-trigger::after {
  content: "";
  right: -20px;
  top: 50%;
  transform: translateY(-50%);
  width: 1em;
  height: 1em;
  position: absolute;
  background: url(../img/arrow_down_wh.svg) 50% 50% no-repeat ;
  background-size: 1rem;
}
.sp_menu .has-menu.is-open > .ac-trigger::after {
  background-image: url(../img/arrow_up_wh.svg);
}
/*サービス概要（！！ボタン類はフッターでも利用中！！）*/
.sp_menu_outline {
  border-top:  .99px solid rgba(255, 255, 255, 0.2);
  border-bottom:  .99px solid rgba(255, 255, 255, 0.2);
  padding: 50px 0;
  margin-bottom: 40px;
}
.sp_menu_outline p {
  font-size: 1.2rem;
  margin-bottom: 10px;
}
.outline_logo a {
  display: block;
  width: 80%;
  margin-bottom: 15px;
}
/* 問い合わせ・ログインボタン */
.outline_cnt {
  display: flex;
  gap: 5px;
  margin-bottom: 20px;
}
.outline_cnt li {
  flex: 1;/*2つを1対1（50%）で配置*/
}
.outline_cnt a {
  display: block;
  padding: 10px 0;
  background: #fff;
  color: #112c6a;
  font-size: 1.2rem;
  font-weight: bold;
  text-align: center;
  text-decoration: none;
  border-radius: 99px;
}
.outline_cnt a span {
  display: inline-block;
  padding-left: 25px;
  background-position: 0 50%;
  background-repeat: no-repeat;
  background-size: 1.8rem;
}
.outline_cnt li:first-child a span {
  background-image: url(../img/ico_mail.svg);
}
.outline_cnt li:last-child a span {
  background-image: url(../img/ico_key.svg);
}
/*SNS*/
.outline_sns li{
   width: 40px;
   display: inline-block;
   margin-right: 5px;
}
/*会社概要*/
.sp_menu_conpamy li{
  padding-bottom: 25px;
  font-size: 1.3rem;
}
.sp_menu_conpamy li a{
  color: #fff;
  text-decoration: none;
}




/*PCヘッダー
---------------------------------*/



.pc_header {
  padding: 0 20px;
  background: #fff;
  box-shadow: 0px 0px 10px 0px rgba(0, 0, 0, 0.1);
}
  /*！！TOPは背景色なし（bodyにクラス付与）！！*/
  .is_home .pc_header {
    background: none;
    box-shadow: none;
    transition: all .7s;
  }

.pc_header_inner {
  max-width: 1200px;
  margin: 0 auto;
  height: 130px;
  display: flex;
  justify-content: space-between;
  align-items: center;
}
/*ロゴ*/
.pc_header .logo p{
  font-size: 1.2rem;
  margin-bottom: 8px;
}
.pc_header .logo a img{
  width: 305px;
}
/*メニュー*/
.pc_menu {
  text-align: right;
}

/*電話番号／ログイン*/
.pc_menu .tel_and_login  {
  margin-bottom: 10px;
}
.pc_menu .tel_and_login li {
  color: #112c6a;
  display: inline-block;
  padding-left: 22px;
  margin-left: 10px;
}
.tel_and_login li:first-child  {
  background: url(../img/ico_phone.svg) 0 50% no-repeat;
  background-size: 1em;
}
.tel_and_login li:last-child  {
  background: url(../img/ico_key.svg) 0 50% no-repeat;
  background-size: 1.2em;
}
.pc_menu .tel_and_login li a{color: #112c6a;}
.pc_menu .tel_and_login li a:hover{color: #0035ae;}
/*Ｇナビ*/
.pc_menu .gnav {
  display: flex;
  align-items: center;
}
.pc_menu .gnav > ul > li{
  display: inline-block;
  margin-right: 20px;
}
.pc_menu .gnav li a{
  color: #000;
  text-decoration: none;
}
.pc_menu .gnav li a:hover {
  color: #0035ae;
  text-decoration: underline;
}
/* 拠点アコーディオン */
.pc_menu .has-menu {
  position: relative;
}
.pc_menu .ac-trigger {
  padding: 15px 20px 15px 0;
  background: url(../img/arrow_down_bk.svg) 100% 50% no-repeat; 
  background-size: .8em;
}
.pc_menu .ac-trigger:hover {
  color: #0035ae;
}
/*本体*/
.pc_menu .ac-menu {
  display: none;
  position: absolute;
  left: -80px;
  padding: 30px 0 30px 50px ;
  background: #112c6a;
  border-radius: 10px;
  box-shadow: 3px 3px 20px 0px rgba(7, 60, 183, 0.2);
}
.pc_menu .ac-menu ul{
  text-align: left;
  display: grid;
  grid-template-columns: 1fr 1fr 1fr ;
}
.pc_menu .ac-menu li {
  display: block;
  white-space: nowrap;
  margin-right: 50px;
  margin-bottom: 8px;
}
.pc_menu .ac-menu li a {
  color: #fff;
}
.pc_menu .ac-menu li a:hover {
  color: #fff;
  text-decoration: underline;
}

/* 問い合わせボタン */
.pc_menu .gnav .cnt a{
  display: block;
  color: #fff;
  text-decoration: none;
  text-align: center;
  text-indent: 30px;
  background: url(../img/ico_mail_wh.svg) 45px 53% no-repeat #112c6a;
  background-size: 1.3em;
  padding: 12px 0;
  width: 210px;
  border-radius: 99px;
  margin-left: 10px;
  transition: all .2s;
}
.pc_menu .gnav .cnt a:hover{
  background: url(../img/ico_mail_wh.svg) 45px 53% no-repeat #0035ae;
  background-size: 1.3em;
  box-shadow: 3px 3px 20px 0px rgba(7, 60, 183, 0.2);
}




/* ###################################################################### */
/* フッター */
/* ###################################################################### */




/* ご利用の流れ（上段）
-------------------------------- */

.flow_section {
  padding: 80px 20px 60px 20px;
  background: url(../img/footer_flow_bg_sp.jpg) 50% 0 no-repeat #2f70a9;
  background-size: 100% auto;
}
.footer_flow_ttl {
  text-align: center;
  color: #fff;
  margin-bottom: 60px;
}
.footer_flow_ttl h3{
  font-size: 3rem;
  font-weight: 700;
  margin-bottom: 10px;
}
.flow_steps dl {
  padding: 40px 30px;
  border-radius: 15px;
  margin-bottom: 15px;
  background-color: #fff;
  background-position: calc(100% - 20px) 30px;
  background-repeat: no-repeat;
  background-size: 55px;
  box-shadow: 5px 5px 10px 0px rgba(0, 0, 0, 0.05);
}
.flow_steps dl.step01 { background-image: url(../img/flow_icon01.svg); }
.flow_steps dl.step02 { background-image: url(../img/flow_icon02.svg); }
.flow_steps dl.step03 { background-image: url(../img/flow_icon03.svg); }
.flow_steps dl.step04 { background-image: url(../img/flow_icon04.svg); }

.flow_steps dt {
  font-size: 2rem;
  font-weight: 700;
  color: #112c6a;
  margin-bottom: 10px;
}
.flow_steps dt span{
   display: block;
   font-weight: normal;
   line-height: 1;
  font-size: 1.5rem;
  font-family: "Oswald";
  color: #2e66a2;
}

@media screen and (min-width: 800px) {
.flow_section {
  padding: 80px 20px 40px 20px;
  background: url(../img/footer_flow_bg_pc.jpg) 50% 0 repeat-x #eff9fc;
  background-size: auto 380px;
}
.footer_flow_ttl {
  margin-bottom: 80px;
}
.footer_flow_ttl h3{
  font-size: 3.2rem;
  margin-bottom: 10px;
}
.flow_steps {
  max-width: 1100px;
  margin: 0 auto;
  display: grid;
  grid-template-columns: 1fr 1fr 1fr 1fr;
  gap: 20px;
}
.flow_steps dl {
  margin-bottom: 0;
  border-radius: 10px;
  background-color: #fff;
  background-position: calc(100% - 10px) 20px;
  background-repeat: no-repeat;
  background-size: 45px;
}
.flow_steps dt {
  font-size: 1.7rem;
}
.flow_steps dt span{
  font-size: 1.4srem;
}
}/*PC*/



/* ご利用の流れ（下段／問い合わせ）
-------------------------------- */

.contact_section {
  padding: 80px 20px;
  background: #eff9fc;
}
.contact_section .img{
  margin-bottom: 30px;
}
/* タイトル */
.footer_contact_ttl {
  padding: 0 0 20px;
}
.footer_contact_ttl .jp_ttl{
  font-size: 2.7rem;
  font-weight: 900;
}

@media screen and (min-width: 800px) {
.contact_section {
  padding: 40px 0 80px 0;
}
.contact_section_inr {
  max-width: 1140px;
  margin: 0 auto;
  padding: 0 20px;
  display: flex;
  justify-content: space-between;
  align-items: center;
  gap: 60px;
}
.contact_section .img{
  flex: 6;
  order: 2;
  margin-bottom: 0;
}
.contact_section .txt{
  flex: 4;
}
}/*PC*/


/*パンくず／PAGETOP
-------------------------------- */

.pankuzu {
  color: #fff;
  background: #000;
}
.pankuzu_inner {
  max-width: 1200px;
  margin: 0 auto;
  display: flex;
  align-items: center;
  justify-content: space-between;
}
.pankuzu a{
  color: #fff;
}

/*AIOSEOによる出力方式*/
.aioseo-breadcrumbs {
  overflow-x: scroll;
  white-space:nowrap;
  width: calc(100% - 80px);
  padding: 0 20px;
}
.aioseo-breadcrumbs span{
  font-size: 1.2rem;
  display: inline-block;
}
.aioseo-breadcrumb-separator {
  padding: 0 5px;
}
@media screen and (min-width: 800px) {
.pankuzu {
  padding-left: 20px;
}
.aioseo-breadcrumbs {
  overflow: hidden;
  padding: 0;
}
}/*PC*/

/*ページトップ*/
a.btn_pagetop {
  display: inline-block;
  color: #fff;
  height: 70px;
  width: 70px;
  font-family: 'Oswald';
  font-size: 1.3rem;
  text-decoration: none;
  text-align: center;
  overflow: hidden;
  line-height: 90px;
  background: url(../img/arrow_pagetop.svg) 50% 22px no-repeat #222;
  background-size: 7px;
}
a.btn_pagetop:hover {
  background: url(../img/arrow_pagetop.svg) 50% 22px no-repeat #333;
  background-size: 7px;
}


/*フッター本体
-------------------------------- */



/* #####当面は旧サイトが残存するため注意書きを追加##### */
.base_list_notice {
  position: fixed;
  z-index: 999;
  width: 100%;
  bottom: 0;
  font-size: 1.2rem;
  padding: 10px;
  background: #f3585b;
  text-align: center;
  color: #fff;
  border: 1px solid #f3585b;
}
.base_list_notice a{
  color: #fff;
}
@media screen and (min-width: 800px) {
.base_list_notice {
  font-size: 1.5rem;
  padding: 13px;
}
}/*PC*/
/* #####当面は旧サイトが残存するため注意書きを追加##### */



/*全体*/
.footer {
  color: #fff;
  background: #112c6a;
  padding: 50px 20px 100px;
}
.footer_inr {
  max-width: 1200px;
  margin: 0 auto;
}

/*ロゴまわり*/
.footer_menu_outline{
  padding: 40px 0;
  border-top:     .99px solid rgba(255, 255, 255, 0.2);
  border-bottom:  .99px solid rgba(255, 255, 255, 0.2);
}
.footer_menu_outline p {
  font-size: 1.2rem;
  margin-bottom: 10px;
}

/* サイトマップ */
.footer_nav  li   {
  padding: 5px 0;
  margin-bottom: 10px;
}
.footer_nav  a {
  color: #fff;
}
/*拠点アコーディオン*/
.footer_nav .ac-trigger {
  padding: 5px 0;
  margin-bottom: 20px;
}
.footer_nav .ac-trigger {
  position: relative;
  display: inline-block;
}
.footer_nav .ac-trigger::after {
  content: "";
  right: -20px;
  top: 50%;
  transform: translateY(-50%);
  width: 1em;
  height: 1em;
  position: absolute;
  background: url(../img/arrow_down_wh.svg) 50% 50% no-repeat ;
  background-size: 1rem;
}
.footer_nav .has-menu.is-open > .ac-trigger::after {
  background-image: url(../img/arrow_up_wh.svg);
}
/* アコーディオン本体 */
.footer_nav .ac-menu {
  display: none;
  padding: 1em;
}

@media screen and (min-width: 800px) {
/*全体*/
.footer {
  padding: 50px 20px 100px;
}
/* カラム設定（PCのみ） */
.footer_main_menu {
  display: flex;
  gap: 120px;
}
.footer_menu_outline {
  order: 1;
  flex: 3.5;
}
.footer_nav {
  order: 2;
  flex: 6.5;
  border: none;
  margin: 0;
}
/*ロゴまわり*/
.footer_menu_outline{
  padding: 0;
  border: none;
}
.outline_cnt a:hover,
.outline_sns a:hover {
  opacity: .7;
}
/* サイトマップ */
.footer_nav {
  display: flex;
  justify-content: space-between;
}
.footer_nav ul:first-child {flex:1;}/*単体ページ*/
.footer_nav ul:last-child  {flex:2.5;}/*拠点リスト*/
.footer_nav li {
  padding:  0;
  margin-bottom: 10px;
}
/*拠点アコーディオン（PCは隠さない！）*/
.footer_nav .ac-trigger {
  padding: 0;
  margin-bottom: 10px;
}
.footer_nav .ac-trigger::after {
  display: none;
}
/* アコーディオン本体 */
.footer_nav .ac-menu {
  display: block;
  padding: 0;
}
.footer_nav .ac-menu ul{
  display: grid;
  grid-template-columns: 1fr 1fr ;
  gap: 0 20px;
  padding-left: 10px;
}
.footer_nav .ac-menu li{
  font-size: 1.3rem;
  line-height: 1.5;
  margin-bottom: 8px;
}

}/*PC*/


/*会社概要メニュー／コピーライト*/
.footer_sub_menu {
  font-size: 1.3rem;
  padding-top: 60px;
}
.footer_menu_conpamy {
  margin-bottom: 50px;
}
.footer_menu_conpamy li{
  margin-bottom: 20px;
}
.footer_menu_conpamy li a{
  color: #fff;
}
.copyright {
}
@media screen and (min-width: 800px) {
.footer_sub_menu {
  display: flex;
  justify-content: space-between;
  align-items: center;
}
.footer_menu_conpamy {
  margin-bottom:0;
}
.footer_menu_conpamy li{
  display: inline-block;
  margin: 0 20px 0 0 ;
}
}/*PC*/










/* ###################################################################### */
/* TOPページ（店舗詳細併用パーツあり） */
/* ###################################################################### */











/* TOP用FV背景
---------------------------- */

.cover {
  position: relative;
  isolation: isolate; /* Vegasレイヤーとz-index競合を防ぐ */
}
/* VEGAS@共通 */
.cover_sp,
.cover_pc {
  width: 100%;
  background: #f4fbfd;
  position: relative;
  z-index: 1; /* 背景レイヤー */
}
  /* VEGAS@SP */
  .cover_sp {
    height: calc(100vh - 30px);
    border-radius: 0 0 40px 40px;
  }
  /* VEGAS@PC */
  .cover_pc {
    height: 700px;
    margin-top: -130px;
    border-radius: 0 0 60px 60px;
  }

/* TOP用FVコンテナ
--------------------------- */

.cover_contents {
  position: absolute;
  inset: 0;   /* サイズをコンテナ全体に広げる */
  z-index: 2; /* コンテンツレイヤー */
  display: flex;
  align-items: center;
}
.cover_contents .inner{
  width: 100%;
  text-align: center;
}
@media screen and (min-width: 800px) {
.cover_contents .inner{
  max-width: 1240px;
  margin: 0 auto;
  padding: 80px 20px 0; 
  display: flex;
  justify-content: space-between;
  text-align: left;
}
}/*PC*/


/*初期アニメーション用*/

.cover_contents .inner{
  opacity: 0;
  margin-top: 40px;
  transition: all 1s;
}
.cover_contents.on .inner{
  opacity: 1;
  margin-top: 0;
}

/*文字組関連
-------------------------*/

.cover_contents h1 {
  font-size: 8vw;
  font-weight: 900;
  line-height: 1;
}
.cover_contents h1 span{
  display: inline-block;
  padding: 5px 5px 8px 5px;
  font-style: normal;
  margin-bottom: 5px;
}
.cover_contents h1 .red{
  color: #fff;
  background: #f3585b;
}
.cover_contents h1 .wht{
  background: #fff;
}
.cover_contents picture{
  display: inline-block;
  width: 90%;
  margin: 15px 0;
}
/*H1内のブランド名（display:noneを使わずに非表示／画像だと弱いので文字列で記述）*/
.sr-only {
  position: absolute;
  width: 1px;
  height: 1px;
  padding: 0;
  margin: -1px;
  overflow: hidden;
  clip: rect(0, 0, 0, 0);
  white-space: nowrap;
  border: 0;
}
/* 完全個室 */
.cover_contents p{
  display: inline-block;
  font-size: 1.4rem;
  background: #112c6a;
  color: #fff;
  padding: 10px 30px;
  border-radius: 99px;
  text-align: center;
  margin-bottom: 25px;
}
/* ポイント */
.salespoint li  {
  max-width: 80%;
  margin: 0 auto;
  font-size: 1.5rem;
  font-weight: 700;
  color: #112c6a;
  padding: 15px 20px 20px 20px;
  position: relative;
  line-height: 1.4;
  border-radius: 99px;
  background: #fff;
  margin-bottom: 10px;
}
.salespoint li::after {
  content: "";
  position: absolute;
  top: -3px;      /* ← 上も指定する */
  left: -3px;
  right: 3px;
  bottom: 3px;   /* ← 下 */
  border-radius: 999px;
  border: 1px solid #112c6a;
}
.salespoint li strong {
  font-weight: 700;
}

@media screen and (min-width: 800px) {
.cover_contents h1 {
  font-size: 3.5rem;
}
.cover_contents h1 em,
.cover_contents h1 i{
  margin-bottom: 10px;
}
.cover_contents .idt{/*格安〜部分のスキマを詰める*/
  margin-left: -10px;
  padding-left: 0;
}
.cover_contents picture{
  width: 100%;
  max-width: 640px;
  margin-top: 15px;
  margin-bottom: 30px;
}
.cover_contents p{
  font-size: 1.5rem;
  max-width: 400px;
  padding: 13px 50px;
  margin-bottom: 0;
}
.salespoint   {
  display: flex;
  align-items: center;
}
.salespoint li  {
  font-size: 1.8rem;
  width: 210px;
  height: 210px;
  display: flex;
  justify-content: center;
  align-items: center;
  text-align: center;
  line-height: 1.5;
  padding: 0;
  margin-bottom: 0;
  margin-left: 20px;
}

}/*PC*/




/* コンセプト（TOPのみ！）
------------------------------------------- */


.concept {
  margin-top: -150px;
  padding-top: 150px;
  background: url(../img/top_concept_sp_bg_top.gif) 0 0 no-repeat#eff9fc;
  background-size: auto 500px;
  border-radius: 0 0 40px 40px;
  padding-bottom: 100px;
}
.concept_inner {
  padding: 100px 20px;
}
.concept h2 {
  font-size: 3.5rem;
  font-weight: 900;
  line-height: 1.4;
  margin-bottom: 30px;
}
.concept p {
  font-size: 1.6rem;
  font-weight: 700;
  line-height: 2;
  margin-bottom: 1.2em;
}

@media screen and (min-width: 800px) {
.concept {
  background: url(../img/top_concept_pc_bg_left.gif) 0 0 no-repeat#eff9fc;
  background-size: auto 500px;
  border-radius: 0 0 60px 60px;
}
.concept_wrap {/*背景2枚目*/
  background: url(../img/top_concept_pc_bg_right.gif) 110% 100px no-repeat;
  background-size: auto 400px;
}
.concept_inner {
  max-width: 1140px;
  margin: 0 auto;
}
.concept h2 {
  font-size: 4.2rem;
  margin-bottom: 30px;
}
.concept p {
  font-size: 1.8rem;
}

}/*PC*/

/* 男性背景イラスト位置調整 */
@media (max-width: 1000px) {/*狭いときは右に*/
  .concept_wrap {
    background-position: 200% 100px;
  }
}
@media (min-width: 1200px) {/*広いときは左に*/
  .concept_wrap {
    background-position: 90% 100px;
  }
}


/* ギャラリー（TOPのみ！）
------------------------------------------- */

.gallery {
  margin-top: -150px;
  padding-bottom: 40px;
  overflow: hidden;
  padding-bottom: 140px;
}
.gallery_list {
  width: 140%;
}
.gallery_list div {
  margin: 0 10px;
}
.gallery_list img {
  border-radius: 15px;
}
.gallery_list a:hover{
  opacity: .7;
  transition: opacity .5s;
}

@media screen and (min-width: 800px) {
.gallery {
  max-width: 1140px;
  margin: -150px auto 100px;
  padding: 0px 20px ;
  background: none;
}
.gallery_list {
  width: 100%;
  margin-left: 10px;
}
.gallery_list div {
  margin: 0 20px 0 0;
}
}/*PC*/



/* 拠点リスト（店舗一覧／その他ページ下部で併用）
------------------------------------------- */



.base_list {
  display: grid;
  gap: 14px;
}
.base_list > li {
  display: grid;
  grid-template-columns: 90px 1fr;
  gap: 10px;
  align-items: center;
}
.base_list .thumb {
  width: 90px;
  height: 90px;
  border-radius: 10px;
  overflow: hidden;
  position: relative;
}
.base_list .thumb img {
  width: 100%;
  height: 100%;
  object-fit: cover; 
  display: block;
}
/*NEWアイコン*/
.base_list li.new .thumb::before{
  position: absolute;
  display: block;
  content: "";
  width: 40px;
  height: 40px;
  background: url(../img/ico_new.png)  0 0 no-repeat;
  background-size: cover;
  top: 0;
  left: 0;
  z-index: 1;
}
.base_list h3 {
  font-size:1.6rem; 
  font-weight: 700;
  line-height: 1.2;
  margin-bottom: 7px;
}
/* アイコン */
.base_list .add,
.base_list .time {
  font-size: 1.2rem;
  display: flex;
  align-items: flex-start;
  line-height: 1.2;
  margin-bottom: 2px;
}
.base_list .add::before,
.base_list .time::before {
  content: "";
  width: 1em;
  height: calc(1em + 4px);
  padding-left: 1.6em;
  background-repeat: no-repeat;
  background-position: center 50%;
  background-size: 1em; 
}
.base_list .add::before {
  background-image: url(/assets/img/ico_pin.svg);
}
.base_list .time::before {
  background-image: url(/assets/img/ico_clock.svg);
}
/* バーチャル対応 */
.badge {
  display: inline-block;
  padding: 2px 12px 3px;
  font-size: 1rem;
  line-height: 1.4;
  color: #fff;
  background: #5ca3f2; 
  border-radius: 99px;
  white-space: nowrap;
}
@media screen and (min-width: 800px) {
  .base_list {
    grid-template-columns: 1fr 1fr;
    gap: 10px;
  }
  .base_list > li {
    grid-template-columns: 100px 1fr; 
  }
  .base_list .thumb {
    width: 100px;
    height: 100px;
  }
  /*拡大エフェクト*/
  .base_list .thumb img { transition: transform .5s ease; }
  .base_list .thumb a:hover img { transform: scale(1.1); }

}/*PC*/

@media screen and (min-width: 1000px) {
  .base_list {
    grid-template-columns: 1fr 1fr 1fr;
  }
}/*PC*/


/* お知らせリスト（店舗詳細でも併用）
------------------------------------------- */


.news_list ul{
  margin-bottom: 40px;
}
.news_list li {
  margin-bottom: 2rem;
}
.news_list li span {
  display: block;
  margin-bottom: 6px;
}
.news_list li a {
  display: block;
}
@media screen and (min-width: 800px) {
.news_container {
  display: flex;
  justify-content: space-between;
}
.news_ttl {
  flex: 2.5;
}
.news_list {
  flex: 7.5;
}
.news_list ul{
  margin-bottom: 0px;
}
.news_list li {
  display: flex;
  gap: 20px;
  margin-bottom: 1.5rem;
}
}/*PC*/


/* サービスリスト（店舗詳細でも併用）
------------------------------------------- */

.service_list_main  {
  padding: 0 20px;
  margin-bottom: 40px;
}
.service_list_main li {
  border-radius: 15px;
  padding: 60px 30px;
  background:#fff;
  text-align: center;
  box-shadow: 5px 5px 10px 0px rgba(0, 0, 0, 0.05);
  margin-bottom: 20px;
}
.service_list_main img {
  width: 45%;
  margin: 0 auto 20px;
}
.service_list_main h3 {
  font-size: 2.5rem;
  font-weight: 900;
  color: #112c6a;
  margin-bottom: 20px;
}
@media screen and (min-width: 800px) {
.service_list_main  {
  padding: 0;
  display: grid;
  grid-template-columns: 1fr 1fr 1fr 1fr;
  gap: 15px;
}
.service_list_main li {
  padding: 50px 30px;
}
.service_list_main h3 {
  margin-bottom: 10px;
}
.service_list_main img {
  width: 45%;
}
}/*PC*/

/*設備リスト*/
.service_ttl_sub {
  text-align: center;
  font-size: 2.5rem;
  font-weight: 700;
  line-height: 1.5;
  color: #112c6a;
  margin-bottom: 40px;
}
.service_ttl_sub span{
  display: block;
  font-size:  1.5rem;
  font-weight: normal;
}
.service_list_sub  {
  padding: 0 20px;
  margin-bottom: 40px;
}
.service_list_sub li {
  border-radius: 10px;
  padding: 15px 20px;
  background:#fff;
  box-shadow: 5px 5px 10px 0px rgba(0, 0, 0, 0.05);
  display: flex; 
  align-items: center;
  gap: 15px;
  margin-bottom: 10px;
}
.service_list_sub li img {
  width: 28px;
  height: 28px;
  flex-shrink: 0; 
}
@media screen and (min-width: 800px) {
.service_ttl_sub {
  text-align: left;
  margin-bottom: 20px;
}
.service_ttl_sub span{
  display: inline-block;
}
.service_list_sub  {
  padding: 0;
  display: grid;
  grid-template-columns: 1fr 1fr 1fr 1fr;
  gap: 10px;
}
.service_list_sub li {
  margin-bottom: 0px;
  padding: 20px;
  border-radius: px;
}
}/*PC*/

/*バーチャル対応*/
.service_virtual {
  line-height: 1.5;
  margin: 0 20px;
  border-radius: 15px;
  padding: 40px 30px;
  background:#fff;
  text-align: center;
  box-shadow: 5px 5px 10px 0px rgba(0, 0, 0, 0.05);
}
.service_virtual img {
  width: 45%;
  margin-bottom: 20px;
}
.service_virtual h4 {
  font-weight: 700;
  color: #112c6a;
  margin-bottom: 5px;
}
.service_virtual .price {
  font-weight: 700;
  color: #f3585b;
  margin-bottom: 10px;
}
.service_virtual .notice {
  font-size: 1.3rem;
}
@media screen and (min-width: 800px) {
.service_virtual {
  display: flex;
  text-align: left;
  align-items: center;
  margin: 0 ;
  padding: 20px 40px 20px 30px;
}
.service_virtual .icon {
  width: auto;
  flex: 0 0 80px;
  margin-right: 30px;
}
.service_virtual .text {
  flex: 0 0 50%;
}
.service_virtual .notice {
  flex: 0 0 40%;
  text-align: right;
}
.service_virtual img {
  width: 100%;
  margin-bottom: 0;
}
.service_virtual .price {
  margin-bottom: 0;
}
}/*PC*/




/* 料金案内（店舗詳細でも併用）
------------------------------------------- */

.price_column {
  margin-bottom: 60px;
}
.price_ttl {
  font-size: 2.25rem;
  font-weight: 700;
  color: #112c6a;
  text-decoration: underline;
  text-decoration-thickness: 2px;
  text-underline-offset: 6px;
  margin-bottom: 30px;
}
.price_box {
  border: 2px solid #112c6a;
  padding: 20px ;
  margin-bottom: 10px;
}
.price_box dt{
  font-size: 1.7rem;
  font-weight: 700;
  color: #112c6a;
}
.price_box dt img{
  width: 1em;
  vertical-align: baseline;
  padding-right: 5px;
}

@media screen and (min-width: 800px) {

.price_ttl {
  font-size: 2.5rem;
}
.price_column {
  display: flex;
  justify-content: space-between;
}
.price_ttl     {flex: 2.5;}
.price_details {flex: 7.5;}
.price_box {
  display: flex;
  align-items: center;
}
.price_box dt  {flex: 1; white-space: nowrap;}
.price_box dd  {flex: 2;}

}/*PC*/

/* 参考価格表. */
.price_sample {
  padding: 30px;
  border-radius: 15px;
  background: #eff9fc; 
}
.price_sample h4 {
  font-size: 1.7rem;
  color: #2e66a2;
  font-weight: 700;
  line-height: 1.5;
  margin-bottom: 5px;
}
.price_sample h4 + p{
  font-size: 1.2rem;
  margin-bottom: 20px;
}
.price_table {
  font-size: 1.3rem;
  background: #fff;
  padding: 20px;
  border-radius: 10px;
  display: grid;
  grid-template-columns: 1fr auto;
  gap: 5px 0px;
  margin-bottom: 20px;
}
.price_table dd {
  text-align: right;
}
.price_sample .price {
  font-size: 1.7rem;
  color: #f3585b;
  font-weight: 700;
  line-height: 1.2;
}
.price_sample .price span{
  font-size: 3.5rem;
  font-family: "Oswald";
  font-weight: 700;
  position: relative;
  top: 2px;
}

@media screen and (min-width: 800px) {
.price_sample h4 {
  font-size: 1.8rem;
}
.price_table {
  font-size: 1.5rem;
  padding: 30px;
}
.price_sample .price {
  text-align: right;
}
.price_sample .price span{
  font-size: 3.5rem;
}
}/*PC*/



/* フッター用利用者の声
------------------------------------------- */


.voice_list {
  margin-bottom: 40px;
}
.voice_list dl{
  padding: 30px 20px;
  border-radius: 15px;
  background: #fff;
  box-shadow: 5px 5px 10px 0px rgba(0, 0, 0, 0.05);
  margin-bottom: 20px;
}
.voice_list dt{
  display: flex;
  align-items: center;
  gap: 10px;
  font-size: 1.7rem;
  font-weight: 700;
  color: #306bac;
  margin-bottom: 20px;
}
.voice_list dt img{
  width: 60px;
}
.voice_list dd{
  height: 170px;
  padding: 15px;
  overflow-y: scroll;
  background: #f4fbfd;
  border-radius: 10px;
}
.voice_list dd p{
  margin-bottom: .5em;
}
.voice_list dd em{
  font-weight: bold;
  color: #f3585b;
}

@media screen and (min-width: 800px) {
.voice_list {
  display: grid;
  grid-template-columns: 1fr 1fr 1fr;
  gap: 30px;
}
.voice_list dl{
  padding: 30px;
  margin-bottom: 0;
}
.voice_list dt img{
  width: 70px;
}
.voice_list dd{
  height: 170px;
  padding: 0 20px 0 0;
  background: #fff;
  scrollbar-width: thin;
  scrollbar-color: #112c6a transparent;
}
}/*PC*/



/* フッター用拠点リスト（リスト本体は別で管理）
-------------------------------- */
/* タイトル */
.footer_base_ttl {
  padding:  0 0 40px;
}
.footer_base_ttl .jp_ttl{
  font-size: 2.5rem;
  font-weight: 900;
}
/*セクション背景*/
.footer_base {
  background: url(../img/footer_base_list_bg_sp.jpg) 0 0  no-repeat #f4fbfd;
  background-size: 100%;
}
.footer_base_inr {
  background: url(../img/footer_base_list_bg_txt.png) 100% 100% no-repeat;
  background-size: 100%;
} 
@media screen and (min-width: 800px) {
.footer_base {
  background: url(../img/footer_base_list_bg_sp.jpg) 0 0  no-repeat #f4fbfd;
  background-size: 700px;
}
.footer_base_inr {
  background: url(../img/footer_base_list_bg_txt.png) 100% 100% no-repeat;
  background-size: 700px;
} 
}/*PC*/








/* ###################################################################### */
/* 汎用パーツ */
/* ###################################################################### */








/* コンテナ系
-------------------------------- */

/* セクション背景2色 */
.bg_blue {background: #eff9fc;}
.bg_white {background: #fff;}


/* コンテナいろいろ */


/*W1100px*/

.box1100 {
  padding: 100px 20px 80px;
}
  /*上下paddingを狭くしたい時*/
  .box1100.is_narrow {
    padding: 60px 20px 60px;
  }
@media screen and (min-width: 800px) {
.box1100 {
  max-width: 1140px;
  margin: 0 auto;
}
}/*PC*/


/*W800px*/

.box800 {
  padding: 60px 20px 80px;
}
@media screen and (min-width: 800px) {
.box800 {
  max-width: 840px;
  margin: 0 auto;
}
}/*PC*/





/* タイトル系
-------------------------------- */

/* 英語キャプション */
.en_ttl {
  font-family: "Oswald";
  font-size: 1.8rem;
  color: #112c6a;
  display: inline-block;
  width: fit-content;
  border-bottom: 2px solid #112c6a;
  margin-bottom: 10px;
}

/* セクションタイトル */
.section_ttl {
  text-align: center;
  padding:  0 0 80px;
}
.section_ttl .jp_ttl{
  font-size: 3rem;
  font-weight: 900;
}
@media screen and (min-width: 800px) {
.section_ttl .jp_ttl{
  font-size: 3.5rem;
}
}/*PC*/

  /* お知らせセクション用 */
  .news_ttl {
    padding:  0 0 60px;
  }
  .news_ttl .jp_ttl{
    font-size: 2.5rem;
    font-weight: 900;
  }

/* 下線タイトル */
.title_underline  {
  font-size: 2.5rem;
  font-weight: 700;
  color: #112c6a;
  text-decoration: underline;
  text-decoration-thickness: 2px;
  text-underline-offset: 6px;
  margin-bottom: 50px;
}

/* ボタン系
-------------------------------- */

.btn-color01 a,
.btn-color02 a,
.btn-color03 a{
  display: inline-block;
  padding:  15px 60px;
  color: #fff;
  text-align: center;
  border-radius: 99px;
  text-decoration: none;
  transition: all .3s;
}
.btn-color01 a{background: #112c6a;}
.btn-color02 a{background: #f3585b;}
.btn-color03 a{background: #5ca3f2;}
.btn-color01 a:hover{
  background: #0035ae;
  box-shadow: 3px 3px 20px 0px rgba(7, 60, 183, 0.2);
  }
.btn-color02 a:hover{
  background: #ff3a65;
  box-shadow: 3px 3px 20px 0px rgba(168, 7, 111, 0.2);
  }
.btn-color03 a:hover{
  background: #3dcbee;
  box-shadow: 3px 3px 20px 0px rgba(11, 83, 252, 0.2);
  }
/*SP限定で幅いっぱいにしたい*/
.btn_block_only_sp a{
  width: 100%;
}
/*一回り小さくしたい*/
.is_small a{
  font-size: 1.2rem;
  padding:  10px 50px;
}
@media screen and (min-width: 800px) {
.btn_block_only_sp a{
  width: auto;
}
}/*PC*/






/* ###################################################################### */
/* 調整用クラス */
/* ###################################################################### */












/*マージン*/
.mt5 {margin-top: 5px !important;}
.mt10{margin-top:10px !important;}
.mt15{margin-top:15px !important;}
.mt20{margin-top:20px !important;}
.mt25{margin-top:25px !important;}
.mt30{margin-top:30px !important;}
.mt35{margin-top:35px !important;}
.mt40{margin-top:40px !important;}
.mt45{margin-top:45px !important;}
.mt50{margin-top:50px !important;}
.mt60{margin-top:60px !important;}
.mt70{margin-top:70px !important;}
.mt80{margin-top:80px !important;}
.mt90{margin-top:90px !important;}
.mt100{margin-top:100px !important;}

.mb5 {margin-bottom: 5px !important;}
.mb10{margin-bottom:10px !important;}
.mb15{margin-bottom:15px !important;}
.mb20{margin-bottom:20px !important;}
.mb25{margin-bottom:25px !important;}
.mb30{margin-bottom:30px !important;}
.mb35{margin-bottom:35px !important;}
.mb40{margin-bottom:40px !important;}
.mb45{margin-bottom:45px !important;}
.mb50{margin-bottom:50px !important;}
.mb60{margin-bottom:60px !important;}
.mb70{margin-bottom:70px !important;}
.mb80{margin-bottom:80px !important;}
.mb90{margin-bottom:90px !important;}
.mb100{margin-bottom:100px !important;}
.mb150{margin-bottom:150px !important;}
.mb200{margin-bottom:200px !important;}

.ml5 {margin-left: 5px !important;}
.ml10{margin-left:10px !important;}
.ml15{margin-left:15px !important;}
.ml20{margin-left:20px !important;}
.ml25{margin-left:25px !important;}
.ml30{margin-left:30px !important;}
.ml35{margin-left:35px !important;}
.ml40{margin-left:40px !important;}
.ml45{margin-left:45px !important;}
.ml50{margin-left:50px !important;}

.mr5{margin-right: 5px !important;}
.mr10{margin-right:10px !important;}
.mr15{margin-right:15px !important;}
.mr20{margin-right:20px !important;}
.mr25{margin-right:25px !important;}
.mr30{margin-right:30px !important;}
.mr35{margin-right:35px !important;}
.mr40{margin-right:40px !important;}
.mr45{margin-right:45px !important;}
.mr50{margin-right:50px !important;}

.noMg{margin:0 !important;}

/*左右マージン*/
.inr5 {padding:0  5px;}
.inr10{padding:0 10px;}
.inr15{padding:0 15px;}
.inr20{padding:0 20px;}
.inr25{padding:0 25px;}
.inr30{padding:0 30px;}
.inr35{padding:0 35px;}
.inr40{padding:0 40px;}
.inr45{padding:0 45px;}
.inr50{padding:0 50px;}

/*下パディング*/
.pb10 {padding-bottom: 10px;}
.pb20 {padding-bottom: 20px;}
.pb30 {padding-bottom: 30px;}
.pb40 {padding-bottom: 40px;}
.pb50 {padding-bottom: 50px;}
.pb60 {padding-bottom: 60px;}
.pb70 {padding-bottom: 70px;}
.pb80 {padding-bottom: 80px;}
.pb90 {padding-bottom: 90px;}
.pb100 {padding-bottom: 100px;}

/*フロート*/
.float-l{float:left;}
.float-r{float:right;}

/*アライン*/
.align-c{text-align: center !important;}
.align-l{text-align: left   !important;}
.align-r{text-align: right  !important;}

/*フォントサイズ（相対）*/
big   {font-size:1.2em}
small {font-size:0.8em;}

/*フォントサイズ（絶対）※ハイフンなし！*/
.fs10 {font-size:1.0rem}
.fs11 {font-size:1.1rem}
.fs12 {font-size:1.2rem}
.fs13 {font-size:1.3rem}
.fs14 {font-size:1.4rem}
.fs15 {font-size:1.5rem}
.fs16 {font-size:1.6rem}
.fs17 {font-size:1.7rem}
.fs18 {font-size:1.8rem}
.fs19 {font-size:1.9rem}
.fs20 {font-size:2.0rem}
.fs21 {font-size:2.1rem}
.fs22 {font-size:2.2rem}
.fs23 {font-size:2.3rem}
.fs24 {font-size:2.4rem}
.fs25 {font-size:2.5rem}
.fs26 {font-size:2.6rem}
.fs27 {font-size:2.7rem}
.fs28 {font-size:2.8rem}
.fs29 {font-size:2.9rem}
.fs30 {font-size:3.0rem}
.fs35 {font-size:3.5rem}
.fs40 {font-size:4.0rem}
.fs45 {font-size:4.5rem}
.fs50 {font-size:5.0rem}

/*画像透過*/
a.imgHover:hover{
  opacity:0.5;
  transition: opacity 0.5s ease;
}

/*回りこみ解除禁止（簡易crearfix）*/
.ovh{overflow:hidden;}

/*boeder*/
hr.border{
  clear:both;
  padding:0;
  margin: 0;
  display:block;
  height:1px;
  border:0;   
  border-top:1px solid #ddd;
}

/*boeder-黒*/
hr.border_bk{
  clear:both;
  padding:0;
  margin: 0;
  display:block;
  height:1px;
  border:0;   
  border-top:1px solid #000;
}

/*テキスト強調*/
em {
  font-style: normal;
}
strong {
  font-style: normal;
}
.txt_em {
  color: #f3585b;
}
.txt_strong {
  color: #f3585b;
  font-weight: bold;
}

/*記事がないとき*/
.noresult {
  color: #999;
}