@charset "utf-8";

/*------------------------------------------------------------------
/  BASE
------------------------------------------------------------------*/
html { -webkit-text-size-adjust: 100%; }
body {
  margin: 0 auto;
  font-size: 100%;
  color: #333;
  line-height: 1.6;
  background: #fff;
  /* 本文の下余白（下部固定CTAぶん） */
  padding-bottom: calc(var(--sticky-cta-h, 64px) + 10px);
  padding-bottom: calc(var(--sticky-cta-h, 64px) + env(safe-area-inset-bottom) + 10px);
}
a { color: #777; text-decoration: none; }
a:visited {}
.sp { display: none; }
.text-center{ text-align:center; }
.text-right{ text-align:right; }
.text-left{ text-align:left; }
.area{ width:100%; }
.area-in{ width:100%; margin:0 auto; }
* header:after, * footer:after, * main, * section:after, * article:after, * div:after, * ul:after, * ol:after, * dl:after{
  content:""; clear:both; display:block;
}
* img{ width:100%; }

/* アイコン入りテキスト */
.inside{ padding:0 0 0 60px; background:url(../images/free_ico_01.gif?0) no-repeat center left; }
#header .inside{
  padding:14px 0 0 38px; line-height:1.2;
  background:url(../images/free_ico_01.gif?0) no-repeat;
  background-position:left 12px; background-size:34px auto;
}
.inside02{ padding:0 0 0 50px; background:url(../images/free_ico_01.gif?0) no-repeat center left; }

