@charset "utf-8";

/* =============================================================================
	お知らせインフォメーション(supinfo_include.js）
============================================================================= */
#InformationBox h2 {font-size: 2.4rem; line-height: 1.4; margin: 0 0 26px; padding-bottom: 14px; border-bottom: 2px solid #005243; position: relative;}
#InformationBox h2::before {content: " ";display: inline-block; width: 12px; height: 12px; margin-right: 10px; border: solid 8px #005243; border-radius: 50%; position: relative; top: 4px;}
#InformationBox>* a {border: none!important;} /* 共通css打消し */

/* よくあるお問い合わせ表示用 */
#InformationBox h2.hd-faq { margin-top: 56px;}
#faqforupdatedate	{ font-weight: normal; font-size: 90%; }
#FAQsection { margin-top: 1.5em; }
.faqList {counter-reset: item; list-style-type: none; padding-left: 0; }
.faqList li { margin-bottom: 0.5em; }
.faqList li a:before { counter-increment: item; content: counter(item)''; padding: 0 0.5em; margin-right: 0.5em; font-weight: bold; color: #fff; background-color: #666; text-decoration: none!important; display: inline-block;}
.faqList li.faq1 a:before { background-color: #e6b422; }
.faqList li.faq2 a:before { background-color: #a7a7a7; }
.faqList li.faq3 a:before { background-color: #B87333; }

/* =============================================================================
	common
============================================================================= */
/* ボックス（optionBox） -------------------- { */
.optionBox h2 {}
.optionBox>* a {border: none!important;} /* 共通css打消し */
.supmenu-idx>* a {height: 100%;}
/* -------------------- } ボックス（optionBox） */
/* ナビゲーション（nav-contact） -------------------- { */
.nav-contact { max-width: 1280px; margin: 0 auto; padding: 20px 0; background: #dad9d5; }
.nav-contact ul {margin-left: -16px!important;}
/* -------------------- } ナビゲーション（nav-contact） */
/* インデックス（list-panel-contact） -------------------- { */
.list-panel-contact { -webkit-box-sizing: border-box; box-sizing: border-box; display: -webkit-box; display: -ms-flexbox; display: flex; margin-left: -0.78125%; margin-right: -0.78125%; -ms-flex-wrap: wrap;  flex-wrap: wrap; margin-bottom: -3.125%; }
.list-panel-contact > li{ -webkit-box-sizing:border-box; box-sizing:border-box; -webkit-box-flex:0; -ms-flex:0 0 31.7708%; flex:0 0 31.7708%; width:31.7708%; margin-left:0.78125%; margin-right:0.78125%; margin-bottom:3.125%} /* col3 */
.list-panel-contact a { position: relative; text-decoration: none; display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-orient: vertical; -webkit-box-direction: normal; -ms-flex-flow: column; flex-flow: column; height: 100%; -webkit-box-pack: justify; -ms-flex-pack: justify; justify-content: space-between; background-color: #fff; padding: 18px; border: 1px solid #c6c6c0; }
.list-panel-contact a::before { content: ''; position: absolute; top: -2px; left: -2px; width: 0; height: 0; border: 2px solid transparent; }
.list-panel-contact a::after  { content: ''; position: absolute; bottom: -2px; right: -2px; width: 0; height: 0; border: 2px solid transparent; }
.list-panel-contact a:hover::before { width: 100%; height: 100%; border-top-color: #005243; border-right-color: #005243; transition: width .25s ease-out, height .25s ease-out .25s; }
.list-panel-contact a:hover::after  { width: 100%; height: 100%; border-bottom-color: #005243; border-left-color: #005243; transition: border-color 0s ease-out .5s, width .25s ease-out .5s, height .25s ease-out .75s; }
.list-panel-contact a .list-panel-contact_img { text-align: center; margin-bottom: 15px; }
.list-panel-contact a .list-panel-contact_inr .title { color:#000; font-size:1.8rem; line-height:1.6; font-weight:700; text-align: center;}
.list-panel-contact a .list-panel-contact_inr .title .subtitle { display: block; font-size: 1.5rem; }
.list-panel-contact a .list-panel-contact_inr .desc { font-size:1.5rem; color:#000}
.list-panel-contact a .list-panel-contact_inr .discount { background: #d2ecef; padding: 8px; border-radius: 3px; font-weight: 700; color: #000000; text-align: center; }
.list-panel-contact a .list-panel-contact_inr .discount > span { display: inline-block;}
.list-panel-contact a .list-panel-contact_inr .point { text-align: center; }
.list-panel-contact a .list-panel-contact_inr .point > span { color: #005243; padding: 8px 16px; border: 1px solid #005243; border-radius: 24px; display: inline-block;}
.list-panel-contact a .recommendation_tab  { position: absolute; width: 40px; top: 0px; left: 18px; color: #fff; font-size: 1.8rem; display: inline-block; padding: 5px 0 3px; text-align: center; background: #000f52; z-index: 1; }
.list-panel-contact a .recommendation_tab::after  { position: absolute; content: ''; top:100%; left: 0; width: 0; height: 0; border-left: 20px solid #000f52; border-right: 20px solid #000f52; border-bottom: 15px solid transparent; }
.list-panel-contact_foot { margin-top: 15px; text-align: center; }
@media screen and (max-width:1000px) {
	.list-panel-contact { margin-bottom:-3.125% }
	.list-panel-contact > li { -webkit-box-sizing:border-box; box-sizing:border-box; -webkit-box-flex:0; -ms-flex:0 0 46.875%; flex:0 0 46.875%; width:46.875%; margin-left:1.5625%; margin-right:1.5625%; margin-bottom:3.125%;}
}
@media screen and (max-width:500px) {
	.list-panel-contact > li { -webkit-box-sizing:border-box; box-sizing:border-box; -webkit-box-flex:0; -ms-flex:0 0 96.875%; flex:0 0 96.875%; width:96.875%; margin-left:1.5625%; margin-right:1.5625%; margin-bottom:3.125%}
	.list-panel-contact a .list-panel-contact_inr .title { font-size:1.6rem;}
	.list-panel-contact a .list-panel-contact_inr .desc { font-size:1.4rem;}
}
/* -------------------- } インデックス（list-panel-contact） */
/* 申し込み手順内BOX（contact_step_box） -------------------- { */
.list-step-a .step-txt { font-size: 3.2rem; min-width: 130px;}
.list-step-a .step-txt-inner::before { width: 50px; }
.list-step-a .step-content { width: 100%; margin-bottom: 32px; }
.list-step-a .step-content>dt {font-size: 3.2rem;}
.contact_step_box { }
.contact_step_box .optionBox h2 {font-size: 2.4rem; }
/* hdg-tit */
.contact_step_box .hdg-tit { position: relative; margin: 38px 0 30px; padding-bottom: 10px; font-size: 2.4rem; line-height: 1.4; font-weight: 700; border-bottom: 2px solid #9d9c95;}
.contact_step_box .hdg-tit::before { display: block; position: absolute; content: ""; bottom: -2px; left: 0; width: 18.75%; height: 2px; min-width: 72px; background: #005243;}
.contact_step_box .hdg-tit span { display: inline-block; color: #FFFFFF; font-weight: normal; padding: 2px 0.5em 1px; margin-left: 1em; border-radius: 3px; text-shadow: none; filter: none; }
.contact_step_box .hdg-tit .Free { background: #19448e ; }
.contact_step_box .hdg-tit .Pay { background: #a22041; }
.contact_step_box h3 { font-size: 2.0rem; }
/* technicalcenter-Price */
.contact_step_box .technicalcenter-Price { display: flex; align-items: center; }
.contact_step_box .technicalcenter-Price .Normal { display: inline-block; border: 2px solid #cccccc; padding: 0.5em; width: 45%; font-weight: 700; }
.contact_step_box .technicalcenter-Price .Discount { display: inline-block; border: 2px solid #8C7B33; padding: 0.5em; width: 45%; color: #56482D; font-weight: 700; }
.contact_step_box .technicalcenter-Price .Normal .tit span,
.contact_step_box .technicalcenter-Price .Discount .tit span { font-size: 1.8rem; }
.contact_step_box .technicalcenter-Price .Normal .fee,
.contact_step_box .technicalcenter-Price .Discount .fee {font-size: 1.8rem; margin: 20px 0; text-align: center;}
.contact_step_box .technicalcenter-Price .Normal .fee span,
.contact_step_box .technicalcenter-Price .Discount .fee span { font-size: 2.4rem;}
.contact_step_box .technicalcenter-Price .Arrow { display: inline-block; width: 10%; text-align: center; }
.contact_step_box .DiscountTerms { position: relative;}
.contact_step_box .DiscountTerms .head { position: relative; top: 20px; background: #ffffff; font-size: 1.8rem; font-weight: 700; display: inline-block; margin-left: 1em; margin-right: 1em; padding: 0.3em 1em; color: #56482D; }
.contact_step_box .DiscountTerms .terms { border: 2px solid #8C7B33; padding: 1.8em 1em 1em; }
.contact_step_box .DiscountTerms .terms p span.caution { display: inline-block; background: #AA0000; color: #ffffff; font-size: 1.3rem; padding: 0.3em 0.5em 0.1em; margin-right: 0.5em; }
/* Payment */
.contact_step_box .Payment	{}
.contact_step_box .Payment > dt { display: inline-block; position: relative; margin-bottom: 1.8em; padding: 0 3.5em; font-size: 1.8rem; font-weight: 700; }
.contact_step_box .Payment > dt::before,
.contact_step_box .Payment > dt::after { content: ''; display: inline-block; position: absolute; top: 50%; width: 45px; height: 3px; background-color: #005243; }
.contact_step_box .Payment > dt::before { left: 0; }
.contact_step_box .Payment > dt::after { right: 0; }
.contact_step_box .Payment dd	{ margin: 0 0 1.75em; }
.contact_step_box .Payment dd	> p strong	{ display: inline-block; background: #192f60; color: #ffffff; padding: 0 0.5em; margin-right: 8px; }
.Payment-accordion { max-width: 100%; margin-bottom: 7px; border: 2px solid #d6dde3; border-radius: 5px; }
.Payment-accordion summary { display: flex; justify-content: space-between; align-items: center; position: relative; padding: 1em 2em; font-weight: 600; cursor: pointer; }
.Payment-accordion summary::-webkit-details-marker { display: none; }
.Payment-accordion summary::after { transform: translateY(-25%) rotate(45deg); width: 7px; height: 7px; margin-left: 10px; border-bottom: 3px solid #000000b3; border-right: 3px solid #000000b3; content: ''; transition: transform .3s; }
.Payment-accordion[open] summary::after { transform: rotate(225deg); }
.Payment-accordion .summary-inner { transform: translateY(-10px); opacity: 0; margin: 0; padding: 1.0em 2em 1.5em; transition: transform .5s, opacity .5s; }
.Payment-accordion[open] .summary-inner { transform: none; opacity: 1; }
/* table */
.contact_step_box table .name { font-weight: 700; font-size: 1.8rem; }
.contact_step_box table .time { font-size: 1.5rem; }

@media only screen and (max-width: 768px) {.contact_step_box .hdg-tit{font-size: 1.6rem;}}
/* -------------------- } box（repair_step_box） */


@media only screen and (max-width: 768px) {}
@media only screen and (max-width: 480px) {}
@media only screen and (max-width: 320px) {}
