@charset "UTF-8";



*{box-sizing: border-box; line-height: 1.68; }
body{font-family: 'IBM Plex Sans', "游ゴシック体", YuGothic, "游ゴシック", "Yu Gothic", "メイリオ", "Hiragino Kaku Gothic ProN", "Hiragino Sans", sans-serif;
    font-size: 14px; letter-spacing: 0.01em;}
 article{    width: 100%; overflow: hidden; }
 .sp_br{display: none;}
/*= page =*/
/*========================================================*/
.pink{color: #f9bcdb;} .vi_pink{color: #ee228c;} 
.comment_txt .vi_pink, .info_inner .txt .vi_pink{font-weight: bold;}
.txt .vi_pink{font-size:16px}
.mb_25{margin-bottom: 25px;}
/*===========================KV=============================*/
.kv_area { height: 585px; position: relative; margin-bottom: -15%; z-index: 100; transition: all .3s;}
.kv_back { position: relative;  height: 100%;}
.kv_area_plan {
    background: rgba(255,255,255,0.85);  border-radius: 10px; line-height: 1.68;
    display: block;  transform: translate(-50%, -50%);text-align: center;
    width: 600px;
    padding: 40px 28px; margin: 0 auto; position: absolute;
    left: 51%; top: 37%; color: #000; 
}
.kv_back img { object-fit: cover; width: 125%; transition: all .3s;}
/*.kv_area_txt {  line-height: 1.7; font-size: 18px; font-weight: 700; color: #333; }*/
.kv_area_txt {  line-height: 1.7; font-size: 18px; font-weight: 500; color: #333; }
@media screen and (max-width: 1074px) {
    .kv_back img{width: 140%;}
}
/*.kv_area { height: 585px; position: relative; margin-bottom: -15%; z-index: 100; transition: all .3s;
    clip-path: polygon(0 0, 100% 0, 100% 75%, 63% 75%, 51% 89%, 37% 75%, 0% 75%);}
*/
.kv_area { height: 585px; position: relative; margin-bottom: -15%; z-index: 100; transition: all .3s;
    clip-path: polygon(0 0, 100% 0, 100% 75%, 63% 75%, 51% 89%, 37% 75%, 0% 75%); letter-spacing:  0.1rem;}
.kv_area_plan h2 {font-size: 25px; line-height: 1.4; text-align: center;}
/*.kv_area_plan_nm {
    padding: 10px 10px; color: #fff; line-height: 1.3; letter-spacing: 0.01em;
    font-size: 34px; font-weight: bold; margin: 12px 0 22px;
}*/
.kv_area_plan_nm {
    padding: 10px 10px; color: #fff; line-height: 1.3; letter-spacing: 0.1em;
    font-size: 34px; font-weight: bold; margin: 12px 0 22px;
}

#maintenance .kv_area_plan_nm{background: #9458ed}
#corporate .kv_area_plan_nm{background: #eeb313}
#promption .kv_area_plan_nm{background: #51ac63}

_:-ms-input-placeholder, :root .kv_area { height: 400px; margin-bottom: 0; overflow: hidden;}
_:-ms-input-placeholder, :root .kv_area_plan{top: 50%;}
_:-ms-input-placeholder, :root .infoarrow{padding-top: 100px}
/*===========================contents=============================*/
.details{width: 960px; margin: 0 auto; position: relative;}
.contents{width: 960px; margin: 95px auto;}
.price_conts{width: 960px; margin: 80px auto; position: relative;}
.details h2, .contents h2{font-size: 38px; text-align: center; align-items: flex-start; letter-spacing: 0.01em;}
.contents h2.ver2 {font-size: 32px;}
.details h2 .vi_pink{position: relative; display: inline-block;}
.details h2 .vi_pink span{position: relative; background: linear-gradient(transparent 70%, #fff 0%);}
.details .info_subttl h2{font-size: 22px; font-weight: normal; color: #444;}

.card_title .vi_pink{font-size: 24px; line-height: 1.25;}
.link_footer { background: #ececec;  padding: 75px 0 70px;}
.link_footer.bg-no{background: none;} .conts_capttl{margin: -5px 0 20px; line-height: 1.3;}
.details_area {background: #ececec; padding: 95px 0 85px;}
.infoarrow{position: relative; padding: 15% 0 90px;}
.card_wrap {display: flex; justify-content: center; margin: 35px auto 60px; flex-wrap: wrap;}
.card_wrap.parts {margin-top: -35px;}
.card {
    width: 32%; text-align: center; margin: 95px 0 0 2%;
    background: #fff; position: relative; border-radius: 8px;
}
.card.large {width: 38%;}
.card:first-of-type{margin-left: 0;}
.card_wrap.parts .card{border: solid 3px #ccc;}
.card_title {
    text-align: center; font-size: 22px; line-height: 1.5; background: #fff; border-radius: 150px;
    position: relative; margin: -65px auto 0; z-index: 15;
    width: 180px; height: 175px; border: solid 3px #c5c5c5;
    display: flex; align-items: center; justify-content: center;    
}
.card_title h3{margin-top: 0.9em; font-size: 20px; line-height: 1.3;}

.card_title figure {
    width: 62px; display: inline-block; position: absolute;
    margin-top: 0; top: -10px; left: 50%; transform: translateX(-50%);
}

.card_title .light { top: -20px; width: 60px;}
.card_title .baloom { width: 68px;}
.card_info {
    padding: 85px 0 25px; line-height: 1.3;
    margin-top: -40px; border-radius: 8px; position: relative;
    z-index: 10; height: 100%; font-size: 16px;
}
.card_info .vi_pink{font-weight: bold; font-size: 18px; line-height: 1.5;}
.card_info::before {
    content: " "; top: 28px; left: 46%;
    background: url(../../images/page/arrow_under.svg) no-repeat;
    height: 50px; width: 2em; position: absolute;
}
.card_info h4 { font-size: 18px; letter-spacing: -0.01em; margin-bottom: 0.35em; line-height: 1.54;}

.flex_subttl {
    display: flex; align-items: center;  justify-content: center;
     margin: 0 0 80px; position: relative;
}
.promo_arrow {width: 33px; margin: 9% 1% 0;}
.promo_flow {display: flex; justify-content: center; 
    align-items: flex-start; margin: 70px 0;}
dt.promo_flow_box{text-align: center;}
dt.promo_flow_box h4 {
    font-size: 22px; display: flex; justify-content: center;  margin-bottom: 0.6em;
    width: 180px;  height: 180px; align-content: center;  align-items: center;
    border-radius: 200px; border: solid 4px #aaa;
}
.info_inner, .howco_inner{
    display: flex; align-items: center; flex-wrap: wrap; margin: 20px auto;
    height: 100%; border: solid 3px #ccc; border-radius: 8px; width: 850px;
    overflow: hidden;
}
.info_inner{background: url(../../images/page/graytex.jpg);}
.info_inner .info_subttl { text-align: center; width: 32%;}
.info_subttl h4 {display: inline-block; text-align: left; font-size: 18px;}
.info_inner .txt { width: 68%; padding:22px 34px;; text-align: justify;
    background: #fff; letter-spacing: 0.05rem; font-size: 15px; font-weight: normal;}
.bd_pink{color: #ee228c; border-bottom: solid; display: inline-block; line-height: 1.2;}
.examplemenu { display: flex; flex-wrap: wrap; justify-content: space-between; position: relative; margin-bottom: -40px;}
.menubox{width: 43%; margin: 0 0 50px; text-align: center;}
.menubox img {width: 100%; } .promo_mn { margin-bottom: 1em;}
.menubox .bdnm{font-size: 18px;}
#corporate .promo_mn, #maintenance .promo_mn{width: 100%; margin: 0 auto 1rem;}
.bdnm{font-weight: bold; margin-bottom: 0.2em;}
.price_inner {
    display: flex; width: 800px; margin: 0 auto;
    justify-content: center; align-items: center;
}
.price_inner h4{font-size:22px; margin-bottom: 0.2em;}
.price_info {
    border-left: solid 3px #e6e6e6; font-size: 18px;
    padding-left: 2em; margin-left: 2em; 
}
.price_inner h3{font-size: 28px; text-align: center; align-items: flex-start; letter-spacing: 10px;}
a.link_main {
    text-align: center; display: block;  border-radius: 80px;
    width: 800px; margin: 22px auto 18px; line-height: 1.3;
    background: #ee228c; padding: 18px 0 14px; transition: all .3s;
    font-size: 22px; color: #fff; font-weight: bold; border: solid 1px #ee228c;
}
a.link_main:hover{background: #fff; color: #f47ab6; border: solid 1px #f47ab6;}

/*===========================promotion======================*/
/*.promo_info_ttl {
    font-weight: bold; margin-right: 8.5%; letter-spacing: 1px; line-height: 1.65; font-size: 18px;
    position: relative; z-index: 10;
}
*/
.promo_info_ttl {
    font-weight: bold; margin-right: 8.5%; letter-spacing: 1px; line-height: 1.65; font-size: 18px;
    position: relative; z-index: 10;
    font-style: italic;
    font-size: 18px;
    text-decoration: underline;
    text-decoration-color: #FCDBE9;
}
.promo_info {
    border: solid 3px #fff; display: flex; align-items: center;
    border-radius: 8px; padding: 20px 28px; justify-content: center;
    background: url(../../images/page/graytex.jpg); position: relative;
}
.promo_info::after {
    content: " "; width: 12%; height: 100%;
    position: absolute; left: 0; top: 0;
    background: url(../../images/page/gear.svg) no-repeat;
    background-size: 100%;
}
.promo_info_conts {font-size: 18px; font-weight: bold;}
.promo_info_conts li { margin: 18px 0; position: relative; padding-left: 1.5em; line-height: 1;}
.promo_info_conts li::before {
    content: " "; position: absolute; width: 1em; height: 1em; left: 0; top: 0; z-index: 10000;
    background: url(../../images/page/listicon.png) no-repeat;
    background-position: 100%;
}
.link_gr8 { width: 560px; transition: all .3s; display: block; margin: 0 auto; }
.link_gr8 img{width: 100%;}
.gr8fm_footer p{font-size: 22px; font-weight: bold; margin-bottom: 10px; transition: all .3s;}
.logo_8 { display: inline-block; width: 150px;  vertical-align: middle;  margin: 0 0 0 8px; transition: all .3s;}
.link_gr8:hover{filter: contrast(110%);}
.gr8fm_footer {
    text-align: center;  border-top: solid 1px #ccc;
    margin: 45px 0 0; padding: 35px 0 0;
}
.info_inner_list li {list-style-type: disc; margin-left: 1em; line-height: 1.48; margin-top: 0.2em;}

/*==========================tex======================*/
.ex_logo { position: absolute; right: -35px; width: 55px; top: -158px; transition: all .3s;}
.price_logo { width: 55px; position: absolute; left: 10px; top: -137px;}
@media screen and (max-width: 980px) {
    .ex_logo{right: 0}
}
/*==========================corporate======================*/
.howco_inner{background: #fff; font-size: 18px; line-height: 1.3;}
.info_subttl_02{color: #ee228c; margin-bottom: 0.25em; font-size: 20px;}
.info_icon_robo{width: 18%;  background: url(../../images/page/graytex.jpg); margin-right: 1.5%;}
.info_icon_robo img {width: 100%;} .howco_inner .txt{width: 80%; background: #fff; padding: 20px 35px;font-size: 16px;}
.info_icon_robo figure { position: relative; left: 10px; width: 98%; padding-top: 6px;}
figure.brand_icon_02 {left: 0;}
figure.brand_icon_03 {padding-top: 20px;}
.card_title  figure.robo_min{width: 36px; top: 10px; left: 50%;}
/*==========================mentenance======================*/
.comment{display: flex; flex-wrap: wrap; justify-content: center; flex-direction: row-reverse;}  
.comment_txt {width: 52%; font-size: 18px; } .comment img{width: 100%;}
/*.comment_txt p {margin: 30px 0 0; line-height: 1.8;} .comment figure{width: 42%;} */
.comment_txt p {margin: 30px 0 0; line-height: 2.2;} .comment figure{width: 42%;} 
.info_icon_robo.mente { padding: 1% 0;}
.info_icon_robo.mente figure {width: 80%; padding: 2%; margin: 0 auto; left: 0;}
/*==========================subtitle======================*/
.subttl {font-size: 22px; background: #000; color: #fff; border-radius: 60px; padding: 5px 50px; position: relative;}
h3.subttl span { position: relative; z-index: 100;}
h3.subttl span.pc{display: inline;}
.subttl::after {
    content: " ";  width: 960px; height: 0.2em; transform: translate(-50%);
    border-top: solid 3px #000; position: absolute; left: 50%; top: 50%;
}
#maintenance .subttl{background: #9458ed;} #maintenance .subttl::after{border-top: solid 6px #9458ed;}
#corporate .subttl{background: #eeb313;} #corporate .subttl::after{border-top: solid 6px #eeb313;}
#promption .subttl{background: #51ac63;} #promption .subttl::after{border-top: solid 6px #51ac63;}

/*= footlink =*/
/*========================================================*/
.webpromotion_footer{border-top: solid 1px #ccc; padding: 65px 0 0; margin: 0 auto 60px; }
.webpromotion {
    text-align: center;
    display: flex; width: 980px; margin: 0 auto;
    justify-content: center;
}
.circlebox {position: relative; }
.circle { position: relative; left: 0; margin-left: 0;}
.circle.circle1 a { background: #fbe392;}
.circle.circle2 a { background: #abeab7;}
.circle.circle3 a { background: #d4eff9;}
.circle.circle4 a { background: #d2ccfc;}
.promobox {
    width: 178px; display: inline-block; text-align: center;
    vertical-align: top; margin: 0 0 0 16px;
}
.circle a {
    display: block;
    font-family: 'Montserrat', sans-serif;
    font-weight: 800;
    font-size: 28px;
    letter-spacing: 3px;
    color: #333;
    width: 148px;
    height: 148px;
    padding: 48px 0 0;
    margin: 0 auto;
    vertical-align: middle;
    line-height: 1.7;
    position: relative;
    border: solid 1px #333;
    border-radius: 100px;
}
.circle a:hover{background: #333; color: #fff; cursor: pointer;}
.circle a::before,
.circle a::after {position: absolute; z-index: -1; display: block; content: '';}
.circle a,
.circle a::before,
.circle a::after {-webkit-box-sizing: border-box; -moz-box-sizing: border-box;
	box-sizing: border-box; -webkit-transition: all .6s; transition: all .6s;}
.promobox:first-child{margin: 0;} .promobox img {width: 100%;}
.promobox .cap {
    font-size: 15px; letter-spacing: 0.2px;
    margin: 15px 0 0; line-height: 1.35; text-align: center;
}

/*= bnr gr8form  =*/
/*========================================================*/
.promobox_bnr { width: 500px; margin: 60px auto 55px;}
.promobox_bnr img {width: 100%;} 
/*.promobox_bnr p{margin: 15px auto; line-height: 1.6; text-align: center;}*/
.promobox_bnr p{margin: 10px auto; font-weight: bold; color: #666; line-height: 1.6; text-align: center;}