/*------------------------------------------------------------------
/  COLORS / FONTS / UTILITIES
------------------------------------------------------------------*/
.bgcolor01{ background-color:#fff !important; }
.bgcolor02{ background-color:#f5f5f5 !important; }
.bgimg00{ background-image:none !important; }
.bgimg01{ background-image:url(../images/common/bg_contents.jpg); background-repeat:repeat; }
.color00{ color:#000 !important; }
.color01{ color:#fff !important; }
.color02{ color:#885b2e !important; }
.color_c{ color:#ba0202 !important; }
.color_g{ color:#bbb !important; }
.color_red{ color:#cc0000 !important; }
.fsXS{ font-size:10px; font-size:1.0rem; }
.fsS{  font-size:12px; font-size:1.2rem; }
.fsM{  font-size:14px; font-size:1.4rem; }
.fsL{  font-size:16px; font-size:1.6rem; }
.fsXL{ font-size:18px; font-size:1.8rem; }
.fsXXL{ font-size:24px; font-size:2.4rem; }
.fsXXL02{ font-size:22px; font-size:2.4rem; }
.fs1225{ font-size:.825rem; text-align:center; }
@media screen and (min-width:737px) and (max-width:1000px){ .fsM{ font-size:14px; font-size:1.4rem; } }
@media screen and (max-width:736px){ .fsM{ font-size:13px; font-size:1.3rem; } }

.flL{ float:left !important; } .flR{ float:right !important; } .flN{ float:none !important; }
.alL{ text-align:left !important; } .alR{ text-align:right !important; } .alC{ text-align:center !important; }
.vaT{ vertical-align:top !important; } .vaM{ vertical-align:middle !important; } .vaB{ vertical-align:bottom !important; }
.thL th{ text-align:left !important; } .tdL td{ text-align:left !important; }
.thC th{ text-align:center !important; } .thR th{ text-align:right !important; }
.tdR td{ text-align:right !important; } .tdC td{ text-align:center !important; }
.tbFix{ table-layout:fixed !important; }

/* spacing utils */
.mg00{ margin:0 !important; } .mgT00{ margin-top:0 !important; }
.mgT5{ margin-top:5px !important; } .mgT10{ margin-top:10px !important; } .mgT15{ margin-top:15px !important; }
.mgT20{ margin-top:20px !important; } .mgT25{ margin-top:25px !important; } .mgT30{ margin-top:30px !important; }
.mgT35{ margin-top:35px !important; } .mgT40{ margin-top:40px !important; } .mgT45{ margin-top:45px !important; } .mgT50{ margin-top:50px !important; }
.mgB00{ margin-bottom:0 !important; } .mgB5{ margin-bottom:5px !important; } .mgB10{ margin-bottom:10px !important; }
.mgB15{ margin-bottom:15px !important; } .mgB20{ margin-bottom:20px !important; } .mgB25{ margin-bottom:25px !important; }
.mgB30{ margin-bottom:30px !important; } .mgB35{ margin-bottom:35px !important; } .mgB40{ margin-bottom:40px !important; } .mgB45{ margin-bottom:45px !important; }
.mgB50{ margin-bottom:50px !important; }
.mgL00{ margin-left:0 !important; } .mgL5{ margin-left:5px !important; } .mgL10{ margin-left:10px !important; } .mgL15{ margin-left:15px !important; }
.mgL20{ margin-left:20px !important; } .mgL25{ margin-left:25px !important; } .mgL30{ margin-left:30px !important; } .mgL35{ margin-left:35px !important; }
.mgL40{ margin-left:40px !important; } .mgL45{ margin-left:45px !important; } .mgL50{ margin-left:50px !important; }
.mgR00{ margin-right:0 !important; } .mgR5{ margin-right:5px !important; } .mgR10{ margin-right:10px !important; } .mgR15{ margin-right:15px !important; }
.mgR20{ margin-right:20px !important; } .mgR25{ margin-right:25px !important; } .mgR30{ margin-right:30px !important; } .mgR35{ margin-right:35px !important; }
.mgR40{ margin-right:40px !important; } .mgR45{ margin-right:45px !important; } .mgR50{ margin-right:50px !important; }
.pd00{ padding:0 !important; } .pdT00{ padding-top:0 !important; }
.pdT5{ padding-top:5px !important; } .pdT10{ padding-top:10px !important; } .pdT15{ padding-top:15px !important; }
.pdT20{ padding-top:20px !important; } .pdT25{ padding-top:25px !important; } .pdT30{ padding-top:30px !important; } .pdT35{ padding-top:35px !important; }
.pdT40{ padding-top:40px !important; } .pdT45{ padding-top:45px !important; } .pdT50{ padding-top:50px !important; }
.pdB00{ padding-bottom:0 !important; } .pdB5{ padding-bottom:5px !important; } .pdB10{ padding-bottom:10px !important; }
.pdB15{ padding-bottom:15px !important; } .pdB20{ padding-bottom:20px !important; } .pdB25{ padding-bottom:25px !important; }
.pdB30{ padding-bottom:30px !important; } .pdB35{ padding-bottom:35px !important; } .pdB40{ padding-bottom:40px !important; } .pdB45{ padding-bottom:45px !important; } .pdB50{ padding-bottom:50px !important; }
.pdL00{ padding-left:0 !important; } .pdL5{ padding-left:5px !important; } .pdL10{ padding-left:10px !important; } .pdL15{ padding-left:15px !important; }
.pdL20{ padding-left:20px !important; } .pdL25{ padding-left:25px !important; } .pdL30{ padding-left:30px !important; } .pdL35{ padding-left:35px !important; } .pdL40{ padding-left:40px !important; } .pdL45{ padding-left:45px !important; } .pdL50{ padding-left:50px !important; }
.pdR00{ padding-right:0 !important; } .pdR5{ padding-right:5px !important; } .pdR10{ padding-right:10px !important; } .pdR15{ padding-right:15px !important; } .pdR20{ padding-right:20px !important; } .pdR25{ padding-right:25px !important; } .pdR30{ padding-right:30px !important; } .pdR35{ padding-right:35px !important; } .pdR40{ padding-right:40px !important; } .pdR45{ padding-right:45px !important; }

/*------------------------------------------------------------------
/  HEADER
------------------------------------------------------------------*/
#header .in{ width:100%; margin:0 auto; padding:10px 0 0; }
#header .in h1{ font-size:.625rem; text-align:center; }
#header .branding .logo{ text-align:center; }
#header .branding .logo img{ width:50%; }
#header .branding .contact{
  padding:0 10px; box-sizing:border-box; background:#fff;
  display:flex; align-items:center;
}
#header .branding .contact li{ width:auto; float:none; }
#header .branding .contact li:first-child{ flex-grow:1; }
#header .branding .contact li img{ width:100%; }
.fixed{ position:fixed; top:0; width:100%; z-index:10000; }

/* SP: ヘッダーバーを圧縮（必要時のみ有効。後段で非表示にする場合は見た目影響なし） */
@media (max-width:767px){
  #header .in h1,
  #header .branding .color_c{ display:none !important; }

  #header .in{ padding:0 !important; }
  #header .branding .logo{ margin:4px 0 2px !important; }
  #header .branding .logo img{ width:50% !important; height:auto; }

  #header .branding .contact{
    display:flex !important; align-items:center; flex-wrap:nowrap; gap:8px;
    padding:6px 10px !important; margin:4px 0 6px !important;
  }
  #header .branding .contact li{ list-style:none; width:auto; }
  #header .branding .contact li:first-child{ flex:1 1 auto; min-width:0; }
  #header .branding .contact li:last-child{ flex:0 0 auto; display:flex; align-items:center; }

  #header .branding .contact li:first-child a{
    display:block; padding:0 !important; border:none !important; background:none !important; min-height:0 !important;
  }
  #header .branding .contact li:first-child .inside{
    display:block; margin:0; line-height:1.2;
    padding-left:34px !important;
    background-size:22px auto !important;
    background-position:8px center !important;
    font-size:clamp(17px, 4.7vw, 21px) !important;
    color:#666;
    white-space:nowrap; overflow:hidden; text-overflow:ellipsis;
  }
  #header .branding .contact li:last-child img{
    height:40px !important; width:auto !important; display:block;
  }
}

/*------------------------------------------------------------------
/  FOOTER
------------------------------------------------------------------*/
#footer{ border-top:3px solid #0AA7DA; padding:30px 0 0 0; }
#footer .copy{ color:#fff; background:url(../images/bg01.jpg) repeat; padding:10px 0; text-align:center; font-size:.625rem; }
#footer ul{ text-align:center; }
#footer ul li{ width:48%; display:inline-block; vertical-align:middle; }
#footer p{ font-size:.875rem; text-align:center; padding:10px 0 30px 0; }
#footer .logo{ padding-bottom:0; text-align:center; }
#footer .logo img{ width:50%; }

/*------------------------------------------------------------------
/  VISUAL
------------------------------------------------------------------*/
#visual{ text-align:center; background:url(../images/visual_bg.png) repeat-x left bottom #f7f7f7; }

/*------------------------------------------------------------------
/  AREAS
------------------------------------------------------------------*/
.bg01{ background:url(../images/bg01.jpg) repeat; }
.area-contact{
  position:relative; margin:0 auto; padding:30px 20px; text-align:center; box-sizing:border-box;
}
.area-contact.bar01{ border-top:3px solid #00A3D9; }
.title01{
  background:url(../images/bg01.jpg) repeat; text-align:center; position:relative; margin-bottom:50px; padding:20px; box-sizing:border-box;
}
.title01:before{
  content:''; position:absolute; background:url(../images/arrow01.png) no-repeat center bottom; width:78px; height:18px; bottom:-18px; left:0; right:0; margin:0 auto;
}
.title02{ border-bottom:3px solid #00A3D9; text-align:center; margin-bottom:40px; padding:0 20px 10px; }

/* area01 */
#area01 ul{ padding:20px; text-align:center; box-sizing:border-box; }
#area01 ul li{ width:30%; display:inline-block; vertical-align:middle; margin-right:2%; }
#area01 ul li:last-of-type{ margin-right:0; }

/* area02 */
#area02 article{ margin-bottom:50px; padding:0 20px; box-sizing:border-box; }
#area02 .box{ background:#F5F7DD; padding:20px; box-sizing:border-box; position:relative; }
#area02 .box:before{
  content:''; position:absolute; background:url(../images/area02_img02.png) no-repeat left bottom; background-size:contain;
  width:100px; height:80px; left:0; top:-80px;
}
#area02 .box p{ font-size:1.25rem; line-height:1.58; }

/* area03 */
#area03{ background:#f7f7ee; }
#area03 article{ padding:30px 0; border-bottom:1px solid #00A3D9; }
#area03 article:first-of-type{ padding-top:0; }
#area03 dl{ padding:0 20px; box-sizing:border-box; }
#area03 dl dt{ text-align:center; margin-bottom:10px; }
#area03 dl dt img{ width:40%; }
#area03 dl dd h4{ margin-bottom:20px; }
#area03 dl dd p{ font-size:100%; }

/* area04 */
#area04 article{ padding:0 0 60px 0; }

/* area05 */
#area05 article{ padding:0 20px 80px 20px; box-sizing:border-box; }
#area05 ul{} 
#area05 ul li{ width:100%; padding:20px; box-sizing:border-box; border:1px solid #0AA7DA; margin-bottom:20px; }
#area05 ul li .text{ background:#F7F7EE; padding:10px; box-sizing:border-box; border-radius:5px; }
#area05 .box{ background:#F5F7DD; padding:20px; box-sizing:border-box; position:relative; }
#area05 .box:before{
  content:''; position:absolute; background:url(../images/area05_img04.png) no-repeat left bottom; background-size:contain;
  width:100px; height:80px; left:0; top:-80px;
}
#area05 .box p{ font-size:1.25rem; line-height:1.58; }
#area05 .box p br{ display:none; }
#area05 .notes{ margin:0; padding:20px 0 0; }
#area05 .notes ul{} 
#area05 .notes ul li{
  position:relative; width:100%; font-size:13px; padding:2px 2px 2px 28px; box-sizing:border-box; border:none; margin:0 0 5px;
}
#area05 .notes ul li::before{
  content:""; position:absolute; top:9px; left:10px; width:6px; height:6px; border-radius:50%; background:#bfbfbf;
}

/* area06 */
#area06 article{ padding:0 20px 60px 20px; box-sizing:border-box; }
#area06 dl{ border:1px solid #D6D6D6; border-bottom:5px solid #eee; padding:20px; box-sizing:border-box; border-radius:5px; margin-bottom:30px; }
#area06 dl dt, #area06 dl dd{ display:block; vertical-align:top; }
#area06 dl dt{ text-align:center; margin-bottom:15px; }
#area06 dl dt img{ width:30%; }
#area06 dl dd h4{ color:#00A3D9; border-bottom:1px solid #00A3D9; font-size:1.4375rem; margin-bottom:20px; padding-bottom:10px; line-height:1.3; }
#area06 dl dt h4{ color:#00A3D9; border-bottom:1px solid #00A3D9; font-size:1.2rem; margin-bottom:20px; line-height:1.3; padding-left:40px; text-align:left; }
#area06 dl dd h4 span, #area06 dl dt h4 span{ font-size:1rem; }
.area06_icon01{ background:url(../images/area06_img02.png) no-repeat left center; background-size:35px; }
.area06_icon02{ background:url(../images/area06_img03.png) no-repeat left center; background-size:35px; }
.area06_icon03{ background:url(../images/area06_img04.png) no-repeat left center; background-size:35px; }

/* area07 */
#area07 ol{ padding:0 20px; box-sizing:border-box; }
#area07 ol li{ list-style:none; padding-bottom:40px; position:relative; background:url(../images/area07_arrow01.png) no-repeat center 90%; }
#area07 ol li:last-of-type{ background:none; }

/* area08 */
#area08{ background:url(../images/area08_bg.jpg) no-repeat center center; background-size:cover; padding:60px 20px; box-sizing:border-box; }
#area08 .box{ padding:20px; background:#fff; box-sizing:border-box; border-radius:5px; margin-bottom:20px; }
#area08 .box dl dt, #area08 .box dl dd{ padding:0 0 10px 50px; }
#area08 .box dl dt{
  color:#3F1F00; background:url(../images/area08_q.png) no-repeat left top;
  font-size:1.375rem; line-height:1.2; border-bottom:1px solid #DDC5A9; margin-bottom:10px;
}
#area08 .box dl dd{ background:url(../images/area08_a.png) no-repeat left top; padding-bottom:0; }

