@charset "utf-8";

/* ===================================
   リセット・汎用クラス　　　　　　　　　　　　　　　　
=================================== */
body{
   padding: 0;
   margin: 0 !important;
   font-size: 100%;
}
.malp{
   font-family: "Roboto","Noto Sans JP",sans-serif;
   font-optical-sizing: auto;
   font-weight: 400;
   font-style: normal;
}
.malp main h1,
.malp main h2,
.malp main h3,
.malp main h4,
.malp main div,
.malp main p,
.malp main ul,
.malp main ol,
.malp main li,
.malp main dl,
.malp main dt,
.malp main dd,
.malp main table,
.malp main th,
.malp main td{
margin: 0;
padding: 0;
font-size: 16px;
color: #111;
line-height: 1.8;
box-sizing: border-box;
}
.malp main .contents_wrap{
   width: 1000px;
   margin: 0 auto;
   padding: 80px 0;
}
.malp main .contents_wrap h2{
   font-size: 42px;
   font-weight: 900;
   text-align: center;
   line-height: 1.4;
   margin: 0 0 40px 0;
   padding-bottom: 14px;
   letter-spacing: 0.04em;
   position: relative;
}
.malp main .contents_wrap h2::after{
   content: "";
   width: 90px;
   height: 3px;
   background: url("../images/bg_h2_dot.png") center center repeat-x;
   position: absolute;
   bottom: 0;
   left: 0;
   right: 0;
   margin: auto;
}
.malp main .contents_wrap h2 span{
   display: block;
   font-size: 16px;
   font-weight: 600;
   margin-bottom: 3px; 
   color: #00a7ac;
}
.malp main .contents_wrap h2 + p{
   text-align: center;
   margin-bottom: 40px;
}
.malp a{
   text-decoration: none;
   color: #00a7ac;
}
.malp main img{
   border: none;
   vertical-align: middle;
}
.malp main ul li,
.malp main ol li{
   list-style: none;
}
.malp main sup{
   vertical-align: top;
}
.malp main .note{
   display: block;
   font-size: 0.85rem;
   line-height: 1.8 !important;
   padding-left: 1em;
   text-indent: -1em;
}
.malp main .note a{
   text-decoration: underline;
}
.malp main .indent{
   display: block;
   padding-left: 1em;
   text-indent: -1em;
}
.malp main .txt_small{
   font-size: 0.8rem;
}

@media screen and (max-width: 767px){
body{
   margin: 0 0 0 0 !important;
}
.malp main h1,
.malp main h2,
.malp main h3,
.malp main h4,
.malp main div,
.malp main p,
.malp main ul,
.malp main ol,
.malp main li,
.malp main dl,
.malp main dt,
.malp main dd,
.malp main table,
.malp main th,
.malp main td{
margin: 0;
padding: 0;
font-size: 15px;
color: #111;
line-height: 1.8;
box-sizing: border-box;
}
.malp main .contents_wrap{
   width: 100%;
   padding: 40px 5%;
   box-sizing: border-box;
}
.malp main .contents_wrap h2{
   font-size: 26px;
   margin: 0 0 30px 0;
   padding-bottom: 12px;
}
.malp main .contents_wrap h2 span{
   font-size: 14px;
}
.malp main .contents_wrap h2 + p{
   text-align: left;
   margin-bottom: 20px;
}
#page-top {
   bottom: 65px;
}
/* #header #head_btncontact {
   right: 0px;
} */
}

/* ===================================
   フッター　　　　　　　　　　　　　　　　
=================================== */
@media screen and (max-width: 767px){
#footerCredit{
   padding: 15px 0 70px;
}
}

/* ===================================
   共通パーツ　　　　　　　　　　　　　　　
=================================== */
.bgc_green {
   background-color: #e3f3f3;
}
.sp_only{
   display: none;
}
.center_img{
   display: flex;
   justify-content: center;
}
.pt0{
   padding-top: 0!important;
}
.pt40{
   padding-top: 40px!important;
}
.mb120{
   margin-bottom: 120px!important;
}
@media screen and (max-width: 767px){
   .sp_only {
      display: block;
   }
   .pt40{
   padding-top: 0!important;
}
}

