
@charset "UTF-8";

@media screen and (max-width: 767px) {
  img {width: 100%;} 
  article{margin-bottom: 30px;}
  .vi_pink{line-height: inherit;}
  .txt .vi_pink{line-height: 1.3;}
/*= page =*/
/*========================================================*/
body{font-size: 16px;} p{font-size: 14px; line-height: 1.64; letter-spacing: 0.05em;} p{line-height: 1.64;}
.price_conts { width: 100%;} .price_conts{margin: 30px auto 35px;}
.contents, .details{margin: 0 auto; width: 94%;}
.contents{margin: 45px auto 55px;} .card_wrap{display: block;}  .contents h2 {margin-top: 0;}
.kv_area { clip-path: polygon(0 0, 100% 0, 100% 75%, 68% 75%, 52% 82%, 34% 75%, 0% 75%);
  height: 535px; width: 100%; margin-bottom: -140px;}
.details_area{padding: 50px 0 45px;} 
.details h2 .vi_pink{margin-bottom: 5px;}
.details h2 .vi_pink:before{bottom: 5px;}
.details .info_subttl h2 {font-size: 1rem;}
.infoarrow {padding: 60px 0 50px; margin-bottom: 50px;}
.link_footer {padding: 30px 0 38px;}
.promo_info{display: block; width: 90%; margin: 0 auto; padding: 30px 25px; text-align: justify;}
.card_info h4, .promo_info_conts, .flex_subttl, .price_inner h4, .price_info, a.link_main {font-size: 1rem; line-height: 1.4; letter-spacing: 0.05em;}
.flex_subttl{width: 90%; margin: -5px auto 40px;}
/*= KV ===============================================*/
.kv_area_plan{ width: 90%; padding: 25px 20px; left: 50%;}
.kv_area_txt{text-align: left; text-align: justify; letter-spacing: -0.05em; text-align: justify; font-size: 0.9rem;}
.kv_area_txt br {display: none;}
.kv_back img {height: 100%; width: 100%;}
.kv_area_plan h2{font-size: 1.25rem; line-height: 1.4; letter-spacing: -0.015em;} .kv_area_plan h2 .vi_pink{line-height: 1.4;}
.details h2, .contents h2, p.kv_area_plan_nm, .price_inner h3{font-size: 1.35rem; line-height: 1.4;  padding: 5px 0 0;}
.contents h2.ver2 {font-size: 1.35rem; line-height: 1.6;  letter-spacing: normal; margin-bottom: 14px;}
.details_area.infoarrow .details h2 {font-size: 1.45rem;}
.details h2 span{line-height: 1.4;}
p.kv_area_plan_nm{padding:10px 0; margin-bottom: 15px;}
/*=======================contents arrow=======================*/
.details_area::before {
  border-left: 120px solid transparent;
  border-right: 120px solid transparent;
  border-top: 22px solid #fff;
  transform: translateX(-50%); top: 4px;
}

/*= contents ===============================================*/
.card_wrap{margin-top: -5px; margin-bottom: 45px;} .card_title h3{font-size: 1.25rem; line-height: 1.4.promo_arrow;}
.card_title{margin: 0px auto 0; top: -50px; transform: scale(0.95);} 
.card_info{margin-top: -85px; padding-bottom: 20px;}
.card {width: 85%; margin: 85px auto -5px;}
.card:first-of-type {margin-left: auto;}
.card_wrap.parts .card, .card.large{width: 90%; padding: 0 3%; margin: 60px auto 0;}
.card_wrap.parts {margin-top: 80px;}
.card_info::before{height: 45px; width: 1.8em; left: 50%; transform: translateX(-50%);}
.promo_info_conts{margin-top: 15px;}
.promo_info_ttl {
  font-weight: bold; border-bottom: dashed 1px #aaa; text-align: justify;
  padding: 0 0 4%; margin-right: 0; text-align: left; font-size: 1rem; line-height: 1.4;}
.promo_info::after{width: 20%; opacity: 0.8;}
.promo_info_ttl br {display: none;}
  .promo_info_conts li{line-height: inherit; margin: 0.8em 0 0;}
  .promo_info_conts li::before{top: 0.3em;}
.promo_flow{display: block; margin: 0 0 45px;}
.menubox .bdnm{font-size: 16px;}
.subttl{width: 80%; text-align: center; padding: 10px 0; margin: 5px 0 0; font-size: 1rem; line-height: 1.2;}
.subttl::after {width: 95vw;}
h3.subttl span.pc{display: none} .subttl span{line-height: 1.2;}
dt.promo_flow_box h4{margin: 0 auto 10px; font-size: 1.25rem;}
.promo_arrow {width: 40px; margin: 25px auto}
.promo_arrow figure {transform: rotate(90deg);}
.info_inner, .howco_inner {display: block; width: 90%; margin: 3% auto 6%; padding: 0 10px 10px;}
.info_inner .info_subttl{width: 100%; margin: 20px 0 10px;}
.info_inner .txt,  .howco_inner .txt{ width: 100%; padding: 5% 6%; font-size: 0.95rem; letter-spacing: -0.05em; text-align: justify;}
.info_inner .vi_pink {display: inline-block; margin: 3px 0 0;  font-size: 0.95rem;}
.info_subttl h4{text-align: center;}
.examplemenu {display: block; margin-bottom: -30px;}
.menubox { width: 90%; margin: 25px auto 35px; text-align: center;}
.menubox p {text-align: left;}
.price_inner {display: block; width: 90%; margin: 0 auto;}
.price_info{padding: 0; margin: 0; border: none; border-top: solid 1px #e6e6e6;}
a.link_main{width: 90%; margin: 5px auto;}
.link_gr8{width: 100%;}
.logo_8 { display: block; width: 120px; margin: 3px auto 0;}
.gr8fm_footer {margin: 35px 0 0; padding: 25px 0 0;} .gr8fm_footer p{font-size: 1rem;}
.link_footer .info_subttl{margin-bottom: 10px;}
/*==tex======================================*/
.price_logo, .ex_logo{width: 40px; display: none;}
.price_logo{ top: -85px;}
.price_info {padding: 10px 0 0; margin: 7px 0 0;
  border: none; border-top: solid 1px #ccc; text-align: center;
} 
.price_info h4.vi_pink{font-size: 1.1rem;}
.info_icon_robo { width: 25%; border-bottom: solid 1px #eee; margin: 0 auto;}
.info_subttl_02 {font-size: 1.15em; line-height: 1.36; margin-bottom: 6px;}
/*==========================mentenance======================*/
.comment {display: block; }
.comment_txt {width: 90%; font-size: 1rem; margin: 0 auto;} .comment_txt p { margin: 16px 0 0; font-size: 1rem;}
.comment figure {width: 80%; margin: 20px auto 0; display: block}
.mb_25 {margin-bottom: 15px;}

/*= footlink =*/
/*========================================================*/
.webpromotion {
  width: 100%;
  display: flex; flex-wrap: wrap;  justify-content: center; transform: scale(0.96);
}
.webpromotion_footer {
  border-top: solid 1px #ccc;  padding: 18px 0 0; margin: 0 auto 15px;}

.circle a {
  font-size: 2rem;
  width: 160px;
  height: 160px;
  padding: 55px 0 0;
  transform: scale(0.85);
  margin: 0 auto 0 auto;
}
.promobox {width: 42%; display: inline-block; vertical-align: top; margin: 1% 3%;}
.promobox:first-child {margin: 1% 2.5%;}
.promobox .cap{font-size: 0.85rem; margin: -1.5px 0 0;}
/*= bnr gr8form  =*/
/*========================================================*/
.promobox_bnr { width: 90%; margin: 45px auto 40px;}
.promobox_bnr img { width: 92%; margin: 0 auto; display: block;}
.promobox_bnr p{letter-spacing: normal;}

.pc_br { display: none; }

}