/*------------------------------------------------------------------
/  CONTACT / area09
------------------------------------------------------------------*/
#contact{ padding:0 0 70px 0; }
#contact .contact-form{ padding:0 20px; box-sizing:border-box; }
#contact .contact-form.sent{ margin-bottom:150px; }
#contact .contact-form .in{ border:1px solid #D6D6D6; width:100%; box-sizing:border-box; }
#contact .contact-form .in dl{ display:block; width:100%; }
#contact .contact-form .in dl dt, #contact .contact-form .in dl dd{
  width:100%; display:block; padding:10px; box-sizing:border-box;
}
#contact .contact-form .in dl dt{
  background:linear-gradient(to bottom,#fff 0%,#eee 100%); border-bottom:1px solid #D6D6D6;
  color:#3F1F00; font-size:1rem; position:relative;
}
#contact .contact-form .in dl dt:before{ content:''; position:absolute; top:0; bottom:0; right:10px; margin:auto 0; width:50px; height:22px; }
#contact .contact-form .in dl dt.hissu:before{ background:url(../images/hissu.png) no-repeat right center; }
#contact .contact-form .in dl dt.nini:before{ background:url(../images/nini.png) no-repeat right center; }
#contact .contact-form .in dl dd{ border-bottom:1px solid #D6D6D6; }
#contact .contact-form .in dl:last-of-type dd{ border-bottom:none; }
#contact .contact-form .form-text01{ width:100%; height:40px; border:1px solid #D6D6D6; box-sizing:border-box; background:#F0F0E1; -webkit-appearance:none; }
#contact .contact-form .form-textarea01{ width:100%; height:110px; border:1px solid #D6D6D6; box-sizing:border-box; background:#F0F0E1; -webkit-appearance:none; }
#contact .contact-form .contact-btnarea{ margin-top:30px; text-align:center; }
#contact .contact-form .form-btn{
  width:100%; height:60px; color:#fff; font-size:1.375rem; text-align:center; line-height:60px;
  border:none; border-radius:5px; -webkit-appearance:none;
}
.form-btn-conf,.form-btn-send{ background:#FF9424; } .form-btn-back{ background:#00a2d9; }
#contact .contact-form .contact-caution{ color:#dd0000; margin-bottom:20px; }
#contact .form-btn-2cols li{ display:block; margin-bottom:10px; }
#contact .form-btn-2cols li:last-child{ margin-right:0; }
#contact .form-sent{ font-size:1rem; margin-bottom:100px; }
#contact .form-sent-message{ font-size:1.5625rem; font-weight:bold; color:#ff8000; margin-bottom:20px; }

/* === PRIVACY POLICY 本文の左右余白 === */
#area09 dl{
  padding: 0 20px;
  box-sizing: border-box;
}
#area09 dl dd{ margin-bottom: 1.2em; }
#area09 dl dd span{ display:block; }
@media (min-width: 768px){
  #area09 dl{ max-width: 900px; margin: 0 auto; }
}