/* =========================================
   MV
========================================= */
.sec { padding: clamp(40px, 6vw, 80px) 0; }
.sec__inner { width: min(1120px, 92vw); margin: 0 auto; }
.sec__title {
  text-align: center;
  font-weight: 700;
  letter-spacing: .02em;
  font-size: clamp(20px, 2.4vw, 28px);
  color: #0f3237;
  margin: 0 0 clamp(28px, 3.5vw, 40px);
}
.sec--flat { padding-top: clamp(24px, 4vw, 40px); padding-bottom: clamp(24px, 4vw, 40px); }

#mv {
  position: relative;
  isolation: isolate;
  overflow: hidden;
  min-height: clamp(520px, 60vw, 680px);
  display: grid;
  place-items: center;
}
#mv .mv__bg {
  position: absolute; inset: 0;
  background: url("../images/bg_mv_pc.jpg") center/cover no-repeat;
  opacity: 1;
  z-index: -1;
}
#mv .mv__inner {
  display: grid;
  grid-template-columns: 1fr;
  grid-template-rows: auto auto auto;
  grid-template-areas:"title""frame""lead";
  align-items: start;
  width: min(1120px, 92vw);
  margin-inline: auto;
  margin-top: 50px;

}
.mv__title { grid-area: title; margin: 0; }
.mv__frame { grid-area: frame; }
.mv__lead  { grid-area: lead; }

.mv__inner .mv__title {
  line-height: 1.25;
  margin: 0;
  color: #111;
  font-size: 3.75rem;
  line-height: 80px;
  margin-bottom: 40px;
  margin-top: 50px;
  font-weight: 900;
  letter-spacing: 0.1rem;
}
.mv__inner .mv__title span{
background-color: #fff;
}

@media (max-width: 767px) {
   #mv .mv__bg {
      background: url(../images/bg_mv_sp.jpg) right top / cover no-repeat;
      background-size: 700px;
}
  #mv .mv__inner {
   grid-template-columns: 1fr;
   grid-template-rows: auto auto auto;
   grid-template-areas:"title""frame""lead";
   margin-top: 40px;
  }
  .mv__inner .mv__title {
  line-height: 1.5em;
  font-size: 2.25em;
  margin-top: 0;
}
}

