/* CSS Document */
h2.multi{
color: #2a3f5f;
font-weight: bold;
padding:5px 0;
border-bottom:8px solid rgba(31,130,198,1.00);
position:relative;
}
h2.multi:before, h2.multi:after{
content:"";
display:block;
height:8px;
position:absolute;
bottom:-8px;
}
h2.multi:before{
width:20%;
left:8%;
background:rgba(255,255,255,0.7);
}
h2.multi:after{
width:30%;
left:12%;
background:rgba(31,130,198,0.6);
}
.flex-container,.flex-container-2 {
display: flex;
justify-content: space-between;
}
/* アイコンの設定 */
h2.camera-icon {
padding-left: 68px;
line-height: 45px;
background: url("/service/maintenance/images/icon-camera.png") 0 -3px no-repeat;
}
h3 {
display: inline-block;
width: 100%;
padding:5px 0;
margin-bottom: .4em;
font-size: 2.2em;
}
h3.hatena-icon,h3.yen-icon,h3.houki-icon {
color: #2a3f5f;
font-weight: bold;
padding-left: 54px;
line-height: 40px;
background: url("/service/maintenance/images/icon-hatena.png") 0 center no-repeat;
background-size: 48px;
}
h3.yen-icon {
padding-left: 62px;
background: url("/service/maintenance/images/icon-yen.png") 0 center no-repeat;
}
h3.yen-icon {
padding-left: 62px;
background: url("/service/maintenance/images/icon-houki.png") 0 center no-repeat;
}
/* カードデザイン */
.card,
.flex-container-2 .card {
width: 33%;
background: #fff;
border-radius: 10px;
box-shadow: 0 0 3px #989898;
margin: 10px;
}
.flex-container-2 .card {
width: 48%;
}
.card:first-child {margin-left: 0;}
.card:last-child {margin-right: 0;}
.card-img {
border-radius: 5px 5px 0 0;
max-width: 100%;
height: auto;
}
.card-content {
padding: 20px;
}
.card-title {
color: #2a3f5f;
font-size: 1.5em;
margin-bottom: 12px;
}
.card-title span {
font-size: .7em;
line-height: 1.8;
font-weight: normal;
color: #1f82c6;
}
h4.check {
padding-left: 26px;
line-height: 30px;
background: url("/service/maintenance/images/icon-check-blue.png") -20px center no-repeat;
}
.card-text {
font-size: 1.3em;
line-height: 1.5;
}
.price-card {/* PC */
width: 100%;
display: block;
box-sizing: border-box;
background: #79b5e5;
color: #fff;
border-radius: 10px;
padding: 18px;
font-size: 3.2em;
font-weight: bold;
}
.price-card span,.card-price span {
font-size: .5em!important;
font-weight: normal;
}
h5 {
width: 100%;
display: inline-block;
box-sizing: border-box;
background: #2a3f5f;
color: #fff;
padding: 24px;
font-size: 2.4em;
font-weight: bold;
}
.bg-gray,.bg-gray-last {
width: 100%;
display: block;
box-sizing: border-box;
background: #e9eaeb;
padding: 24px 24px 0;
}
.bg-gray-last {
padding: 24px;
}
.bg-white {
box-sizing: border-box;
background: #fff;
padding: 24px;
display: flex;
justify-content: space-between;
}
h6 {
font-size: 2.4em;
font-weight: bold;
text-align: left;
}
h6 + p {
margin-top: 18px;
}

/* 空の要素用のスタイル */
.card-empty {
width: 33%;
height: 0;
margin: 10px;
}
/* チェックマークのところ*/
.inner_left.check-li,
.inner_right.check-li{
  min-width: 49%;
  text-align: center;
}
.inner_right.check-li:last-child {
min-width: 25%;
}
ul.check li {
margin-left: 56px;
color: #2a3f5f;
text-align: left;
font-size: 1.5em;
margin-bottom: 20px;
padding-left: 26px;
line-height: 30px;
background: url("/service/maintenance/images/icon-check-blue.png") -20px center no-repeat;
}
/* ※つける */
ul.asterisk li {
padding-left: 1em;
list-style-type: none;
text-indent: -1em;
}
ul.asterisk li:before {
display: inline;
content: "※";
}

/**/

@media screen and (max-width: 767px) {/* スマホここから */
.flex-container,.flex-container-2 {
display: block;
justify-content: center!important;
}
.card, .flex-container-2 .card {
width: 100%;
margin: 0 auto 15px;
}
.bg-white {
display: block;
justify-content: center!important;
margin: 0 auto
}
.card-img {
width: 100%;
}
ul.check li {
font-size: 1em;
margin-bottom: 8px;
}
.card-price {/* SP */
text-align: center;
padding: 18px 12px 0 12px;
font-size: 1.8em;
font-weight: bold;
border-top: 1px dotted #666;
}
.flex-container-2 .card-price {
padding: 18px;
}
h2, h3, a.btn, h5, h6{
font-size: 1.6em;
line-height: 24px;
}
/* スマホここまで */}