/*------------------------------------------------------------------
/  POPUP
------------------------------------------------------------------*/
#popupOverlay{ display:none; position:fixed; top:0; left:0; width:100%; height:100%; background:rgba(0,0,0,.3); z-index:999; }
#popupMessage{
  position:fixed; top:50%; left:50%; transform:translate(-50%,-50%);
  background:#fff; color:#333; padding:0; border-radius:8px; z-index:1000; border:3px #595959 solid;
}
#popupMessage p{ font-size:26px; line-height:1.7em; margin:1px; padding:1px; }
#popupMessage .close{ margin-top:10px; text-align:center; }
#popupMessage .close span{
  display:inline-block; font-size:20px; font-weight:bold; margin:0; padding:5px 10px; text-align:center; color:#fff;
  width:300px; max-width:calc(100% - 20px); border-radius:26px; background:#ff8f00;
}
#popupClose{ cursor:pointer; margin:0; padding:25px 30px; }
@media screen and (max-width:767px){
  #popupMessage{ left:10%; transform:translate(-5%,-50%); }
  #popupMessage p{ font-size:20px; }
  #popupMessage .close span{ font-size:15px; width:calc(100% - 20px); max-width:initial; }
  #popupClose{ padding:30px; }
}

/*------------------------------------------------------------------
/  STICKY CTA（下部固定バナー）
------------------------------------------------------------------*/
:root{ --sticky-cta-h:64px; }