/* リード文 */
.mv__lead{
   margin: 40px 0 60px 0!important;
}
.mv__lead .mv__sub {
  color: #00a7ac;
  font-weight: 900;
  margin-bottom: 25px;
  font-size: 1.5em;
  letter-spacing: 0.075rem;
}
.mv__lead .mv__sub span{
   background-color: #fff;
   padding: 5px 10px;
}
.mv__lead .mv__text {
  color: #00a7ac;
  margin: 0;
  font-size: 1.075rem;
  letter-spacing: 0.075rem;
  line-height: 35px;
}
.mv__lead .mv__text span {
   background-color: #fff;
   padding: 3px 10px;
}
:root { --kob-teal: #00a7ac; }
.mv__frame {
  border-radius: 14px;
  background: #fff;
  border: 1px solid var(--kob-teal);
  padding: clamp(10px, 1.2vw, 14px);
  box-shadow: 0 12px 36px rgba(0,0,0,.14);
  display: block;
  width: 730px;
  margin: 0 auto!important;
}
.mv__slide {
  position: relative;
  aspect-ratio: 16/10;
  overflow: hidden;
  border-radius: 10px;
  margin: 15px;
}

.mv__slide img {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  object-fit: cover; object-position: center;
  display: block;
  opacity: 0;
  animation: mvFade 13s infinite;
}
.mv__slide img:nth-child(1) { animation-delay: 0s; }
.mv__slide img:nth-child(2) { animation-delay: 5s; }
.mv__slide img:nth-child(3) { animation-delay: 10s; }

@keyframes mvFade {
  0%   { opacity: 0; }
  5%   { opacity: 1; }
  45%  { opacity: 1; }
  50%  { opacity: 0; }
  100% { opacity: 0; }
}

@media (max-width: 767px) {
   .mv__frame{
      width: 100%;
   }
   .mv__lead {
   margin: 40px 0 24px 0 !important;
}
   .mv__lead .mv__sub{
   font-size: 1.1em;
   margin-bottom: 10px;
   }
   .mv__lead .mv__text {
    font-size: 12.5px;
    line-height: 33px;
    letter-spacing: 0.02rem;
   }
   #worries .sec__title {
    font-size: 1.5em;
}
}
/* =========================================
   こんな不安ありませんか？
========================================= */
#worries {
   background: #00a7ac;
   position: relative;
   z-index: 1;   
}
#worries::after {
  content: "";
  position: absolute;
  left: 50%;
  transform: translateX(-50%);
  bottom: -48px;
  width: 0;
  height: 0;
  border-left: 50px solid transparent;
  border-right: 50px solid transparent;
  border-top: 50px solid #00a7ac;
}
#worries .sec{
   padding: 75px 0;
}
#worries .sec__inner{
   margin: 0 auto;
}
#worries .sec__title{
   color: #fff;
   font-size: 2.625em;
   margin-bottom: 30px;
}
.worries__list {
  list-style: none; margin: 0; padding: 0;
  display: flex;
  justify-content: center;
  gap: 20px;
}
.worries__list .worries__item {
  background: #fff;
  border: 1px solid #fff;
  border-radius: 6px;
  text-align: left;
  padding: 35px 25px;
  width: 320px;
}
.worries__icon{ 
   text-align: center;
}
.worries__icon img { 
   width: 150px;
   height: auto;
}
.worries__item .worries__head {
  color: #111;
  font-weight: 700;
  line-height: 1.4;
  text-align: center;
  font-size: 1.25em;
  margin-bottom: 30px;
}
.worries__item .worries__txt {
  color: #111;
  font-size: 0.9em;
  line-height: 1.8;
  margin-top: 30px;
}
@media (max-width: 767px) {
  .worries__list { 
   flex-direction: column; 
}
#worries .sec__title {
    font-size: 1.5em;
}
.worries__list .worries__item {
   width: 90%;
   margin: 0 auto;
}
#worries::after {
  bottom: -37px;
  border-left: 40px solid transparent;
  border-right: 40px solid transparent;
  border-top: 40px solid #00a7ac;
}
}

/* =========================================
　購入前の不安にお応えします。
========================================= */
#to-zero .to-zero__balloon{
   text-align: center;
   font-size: 2.65em;
   font-weight: 700;
   color: #00a7ac;
   margin: 55px auto 20px auto;
}
#to-zero .to-zero__balloon_sub{
   text-align: center;
   color: #00a7ac;
   font-size: 1.15em;
}
#to-zero .sec__inner{
   margin: 0 auto;
}
.tozero__actions {
   display: flex;
   gap:20px;
   justify-content: center;
   flex-wrap: wrap;
   margin: 50px auto 80px auto!important;
   flex-direction: row;
   justify-content: center;
   align-items: center;
}
.tozero__btn {
   width: 100%;
   max-width: 320px;
   display: flex;
   justify-content: center;
   align-items: center;
   gap: 10px;
   background-color: #e2fbfb;
   color: #00a7ac;
   border: 2px solid #00a7ac;
   border-radius: 999px;
   padding: 15px 18px;
   font-weight: 700;
   text-decoration: none;
}


.tozero__actions li {
   display: block;
   width: auto; 
   margin: 0;
}

.tozero__btn {
   width: 320px;
   max-width: none;
   margin: 0;
}

