@charset "UTF-8";
@font-face { font-family: 'rakuraku-icon'; src: url("../fonts/rakuraku-icon.eot?ct4fzh"); src: url("../fonts/rakuraku-icon.eot?ct4fzh#iefix") format("embedded-opentype"), url("../fonts/rakuraku-icon.ttf?ct4fzh") format("truetype"), url("../fonts/rakuraku-icon.woff?ct4fzh") format("woff"), url("../fonts/rakuraku-icon.svg?ct4fzh#rakuraku-icon") format("svg"); font-weight: normal; font-style: normal; font-display: block; }

[class^="icon-"], [class*=" icon-"] { /* use !important to prevent issues with browser extensions that change fonts */ font-family: 'rakuraku-icon' !important; speak: none; font-style: normal; font-weight: normal; font-variant: normal; text-transform: none; line-height: 1; /* Better Font Rendering =========== */ -webkit-font-smoothing: antialiased; -moz-osx-font-smoothing: grayscale; }

.icon-mail:before { content: "\e900"; color: #fff; }

/* 1)	初期設定 2)	hover 3)	modules 4)	header 5)	footer 6)	contents */
/*============================================================================================================ 初期設定 ============================================================================================================*/
body { color: #563A2F; -webkit-text-size-adjust: 100%; line-height: 1.4; }

div, h1, h2, h3, h4, h5, p, ul, li, dl, dt, dd, th, td, article, header, footer, nav, span, a { -webkit-box-sizing: border-box; box-sizing: border-box; }

a { color: inherit; text-decoration: none; }

img { height: auto; width: auto; max-width: 100%; line-height: 100%; vertical-align: bottom; }

h1, h2, h3, h4, h5 { line-height: 1.4; margin: 0; word-wrap: break-word; }

p, li, td, th, dt, dd { font-size: 26px; line-height: 1.4; margin: 0; word-wrap: break-word; }

@media screen and (max-width: 768px) { p, li, td, th, dt, dd { font-size: 15px; } }

table { width: 100%; border-collapse: collapse; }

th, td { text-align: left; font-weight: normal; vertical-align: top; word-break: break-all; }

ul, ol { padding: 0; margin: 0; }

.cf:after { content: ""; display: block; clear: both; }

.ico { margin: 1rem auto !important; }

@media screen and (min-width: 769px) { .sp { display: none !important; } }

@media screen and (max-width: 768px) { .pc { display: none !important; } }

/*------------------------------------------ フォント ------------------------------------------*/
body { font-family: 'M PLUS Rounded 1c', '源ノ角ゴシック', 'ヒラギノ角ゴシック Pro', 'Hiragino Kaku Gothic Pro', 'メイリオ', 'Meiryo', Osaka, 'ＭＳ Ｐゴシック', 'MS PGothic', sans-serif; }

/*------------------------------------------ 枠 ------------------------------------------*/
@media screen and (min-width: 769px) { body { min-width: 1200px; } }

/*============================================================================================================ hover ============================================================================================================*/
@media screen and (min-width: 769px) { a { -webkit-transition: all 0.3s ease-in-out; -moz-transition: all 0.3s ease-in-out; -o-transition: all 0.3s ease-in-out; transition: all 0.3s ease-in-out; }
  a:hover { filter: alpha(opacity=60); -moz-opacity: 0.6; opacity: 0.6; } }

/*============================================================================================================ module css ============================================================================================================*/
/*------------------------------------------ inner ------------------------------------------*/
.cmnInner01 { width: 100%; max-width: 1200px; margin: 0 auto; }

.cmnInner02 { width: 100%; max-width: 1000px; margin: 0 auto; }

/*============================================================================================================ header ============================================================================================================*/
#header { width: 100%; min-width: 1200px; position: fixed; top: 0; left: 0; background: #fff; z-index: 9998; }

#header .inner { font-family: '源ノ角ゴシック'; height: 80px; display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-pack: justify; -ms-flex-pack: justify; justify-content: space-between; -webkit-box-align: center; -ms-flex-align: center; align-items: center; }

#header .headerTtl a { display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-align: center; -ms-flex-align: center; align-items: center; }

#header .headerCv { height: 58px; width: 420px; display: flex; justify-content: space-between; }

#header .headerCv .btnTel { width: 240px; color: #5c392b; border: 1px solid #5c392b; display: block; padding: 0 10px; border-radius: 6px; overflow: hidden; }

#header .headerCv .contact { line-height: 1.8; }

#header .headerCv .tel { font-size: 0.65rem; margin-top: -.4rem; text-align: right; }

#header .headerCv .tel div:nth-child(1) { display: flex; align-items: center; margin-bottom: -1rem; }

#header .headerCv .btnTel .txt { float: left; font-size: 13px; margin: 17px auto 0 0; }

#header .headerCv .btnTel .tel_ico { display: inline-block; width: 2rem; height: 2rem;margin-right: 0.5rem; padding-top: 0.6rem; margin: 11px auto 4px 0; }

#header .headerCv .btnTel .tel_number { width: 190px; max-width: 100%;}

#header .headerCv .btnTel .time { float: right; font-size: 13px; font-weight: normal; margin: 0 7px 0 auto; }

#header .headerCv .btnMail { width: 170px; color: #fff; font-weight: normal; font-size: 16px; padding: 0; background: #5c392b url(../img/ico/mail_01.svg) no-repeat left 12% center; padding-left: 8%; border: 1px solid #fff; border-radius: 6px; display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-pack: center; -ms-flex-pack: center; justify-content: center; -webkit-box-align: center; -ms-flex-align: center; align-items: center; }

#header .headerCv .btnMail .icon-mail { display: inline-block; margin-right: 10px; color: inherit; }

#header .headerCv .btnMail .icon-mail:before { font-size: 19px; color: inherit; }

@media screen and (max-width: 768px) { #header { min-width: 100%; }
  #header .inner { height: 58px; padding: 0 12px; }
  #header .headerTtl { margin: 0 10px 0 0; }
  #header .headerTtl a { width:80%; }
  #header .headerTtl img { width: 100%; max-height: 100%; }
  #header .headerCv { width: auto; max-width: 250px; height: auto; display: flex; }
  #header .headerCv .btnTel { width: 100%; height: 40px; padding: 0 5px; display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-pack: center; -ms-flex-pack: center; justify-content: center; -webkit-box-align: center; -ms-flex-align: center; align-items: center; border: none; }
  #header .headerCv .btnTel img { float: none; margin: 0; width: 100%; max-height: 40px; } }

/*	footer
------------------------------------------*/

.outer-base-width {
  padding-left: 1.5%;
  padding-right: 1.5%;
  background-color: #065AAA;
  font-size: 8.3px;
  font-family: "Noto Sans JP", sans-serif;
}
.outer-base-width .ico { margin: auto!important; }
.wrap {
  max-width: 1150px;
  margin: 0 auto;
}
#contact {
  background-color: #065AAA;
  color: #fff;
  font-size: 1.25em;
}
#contact .contact_title p {
  font-size: 1.25em;
}
.contact_wrap {
  padding: 5.2% 0;
}
.lead { text-align: center; font-size: 1.2em; font-weight: 300; }

.contact_btn {
  margin-top: 60px;
  align-items: center;
  justify-content: space-around;
}
.flexbox {
  display: flex;
}
.contact_title img {
  max-width: 117px;
  width: 12rem;
}
.contact_web {
  padding: 1.7% 3.7%;
  background-color: rgba(255, 255, 255, 0.1);
  border: solid 1px #FFFFFF;
  border-radius: 50px;
  align-items: center;
}
.contact_web .ico {
  width: 4.1rem;
  max-width: 30px;
  margin: auto 2.2rem auto auto!important;
  
}
.contact_web p {
  font-size: 1.8em;
  font-weight: bold;
}
.contact_tell .ico {
  max-width: 41px;
  width: 4.1rem;
  margin: auto 1.3rem auto auto!important;
  align-self: center;
}
.contact_tell p {
  font-size: 13px;
}
.contact_tell p:first-child {
  margin-bottom: 0.3em;
}
.contact_tell p span {
  font-size: 2.3em;
  font-weight: bold;
}
.corp_wrap {
  padding: 25px 0;
  border-top: solid 1px;
  border-color: rgba(255, 255, 255, 0.37);
  text-align: center;
}
.corp_wrap ul {
  justify-content: center;
  margin-bottom: 1.5em;
}
.corp_wrap ul li {
  margin-right: 2em;
  font-size: 1.25em;
}
.corp_wrap ul li:last-child {
  margin-right: 0;
}
.corp_wrap .copy {
  font-size: 1.25em;
}

@media screen and (max-width: 768px) { 
  .outer-base-width {
    padding: 0;
  }
  .wrap {
    padding-left: 5.3%;
    padding-right: 5.3%;
    padding-top: 2%;
  }
  .wrap #contact .wrap {
    padding-left: 0;
    padding-right: 0;
  }

  .contact_wrap {
    padding: 0;
    padding-top: 1em;
  }
  .lead {
    font-family: "メイリオ" , Meiryo;
    font-size: 1.4em;
    line-height: 1.5;
  }
  .contact_btn.flexbox {
    display: block;
    text-align: center;
  }
  .contact_btn {
    margin-top: 5%;
  }
  .contact_btn.flexbox .contact_title, .contact_btn.flexbox .contact_web, .contact_btn.flexbox .contact_tell {
    margin-bottom: 5em;
  }
  .contact_web {
    margin-right: auto;
    margin-left: auto;
    color: #fff;
    padding: 20px;
    justify-content: center;
    max-width: 400px;
  }
  .contact_web .ico {
    margin: auto 2em auto 1em!important;
  }
  .contact_web .txt {
    margin-right: 1em;
  }
  .contact_web p {
    font-size: 1.5em;
    line-height: 1.2;
  }
  .contact_btn.flexbox .contact_tell {
    justify-content: center;
  }
  .contact_tell .ico {
    margin: auto 1em auto 1em!important;
  }
  .contact_tell p span {
    font-size: 2.2em;
    color: #FFF;
  }
  .corp_wrap {
    border-top: none;
    position: relative;
    padding: 0;
  }
  .corp_wrap ul {
    display: flex;
    flex-wrap: wrap;
    text-align: center;
    font-size: 100%;
    text-decoration: underline;
    line-height: 1.5;
    padding: 25px 0;
    margin-bottom: 0;
    justify-content: space-between;
  }
  .corp_wrap ul li {
    margin-right: 0;
    width: 49%;
  }
  .corp_wrap ul li:nth-child(n+3) {
    margin-top: 1em;
  }
  .copy {
    line-height: 1.7;
    padding: 1em 0;
  }
  .corp_wrap::after {
    content: "";
    position: absolute;
    top: 0;
    right: 50%;
    transform: translateX(50vw);
    width: 100vw;
    border-bottom: 1px solid;
    border-color: rgba(255, 255, 255, 0.37);
  }
}