.sticky-cta{
  position:fixed; left:0; right:0; bottom:0; z-index:9999;
  display:flex; gap:8px; justify-content:space-between;
  padding:10px 10px; min-height:var(--sticky-cta-h);
  /* フォールバック→env() */
  padding-bottom:10px;
  padding-bottom:calc(10px + env(safe-area-inset-bottom));
  background:rgba(255,255,255,.96);
  box-shadow:0 -6px 20px rgba(0,0,0,.12);
  transform:translateY(0);
  transition:transform .25s ease;
  will-change:transform;
}
.sticky-cta.is-hidden{ transform:translateY(100%); pointer-events:none; }

.sticky-cta .cta-btn{
  flex:1 1 0; display:inline-flex; align-items:center; justify-content:center;
  padding:12px 10px; border-radius:12px; text-decoration:none; font-weight:700; line-height:1.1;
  white-space:nowrap; word-break:keep-all; overflow:hidden; text-overflow:ellipsis;
  font-size:clamp(13px,3.9vw,16px);
}
.sticky-cta .cta-btn.tel{  background:#16a34a; color:#fff; }
.sticky-cta .cta-btn.form{ background:#f97316; color:#fff; }
.sticky-cta .cta-btn .icon{ line-height:1; flex:0 0 auto; margin-right:.45em; }
.sticky-cta .cta-btn .label{ font-weight:800; }
.sticky-cta .cta-btn .sub{ font-weight:700; font-size:.86em; margin-left:.2em; }

@media (max-width:360px){
  .sticky-cta{ gap:6px; padding-left:8px; padding-right:8px; }
  .sticky-cta .cta-btn{ padding-left:8px; padding-right:8px; font-size:clamp(12px,3.6vw,15px); }
  .sticky-cta .cta-btn .icon{ display:none; }
}
@media (min-width:1024px){ .sticky-cta{ display:none; } }

/* 入力中はボディ下余白を小さくしてフォームを隠さない */
@media (max-width:1023px){
  body.kb-open{
    padding-bottom: 10px;
    padding-bottom: calc(env(safe-area-inset-bottom) + 10px);
  }
}

/*------------------------------------------------------------------
/  BOTTOM TEL（最下部の電話番号を大きく中央に）
------------------------------------------------------------------*/
/* LP最下部の tel リンクを大きく・中央に統一 */
.footer-tel__link,
.area-contact a[href^="tel"]{
  display: block !important;
  width: max-content;
  margin: 8px auto 14px !important;
  float: none !important;
  font-size: clamp(40px, 13vw, 64px) !important;
  line-height: 1;
  letter-spacing: .02em;
  white-space: nowrap;
  word-break: keep-all;
  hyphens: manual; -webkit-hyphens: manual;
  -webkit-text-size-adjust: 100% !important;
}
/* 旧 .inside の左アイコン余白を無効化して横幅確保（footer内のみ） */
#footer ul li.inside{ padding-left:0 !important; background:none !important; }
/* footer内の tel を中央寄せ */
#footer a[href^="tel"]{
  display:block; width:max-content; margin:0 auto; float:none !important;
  white-space:nowrap; word-break:keep-all;
}

/* スマホはtel/ボタンを縦積み */
@media (max-width: 767px){
  #footer ul li{ width:100% !important; display:block !important; }
}
/* 極小画面でのサイズ調整 */
@media (max-width: 480px){
  #footer .footer-tel .footer-tel__link{
    font-size: clamp(34px, 10.5vw, 50px) !important;
  }
}