.tozero__btn:hover{
   background-color: #fff;
}
@media (max-width: 767px) {
   #to-zero .to-zero__balloon {
   font-size: 2em;
   line-height: 1.5em;
   margin: 40px auto 20px auto;
   }
   .tozero__actions {
      flex-direction: column;
      align-items: center;
      margin: 30px auto !important;
   }
   .tozero__actions li {
      width: 100%;
      display: flex;
      justify-content: center;
      margin: 0 auto !important;
   }
   .tozero__actions li img{
      width: 20px;
   }
   .tozero__btn {
      margin: 0 auto;
      max-width: 320px;
   }
}


/* ===================================
   故障やサポート体制の不安を解決
=================================== */
.after_service #anc_support .support_box h3{
   font-size: 22px;
   font-weight: 800;
   margin-bottom: 20px;
   border-bottom: 1px solid #111;
}
.after_service #anc_support .support_box p{
   margin-bottom: 30px;
   display: flex;
}
.after_service #anc_support .support_box .support_innerbox{
   margin-bottom: 50px;
}
.after_service #anc_support .support_box .support_innerbox:last-child{
   margin-bottom: 0;
}
.after_service #anc_support .support_box .support_innerbox div:first-child{
   float: right;
   width: 48%;
}
.after_service #anc_support .support_box .support_innerbox div img{
   width: 100%;
   border-radius: 10px;
}
.after_service #anc_support .support_box .support_innerbox div:last-child{
   float: left;
   width: 48%;
}
.after_service #anc_ssupport .support_box .support_innerbox div:last-child p{
   margin-bottom: 30px;
}
.support_box p {
   display: block;
   width: 100%;
}

@media screen and (max-width: 767px){
.after_service #anc_support .support_box h3{
   font-size: 18px;
}
.after_service #anc_support .support_box .support_innerbox{
   margin-bottom: 30px;
}
.after_service #anc_support .support_box .support_innerbox div:first-child{
   float: none;
   width: 100%;
   margin-bottom: 20px;
}
.after_service #anc_ssupport .support_box .support_innerbox div img{
   width: 100%;
   border-radius: 10px;
}
.after_service #anc_support .support_box .support_innerbox div:last-child{
   float: none;
   width: 100%;
}
.after_service #anc_support .support_box .support_innerbox div:last-child p{
   margin-bottom: 20px;
}
}

/* ===================================
   維持管理の不安を解決
=================================== */
.after_service #anc_warranty .warranty_box h3{
   font-size: 22px;
   font-weight: 800;
   margin-bottom: 20px;
   border-bottom: 1px solid #111;
}
.after_service #anc_warranty .warranty_box p{
   margin-bottom: 30px;
   display: flex;
}
.after_service #anc_warranty .warranty_box .warranty_innerbox{
   margin-bottom: 50px;
}
.after_service #anc_warranty .warranty_box .warranty_innerbox:last-child{
   margin-bottom: 0;
}
.after_service #anc_warranty .warranty_box .warranty_innerbox div:first-child{
   float: right;
   width: 48%;
}
.after_service #anc_warranty .warranty_box .warranty_innerbox div img{
   width: 100%;
   border-radius: 10px;
}
.after_service #anc_warranty .warranty_box .warranty_innerbox div:last-child{
   float: left;
   width: 48%;
}
.after_service #anc_swarranty .warranty_box .warranty_innerbox div:last-child p{
   margin-bottom: 30px;
}

@media screen and (max-width: 767px){
.after_service #anc_warranty .warranty_box h3{
   font-size: 18px;
}
.after_service #anc_warranty .warranty_box .warranty_innerbox{
   margin-bottom: 30px;
}
.after_service #anc_warranty .warranty_box .warranty_innerbox div:first-child{
   float: none;
   width: 100%;
   margin-bottom: 20px;
}
.after_service #anc_swarranty .warranty_box .warranty_innerbox div img{
   width: 100%;
   border-radius: 10px;
}
.after_service #anc_warranty .warranty_box .warranty_innerbox div:last-child{
   float: none;
   width: 100%;
}
.after_service #anc_warranty .warranty_box .warranty_innerbox div:last-child p{
   margin-bottom: 20px;
}
}