/*	TOPへ戻る
------------------------------------------*/
#pagetop { width: 68px; height: 68px; z-index: 9990; right: 50px; bottom: 50px; position: fixed; display: none; }

#pagetop a { display: block; }

@media screen and (max-width: 768px) { #pagetop { width: 57px; height: 57px; right: 19px; bottom: 19px; } }

/*============================================================================================================ contents ============================================================================================================*/
#contents { padding: 80px 0 0; }

@media screen and (max-width: 768px) { #contents { padding: 58px 0 0; } }

/*========================================== #mainVisual ==========================================*/
#mainVisual { position: relative; }

#mainVisual .tit { width: 88%; position: absolute; left: 0; right: 0; top: 14%; margin: auto; z-index: 2; display: inherit; }

#mainVisual .tit img { width: 68%; }

#mainVisual .txt { width: 100%;text-align: center; position: absolute; left: 0; right: 0; bottom: -40px; margin: auto; z-index: 2; }

#mainVisual .txt img { width: 62.5%; }

#mainVisual .bgBox img { width: 100%; }

#mainVisual .mv_bk { position:relative; width: 100%; background: url(../img/bg/img_mv03_pc.png) no-repeat; background-size: cover; height: 37vw;}

#mainVisual .mv_bk .bgBox { position:absolute; top: 50%; left: 50%; transform: translate(-50%, -50%); width: 70%; margin: auto;display: flex; justify-content: space-evenly; align-items: center; }

#mainVisual .mv_txt { font-size: 24px; line-height:1.8; text-align: center; margin-top: 2rem; }

@media screen and (max-width: 768px) {
  #mainVisual { margin: 0 auto 12px; }
  #mainVisual .img_sp { width: 100%; }
  #mainVisual .mv_bk { position: relative; width: 100%; background: url(../img/bg/img_mv03_sp.png) center no-repeat; background-size: cover; height: unset; }
  #mainVisual .mv_bk .bgBox { position: relative; top: 0; left: 0; transform: unset; flex-direction: column; width: 84%; padding: 8% 0; }
  #mainVisual .mv_bk .bgBox .left { margin: 5%; }
  #mainVisual .mv_txt { font-size: 1rem; margin-top: 1rem; }
}

/*========================================== main ==========================================*/
/*------------------------------------------ #problem ------------------------------------------*/
#problem { padding: 0; overflow: hidden; }

#problem .leadBox { margin: 0 auto -8px; position: relative; z-index: 2; }

#problem .leadBox .inner { height: 180px; display: flex; justify-content: center; align-items: center; flex-direction: column; }

#problem .leadBox .txt01 { font-size: 36px; text-align: center; border-bottom: #F8D2D1 4px solid; padding: 0 2rem 0.5rem;}

#problem .txtBox { height: 662px; overflow: hidden; }

@media screen and (min-width: 1920px) { #problem .txtBox { position: relative; }
  #problem .txtBox:before, #problem .txtBox:after { content: ""; display: block; width: calc(50% - 900px); height: 8px; background: #000; position: absolute; bottom: 42px; }
  #problem .txtBox:before { left: 0; }
  #problem .txtBox:after { right: 0; } }

#problem .txtBox .img { max-width: none; left: 50%; margin-left: -965px; position: relative; }

#problem .resolution { margin: 9% auto 3%; background: #563A2F; position: relative; }

#problem .resolution .inner { height: 142px; display: flex; align-items: center; position: relative; justify-content: center; }

#problem .resolution .txt { color: #fff; font-size: 36px; margin: auto; padding-top: 0.8rem; }

#problem .resolution .img { margin: -5% auto 5% -5%; }

#problem .logo { padding: 24px 0 26px; text-align: center; background: #fff; position: relative; }

#problem .resolution::before { content: ""; display: block; width: 0; height: 0; border-style: solid; border-width: 26px 36px 0 36px; border-color: #fff transparent transparent transparent; position: absolute; left: 0; right: 0; margin: auto; }

#problem .resolution::after { content: ""; display: block; width: 0; height: 0; border-style: solid; border-width: 26px 36px 0 36px; border-color: #563A2F transparent transparent transparent; position: absolute; left: 0; right: 0; margin: auto; }

@media screen and (max-width: 768px) { 
  #problem div:not(.resolution) { width: 84%; margin: auto; }
  #problem .leadBox { height: 92px; margin: 0 auto; display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-pack: center; -ms-flex-pack: center; justify-content: center; -webkit-box-align: center; -ms-flex-align: center; align-items: center; }
  #problem .leadBox .inner { height: auto; display: block; width: 100%; }
  #problem .leadBox .txt01 { font-size: 1.3rem; margin: auto; padding: 0 0 0.5rem 0; }
  #problem .txtBox .img { max-width: 100%; margin: 0 auto; left: auto; }
  #problem .resolution { margin: 24% auto 0; }
  #problem .resolution .inner { height: 12rem; flex-direction: column-reverse; padding: 0 0 5% 0 ; }
  #problem .resolution .txt { font-size: 1.3rem; margin: 0 auto; text-align: center; }
  #problem .resolution::before { display: none; }
  #problem .resolution .img { margin: -17% 0 auto;  }
}


/*------------------------------------------ #intro ------------------------------------------*/
#intro { text-align: center; background: url(../img/bg/bg_intro.png) center no-repeat; background-size: cover; padding: 5rem; margin-top: -3%; }

#intro .leadBox .txt01 { font-size: 24px; line-height: 2;}

#intro .leadBox .logo { margin: 1rem auto 2.5rem;}

#intro .leadBox .txt02 { font-size: 36px; text-align: center; margin: 2rem auto auto auto; width:15em; background:linear-gradient(transparent 60%, #F8D2D1 60%);}

#intro .box01 .img { width: 100%; }

#intro .box01 .lead { color: #fff; font-size: 35px; width: 64%; letter-spacing: -2px; line-height: 1.6; margin: 0 0 39px auto; text-shadow: 2px 2px 0 #000; }

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

.box02 .list .item { width: 31%; }

.box02 .list .item .ico { text-align: center; margin: 0 auto 13px; display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-pack: center; -ms-flex-pack: center; justify-content: center; -webkit-box-align: center; -ms-flex-align: center; align-items: center; }

.box02 .list .item .txt { text-align: center; font-size: 20px; line-height: 1.6; }

@media screen and (max-width: 768px) { 
  #intro { padding: 3rem 0; }
  #intro div:not(.resolution) { width: 84%; margin: auto; }
  #intro .inner { width: 100%!important;}
  #intro .leadBox .txt01 { font-size: 1.3rem; line-height: 1.6; }
  #intro .leadBox .txt02 { width: auto; font-size: 4.5vw; }
  .box02 .list { flex-direction: column; }
  .box02 .list .item { width: 100%; }
  .box02 .list .item .txt { font-size: 1rem; margin-top: 1rem; }
}

/*------------------------------------------ #service ------------------------------------------*/
#service { padding: 5rem; }

#service .service_inner { width: 90%; max-width:900px; margin: auto; border: #DDDDDD 6px solid; border-radius: 30px; }

#service .leadBox { margin: 0 auto -8px; position: relative; z-index: 2; }

#service .leadBox .inner { height: 180px; margin: -1rem auto -2rem; display: flex; justify-content: center; align-items: center; flex-direction: column; }

#service .leadBox .txt01 { font-size: 30px; text-align: center; border-bottom: #F8D2D1 4px solid; padding: 0 2rem 0.5rem; }

#service ul.list { display: flex; align-items: center; justify-content: center; text-align: center; }

#service .item { width:33.3%;}

#service .txt { font-size: 18px; padding: 5px 30px 40px 30px;}

@media screen and (max-width: 768px) { 
  #service { padding: 4rem 0; }

  #service .service_inner { width: 86%; }

  #service ul.list { flex-direction: column; }

  #service .item { width: 100%; }
}


/*------------------------------------------ #cv ------------------------------------------*/
#cv { padding: 3rem 0; background: #5c392b; height: 11rem; }

#cv .lead { color: #5c392b; background-color: #fff; border-radius: 50px; width: 30rem; text-align: center; font-size: 30px; margin: 0 auto 35px; padding: 5px; }

#cv .btnTel { color: #fff; float: left; display: block; width: 51%; margin-top: -1%; }

#cv .btnTel img { width: 100%; margin-bottom: -3%; }

#cv .btnTel .time { font-size: 20px; font-weight: normal; margin: 0 0 0 67px; }

#cv .btnMail { font-family:'源ノ角ゴシック'; width: 42%; height: 83px; color: #fff; float: right; font-size: 30px; padding: 2px 0 0 0; border: 2px solid #fff; border-radius: 10px; background: url(../img/ico/mail_02.svg) no-repeat; display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-pack: center; -ms-flex-pack: center; justify-content: space-evenly; -webkit-box-align: center; -ms-flex-align: center; align-items: center; justify-content: flex-end; background-position-y: center; background-position: left 7% bottom 50%; padding-right: 2.5%; }

#cv .btnMail:hover { background: #fff url(../img/ico/mail_03.svg) no-repeat; color: #5c392b; background-position: left 7% bottom 50%; padding-right: 2.5%; opacity: 1; }

#cv .tel { width: 100%; font-size: 4rem; font-weight: bold; color: #fff; background: url(../img/ico/tel_02.svg) no-repeat; background-position-y: bottom; background-size: 12%; padding-left: 70px; line-height: 1.0;  margin-top: -1%; }

#cv .tel small { font-family:'源ノ角ゴシック'; color: #fff; display: block; font-size: 1.2rem; font-weight: normal; text-align: center; margin-top: 10px; }

@media screen and (max-width: 768px) { 
  #cv { height: unset; }
  #cv .cmnInner02 { width: 84%; }
  #cv .lead { font-size: 4.5vw; margin-bottom: 20px; padding: 3vw 1vw; width: 80%; }
  #cv .btnTel { width: 100%; margin-top: -1%; }
  #cv .tel { font-size: 11.5vw; padding-left:14vw; margin-top: 1%; background-position-y: center; }
  #cv .tel small { font-size: 3.2vw; line-height: 1.6;}
  #cv .btnMail { width: 100%; float: none; font-size: 4.5vw; height: 14vw; padding: 1px 0 0 7%; margin-top: 33%; background-size: 8vw; justify-content: center; }
  #cv .btnMail:hover { background-size: 8vw; }
}

/*------------------------------------------ #flow ------------------------------------------*/
#flow { padding: 5rem; }

#flow .txtBox .inner { background-color: #ffd4d2; background-size: cover; padding: 30px 0; display: -webkit-box; display: -ms-flexbox; display: flex; }

#flow .txtBox .cmnInner01 .txt { background-color: #F8D2D1; border-radius: 50px; text-align: center; font-size: 30px; width:40rem; padding: 12px 0 9px; margin: 0 auto 35px; }

#flow .txtBox .cmnInner01 .flow01 { display: block; margin: 3rem auto; width: 84%; padding-bottom: 6vw;}

#flow .txtBox .txt { font-size: 32px; line-height: 1.45; }

#flow .txtBox .flow_dc { background-color: #F8D2D1; border-radius: 30px; display: flex; align-items: center; justify-content: space-evenly; padding: 3rem 5rem 3rem 2rem; margin-bottom: 5rem; }

#flow .txtBox .flow_dc .left { width: 40%; }

#flow .txtBox .flow_dc .right { width: 55%; }

#flow .txtBox .flow_dc .left { margin: calc(50% - 50vw) 0; }

#flow .txtBox .flow_dc .right .point { display: flex; align-items: center; }

#flow .txtBox .flow_dc .right .point .ico { font-size: 40px; }

#flow .txtBox .flow_dc .right .point .ico img { margin-right: 1.8rem; width: 3.3rem; }

#flow .txtBox .flow_dc .right .point p { font-size: 1rem; line-height: 1.8; }

@media screen and (max-width: 768px) { 
  #flow { padding: 4rem 0; width: 84%; margin: auto; }

  #flow .txtBox .flow_dc { flex-direction: column; padding: 10% 2%; text-align: center; margin-top: 30%; margin-bottom: 0; }

  #flow .txtBox .flow_dc .left { width: 90%; margin: -32% 0 calc(50% - 40vw) 0; }
  
  #flow .txtBox .flow_dc .right { width: 90%; }

  #flow .txtBox .flow_dc .right .point { flex-direction: column; margin-top: 5%; }

  #flow .txtBox .flow_dc .right .point p { font-size: 3.6vw; }

  #flow .leadBox:before { border-width: 13px 12px 0 12px; }

  #flow .leadBox .inner { height: 174px; display: block; padding-top: 123px; }

  #flow .leadBox .txt { font-size: 6vw; margin: 0 auto; text-align: center; }
  
  #flow .leadBox .img { top: -23px; left: 0; right: 0; margin: auto; width: 232px; }
  
  #flow .txtBox .cmnInner01 .txt { font-size: 5vw; width:auto; }
}

  /*------------------------------------------ #inquiry ------------------------------------------*/
  #inquiry { text-align: center; background: url(../img/bg/bg_intro.png) no-repeat; background-size: cover; padding: 5rem; }

  #inquiry .bgBox { display: flex; align-items: center; justify-content: center; gap: 5%; margin-left: -10vw; }

  #inquiry .bgBox .left, #inquiry .bgBox .right { display: flex; flex-direction: column; align-items: center; }

  #inquiry .bgBox .left .item { background-color: #F8D2D1; padding: 0.8rem 0 0.5rem; width: 16rem; border-radius: 50px; font-size: 1.3rem; margin-bottom: 2rem; }
  
  #inquiry .bgBox .left .btn { background-color: #563A2F; color:#fff; padding: 0.9rem 0 0.7rem; width: 24rem; border-radius: 10px; font-size: 1.1rem; margin-top: 2rem; }

  #inquiry .bgBox .left .btn a { display: flex; align-items: center; justify-content: center; }
  
  #inquiry .bgBox .right .item { background-color: #F8D2D1; padding: 0.8rem 0 0.5rem; width: 24rem; border-radius: 50px; font-size: 1.3rem; margin-bottom: 2rem; }

  #inquiry .bgBox .right .list { display: flex; flex-direction: column; align-items: center; }

  #inquiry .bgBox .right .list .btnTel { float: left; display: block; }

  #inquiry .bgBox .right .list .tel { font-size: 3.8rem; font-weight: bold; background: url(../img/ico/tel_01.svg) no-repeat; background-position-y: bottom; background-size: 12%; padding-left: 50px; line-height: 1.0; }

  #inquiry .bgBox .right .list .tel small { font-family: '源ノ角ゴシック'; display: block; font-size: 1.2rem; font-weight: normal; text-align: center; margin-top: 10px; }
  
  #inquiry .bgBox .right .list .btnMail { font-family: '源ノ角ゴシック'; width: 100%; height: 83px; background-color: #fff; border:#563A2F 2px solid; margin: 2rem auto; float: right; font-size: 1.3rem; padding: 2px 0 0 0; border-radius: 10px; display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-pack: center; -ms-flex-pack: center; justify-content: space-evenly; -webkit-box-align: center; -ms-flex-align: center; align-items: center; }

  @media screen and (max-width: 768px) { 
    #inquiry { padding: 4rem 0; margin: auto; }

    #inquiry .bgBox { gap: 0; width: 84%; margin: auto;}

    #inquiry .bgBox .left { width: 100%; }

    #inquiry .bgBox .left .btn { width: 100%; font-size: 0.9rem; padding: 0.9rem 0.5rem 0.7rem; }

    #inquiry .bgBox .left .btn a img { padding-bottom: 0.2rem; }
  }
/*------------------------------------------ loading ------------------------------------------*/
#loading { text-align: center; position: fixed; display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-pack: center; -ms-flex-pack: center; justify-content: center; -webkit-box-align: center; -ms-flex-align: center; align-items: center; width: 100%; height: 100%; background: #fff; z-index: 9999; }

.loader { font-size: 10px; margin: 50px auto; text-indent: -9999em; width: 80px; height: 80px; border-radius: 50%; background: #4c4c4c; background: -moz-linear-gradient(left, #4c4c4c 10%, rgba(76, 76, 76, 0) 42%); background: -webkit-linear-gradient(left, #4c4c4c 10%, rgba(76, 76, 76, 0) 42%); background: -o-linear-gradient(left, #4c4c4c 10%, rgba(76, 76, 76, 0) 42%); background: -ms-linear-gradient(left, #4c4c4c 10%, rgba(76, 76, 76, 0) 42%); background: linear-gradient(to right, #4c4c4c 10%, rgba(76, 76, 76, 0) 42%); position: relative; -webkit-animation: load3 1.4s infinite linear; animation: load3 1.4s infinite linear; -webkit-transform: translateZ(0); -ms-transform: translateZ(0); transform: translateZ(0); position: absolute; top: 0; bottom: 0; left: 0; right: 0; margin: auto; }

.loader:before { width: 50%; height: 50%; background: #4c4c4c; border-radius: 100% 0 0 0; position: absolute; top: 0; left: 0; content: ''; }

.loader:after { background: #ffffff; width: 75%; height: 75%; border-radius: 50%; content: ''; margin: auto; position: absolute; top: 0; left: 0; bottom: 0; right: 0; }

@-webkit-keyframes load3 { 0% { -webkit-transform: rotate(0deg);
    transform: rotate(0deg); }
  100% { -webkit-transform: rotate(360deg);
    transform: rotate(360deg); } }

@keyframes load3 { 0% { -webkit-transform: rotate(0deg);
    transform: rotate(0deg); }
  100% { -webkit-transform: rotate(360deg);
    transform: rotate(360deg); } }