/*------------------------------------------------------------------
/  DISPLAY TWEAKS（このページで隠す要素・見た目調整）
------------------------------------------------------------------*/
/* ヘッダーの TEL リスト・バナーをこのページでは非表示 */
#fixedBox { display: none !important; }
#header .branding .contact { display: none !important; }

/* 固定CTA：画像の周囲の装飾を消して画像100%クリックに */
.sticky-cta .cta-btn,
.sticky-cta .cta-btn.tel,
.sticky-cta .cta-btn.form{
  background: transparent !important;
  padding: 0 !important;
  border-radius: 0 !important;
  box-shadow: none !important;
}
.sticky-cta .cta-btn img{
  display: block;
  width: 100%;
  height: auto;
}

/*------------------------------------------------------------------
/  CONTACT FORM: ERROR VISIBILITY（/sp/のフォームだけ赤字を非表示）
------------------------------------------------------------------*/
#contact .contact-form .wpcf7-not-valid-tip,
#contact .contact-form label.error,
#contact .contact-form p.error,
#contact .contact-form span.error,
#contact .contact-form .wpcf7-response-output{
  display: none !important;
}
/* /sp/ フォーム上部のサーバーエラーメッセージ欄を非表示 */
#contact .contact-form .contact-caution{
  display: none !important;
  margin: 0 !important;
  padding: 0 !important;
}