/* ===================================
   修理費用の不安を解決
=================================== */
.after_service #anc_management .management_box h3{
   font-size: 22px;
   font-weight: 800;
   margin-bottom: 20px;
   border-bottom: 1px solid #111;
}
.after_service #anc_management .management_box p{
   margin-bottom: 30px;
   display: flex;
}
.after_service #anc_management .management_box .management_innerbox{
   margin-bottom: 50px;
}
.after_service #anc_management .management_box .management_innerbox:last-child{
   margin-bottom: 0;
}
.after_service #anc_management .management_box .management_innerbox div:first-child{
   float: right;
   width: 48%;
}
.after_service #anc_management .management_box .management_innerbox div img{
   width: 100%;
   border-radius: 10px;
}
.after_service #anc_management .management_box .management_innerbox div:last-child{
   float: left;
   width: 48%;
}
.after_service #anc_smanagement .management_box .management_innerbox div:last-child p{
   margin-bottom: 30px;
}

.management_innerbox .app_box{
   width: 755px;
   margin-top: 50px;
}
.management_innerbox .app_box .app_box_inner .note{
   font-size: 0.75em;
   padding-top: 10px;
}
.management_innerbox .app_box .app_box_inner .app_box_inner_contents{
   display: flex;
   clear: both!important;
   width: 100%!important;
   align-items: end;
}
.management_innerbox .app_box .app_box_inner .app_box_inner_contents .store{
   height: 55px;
   width: auto!important;
}
.management_innerbox .app_box .app_box_inner .app_box_inner_contents .qrcode img{
   width: 62%!important;
   border: 1px solid #111;
   border-radius: 0!important;
}
.management_innerbox .app_box .app_box_inner .app_box_inner_contents .and img{
   margin-left: 35px;
}


@media screen and (max-width: 767px){
.after_service #anc_management .management_box h3{
   font-size: 18px;
}
.after_service #anc_management .management_box .management_innerbox{
   margin-bottom: 30px;
}
.after_service #anc_management .management_box .management_innerbox div:first-child{
   float: none;
   width: 100%;
   margin-bottom: 20px;
}
.after_service #anc_smanagement .management_box .management_innerbox div img{
   width: 100%;
   border-radius: 10px;
}
.after_service #anc_management .management_box .management_innerbox div:last-child{
   float: none;
   width: 100%;
}
.after_service #anc_management .management_box .management_innerbox div:last-child p{
   margin-bottom: 20px;
}
.management_innerbox .app_box {
    width: 100%;
}
.management_innerbox .app_box .mb50{
    margin-bottom: 50px;
}
.management_innerbox .app_box .app_box_inner .app_box_inner_contents{
   margin-bottom: 0!important;
}
.management_innerbox .app_box .app_box_inner .app_box_inner_contents div{
   margin-bottom: 0!important;
}
.management_innerbox .app_box .app_box_inner .app_box_inner_contents .and img {
    margin-left: 20px;
}
.management_innerbox .app_box .app_box_inner .app_box_inner_contents .ios{
margin-left: 58px;
}
.management_innerbox .app_box .app_box_inner .app_box_inner_contents .qrcode img{
   width: 100px!important;
}
}