/* TEL無料チェック
-----------------------------------------------------*/
.tel-modal {
	position: fixed;
	z-index: 10000;
	top: 0;
	right: 0;
	bottom: 0;
	left: 0;
	background: rgba(0,0,0,0.5);
	width: 100vw;
	height: 100dvh;
	pointer-events: auto;
}
.tel-modal.disnon{
	display: none;
}

.posi-re {
	position: relative;
	width: 100%;
	height: 100%;
}
.posi-ce {
	position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    -webkit-transform: translate(-50%, -50%);
    -ms-transform: translate(-50%, -50%);
	background-color: #ffffff;
    border-radius: 10px;
    padding: 16px;
    width: 70%;
	max-width: 600px;
}
.posi-ce p {
	text-align: center;
	font-size: 23px;
}

.button-area {
	display: table;
	width: 100%;
}
.button-area > div {
	display: table-cell;
    width: 45%;
    text-align: center;
    font-size: 35px;
    font-weight: bold;
}
.button-area > div:nth-of-type(2) {
	width: 10%;
}
a.yes-button {
	background-color: #0aa7da;
	color: #ffffff;
	text-decoration: none;
	display: block;
	border-radius: 30px;
}
.no-button {
	background-color: #C0C0C0;
	color: #333333;
	text-decoration: none;
	display: block;
	border-radius: 30px;
}
.openmodal {pointer-events: auto;}

@media screen and (max-width: 767px) {
	.posi-ce p {
		font-size: 4.2vw;
	}
	.button-area > div {
		font-size: 7.2vw;
	}
	.openmodal {position: relative;}
	.openmodal .openmodal-btn {position: absolute;display: block;z-index: 1; width: 100%;height: 100%;}
}