/* ===================================
   CTA
=================================== */
.after_service #anc_cta .contents_wrap{
   padding: 60px 0;
}
.after_service #anc_cta .cta_box{
   display: flex;
   width: 1000px;
   margin: 0 auto;
   justify-content: center;
}
.after_service #anc_cta .cta_box p{
   font-size: 14px;
   text-align: center;
}
.after_service #anc_cta .cta_box div:nth-child(1){
   margin-right: 30px;
}
.after_service #anc_cta .cta_box div a{
   display: block;
   text-align: center;
   transition: all .2s ease-out;
   margin: 0 auto;
}
.after_service #anc_cta .cta_box div a strong{
   font-size: 20px;
}
.after_service #anc_cta .cta_box div:nth-child(1) a{
   background-color: #fff;
   background-size: 29px;
   padding: 15px 90px;
   border: 2px solid #00a7ac;
   border-radius: 50px;
}
.after_service #anc_cta .cta_box div:nth-child(2) a{
   background-color: #00a7ac;
   color: #fff;
   background-size: 32px;
   padding: 15px 70px;
   border: 2px solid #00a7ac;
   border-radius: 50px;
}
.after_service #anc_cta .cta_box div:nth-child(1) a:hover{
   color: #fff;
   background-color: #00a7ac;
   border: 2px solid #00a7ac;
   background-size: 29px;
}
.after_service #anc_cta .cta_box div:nth-child(2) a:hover{
   color: #00a7ac;
   background-color: #fff;
   border: 2px solid #00a7ac;
   background-size: 32px;
}
.after_service #anc_cta .cta_box div{
   position: relative;
}
.after_service #anc_cta .cta_box div:nth-child(1) a::before{
   position: absolute;
   content: "";
   width: 10px;
   height: 10px;
   border-left: 2px solid #00a7ac;
   border-bottom: 2px solid #00a7ac;
   display: block;
   -webkit-transform: rotate(-135deg);
   transform: rotate(-135deg);
   position: absolute;
   right: 20px;
   top: 44%;
   -webkit-transition: 0.4s;
   transition: 0.4s;
}
.after_service #anc_cta .cta_box div:nth-child(1) a:hover:before{
   border-left: 2px solid #fff;
   border-bottom: 2px solid #fff;
}
.after_service #anc_cta .cta_box div:nth-child(2) a::before{
   position: absolute;
   content: "";
   width: 10px;
   height: 10px;
   border-left: 2px solid #fff;
   border-bottom: 2px solid #fff;
   display: block;
   -webkit-transform: rotate(-135deg);
   transform: rotate(-135deg);
   position: absolute;
   right: 20px;
   top: 44%;
   -webkit-transition: 0.4s;
   transition: 0.4s;
}
.after_service #anc_cta .cta_box div:nth-child(2) a:hover::before{
   border-left: 2px solid #00a7ac;
   border-bottom: 2px solid #00a7ac;
}

@media screen and (max-width: 767px){
.after_service #anc_cta .contents_wrap{
   padding: 40px 20px;
}
.after_service #anc_cta .contents_wrap > p{
   font-size: 18px;
   letter-spacing: 0.05em;
}
.after_service #anc_cta .contents_wrap > p::before,
.after_service #anc_cta .contents_wrap > p::after{
   content: "";
   height: 18px;
}
.after_service #anc_cta .cta_box{
   display: block;
   width: 100%;
}
.after_service #anc_cta .cta_box a{
   width: 100%;
   display: block;
   padding: 15px 20px 20px 20px;
   border-radius: 10px;
   box-sizing: border-box;
}
.after_service #anc_cta .cta_box a:hover{
   opacity: 1;
}
.after_service #anc_cta .cta_box a:first-child{
   width: 100%;
   margin: 0 0 10px 0;
}
.after_service #anc_cta .cta_box div:nth-child(1){
   margin-right: 0;
   margin-bottom: 20px;
}
.after_service #anc_cta .cta_box div:nth-child(1) a{
   padding: 19px 10px;
   background-size: 26px;
}
.after_service #anc_cta .cta_box a:nth-child(2){
   border-radius: 10px;
}
.after_service #anc_cta .cta_box div:nth-child(2) .a{
   background: url(../images/ico_cta_inquiry_w.png) #00a7ac left 25px center no-repeat;
   padding: 18px 0px 16px 37px;
}
.after_service #anc_cta .cta_box div a strong {
   font-size: 17px;
}
.after_service #anc_cta .cta_box a:nth-child(1) strong{
   background: url("../images/ico_online.png") left 7px no-repeat;
   background-size: 35px;
}
.after_service #anc_cta .cta_box a:nth-child(2) strong{
   background: url("../images/ico_inquiry.png") left 7px no-repeat;
   background-size: 30px;
}
.after_service #anc_cta .cta_box a span{
   display: block;
   font-size: 14px;
}
}


/* ===================================
   ボタン
=================================== */
.button .button_box{
   display: flex;
   margin: 0 auto;
   padding: 40px 0;
}
.button .button_box div{
min-width: 300px;
}
.button .button_box p{
   font-size: 14px;
   text-align: center;
}
.button .button_box div a{
   display: block;
   text-align: center;
   transition: all .2s ease-out;
   margin: 0 auto;
}
.button .button_box div a strong{
   font-size: 1em;
}
.button .button_box div a{
   background-color: #00a7ac;
   color: #fff;
   padding: 15px 30px;
   border: 2px solid #00a7ac;
   border-radius: 50px;
}
.button .button_box div a:hover{
   color: #00a7ac;
   background-color: #fff;
   border: 2px solid #00a7ac;
   padding: 15px 30px;
}
.button .button_box div{
   position: relative;
}
.button .button_box > div > a::before {
   position: absolute;
   content: "";
   width: 7px;
   height: 7px;
   border-left: 2px solid #fff;
   border-bottom: 2px solid #fff;
   display: block;
   -webkit-transform: rotate(-135deg);
   transform: rotate(-135deg);
   position: absolute;
   right: 20px;
   top: 44%;
   -webkit-transition: 0.4s;
   transition: 0.4s;
}
.button .button_box > div > a:hover:before {
   position: absolute;
   content: "";
   width: 7px;
   height: 7px;
   border-left: 2px solid #00a7ac;
   border-bottom: 2px solid #00a7ac;
   display: block;
   -webkit-transform: rotate(-135deg);
   transform: rotate(-135deg);
   position: absolute;
   right: 20px;
   top: 44%;
   -webkit-transition: 0.4s;
   transition: 0.4s;
}

@media screen and (max-width: 767px){
.button .contents_wrap{
   padding: 40px 20px;
}
.button .contents_wrap > p{
   font-size: 18px;
   letter-spacing: 0.05em;
}
.button .contents_wrap > p::before,
.button .contents_wrap > p::after{
   content: "";
   height: 18px;
}
.button .button_box{
   display: block;
   width: 100%;
   padding: 0;
}
.button .button_box a{
   width: 100%;
   display: block;
   padding: 15px 20px 20px 20px;
   border-radius: 10px;
   box-sizing: border-box;
}
.button.button_box a:hover{
   opacity: 1;
}
.button .button_box a:first-child{
   width: 100%;
   margin: 0 0 10px 0;
}
.button.button_box div:nth-child(1){
   margin-right: 0;
   margin-bottom: 20px;
}
.button .button_box div:nth-child(1) a{
   padding: 14px 13px 14px 0px;
   background-size: 26px;
}
.button .button_box a:nth-child(2){
   border-radius: 10px;
}
.button .button_box div:nth-child(2) .a{
   background: url(../images/ico_cta_inquiry_w.png) #00a7ac left 25px center no-repeat;
   padding: 18px 0px 16px 37px;
}

.button .button_box div:nth-child(2) a{
   background: url(../images/ico_cta_inquiry_w.png) #00a7ac left 23px center no-repeat;
   background-size: 27px;
}
.button .button_box div a strong {
   font-size: 17px;
}
.button .button_box a:nth-child(1) strong{
   background: url("../images/ico_online.png") left 7px no-repeat;
   background-size: 35px;
}
.button .button_box a:nth-child(2) strong{
   background: url("../images/ico_inquiry.png") left 7px no-repeat;
   background-size: 30px;
}
.button .button_box a span{
   display: block;
   font-size: 14px;
}
}


@media screen and (max-width: 767px) {
   .menuIconWrapper > .menuIcon {
      display: none;
   }
   #header #head_btncontact {
      right: 0px;
   }
}