@charset "UTF-8";
/*----------------------------------------
lineup
----------------------------------------*/
/*　common
----------------------------------------*/
#titleArea { background: url("../img/lineup/bg_main_lineup.jpg") 100% 50% no-repeat; }
@media screen and (min-width: 0px) and (max-width: 667px) { #titleArea { background: url("../img/lineup/bg_main_lineup.jpg") 130% 50% no-repeat; background-size: 50% auto; } }

.mat100 { margin-top: 100px !important; }
@media screen and (min-width: 0px) and (max-width: 667px) { .mat100 { margin-top: 20px !important; } }

.mat105 { margin-top: 105px !important; }
@media screen and (min-width: 0px) and (max-width: 667px) { .mat105 { margin-top: 20px !important; } }

.mat110 { margin-top: 110px !important; }
@media screen and (min-width: 0px) and (max-width: 667px) { .mat110 { margin-top: 20px !important; } }

.mat115 { margin-top: 115px !important; }
@media screen and (min-width: 0px) and (max-width: 667px) { .mat115 { margin-top: 20px !important; } }

.mat120 { margin-top: 120px !important; }
@media screen and (min-width: 0px) and (max-width: 667px) { .mat120 { margin-top: 20px !important; } }

.mat125 { margin-top: 125px !important; }
@media screen and (min-width: 0px) and (max-width: 667px) { .mat125 { margin-top: 20px !important; } }

.mat130 { margin-top: 130px !important; }
@media screen and (min-width: 0px) and (max-width: 667px) { .mat130 { margin-top: 20px !important; } }

.mat135 { margin-top: 135px !important; }
@media screen and (min-width: 0px) and (max-width: 667px) { .mat135 { margin-top: 20px !important; } }

.mat140 { margin-top: 140px !important; }
@media screen and (min-width: 0px) and (max-width: 667px) { .mat140 { margin-top: 20px !important; } }

.mat145 { margin-top: 145px !important; }
@media screen and (min-width: 0px) and (max-width: 667px) { .mat145 { margin-top: 20px !important; } }

.mat150 { margin-top: 150px !important; }
@media screen and (min-width: 0px) and (max-width: 667px) { .mat150 { margin-top: 20px !important; } }

.mat155 { margin-top: 155px !important; }
@media screen and (min-width: 0px) and (max-width: 667px) { .mat155 { margin-top: 20px !important; } }

.mat160 { margin-top: 160px !important; }
@media screen and (min-width: 0px) and (max-width: 667px) { .mat160 { margin-top: 20px !important; } }

.mat165 { margin-top: 165px !important; }
@media screen and (min-width: 0px) and (max-width: 667px) { .mat165 { margin-top: 20px !important; } }

.mat170 { margin-top: 170px !important; }
@media screen and (min-width: 0px) and (max-width: 667px) { .mat170 { margin-top: 20px !important; } }

.mat175 { margin-top: 175px !important; }
@media screen and (min-width: 0px) and (max-width: 667px) { .mat175 { margin-top: 20px !important; } }

.mat180 { margin-top: 180px !important; }
@media screen and (min-width: 0px) and (max-width: 667px) { .mat180 { margin-top: 20px !important; } }

.mat185 { margin-top: 185px !important; }
@media screen and (min-width: 0px) and (max-width: 667px) { .mat185 { margin-top: 20px !important; } }

.mat190 { margin-top: 190px !important; }
@media screen and (min-width: 0px) and (max-width: 667px) { .mat190 { margin-top: 20px !important; } }

.mat195 { margin-top: 195px !important; }
@media screen and (min-width: 0px) and (max-width: 667px) { .mat195 { margin-top: 20px !important; } }

.mat200 { margin-top: 200px !important; }
@media screen and (min-width: 0px) and (max-width: 667px) { .mat200 { margin-top: 20px !important; } }

.mat205 { margin-top: 205px !important; }
@media screen and (min-width: 0px) and (max-width: 667px) { .mat205 { margin-top: 20px !important; } }

.mat210 { margin-top: 210px !important; }
@media screen and (min-width: 0px) and (max-width: 667px) { .mat210 { margin-top: 20px !important; } }

.mat215 { margin-top: 215px !important; }
@media screen and (min-width: 0px) and (max-width: 667px) { .mat215 { margin-top: 20px !important; } }

.mat220 { margin-top: 220px !important; }
@media screen and (min-width: 0px) and (max-width: 667px) { .mat220 { margin-top: 20px !important; } }

.mat225 { margin-top: 225px !important; }
@media screen and (min-width: 0px) and (max-width: 667px) { .mat225 { margin-top: 20px !important; } }

.mat230 { margin-top: 230px !important; }
@media screen and (min-width: 0px) and (max-width: 667px) { .mat230 { margin-top: 20px !important; } }

.mat235 { margin-top: 235px !important; }
@media screen and (min-width: 0px) and (max-width: 667px) { .mat235 { margin-top: 20px !important; } }

.mat240 { margin-top: 240px !important; }
@media screen and (min-width: 0px) and (max-width: 667px) { .mat240 { margin-top: 20px !important; } }

.mat245 { margin-top: 245px !important; }
@media screen and (min-width: 0px) and (max-width: 667px) { .mat245 { margin-top: 20px !important; } }

.lineupCountList { counter-reset: lineupCount 3; padding-left: 1.4em; }
.lineupCountList > li { position: relative; counter-increment: lineupCount -1; }
.lineupCountList > li:before { content: ''; position: absolute; left: -1.2em; top: 0.16em; width: 1em; height: 1em; -moz-border-radius: 50%; -webkit-border-radius: 50%; border-radius: 50%; }
.lineupCountList > li:after { position: absolute; left: -1.3em; top: 0.1em; color: #fff; font-size: 71%; content: counter(lineupCount); }
.lineupCountList > li:first-child:before { background-color: #b88904; }
.lineupCountList > li.nthChild2:before { background-color: #0d6eb9; }

.lineupCountList02 { counter-reset: lineupCount 2; padding-left: 1.4em; }
.lineupCountList02 > li { position: relative; counter-increment: lineupCount -1; }
.lineupCountList02 > li:before { content: ''; position: absolute; left: -1.2em; top: 0.16em; width: 1em; height: 1em; -moz-border-radius: 50%; -webkit-border-radius: 50%; border-radius: 50%; }
.lineupCountList02 > li:after { position: absolute; left: -1.3em; top: 0.1em; color: #fff; font-size: 71%; content: counter(lineupCount); }
.lineupCountList02 > li:first-child:before { background-color: #0d6eb9; }

.lineupFlowList { counter-reset: lineupFlowCount; }
.lineupFlowList > li { position: relative; }
.lineupFlowList > li:before { position: absolute; content: ''; top: -60px; bottom: 0; left: -20px; width: 0px; height: 0px; margin: auto; content: ""; position: absolute; border-top: 10px solid transparent; border-right: 16px solid transparent; border-bottom: 10px solid transparent; border-left: 16px solid #0a3190; }
@media screen and (min-width: 0px) and (max-width: 667px) { .lineupFlowList > li:before { top: -20px; bottom: auto; left: 0; right: 0; margin: auto; content: ""; position: absolute; border-top: 16px solid #0a3190; border-right: 10px solid transparent; border-bottom: 16px solid transparent; border-left: 10px solid transparent; } }
.lineupFlowList > li:first-child:before { display: none; }
.lineupFlowList .titleFlow { counter-increment: lineupFlowCount; font-size: 114%; font-weight: 700; background-color: #7f7f7f; color: #fff; padding: 4px 6px 2px; margin-bottom: 3px; }
.lineupFlowList .titleFlow:before { content: counter(lineupFlowCount) ". "; }

.lineupFlowList02 > li { position: relative; }
.lineupFlowList02 > li:before { position: absolute; content: ''; top: 0; bottom: 0; left: -6px; width: 0px; height: 0px; margin: auto; content: ""; position: absolute; border-top: 14px solid transparent; border-right: 14px solid transparent; border-bottom: 14px solid transparent; border-left: 14px solid #0a3190; }
@media screen and (min-width: 0px) and (max-width: 667px) { .lineupFlowList02 > li:before { top: -20px; bottom: auto; left: 0; right: 0; margin: auto; content: ""; position: absolute; border-top: 16px solid #0a3190; border-right: 10px solid transparent; border-bottom: 16px solid transparent; border-left: 10px solid transparent; } }
.lineupFlowList02 > li:first-child:before { display: none; }

.headingLineupLv01 { font-size: 171%; font-weight: 700; color: #0a3190; line-height: 1.4; border-bottom: 1px solid #ccc; padding-bottom: 0.7em; }
@media screen and (min-width: 0px) and (max-width: 667px) { .headingLineupLv01 { font-size: 121%; } }

.headingLineupLv02 { font-size: 186%; font-weight: 700; color: #1ba8d8; line-height: 1.4; margin-bottom: 15px; }
@media screen and (min-width: 0px) and (max-width: 667px) { .headingLineupLv02 { font-size: 143%; } }

.headingLineupLv04 { border-top: 1px solid #ccc; padding-top: 12px; color: #eb8712; font-size: 114%; font-weight: 700; margin-bottom: 12px; }

.headingLineupLv05 { font-size: 171%; font-weight: 700; color: #fff; line-height: 1.4; padding-bottom: 0.7em; }
@media screen and (min-width: 0px) and (max-width: 667px) { .headingLineupLv05 { font-size: 121%; } }


#lineupTitleArea { position: relative; }
@media screen and (min-width: 0px) and (max-width: 667px) { #lineupTitleArea { width: auto; } }
#lineupTitleArea:after { position: absolute; content: ''; margin: auto; }
#lineupTitleArea01 { position: relative; }
@media screen and (min-width: 0px) and (max-width: 667px) { #lineupTitleArea01 { width: auto; } }
#lineupTitleArea01:after { position: absolute; content: ''; margin: auto; }

.headingCount { counter-reset: lineupCount; }
.headingCount h4 { position: relative; counter-increment: lineupCount; padding-left: 3.4em; font-size: 114%; }
.headingCount h4:before { content: ""; display: inline-block; vertical-align: middle; height: 100%; }
.headingCount h4 > * { display: inline-block; vertical-align: middle; }
.headingCount h4:before { min-height: 2.4em; }
.headingCount h4 span:before { content: ''; position: absolute; left: 0.8em; top: 0.75em; width: 2em; height: 2em; -moz-border-radius: 3px; -webkit-border-radius: 3px; border-radius: 3px; background-color: #0b3290; }
.headingCount h4 span:after { position: absolute; left: 0.8em; top: 0.6em; color: #fff; font-size: 157%; font-style: italic; font-weight: 400; content: counter(lineupCount); }
@media screen and (min-width: 0px) and (max-width: 667px) { .headingCount h4 span:after { left: 0.7em; top: 0.5em; } }

.headingCountAlpha { counter-reset: lineupCount; }
.headingCountAlpha h4 { position: relative; counter-increment: lineupCount; padding-left: 3.2em; font-size: 114%; text-align: center; }
.headingCountAlpha h4:before { content: ""; display: inline-block; vertical-align: middle; height: 100%; }
.headingCountAlpha h4 > * { display: inline-block; vertical-align: middle; }
.headingCountAlpha h4:before { min-height: 2.4em; }
.headingCountAlpha h4 span:before { content: ''; position: absolute; left: 0.8em; top: 0.75em; width: 2em; height: 2em; -moz-border-radius: 3px; -webkit-border-radius: 3px; border-radius: 3px; background-color: #0b3290; }
.headingCountAlpha h4 span:after { position: absolute; left: 0.8em; top: 0.6em; color: #fff; font-size: 157%; font-style: italic; font-weight: 400; content: counter(lineupCount,upper-alpha); }
@media screen and (min-width: 0px) and (max-width: 667px) { .headingCountAlpha h4 span:after { left: 0.7em; top: 0.5em; } }

.gridListfeature { width: 101.26316%; margin-left: -1.26316%; }
.gridListfeature:before, .gridListfeature:after { content: ""; display: table; }
.gridListfeature:after { clear: both; }
.gridListfeature > * { -moz-box-sizing: border-box; -webkit-box-sizing: border-box; box-sizing: border-box; float: left; width: 32.06316%; margin-left: 1.26316%; }
.gridListfeature > *.gridCol02 { width: 65.38947%; }
.gridListfeature > *.gridCol03 { width: 98.71579%; }
.gridListfeature > *:first-child + * + * ~ * { margin-top: 6px; }
@media screen and (min-width: 0px) and (max-width: 667px) { .gridListfeature { width: 104.1958%; margin-left: -4.1958%; }
	.gridListfeature:before, .gridListfeature:after { content: ""; display: table; }
	.gridListfeature:after { clear: both; }
	.gridListfeature > * { -moz-box-sizing: border-box; -webkit-box-sizing: border-box; box-sizing: border-box; float: left; width: 45.8042%; margin-left: 4.1958%; }
	.gridListfeature > *.gridCol02 { width: 95.8042%; }
	.gridListfeature > *:first-child + * ~ * { margin-top: 6px; } }
.gridListfeature > li { text-align: center; }
.gridListfeature > li:before { content: ""; display: inline-block; vertical-align: middle; height: 100%; }
.gridListfeature > li > * { display: inline-block; vertical-align: middle; }
.gridListfeature > li:before { min-height: 40px; }

.gridCoatingInfo01 { width: 100%; margin-left: 0%; }
.gridCoatingInfo01:before, .gridCoatingInfo01:after { content: ""; display: table; }
.gridCoatingInfo01:after { clear: both; }
.gridCoatingInfo01 > * { -moz-box-sizing: border-box; -webkit-box-sizing: border-box; box-sizing: border-box; float: left; width: 100%; margin-left: 0%; }
.gridCoatingInfo01 > *.gridCol02 { width: 200%; }
.gridCoatingInfo01 > *.gridCol01 { width: 100%; }
.gridCoatingInfo01 > *:first-child ~ * { margin-top: 12px; }

.gridCoatingInfo02 { width: 100%; margin-left: 0%; }
.gridCoatingInfo02:before, .gridCoatingInfo02:after { content: ""; display: table; }
.gridCoatingInfo02:after { clear: both; }
.gridCoatingInfo02 > * { -moz-box-sizing: border-box; -webkit-box-sizing: border-box; box-sizing: border-box; float: left; width: 50%; margin-left: 0%; }
.gridCoatingInfo02 > *.gridCol02 { width: 100%; }
.gridCoatingInfo02 > *:first-child + * ~ * { margin-top: 12px; }

.gridCoatingInfo03 { width: 100%; margin-left: 0%; }
.gridCoatingInfo03:before, .gridCoatingInfo03:after { content: ""; display: table; }
.gridCoatingInfo03:after { clear: both; }
.gridCoatingInfo03 > * { -moz-box-sizing: border-box; -webkit-box-sizing: border-box; box-sizing: border-box; float: left; width: 33.32623%; margin-left: 0%; }
.gridCoatingInfo03 > *.gridCol02 { width: 66.65245%; }
.gridCoatingInfo03 > *.gridCol03 { width: 99.97868%; }
.gridCoatingInfo03 > *:first-child + * + * ~ * { margin-top: 12px; }

.gridCoatingInfo04 { width: 100%; margin-left: 0%; }
.gridCoatingInfo04:before, .gridCoatingInfo04:after { content: ""; display: table; }
.gridCoatingInfo04:after { clear: both; }
.gridCoatingInfo04 > * { -moz-box-sizing: border-box; -webkit-box-sizing: border-box; box-sizing: border-box; float: left; width: 25%; margin-left: 0%; }
.gridCoatingInfo04 > *.gridCol02 { width: 50%; }
.gridCoatingInfo04 > *.gridCol03 { width: 75%; }
.gridCoatingInfo04 > *.gridCol04 { width: 100%; }
.gridCoatingInfo04 > *:first-child + * + * + * ~ * { margin-top: 12px; }

.gridCoatingInfo05 { width: 100%; margin-left: 0%; }
.gridCoatingInfo05:before, .gridCoatingInfo05:after { content: ""; display: table; }
.gridCoatingInfo05:after { clear: both; }
.gridCoatingInfo05 > * { -moz-box-sizing: border-box; -webkit-box-sizing: border-box; box-sizing: border-box; float: left; width: 19.93603%; margin-left: 0%; }
.gridCoatingInfo05 > *.gridCol02 { width: 39.87207%; }
.gridCoatingInfo05 > *.gridCol03 { width: 59.8081%; }
.gridCoatingInfo05 > *.gridCol04 { width: 79.74414%; }
.gridCoatingInfo05 > *.gridCol05 { width: 99.68017%; }
.gridCoatingInfo05 > *:first-child + * + * + * + * ~ * { margin-top: 12px; }

.gridCoatingInfo06 { width: 100%; margin-left: 0%; }
.gridCoatingInfo06:before, .gridCoatingInfo06:after { content: ""; display: table; }
.gridCoatingInfo06:after { clear: both; }
.gridCoatingInfo06 > * { -moz-box-sizing: border-box; -webkit-box-sizing: border-box; box-sizing: border-box; float: left; width: 16.6%; margin-left: 0%; }
.gridCoatingInfo06 > *.gridCol02 { width: 19.87207%; }
.gridCoatingInfo06 > *.gridCol03 { width: 39.8081%; }
.gridCoatingInfo06 > *.gridCol04 { width: 59.74414%; }
.gridCoatingInfo06 > *.gridCol05 { width: 79.68017%; }
.gridCoatingInfo06 > *.gridCol06 { width: 100%; }
.gridCoatingInfo06 > *:first-child + * + * + * + * + * ~ * { margin-top: 12px; }

/* 202503 add start */
ul.flexerap {
    display: flex;
}
ul.flexerap li {
    width: calc(100% - 5px / 4);
    margin-top: 0!important;
}
ul.flexerap li span {
    display: inline-block;
    content: '　';
}
@media screen and (min-width: 0px) and (max-width: 667px) {
    ul.flexerap li span {
        display: block;
        content: none;
}
}
/* 202503 add end */

[class^="gridCoatingInfo"] > li { border-right: 1px solid #ccc; }
@media screen and (min-width: 0px) and (max-width: 667px) { [class^="gridCoatingInfo"] > li { border: none; } }
[class^="gridCoatingInfo"] > li dl > dt { background-color: #f0f0f0; padding: 4px 4px 2px; font-weight: 700; font-size: 86%; }
[class^="gridCoatingInfo"] > li dl > dd { padding: 6px 10px 4px; }
[class^="gridCoatingInfo"] > li:first-child { border-left: 1px solid #ccc; }
@media screen and (min-width: 0px) and (max-width: 667px) { [class^="gridCoatingInfo"] > li:first-child { border: none; } }

.wideHeadingWrap { padding: 0 20px 20px; background-color: #fff; }
.wideHeadingWrap .headingLv04 { margin: 0 -20px; }
@media screen and (min-width: 0px) and (max-width: 667px) { .wideHeadingWrap { padding: 0 10px 10px; }
	.wideHeadingWrap .headingLv04 { margin: 0 -10px; } }

.tableStylePrice { margin: -10px -10px 0; border-collapse: separate; table-layout: fixed; }
.tableStylePrice .cols04 { background-color: #e4e4e4; }
@media screen and (min-width: 0px) and (max-width: 667px) { .tableStylePrice { width: auto; margin: 0 -4px; } }
.tableStylePrice th, .tableStylePrice td { padding: 10px 11px; text-align: center; word-break: break-all; border-left: 1px solid #ccc; vertical-align: middle; -moz-box-sizing: border-box; -webkit-box-sizing: border-box; box-sizing: border-box; }
@media screen and (min-width: 0px) and (max-width: 667px) { .tableStylePrice th, .tableStylePrice td { padding: 2px 4px; } }
.tableStylePrice th { font-weight: 700; text-align: center; border-left: 1px solid #f0f0f0; background: #666; color: #fff; line-height: 1.2; }
.tableStylePrice tr { position: relative; }
.tableStylePrice thead th, .tableStylePrice thead td { vertical-align: top; }
.tableStylePrice .cellCombine { border-top: 1px solid #ccc; border-bottom: 1px solid #ccc; }
.tableStylePrice .cellCombineGray { padding: 2px 4px; background-color: #f0f0f0; }
.tableStylePrice .cellWidthCol04 { width: 240px; }
.tableStylePrice .cellWidthCol08 { width: 120px; }
@media screen and (min-width: 0px) and (max-width: 667px) { .tableStylePrice .mbCellHeight020 { height: 20px; } }
@media screen and (min-width: 0px) and (max-width: 667px) { .tableStylePrice .mbCellHeight022 { height: 22px; } }
@media screen and (min-width: 0px) and (max-width: 667px) { .tableStylePrice .mbCellHeight024 { height: 24px; } }
@media screen and (min-width: 0px) and (max-width: 667px) { .tableStylePrice .mbCellHeight026 { height: 26px; } }
@media screen and (min-width: 0px) and (max-width: 667px) { .tableStylePrice .mbCellHeight028 { height: 28px; } }
@media screen and (min-width: 0px) and (max-width: 667px) { .tableStylePrice .mbCellHeight030 { height: 30px; } }
@media screen and (min-width: 0px) and (max-width: 667px) { .tableStylePrice .mbCellHeight032 { height: 32px; } }
@media screen and (min-width: 0px) and (max-width: 667px) { .tableStylePrice .mbCellHeight034 { height: 34px; } }
@media screen and (min-width: 0px) and (max-width: 667px) { .tableStylePrice .mbCellHeight036 { height: 36px; } }
@media screen and (min-width: 0px) and (max-width: 667px) { .tableStylePrice .mbCellHeight038 { height: 38px; } }
@media screen and (min-width: 0px) and (max-width: 667px) { .tableStylePrice .mbCellHeight040 { height: 40px; } }
@media screen and (min-width: 0px) and (max-width: 667px) { .tableStylePrice .mbCellHeight042 { height: 42px; } }
@media screen and (min-width: 0px) and (max-width: 667px) { .tableStylePrice .mbCellHeight044 { height: 44px; } }
@media screen and (min-width: 0px) and (max-width: 667px) { .tableStylePrice .mbCellHeight046 { height: 46px; } }
@media screen and (min-width: 0px) and (max-width: 667px) { .tableStylePrice .mbCellHeight048 { height: 48px; } }
@media screen and (min-width: 0px) and (max-width: 667px) { .tableStylePrice .mbCellHeight050 { height: 50px; } }
@media screen and (min-width: 0px) and (max-width: 667px) { .tableStylePrice .mbCellHeight052 { height: 52px; } }
@media screen and (min-width: 0px) and (max-width: 667px) { .tableStylePrice .mbCellHeight054 { height: 54px; } }
@media screen and (min-width: 0px) and (max-width: 667px) { .tableStylePrice .mbCellHeight056 { height: 56px; } }
@media screen and (min-width: 0px) and (max-width: 667px) { .tableStylePrice .mbCellHeight058 { height: 58px; } }
@media screen and (min-width: 0px) and (max-width: 667px) { .tableStylePrice .mbCellHeight060 { height: 60px; } }
@media screen and (min-width: 0px) and (max-width: 667px) { .tableStylePrice .mbCellHeight062 { height: 62px; } }
@media screen and (min-width: 0px) and (max-width: 667px) { .tableStylePrice .mbCellHeight064 { height: 64px; } }
@media screen and (min-width: 0px) and (max-width: 667px) { .tableStylePrice .mbCellHeight066 { height: 66px; } }
@media screen and (min-width: 0px) and (max-width: 667px) { .tableStylePrice .mbCellHeight068 { height: 68px; } }
@media screen and (min-width: 0px) and (max-width: 667px) { .tableStylePrice .mbCellHeight070 { height: 70px; } }
@media screen and (min-width: 0px) and (max-width: 667px) { .tableStylePrice .mbCellHeight072 { height: 72px; } }
@media screen and (min-width: 0px) and (max-width: 667px) { .tableStylePrice .mbCellHeight074 { height: 74px; } }
@media screen and (min-width: 0px) and (max-width: 667px) { .tableStylePrice .mbCellHeight076 { height: 76px; } }
@media screen and (min-width: 0px) and (max-width: 667px) { .tableStylePrice .mbCellHeight078 { height: 78px; } }
@media screen and (min-width: 0px) and (max-width: 667px) { .tableStylePrice .mbCellHeight080 { height: 80px; } }
@media screen and (min-width: 0px) and (max-width: 667px) { .tableStylePrice .mbCellHeight082 { height: 82px; } }
@media screen and (min-width: 0px) and (max-width: 667px) { .tableStylePrice .mbCellHeight084 { height: 84px; } }
@media screen and (min-width: 0px) and (max-width: 667px) { .tableStylePrice .mbCellHeight086 { height: 86px; } }
@media screen and (min-width: 0px) and (max-width: 667px) { .tableStylePrice .mbCellHeight088 { height: 88px; } }
@media screen and (min-width: 0px) and (max-width: 667px) { .tableStylePrice .mbCellHeight090 { height: 90px; } }
@media screen and (min-width: 0px) and (max-width: 667px) { .tableStylePrice .mbCellHeight092 { height: 92px; } }
@media screen and (min-width: 0px) and (max-width: 667px) { .tableStylePrice .mbCellHeight094 { height: 94px; } }
@media screen and (min-width: 0px) and (max-width: 667px) { .tableStylePrice .mbCellHeight096 { height: 96px; } }
@media screen and (min-width: 0px) and (max-width: 667px) { .tableStylePrice .mbCellHeight098 { height: 98px; } }
@media screen and (min-width: 0px) and (max-width: 667px) { .tableStylePrice .mbCellHeight100 { height: 100px; } }
@media screen and (min-width: 0px) and (max-width: 667px) { .tableStylePrice .mbCellHeight102 { height: 102px; } }
@media screen and (min-width: 0px) and (max-width: 667px) { .tableStylePrice .mbCellHeight104 { height: 104px; } }
@media screen and (min-width: 0px) and (max-width: 667px) { .tableStylePrice .mbCellHeight106 { height: 106px; } }
@media screen and (min-width: 0px) and (max-width: 667px) { .tableStylePrice .mbCellHeight108 { height: 108px; } }
@media screen and (min-width: 0px) and (max-width: 667px) { .tableStylePrice .mbCellHeight110 { height: 110px; } }
@media screen and (min-width: 0px) and (max-width: 667px) { .tableStylePrice .mbCellHeight112 { height: 112px; } }
@media screen and (min-width: 0px) and (max-width: 667px) { .tableStylePrice .mbCellHeight114 { height: 114px; } }
@media screen and (min-width: 0px) and (max-width: 667px) { .tableStylePrice .mbCellHeight116 { height: 116px; } }
@media screen and (min-width: 0px) and (max-width: 667px) { .tableStylePrice .mbCellHeight118 { height: 118px; } }
@media screen and (min-width: 0px) and (max-width: 667px) { .tableStylePrice .mbCellHeight120 { height: 120px; } }
@media screen and (min-width: 0px) and (max-width: 667px) { .tableStylePrice .mbCellHeight122 { height: 122px; } }
@media screen and (min-width: 0px) and (max-width: 667px) { .tableStylePrice .mbCellHeight124 { height: 124px; } }
@media screen and (min-width: 0px) and (max-width: 667px) { .tableStylePrice .mbCellHeight126 { height: 126px; } }
@media screen and (min-width: 0px) and (max-width: 667px) { .tableStylePrice .mbCellHeight128 { height: 128px; } }
@media screen and (min-width: 0px) and (max-width: 667px) { .tableStylePrice .mbCellHeight130 { height: 130px; } }
@media screen and (min-width: 0px) and (max-width: 667px) { .tableStylePrice .mbCellHeight132 { height: 132px; } }
@media screen and (min-width: 0px) and (max-width: 667px) { .tableStylePrice .mbCellHeight134 { height: 134px; } }
@media screen and (min-width: 0px) and (max-width: 667px) { .tableStylePrice .mbCellHeight136 { height: 136px; } }
@media screen and (min-width: 0px) and (max-width: 667px) { .tableStylePrice .mbCellHeight138 { height: 138px; } }
@media screen and (min-width: 0px) and (max-width: 667px) { .tableStylePrice .mbCellHeight140 { height: 140px; } }
@media screen and (min-width: 0px) and (max-width: 667px) { .tableStylePrice .mbCellHeight142 { height: 142px; } }
@media screen and (min-width: 0px) and (max-width: 667px) { .tableStylePrice .mbCellHeight144 { height: 144px; } }
@media screen and (min-width: 0px) and (max-width: 667px) { .tableStylePrice .mbCellHeight146 { height: 146px; } }
@media screen and (min-width: 0px) and (max-width: 667px) { .tableStylePrice .mbCellHeight148 { height: 148px; } }
@media screen and (min-width: 0px) and (max-width: 667px) { .tableStylePrice .mbCellHeight150 { height: 150px; } }
@media screen and (min-width: 0px) and (max-width: 667px) { .tableStylePrice .mbCellHeight152 { height: 152px; } }
@media screen and (min-width: 0px) and (max-width: 667px) { .tableStylePrice .mbCellHeight154 { height: 154px; } }
@media screen and (min-width: 0px) and (max-width: 667px) { .tableStylePrice .mbCellHeight156 { height: 156px; } }
@media screen and (min-width: 0px) and (max-width: 667px) { .tableStylePrice .mbCellHeight158 { height: 158px; } }
@media screen and (min-width: 0px) and (max-width: 667px) { .tableStylePrice .mbCellHeight160 { height: 160px; } }
@media screen and (min-width: 0px) and (max-width: 667px) { .tableStylePrice .mbCellHeight162 { height: 162px; } }
@media screen and (min-width: 0px) and (max-width: 667px) { .tableStylePrice .mbCellHeight164 { height: 164px; } }
@media screen and (min-width: 0px) and (max-width: 667px) { .tableStylePrice .mbCellHeight166 { height: 166px; } }
@media screen and (min-width: 0px) and (max-width: 667px) { .tableStylePrice .mbCellHeight168 { height: 168px; } }
@media screen and (min-width: 0px) and (max-width: 667px) { .tableStylePrice .mbCellHeight170 { height: 170px; } }
@media screen and (min-width: 0px) and (max-width: 667px) { .tableStylePrice .mbCellHeight172 { height: 172px; } }
@media screen and (min-width: 0px) and (max-width: 667px) { .tableStylePrice .mbCellHeight174 { height: 174px; } }
@media screen and (min-width: 0px) and (max-width: 667px) { .tableStylePrice .mbCellHeight176 { height: 176px; } }
@media screen and (min-width: 0px) and (max-width: 667px) { .tableStylePrice .mbCellHeight178 { height: 178px; } }
@media screen and (min-width: 0px) and (max-width: 667px) { .tableStylePrice .mbCellHeight180 { height: 180px; } }
@media screen and (min-width: 0px) and (max-width: 667px) { .tableStylePrice .mbCellHeight182 { height: 182px; } }
@media screen and (min-width: 0px) and (max-width: 667px) { .tableStylePrice .mbCellHeight184 { height: 184px; } }
@media screen and (min-width: 0px) and (max-width: 667px) { .tableStylePrice .mbCellHeight186 { height: 186px; } }
@media screen and (min-width: 0px) and (max-width: 667px) { .tableStylePrice .mbCellHeight188 { height: 188px; } }
@media screen and (min-width: 0px) and (max-width: 667px) { .tableStylePrice .mbCellHeight190 { height: 190px; } }
@media screen and (min-width: 0px) and (max-width: 667px) { .tableStylePrice .mbCellHeight192 { height: 192px; } }
@media screen and (min-width: 0px) and (max-width: 667px) { .tableStylePrice .mbCellHeight194 { height: 194px; } }
@media screen and (min-width: 0px) and (max-width: 667px) { .tableStylePrice .mbCellHeight196 { height: 196px; } }
@media screen and (min-width: 0px) and (max-width: 667px) { .tableStylePrice .mbCellHeight198 { height: 198px; } }
@media screen and (min-width: 0px) and (max-width: 667px) { .tableStylePrice .mbCellHeight200 { height: 200px; } }
.tableStylePrice h4 { line-height: 1.2; text-align: center; padding: 7px 12px 5px; }
.tableStylePrice h4:before { content: ""; display: inline-block; vertical-align: middle; height: 100%; }
.tableStylePrice h4 > * { display: inline-block; vertical-align: middle; }
.tableStylePrice h4:before { min-height: 34px; }
.tableStylePrice .lineupCountList > li { word-break: break-all; word-wrap: break-word; }
.tableStylePrice .nthChild4 .lineupCountList { counter-reset: lineupCount 2; }
.tableStylePrice .nthChild4 .lineupCountList > li:first-child:before { background-color: #0d6eb9; }

/*　index
----------------------------------------*/
#lineup .idx .tableStylePrice { width: 721px; }
@media screen and (min-width: 0px) and (max-width: 667px) {
#lineup .idx .tableStylePrice { padding-bottom: 20px !important; } }

#lineup .idx .tableOverlay { padding-bottom: 20px !important; }
#lineup .idx .lineupMenu { position: relative; }
#lineup .idx .lineupMenu:before, #lineup .idx .lineupMenu:after { content: ""; display: table; }
#lineup .idx .lineupMenu:after { clear: both; }
#lineup .idx .lineupMenu #lineupMenuArea { overflow: hidden; }
#lineup .idx .lineupMenu #lineupMenuArea .tableStylePrice h4.ex{
background-color: #bc0a20;
color: white;
}
#lineup .idx .lineupMenu #lineupMenuArea .tableStylePrice p.ex{
color: #bc0a20;
}


@media screen and (min-width: 0px) and (max-width: 667px) {
#lineup .idx .lineupMenu #lineupMenuArea { float: none; }
}

#lineup .idx .lineupMenu #carwashCareArea {
padding: 18px 20px;
background-color: #e4e4e4;
margin-top:50px;
border-radius: 5px;
}
@media screen and (min-width: 0px) and (max-width: 667px) {
#lineup .idx .lineupMenu #carwashCareArea { padding: 10px; }
}

#lineup .idx .lineupMenu #carwashCareArea h4 > * { display: inline-block; vertical-align: middle; }
#lineup .idx .lineupMenu .carwashCareList { text-align: center; }
#lineup .idx .lineupMenu .carwashCareList > div{
width:20%;
display:inline-block;
padding: 10px 20px 0;
font-weight: 700;
}
@media screen and (min-width: 0px) and (max-width: 667px) {
#lineup .idx .lineupMenu .carwashCareList > div{
width:auto;
display:block;
border-top: 4px solid #bdbdbd;
padding: 10px 0;
}
#lineup .idx .lineupMenu .carwashCareList > div:first-of-type {
border-top: none;
}
}

#lineup .idx .lineupMenu .carwashCareList > div figure { background-color: #f0f0f0; padding: 4px 0 2px;}
#lineup .idx .lineupMenu .carwashCareList > div figure figcaption { font-weight: 700; font-size: 86%; padding: 2px; }

/* price
----------------------------------------*/
#lineup .price .tableStylePrice { width: 960px; }
@media screen and (min-width: 0px) and (max-width: 667px) { #lineup .price .tableStylePrice { padding-bottom: 20px !important; } }
#lineup .price .tableStylePrice th.lastChild, #lineup .price .tableStylePrice td.lastChild { border-left: 3px solid #ccc; }
#lineup .price .tableOverlay { padding-bottom: 20px !important; }
#lineup #priceListArea { overflow: hidden; }

/* coating
----------------------------------------*/
/* index */
#lineup .coatingIdx .coatingIdxList dl > dt { position: relative; font-size: 114%; text-align: center; border-top: 2px solid  #0b328f; font-weight: 700; padding: 10px 14px 8px; line-height: 1.2; }
#lineup .coatingIdx .coatingIdxList dl > dt:before { content: ""; display: inline-block; vertical-align: middle; height: 100%; }
#lineup .coatingIdx .coatingIdxList dl > dt > * { display: inline-block; vertical-align: middle; }
#lineup .coatingIdx .coatingIdxList dl > dt:before { min-height: 2.4em; }
#lineup .coatingIdx .headingCotingLv04 { border-top: 1px solid  #0b328f; font-weight: 700; font-size: 129%; background-image: url('data:image/svg+xml;base64,PD94bWwgdmVyc2lvbj0iMS4wIiBlbmNvZGluZz0idXRmLTgiPz4gPHN2ZyB2ZXJzaW9uPSIxLjEiIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyI+PGRlZnM+PGxpbmVhckdyYWRpZW50IGlkPSJncmFkIiBncmFkaWVudFVuaXRzPSJvYmplY3RCb3VuZGluZ0JveCIgeDE9IjAuNSIgeTE9IjAuMCIgeDI9IjAuNSIgeTI9IjEuMCI+PHN0b3Agb2Zmc2V0PSIwJSIgc3RvcC1jb2xvcj0iI2NjY2NjYyIvPjxzdG9wIG9mZnNldD0iMTAwJSIgc3RvcC1jb2xvcj0iI2ZmZmZmZiIvPjwvbGluZWFyR3JhZGllbnQ+PC9kZWZzPjxyZWN0IHg9IjAiIHk9IjAiIHdpZHRoPSIxMDAlIiBoZWlnaHQ9IjEwMCUiIGZpbGw9InVybCgjZ3JhZCkiIC8+PC9zdmc+IA=='); background-size: 100%; background-image: -webkit-gradient(linear, 50% 0%, 50% 26, color-stop(0%, #cccccc), color-stop(100%, #ffffff)); background-image: -moz-linear-gradient(top, #cccccc, #ffffff 26px); background-image: -webkit-linear-gradient(top, #cccccc, #ffffff 26px); background-image: linear-gradient(to bottom, #cccccc, #ffffff 26px); *zoom: 1; filter: progid:DXImageTransform.Microsoft.gradient(gradientType=0, startColorstr='#FFCCCCCC', endColorstr='#FFFFFFFF'); padding: 10px 14px 8px; margin-bottom: 8px; line-height: 1.2; }

/* 2nd page */
#lineup .coating .addGradient { background-position: 50% 182px; }
@media screen and (min-width: 0px) and (max-width: 667px) { #lineup .coating .addGradient { background-image: none; } }
@media screen and (min-width: 0px) and (max-width: 667px) { #lineup .gridCoatingLineup { width: 100%; margin-left: 0%; }
	#lineup .gridCoatingLineup:before, #lineup .gridCoatingLineup:after { content: ""; display: table; }
	#lineup .gridCoatingLineup:after { clear: both; }
	#lineup .gridCoatingLineup > * { -moz-box-sizing: border-box; -webkit-box-sizing: border-box; box-sizing: border-box; float: left; width: 100%; margin-left: 0%; }
	#lineup .gridCoatingLineup > *.gridCol02 { width: 200%; }
	#lineup .gridCoatingLineup > *.gridCol01 { width: 100%; }
	#lineup .gridCoatingLineup > *:first-child ~ * { margin-top: 12px; } }
#lineup .gridCoatingLineup > li > a { display: block; padding: 0px; text-align: center; font-weight: 700; font-size: 114%; line-height: 1.2; color: #333; }
#lineup .gridCoatingLineup > li > a:before { content: ""; display: inline-block; vertical-align: middle; height: 100%; }
#lineup .gridCoatingLineup > li > a > * { display: inline-block; vertical-align: middle; }
#lineup .gridCoatingLineup > li > a span { padding-right: 56px; font-size: 0.84rem; }
#lineup .gridCoatingLineup > li > a span img { margin: 0px -20px 10px 0px; }
@media screen and (min-width: 0px) and (max-width: 667px) { #lineup .gridCoatingLineup > li > a span img { margin: 0px 0px 10px 0px; } }
@media screen and (min-width: 0px) and (max-width: 667px) { #lineup .gridCoatingLineup > li > a { padding: 0px; }
	#lineup .gridCoatingLineup > li > a:before { min-height: 54px; } }
#lineup .gridCoatingLineup > li > a:before { min-height: 118px; }
#lineup .gridCoatingLineup > li > a.active { position: relative; }
#lineup .gridCoatingLineup > li > a.active span:before { position: absolute; content: ''; top: -1px; bottom: -1px; left: -1px; right: -1px; border: 4px solid #0b3290; -moz-border-radius: 5px; -webkit-border-radius: 5px; border-radius: 5px; }
/* ダイヤⅡ選択時に枠の色を変えるための設定 */
/* #lineup .gridCoatingLineup > li > a[href*="dia2"].active span:before {
  display: none !important;
} */
 /* アイアン・プロテクトキーパー選択時に枠の色を変えるための設定 */
/* #lineup .gridCoatingLineup > li > a[href*="iron"].active span:before {
  display: none !important;
} */
#lineup .gridCoatingLineup > li:first-child a { background: #ffffff url("../img/lineup/coating/p_coating05.jpg") 100% 0 no-repeat; -moz-border-radius: 5px; -webkit-border-radius: 5px; border-radius: 5px; }
#lineup .gridCoatingLineup > li.nthChild2 a { background: #e7fb0b33 url("../img/lineup/coating/p_coating09.png") 100% 0 no-repeat; -moz-border-radius: 5px; -webkit-border-radius: 5px; border-radius: 5px; }
#lineup .gridCoatingLineup > li.nthChild7 a { background: #f2edda url("../img/lineup/coating/p_coating02.png") 100% 0 no-repeat; -moz-border-radius: 5px; -webkit-border-radius: 5px; border-radius: 5px; }
#lineup .gridCoatingLineup > li.nthChild5 a { background: #e5ecf4 url("../img/lineup/coating/p_coating03.png") 100% 0 no-repeat; -moz-border-radius: 5px; -webkit-border-radius: 5px; border-radius: 5px; }
/* #lineup .gridCoatingLineup > li.nthChild7 a { background: #dffae9 url("../img/lineup/coating/p_coating06.png") 100% 0 no-repeat; -moz-border-radius: 5px; -webkit-border-radius: 5px; border-radius: 5px; } */
#lineup .gridCoatingLineup > li.nthChild4 a { background: #e8f6fb url("../img/lineup/coating/p_coating01.png") 100% 0 no-repeat; -moz-border-radius: 5px; -webkit-border-radius: 5px; border-radius: 5px; }
#lineup .gridCoatingLineup > li.nthChild3 a { background: #fff9d9 url("../img/lineup/coating/p_coating07.png") 100% 0 no-repeat; -moz-border-radius: 5px; -webkit-border-radius: 5px; border-radius: 5px; }
#lineup .gridCoatingLineup > li.nthChild6 a { background: #dfe7ec url("../img/lineup/coating/p_coating08.png") 100% 0 no-repeat; -moz-border-radius: 5px; -webkit-border-radius: 5px; border-radius: 5px; }
/*#lineup .gridCoatingLineup > li.lastChild { border: none; }*/

/* crystal */
.crystal .addGradient { background: #fff url("../img/bg_contents_gradient01.png") 50% 152px no-repeat; }
.crystal #lineupTitleArea { padding-right: 406px; }
@media screen and (min-width: 0px) and (max-width: 667px) { .crystal #lineupTitleArea { padding-right: 0px; } }
.crystal #lineupTitleArea:after { top: 12px; right: -18px; width: 369px; height: 491px; background: url("../img/lineup/coating/bg_crystal01.png") 100% 0 no-repeat; }
@media screen and (min-width: 0px) and (max-width: 667px) { .crystal #lineupTitleArea:after { background-size: 112px auto; top: -6px; right: -10px; height: 200px; } }

/* dia2 keeper_dia2.cssに移植 20251217*/

/* diamond */
.diamond .addGradient { background: #fff url("../img/bg_contents_gradient02.png") 50% 152px no-repeat; }
.diamond #lineupTitleArea { padding-right: 406px; }
@media screen and (min-width: 0px) and (max-width: 667px) { .diamond #lineupTitleArea { padding-right: 0px; } }
.diamond #lineupTitleArea:after { top: 12px; right: -18px; width: 394px; height: 491px; background: url("../img/lineup/coating/bg_diamond01.png") 100% 0 no-repeat; }
@media screen and (min-width: 0px) and (max-width: 667px) { .diamond #lineupTitleArea:after { background-size: 112px auto; top: -6px; right: -10px; height: 200px; } }
.diamond #mentenaceArea .headingCountAlpha > li { padding: 0 10px 10px; background-color: #fff; }
.diamond #mentenaceArea .headingCountAlpha > li .headingLv04 { margin: 0 -10px; }
.diamond #mentenaceArea .headingCountAlpha [class^="gridCoatingInfo"] > li dl > dd { padding: 6px 4px 4px; }

/* ddiamond */
.ddiamond .addGradient { background: #fff url("../img/bg_contents_gradient03.png") 50% 152px no-repeat; }
.ddiamond #lineupTitleArea { padding-right: 406px; }
@media screen and (min-width: 0px) and (max-width: 667px) { .ddiamond #lineupTitleArea { padding-right: 0px; } }
.ddiamond #lineupTitleArea:after { top: 0; right: -18px; width: 394px; height: 506px; background: url("../img/lineup/coating/bg_ddiamond01.png") 100% 0 no-repeat; }
@media screen and (min-width: 0px) and (max-width: 667px) { .ddiamond #lineupTitleArea:after { background-size: 98px auto; top: -6px; right: -10px; height: 200px; } }
.ddiamond #mentenaceArea .headingCountAlpha > li { padding: 0 10px 10px; background-color: #fff; }
.ddiamond #mentenaceArea .headingCountAlpha > li .headingLv04 { margin: 0 -10px; }
.ddiamond #mentenaceArea .headingCountAlpha [class^="gridCoatingInfo"] > li dl > dd { padding: 6px 4px 4px; }

.eco_diamond .addGradient { background: #fff url("../img/bg_contents_gradient05.png") 50% 152px no-repeat; }
.eco_diamond #lineupTitleArea { padding-right: 406px; }
@media screen and (min-width: 0px) and (max-width: 667px) { .eco_diamond #lineupTitleArea { padding-right: 0px; } }
.eco_diamond #lineupTitleArea:after { top: 0; right: -18px; width: 394px; height: 506px; background: url("../img/lineup/coating/bg_ecodiamond01.png") 100% 0 no-repeat; }
@media screen and (min-width: 0px) and (max-width: 667px) { .eco_diamond #lineupTitleArea:after { background-size: 82px auto; top: -6px; right: -10px; height: 200px; } }
.eco_diamond #mentenaceArea .headingCountAlpha > li { padding: 0 10px 10px; background-color: #fff; }
.eco_diamond #mentenaceArea .headingCountAlpha > li .headingLv04 { margin: 0 -10px; }
.eco_diamond #mentenaceArea .headingCountAlpha [class^="gridCoatingInfo"] > li dl > dd { padding: 6px 4px 4px; }
.eco_diamond_pre { padding: 0px 0px 10px; }

.fresh .addGradient { background: #fff url("../img/bg_contents_gradient06.png") 50% 152px no-repeat; }
.fresh #lineupTitleArea { padding-right: 406px; }
@media screen and (min-width: 0px) and (max-width: 667px) { .fresh #lineupTitleArea { padding-right: 0px; } }
.fresh #lineupTitleArea:after { top: 0; right: -18px; width: 394px; height: 506px; background: url("../img/lineup/coating/bg_fresh01.png") 100% 0 no-repeat; }
@media screen and (min-width: 0px) and (max-width: 667px) { .fresh #lineupTitleArea:after { background-size: 82px auto; top: -6px; right: -10px; height: 200px; } }
.fresh #mentenaceArea .headingCountAlpha > li { padding: 0 10px 10px; background-color: #fff; }
.fresh #mentenaceArea .headingCountAlpha > li .headingLv04 { margin: 0 -10px; }
.fresh #mentenaceArea .headingCountAlpha [class^="gridCoatingInfo"] > li dl > dd { padding: 6px 4px 4px; }
.fresh { padding: 0px 0px 10px; }

#ex > img{
width:100%;
}


/* wash
----------------------------------------*/
#lineup .wash .addGradient { background-position: 50% 152px; }
@media screen and (min-width: 0px) and (max-width: 667px) { #lineup .wash .addGradient { background-image: none; } }
@media screen and (min-width: 0px) and (max-width: 667px) { #lineup .gridWashLineup { width: 100%; margin-left: 0%; }
	#lineup .gridWashLineup:before, #lineup .gridWashLineup:after { content: ""; display: table; }
	#lineup .gridWashLineup:after { clear: both; }
	#lineup .gridWashLineup > * { -moz-box-sizing: border-box; -webkit-box-sizing: border-box; box-sizing: border-box; float: left; width: 100%; margin-left: 0%; }
	#lineup .gridWashLineup > *.gridCol02 { width: 200%; }
	#lineup .gridWashLineup > *.gridCol01 { width: 100%; }
	#lineup .gridWashLineup > *:first-child ~ * { margin-top: 12px; } }
#lineup .gridWashLineup > li > a { display: block; padding: 0px; text-align: center; font-weight: 700; font-size: 114%; line-height: 1.2; color: #333; }
#lineup .gridWashLineup > li > a:before { content: ""; display: inline-block; vertical-align: middle; height: 100%; }
#lineup .gridWashLineup > li > a > * { display: inline-block; vertical-align: middle; }
#lineup .gridWashLineup > li > a span { padding-right: 90px; }
#lineup .gridWashLineup > li > a span img { margin: 0px 0px 10px 0px; }
@media screen and (min-width: 0px) and (max-width: 667px) { #lineup .gridWashLineup > li > a { padding: 0px; }
	#lineup .gridWashLineup > li > a:before { min-height: 54px; } }
#lineup .gridWashLineup > li > a:before { min-height: 118px; }
#lineup .gridWashLineup > li > a:hover { -webkit-backface-visibility: hidden; backface-visibility: hidden; filter: progid:DXImageTransform.Microsoft.Alpha(Opacity=70); opacity: 0.7; -moz-transition-property: all; -o-transition-property: all; -webkit-transition-property: all; transition-property: all; -moz-transition-duration: 0.3s; -o-transition-duration: 0.3s; -webkit-transition-duration: 0.3s; transition-duration: 0.3s; -moz-transition-timing-function: ease-out; -o-transition-timing-function: ease-out; -webkit-transition-timing-function: ease-out; transition-timing-function: ease-out; text-decoration: none; }
#lineup .gridWashLineup > li > a.active { position: relative; }
#lineup .gridWashLineup > li > a.active span:before { position: absolute; content: ''; top: -1px; bottom: -1px; left: -1px; right: -1px; border: 4px solid #0b3290; -moz-border-radius: 5px; -webkit-border-radius: 5px; border-radius: 5px; }
#lineup .gridWashLineup > li:first-child a { background: #fff url("../img/lineup/wash/p_wash01.jpg") 100% 0 no-repeat; -moz-border-radius: 5px; -webkit-border-radius: 5px; border-radius: 5px; }
#lineup .gridWashLineup > li:first-child a span { padding-top: 0; }
#lineup .gridWashLineup > li.nthChild2 a { background: #f0f0f0 url("../img/lineup/wash/p_wash02.jpg") 100% 0 no-repeat; -moz-border-radius: 5px; -webkit-border-radius: 5px; border-radius: 5px; }
#lineup .gridWashLineup > li.nthChild3 a { background: #e5ecf4 url("../img/lineup/wash/p_wash03m.jpg") 100% 0 no-repeat; -moz-border-radius: 5px; -webkit-border-radius: 5px; border-radius: 5px; }

/* handwash */
.handwash #lineupTitleArea { padding-right: 406px; }
@media screen and (min-width: 0px) and (max-width: 667px) { .handwash #lineupTitleArea { padding-right: 0px; } }
.handwash #lineupTitleArea:after { top: 0; right: -18px; width: 426px; height: 409px; background: url("../img/lineup/wash/bg_handwash01.png") 100% 0 no-repeat; }
@media screen and (min-width: 0px) and (max-width: 667px) { .handwash #lineupTitleArea:after { background-size: 138px auto; top: -18px; right: -10px; height: 200px; } }
.handwash #lineupTitleArea01 { padding-right: 406px; }
@media screen and (min-width: 0px) and (max-width: 667px) { .handwash #lineupTitleArea01 { padding-right: 0px; } }
.handwash #lineupTitleArea01:after { top: -20px; right: -18px; width: 426px; height: 409px; background: url("../img/lineup/wash/bg_handwash02.png") 100% 0 no-repeat; }
@media screen and (min-width: 0px) and (max-width: 667px) { .handwash #lineupTitleArea01:after { background-size: 138px auto; top: -50px; right: -10px; height: 150px; } }

/* pure */
.pure .addGradient { background: #fff url("../img/bg_contents_gradient04.png") 50% 152px no-repeat; }
.pure #lineupTitleArea { padding-right: 406px; }
@media screen and (min-width: 0px) and (max-width: 667px) { .pure #lineupTitleArea { padding-right: 0px; } }
.pure #lineupTitleArea:after { top: -22px; right: -18px; width: 372px; height: 513px; background: url("../img/lineup/coating/bg_pure01.png") 100% 0 no-repeat; }
@media screen and (min-width: 0px) and (max-width: 667px) { .pure #lineupTitleArea:after { background-size: 112px auto; top: -20px; right: -10px; height: 200px; } }

/* coatingcare */
.coatingcare #lineupTitleArea { padding-right: 406px; }
@media screen and (min-width: 0px) and (max-width: 667px) { .coatingcare #lineupTitleArea { padding-right: 0px; } }
.coatingcare #lineupTitleArea:after { top: -22px; right: -18px; width: 365px; height: 431px; background: url("../../img/lineup/coating/bg_coatingcare01.png") 100% 0 no-repeat; }
@media screen and (min-width: 0px) and (max-width: 667px) { .coatingcare #lineupTitleArea:after { background-size: 112px auto; top: -20px; right: -10px; height: 200px; } }

/* mineraloff */
.mineraloff #lineupTitleArea { padding-right: 406px; }
@media screen and (min-width: 0px) and (max-width: 667px) { .mineraloff #lineupTitleArea { padding-right: 0px; } }
.mineraloff #lineupTitleArea:after { top: -58px; right: 30px; width: 365px; height: 431px; background: url("../img/lineup/coating/bg_mineraloff01.png") 100% 0 no-repeat; }
@media screen and (min-width: 0px) and (max-width: 667px) { .mineraloff #lineupTitleArea:after { background-size: 112px auto; top: -20px; right: -10px; height: 200px; } }

/* problem
----------------------------------------*/
#lineup .problem .addGradient { background-position: 50% 250px; }
@media screen and (min-width: 0px) and (max-width: 667px) { #lineup .problem .addGradient { background-image: none; } }
@media screen and (min-width: 0px) and (max-width: 667px) { #lineup .gridProblemLineup { width: 100%; margin-left: 0%; }
	#lineup .gridProblemLineup:before, #lineup .gridProblemLineup:after { content: ""; display: table; }
	#lineup .gridProblemLineup:after { clear: both; }
	#lineup .gridProblemLineup > * { -moz-box-sizing: border-box; -webkit-box-sizing: border-box; box-sizing: border-box; float: left; width: 100%; margin-left: 0%; }
	#lineup .gridProblemLineup > *.gridCol02 { width: 200%; }
	#lineup .gridProblemLineup > *.gridCol01 { width: 100%; }
	#lineup .gridProblemLineup > *:first-child ~ * { margin-top: 12px; } }
#lineup .gridProblemLineup > li > a { display: block; padding: 0 66px 0 12px; text-align: center; font-weight: 700; line-height: 1.2; color: #333; }
#lineup .gridProblemLineup > li > a:before { content: ""; display: inline-block; vertical-align: middle; height: 100%; }
#lineup .gridProblemLineup > li > a > * { display: inline-block; vertical-align: middle; }
#lineup .gridProblemLineup > li > a span { padding-top: 4px; }
@media screen and (min-width: 0px) and (max-width: 667px) { #lineup .gridProblemLineup > li > a { text-align: left; } }
#lineup .gridProblemLineup > li > a:before { min-height: 49px; }
#lineup .gridProblemLineup > li > a:hover { -webkit-backface-visibility: hidden; backface-visibility: hidden; filter: progid:DXImageTransform.Microsoft.Alpha(Opacity=70); opacity: 0.7; -moz-transition-property: all; -o-transition-property: all; -webkit-transition-property: all; transition-property: all; -moz-transition-duration: 0.3s; -o-transition-duration: 0.3s; -webkit-transition-duration: 0.3s; transition-duration: 0.3s; -moz-transition-timing-function: ease-out; -o-transition-timing-function: ease-out; -webkit-transition-timing-function: ease-out; transition-timing-function: ease-out; text-decoration: none; }
#lineup .gridProblemLineup > li > a.active { position: relative; }
#lineup .gridProblemLineup > li > a.active span:before { position: absolute; content: ''; top: -1px; bottom: -1px; left: -1px; right: -1px; border: 4px solid #0b3290; -moz-border-radius: 5px; -webkit-border-radius: 5px; border-radius: 5px; }
#lineup .gridProblemLineup > li:first-child a { background: #fff url("../img/lineup/problem/p_problem01_01.png") 100% 0 no-repeat; -moz-border-radius: 5px; -webkit-border-radius: 5px; border-radius: 5px; }
#lineup .gridProblemLineup > li.nthChild2 a { background: #fff url("../img/lineup/problem/p_problem13.jpg") 100% 0 no-repeat; -moz-border-radius: 5px; -webkit-border-radius: 5px; border-radius: 5px; }
#lineup .gridProblemLineup > li.nthChild3 a { background: #fff url("../img/lineup/problem/p_problem02.jpg") 100% 0 no-repeat; -moz-border-radius: 5px; -webkit-border-radius: 5px; border-radius: 5px; }
#lineup .gridProblemLineup > li.nthChild4 a { background: #fff url("../img/lineup/problem/p_problem03.jpg") 100% 0 no-repeat; -moz-border-radius: 5px; -webkit-border-radius: 5px; border-radius: 5px; }
#lineup .gridProblemLineup > li.nthChild5 a { background: #fff url("../img/lineup/problem/p_problem04.jpg") 100% 0 no-repeat; -moz-border-radius: 5px; -webkit-border-radius: 5px; border-radius: 5px; }
#lineup .gridProblemLineup > li.nthChild6 a { background: #fff url("../img/lineup/problem/p_problem05.jpg") 100% 0 no-repeat; -moz-border-radius: 5px; -webkit-border-radius: 5px; border-radius: 5px; }
#lineup .gridProblemLineup > li.nthChild7 a { background: #fff url("../img/lineup/problem/p_problem06.jpg") 100% 0 no-repeat; -moz-border-radius: 5px; -webkit-border-radius: 5px; border-radius: 5px; }
#lineup .gridProblemLineup > li.nthChild8 a { background: #fff url("../img/lineup/problem/p_problem07.jpg") 100% 0 no-repeat; -moz-border-radius: 5px; -webkit-border-radius: 5px; border-radius: 5px; }
#lineup .gridProblemLineup > li.nthChild9 a { background: #fff url("../img/lineup/problem/p_problem08.jpg") 100% 0 no-repeat; -moz-border-radius: 5px; -webkit-border-radius: 5px; border-radius: 5px; }
#lineup .gridProblemLineup > li.nthChild10 a { background: #fff url("../img/lineup/problem/p_problem09.jpg") 100% 0 no-repeat; -moz-border-radius: 5px; -webkit-border-radius: 5px; border-radius: 5px; }
#lineup .gridProblemLineup > li.nthChild11 a { background: #fff url("../img/lineup/problem/p_problem10.jpg") 100% 0 no-repeat; -moz-border-radius: 5px; -webkit-border-radius: 5px; border-radius: 5px; }
#lineup .gridProblemLineup > li.nthChild12 a { background: #fff url("../img/lineup/problem/p_problem11.jpg") 100% 0 no-repeat; -moz-border-radius: 5px; -webkit-border-radius: 5px; border-radius: 5px; }
#lineup .gridProblemLineup > li.nthChild13 a { background: #fff url("../img/lineup/problem/p_problem12.jpg") 100% 0 no-repeat; -moz-border-radius: 5px; -webkit-border-radius: 5px; border-radius: 5px; }

/* problem01 index */
.problem01 #lineupTitleArea { padding-right: 406px; }
@media screen and (min-width: 0px) and (max-width: 667px) { .problem01 #lineupTitleArea { padding-right: 0px; } }
.problem01 #lineupTitleArea:after { top: 10px; right: 0px; width: 369px; height: 491px; background: url("../img/lineup/problem/bg_problem01_01.png") 100% 0 no-repeat; }
@media screen and (min-width: 0px) and (max-width: 667px) { .problem01 #lineupTitleArea:after { background-size: 112px auto; top: -6px; right: -10px; height: 200px; } }

/* problem13 */
.problem13 #lineupTitleArea { padding-right: 406px; }
@media screen and (min-width: 0px) and (max-width: 667px) { .problem13 #lineupTitleArea { padding-right: 0px; } }
.problem13 #lineupTitleArea:after { top: 10px; right: 0px; width: 369px; height: 491px; background: url("../../img/lineup/problem/bg_problem13_01.jpg") 100% 0 no-repeat; }
@media screen and (min-width: 0px) and (max-width: 667px) { .problem13 #lineupTitleArea:after { background-size: 112px auto; top: -6px; right: -10px; height: 200px; } }

/* problem02 */
.problem02 #lineupTitleArea { padding-right: 406px; }
@media screen and (min-width: 0px) and (max-width: 667px) { .problem02 #lineupTitleArea { padding-right: 0px; } }
.problem02 #lineupTitleArea:after { top: 10px; right: 0px; width: 369px; height: 491px; background: url("../img/lineup/problem/bg_problem02_01.jpg") 100% 0 no-repeat; }
@media screen and (min-width: 0px) and (max-width: 667px) { .problem02 #lineupTitleArea:after { background-size: 112px auto; top: -6px; right: -10px; height: 200px; } }

/* problem03 */
.problem03 #lineupTitleArea { padding-right: 406px; }
@media screen and (min-width: 0px) and (max-width: 667px) { .problem03 #lineupTitleArea { padding-right: 0px; } }
.problem03 #lineupTitleArea:after { top: 10px; right: 0px; width: 369px; height: 491px; background: url("../img/lineup/problem/bg_problem03_01.jpg") 100% 0 no-repeat; }
@media screen and (min-width: 0px) and (max-width: 667px) { .problem03 #lineupTitleArea:after { background-size: 112px auto; top: -6px; right: -10px; height: 200px; } }

/* problem03 */
.problem03 #lineupTitleArea { padding-right: 406px; }
@media screen and (min-width: 0px) and (max-width: 667px) { .problem03 #lineupTitleArea { padding-right: 0px; } }
.problem03 #lineupTitleArea:after { top: 10px; right: 0px; width: 369px; height: 491px; background: url("../img/lineup/problem/bg_problem03_01.jpg") 100% 0 no-repeat; }
@media screen and (min-width: 0px) and (max-width: 667px) { .problem03 #lineupTitleArea:after { background-size: 112px auto; top: -6px; right: -10px; height: 200px; } }

/* problem04 */
.problem04 #lineupTitleArea { padding-right: 406px; }
@media screen and (min-width: 0px) and (max-width: 667px) { .problem04 #lineupTitleArea { padding-right: 0px; } }
.problem04 #lineupTitleArea:after { top: 10px; right: 0px; width: 369px; height: 491px; background: url("../img/lineup/problem/bg_problem04_01.jpg") 100% 0 no-repeat; }
@media screen and (min-width: 0px) and (max-width: 667px) { .problem04 #lineupTitleArea:after { background: url("../../img/lineup/problem/bg_problem04_01_mb.jpg") 100% 0 no-repeat; background-size: 112px auto; top: -6px; right: -10px; height: 200px; } }

/* problem05 */
.problem05 #lineupTitleArea { padding-right: 406px; }
@media screen and (min-width: 0px) and (max-width: 667px) { .problem05 #lineupTitleArea { padding-right: 0px; } }
.problem05 #lineupTitleArea:after { top: 10px; right: 0px; width: 369px; height: 491px; background: url("../img/lineup/problem/bg_problem05_01.jpg") 100% 0 no-repeat; }
@media screen and (min-width: 0px) and (max-width: 667px) { .problem05 #lineupTitleArea:after { background-size: 112px auto; top: -6px; right: -10px; height: 200px; } }

/* problem06 */
.problem06 #lineupTitleArea { padding-right: 406px; }
@media screen and (min-width: 0px) and (max-width: 667px) { .problem06 #lineupTitleArea { padding-right: 0px; } }
.problem06 #lineupTitleArea:after { top: 10px; right: 0px; width: 369px; height: 491px; background: url("../img/lineup/problem/bg_problem06_01.jpg") 100% 0 no-repeat; }
@media screen and (min-width: 0px) and (max-width: 667px) { .problem06 #lineupTitleArea:after { background-size: 112px auto; top: -6px; right: -10px; height: 200px; } }

/* problem07 */
.problem07 #lineupTitleArea { padding-right: 406px; }
@media screen and (min-width: 0px) and (max-width: 667px) { .problem07 #lineupTitleArea { padding-right: 0px; } }
.problem07 #lineupTitleArea:after { top: 10px; right: 0px; width: 369px; height: 491px; background: url("../img/lineup/problem/bg_problem07_01.jpg") 100% 0 no-repeat; }
@media screen and (min-width: 0px) and (max-width: 667px) { .problem07 #lineupTitleArea:after { background-size: 112px auto; top: -6px; right: -10px; height: 200px; } }

/* problem08 */
.problem08 #lineupTitleArea { padding-right: 406px; }
@media screen and (min-width: 0px) and (max-width: 667px) { .problem08 #lineupTitleArea { padding-right: 0px; } }
.problem08 #lineupTitleArea:after { top: 10px; right: 0px; width: 369px; height: 491px; background: url("../img/lineup/problem/bg_problem08_01.jpg") 100% 0 no-repeat; }
@media screen and (min-width: 0px) and (max-width: 667px) { .problem08 #lineupTitleArea:after { background: url("../../img/lineup/problem/bg_problem08_01_mb.jpg") 100% 0 no-repeat; background-size: 112px auto; top: -6px; right: -10px; height: 200px; } }

/* problem09 */
.problem09 #lineupTitleArea { padding-right: 406px; }
@media screen and (min-width: 0px) and (max-width: 667px) { .problem09 #lineupTitleArea { padding-right: 0px; } }
.problem09 #lineupTitleArea:after { top: 10px; right: 0px; width: 369px; height: 491px; background: url("../img/lineup/problem/bg_problem09_01.jpg") 100% 0 no-repeat; }
@media screen and (min-width: 0px) and (max-width: 667px) { .problem09 #lineupTitleArea:after { background-size: 112px auto; top: -6px; right: -10px; height: 200px; } }

/* problem10 */
.problem10 #lineupTitleArea { padding-right: 406px; }
@media screen and (min-width: 0px) and (max-width: 667px) { .problem10 #lineupTitleArea { padding-right: 0px; } }
.problem10 #lineupTitleArea:after { top: 10px; right: 0px; width: 369px; height: 491px; background: url("../img/lineup/problem/bg_problem10_01.jpg") 100% 0 no-repeat; }
@media screen and (min-width: 0px) and (max-width: 667px) { .problem10 #lineupTitleArea:after { background-size: 112px auto; top: -6px; right: -10px; height: 200px; } }

/* problem11 */
.problem11 #lineupTitleArea { padding-right: 406px; }
@media screen and (min-width: 0px) and (max-width: 667px) { .problem11 #lineupTitleArea { padding-right: 0px; } }
.problem11 #lineupTitleArea:after { top: 10px; right: 0px; width: 369px; height: 491px; background: url("../img/lineup/problem/bg_problem11_01.jpg") 100% 0 no-repeat; }
@media screen and (min-width: 0px) and (max-width: 667px) { .problem11 #lineupTitleArea:after { background-size: 112px auto; top: -6px; right: -10px; height: 200px; } }

/* problem12 */
.problem12 #lineupTitleArea { padding-right: 406px; }
@media screen and (min-width: 0px) and (max-width: 667px) { .problem12 #lineupTitleArea { padding-right: 0px; } }
.problem12 #lineupTitleArea:after { top: 10px; right: 0px; width: 369px; height: 491px; background: url("../../img/lineup/problem/bg_problem12_01.jpg") 100% 0 no-repeat; }
@media screen and (min-width: 0px) and (max-width: 667px) { .problem12 #lineupTitleArea:after { background-size: 112px auto; top: -6px; right: -10px; height: 200px; } }

/* inside
----------------------------------------*/
#lineup .inside .addGradient { background-position: 50% 0px; }
@media screen and (min-width: 0px) and (max-width: 667px) { #lineup .inside .addGradient { background-image: none; } }

/* inside01 */
.inside01 #lineupTitleArea { padding-right: 406px; }
@media screen and (min-width: 0px) and (max-width: 667px) { .inside01 #lineupTitleArea { padding-right: 0px; } }
.inside01 #lineupTitleArea:after { top: -18px; right: -18px; width: 481px; height: 260px; background: url("../img/lineup/inside/bg_inside01.png") 100% 0 no-repeat; }
@media screen and (min-width: 0px) and (max-width: 667px) { .inside01 #lineupTitleArea:after { background-size: 158px auto; top: -12px; right: -10px; height: 200px; } }
.inside01 #singleMenuArea .gridList02 > li { padding: 0 10px 10px; background-color: #fff; }
.inside01 #singleMenuArea .gridList02 > li .headingLv04 { margin: 0 -10px; }

/* outside
----------------------------------------*/
#lineup .outside .addGradient { background-position: 50% 196px; }
@media screen and (min-width: 0px) and (max-width: 667px) { #lineup .outside .addGradient { background-image: none; } }
@media screen and (min-width: 0px) and (max-width: 667px) { #lineup .gridOutsideLineup { width: 100%; margin-left: 0%; }
	#lineup .gridOutsideLineup:before, #lineup .gridOutsideLineup:after { content: ""; display: table; }
	#lineup .gridOutsideLineup:after { clear: both; }
	#lineup .gridOutsideLineup > * { -moz-box-sizing: border-box; -webkit-box-sizing: border-box; box-sizing: border-box; float: left; width: 100%; margin-left: 0%; }
	#lineup .gridOutsideLineup > *.gridCol02 { width: 200%; }
	#lineup .gridOutsideLineup > *.gridCol01 { width: 100%; }
	#lineup .gridOutsideLineup > *:first-child ~ * { margin-top: 12px; } }
#lineup .gridOutsideLineup > li > a { display: block; padding: 0 66px 0 12px; text-align: center; font-weight: 700; line-height: 1.2; color: #333; }
#lineup .gridOutsideLineup > li > a:before { content: ""; display: inline-block; vertical-align: middle; height: 100%; }
#lineup .gridOutsideLineup > li > a > * { display: inline-block; vertical-align: middle; }
#lineup .gridOutsideLineup > li > a span { padding-top: 4px; }
@media screen and (min-width: 0px) and (max-width: 667px) { #lineup .gridOutsideLineup > li > a { text-align: left; } }
#lineup .gridOutsideLineup > li > a:before { min-height: 49px; }
#lineup .gridOutsideLineup > li > a:hover { -webkit-backface-visibility: hidden; backface-visibility: hidden; filter: progid:DXImageTransform.Microsoft.Alpha(Opacity=70); opacity: 0.7; -moz-transition-property: all; -o-transition-property: all; -webkit-transition-property: all; transition-property: all; -moz-transition-duration: 0.3s; -o-transition-duration: 0.3s; -webkit-transition-duration: 0.3s; transition-duration: 0.3s; -moz-transition-timing-function: ease-out; -o-transition-timing-function: ease-out; -webkit-transition-timing-function: ease-out; transition-timing-function: ease-out; text-decoration: none; }
#lineup .gridOutsideLineup > li > a.active { position: relative; }
#lineup .gridOutsideLineup > li > a.active span:before { position: absolute; content: ''; top: -1px; bottom: -1px; left: -1px; right: -1px; border: 4px solid #0b3290; -moz-border-radius: 5px; -webkit-border-radius: 5px; border-radius: 5px; }

/* 2017.07.26 メニュー変更に伴い改修
#lineup .gridOutsideLineup > li:first-child a { background: #fff url("../../img/p_outside01.jpg") 100% 0 no-repeat; -moz-border-radius: 5px; -webkit-border-radius: 5px; border-radius: 5px; }
#lineup .gridOutsideLineup > li.nthChild2 a { background: #fff url("../../img/p_outside02.jpg") 100% 0 no-repeat; -moz-border-radius: 5px; -webkit-border-radius: 5px; border-radius: 5px; }
#lineup .gridOutsideLineup > li.nthChild3 a { background: #fff url("../../img/p_outside03.jpg") 100% 0 no-repeat; -moz-border-radius: 5px; -webkit-border-radius: 5px; border-radius: 5px; }
#lineup .gridOutsideLineup > li.nthChild4 a { background: #fff url("../../img/p_outside04.jpg") 100% 0 no-repeat; -moz-border-radius: 5px; -webkit-border-radius: 5px; border-radius: 5px; }
#lineup .gridOutsideLineup > li.nthChild5 a { background: #fff url("../../img/p_outside05.jpg") 100% 0 no-repeat; -moz-border-radius: 5px; -webkit-border-radius: 5px; border-radius: 5px; }
#lineup .gridOutsideLineup > li.nthChild6 a { background: #fff url("../../img/p_outside06.jpg") 100% 0 no-repeat; -moz-border-radius: 5px; -webkit-border-radius: 5px; border-radius: 5px; }
*/
#lineup .gridOutsideLineup > li:first-child a { background: #fff url("../img/lineup/outside/p_outside01.jpg") 100% 0 no-repeat; -moz-border-radius: 5px; -webkit-border-radius: 5px; border-radius: 5px; }
#lineup .gridOutsideLineup > li.nthChild2 a { background: #fff url("../img/lineup/outside/p_outside09.jpg") 100% 0 no-repeat; -moz-border-radius: 5px; -webkit-border-radius: 5px; border-radius: 5px; }
#lineup .gridOutsideLineup > li.nthChild3 a { background: #fff url("../img/lineup/outside/p_outside08.jpg") 100% 0 no-repeat; -moz-border-radius: 5px; -webkit-border-radius: 5px; border-radius: 5px; }
#lineup .gridOutsideLineup > li.nthChild4 a { background: #fff url("../img/lineup/outside/p_outside04.jpg") 100% 0 no-repeat; -moz-border-radius: 5px; -webkit-border-radius: 5px; border-radius: 5px; }
#lineup .gridOutsideLineup > li.nthChild5 a { background: #fff url("../img/lineup/outside/p_outside05.jpg") 100% 0 no-repeat; -moz-border-radius: 5px; -webkit-border-radius: 5px; border-radius: 5px; }
#lineup .gridOutsideLineup > li.nthChild6 a { background: #fff url("../img/lineup/outside/p_outside03.jpg") 100% 0 no-repeat; -moz-border-radius: 5px; -webkit-border-radius: 5px; border-radius: 5px; }
#lineup .gridOutsideLineup > li.nthChild7 a { background: #fff url("../img/lineup/outside/p_outside07.jpg") 100% 0 no-repeat; -moz-border-radius: 5px; -webkit-border-radius: 5px; border-radius: 5px; }
#lineup .gridOutsideLineup > li.nthChild8 a { background: #fff url("../img/lineup/outside/p_outside06.jpg") 100% 0 no-repeat; -moz-border-radius: 5px; -webkit-border-radius: 5px; border-radius: 5px; }
#lineup .gridOutsideLineup > li.nthChild9 a { background: #fff url("../img/lineup/outside/p_outside02.png") 100% 0 no-repeat; -moz-border-radius: 5px; -webkit-border-radius: 5px; border-radius: 5px; }

/* outside index */
.outside01 #lineupTitleArea { padding-right: 406px; }
@media screen and (min-width: 0px) and (max-width: 667px) { .outside01 #lineupTitleArea { padding-right: 0px; } }
.outside01 #lineupTitleArea:after { top: 8px; right: 0px; width: 369px; height: 491px; background: url("../img/lineup/outside/bg_outside01.png") 100% 0 no-repeat; }
@media screen and (min-width: 0px) and (max-width: 667px) { .outside01 #lineupTitleArea:after { background-size: 112px auto; top: -6px; right: -10px; height: 200px; } }

/* outside02 */
.outside02 #lineupTitleArea {
    padding-right: 406px;
}
@media screen and (min-width: 0px) and (max-width: 667px) {
    .outside02 #lineupTitleArea {
        padding-right: 0px;
    }
}
.outside02 #lineupTitleArea:after {
    top: 8px; right: 0px; width: 369px; height: 491px;
    background: url("../img/lineup/outside/bg_outside02.png") 100% 0 no-repeat;
}
@media screen and (min-width: 0px) and (max-width: 667px) {
    .outside02 #lineupTitleArea:after {
        background-size: 92px auto;
        top: -6px;
        right: -10px;
        height: 200px;
    }
}

/* outside09 */
.outside09 #lineupTitleArea { padding-right: 406px; }
@media screen and (min-width: 0px) and (max-width: 667px) { .outside09 #lineupTitleArea { padding-right: 0px; } }
.outside09 #lineupTitleArea:after { top: 8px; right: 0px; width: 369px; height: 491px; background: url("../img/lineup/outside/bg_outside09.jpg") 100% 0 no-repeat; }
@media screen and (min-width: 0px) and (max-width: 667px) { .outside09 #lineupTitleArea:after { background-size: 112px auto; top: -6px; right: -10px; height: 200px; } }

/* outside08 */
.outside08 #lineupTitleArea { padding-right: 406px; }
@media screen and (min-width: 0px) and (max-width: 667px) { .outside08 #lineupTitleArea { padding-right: 0px; } }
/*.outside08 #lineupTitleArea:after { top: 8px; right: 0px; width: 369px; height: 491px; background: url("../img/lineup/outside/bg_outside08_01.jpg") 100% 0 no-repeat; }*/
@media screen and (min-width: 0px) and (max-width: 667px) { .outside08 #lineupTitleArea:after { background-size: 112px auto; top: -6px; right: -10px; height: 200px; } }

.outside08 .sizeList {
    display: flex;
    flex-direction: row;
    justify-content: space-between;
    flex-wrap: wrap;
    width: 100%;
    /* max-width: 835px; */
    height: auto;
    margin: 0.5rem 0 0 0;
    margin-right: 0;
}
.outside08 .sizeList li {
    border: 1px solid #222;
    border-bottom: 0;
    font-size: 0.55rem;
    font-weight: bold;
    padding: 1px 3px;
    line-height: 1rem;
    letter-spacing: 0;
    background: #fff;
    width: auto;
    height: auto;
}
.outside08 .sizeList li:last-child {
    border-bottom: 1px solid #222;
}
.outside08 .sizeList li.pickup {
    background: #eee;
}

@media screen and (max-width: 667px) {
    .outside08 .sizeListWrap {
        width: 100%;
        overflow-x: auto;
    }
    .outside08 .sizeList {
        min-width: 1000px;
    }
}

/* outside03 */
.outside03 #lineupTitleArea { padding-right: 406px; }
@media screen and (min-width: 0px) and (max-width: 667px) { .outside03 #lineupTitleArea { padding-right: 0px; } }
.outside03 #lineupTitleArea:after { top: 8px; right: 0px; width: 369px; height: 491px; background: url("../img/lineup/outside/bg_outside03_01.png") 100% 0 no-repeat; }
@media screen and (min-width: 0px) and (max-width: 667px) { .outside03 #lineupTitleArea:after { background: url("../../img/lineup/outside/bg_outside03_01_mb.jpg") 100% 0 no-repeat; background-size: 112px auto; top: -6px; right: -10px; height: 200px; } }

/* outside04 */
.outside04 #lineupTitleArea { padding-right: 500px; }
.outside04 #area3 {
    width: 650px!important;
}
.outside04 #area1:after,#area2:after,#area3:after {
	position: absolute;
	content: '';
	margin: auto;
	top: 8px;
	right:0px;
	width: 480px;
	height: 230px;
}
.outside04 #area1:after{
	background: url("../img/lineup/outside/outside04_01-dispel.png") 100% 0 no-repeat;
}
.outside04 #area2:after{
	background: url("../img/lineup/outside/outside04_02-dispel.png") 100% 0 no-repeat;
}
.outside04 #area3:after{
	background: url("../img/lineup/outside/outside04_mat.png") 100% 0 no-repeat;
}
@media screen and (min-width: 0px) and (max-width: 667px) {
	.outside04 #lineupTitleArea { padding-right: 0px; }
    .outside04 #area3 {
        width: 100%!important;
    }
	.outside04 #area1:after,#area2:after,#area3:after { background: none; height: auto; }
}



/* outside05 */
.outside05 #lineupTitleArea { padding-right: 406px; }
@media screen and (min-width: 0px) and (max-width: 667px) { .outside05 #lineupTitleArea { padding-right: 0px; } }
.outside05 #lineupTitleArea:after { top: 8px; right: 0px; width: 369px; height: 491px; background: url("../img/lineup/outside/bg_outside05_01.jpg") 100% 0 no-repeat; }
@media screen and (min-width: 0px) and (max-width: 667px) { .outside05 #lineupTitleArea:after { background-size: 92px auto; top: -6px; right: -10px; height: 200px; } }

/* outside06 */
.outside06 #lineupTitleArea { padding-right: 406px; }
@media screen and (min-width: 0px) and (max-width: 667px) { .outside06 #lineupTitleArea { padding-right: 0px; } }
.outside06 #lineupTitleArea:after { top: 8px; right: 0px; width: 369px; height: 491px; background: url("../img/lineup/outside/bg_outside06_01.jpg") 100% 0 no-repeat; }
@media screen and (min-width: 0px) and (max-width: 667px) { .outside06 #lineupTitleArea:after { background: url("../../img/lineup/outside/bg_outside06_01_mb.jpg") 100% 0 no-repeat; background-size: 112px auto; top: -6px; right: -10px; height: 200px; } }

/* outside07 */
.outside07 #lineupTitleArea { padding-right: 406px; }
@media screen and (min-width: 0px) and (max-width: 667px) { .outside07 #lineupTitleArea { padding-right: 0px; } }
.outside07 #lineupTitleArea:after {
    top: 8px;
    right: 0px;
    width: 369px;
    height: 491px;
    background: url("../img/lineup/outside/bg_outside07_01.png") 100% 0 no-repeat;
}
@media screen and (min-width: 0px) and (max-width: 667px) {
    .outside07 #lineupTitleArea:after {
        background: url("../img/lineup/outside/bg_outside07_01.png") 100% 0 no-repeat;
        background-size: auto 60px;
        top: -6px;
        right: 0;
        height: 200px;
    }
}


/* car
----------------------------------------*/
.faqList02 { padding-left: 28px; }
.faqList02 > li { position: relative; color: #0b3290; font-weight: 700; font-size: 114%; padding: 6px 0 4px; }
.faqList02 > li:before { content: ''; position: absolute; top: 6px; bottom: 6px; left: -26px; display: block; width: 21px; height: 21px; background: url("../img/i_faq_q.png") 0 0 no-repeat; background-size: 21px auto; }

.faqList01 { padding-left: 50px; }
.faqList01 > dt { position: relative; color: #0b3290; font-weight: 700; font-size: 129%; padding: 12px 0 18px; }
.faqList01 > dt:before { content: ''; position: absolute; top: 6px; bottom: 6px; left: -50px; display: block; width: 41px; height: 41px; background: url("../img/faq/ico_faq_q.png") 0 0 no-repeat; }
.faqList01 > dt:after { content: ''; position: absolute; bottom: 2px; left: -50px; display: block; width: 938px; height: 1px; background: url("../img/bg_line01.png") 0 0 repeat-x; }
.faqList01 > dt + dd { position: relative; padding: 12px 0 8px; }
.faqList01 > dt + dd:before { content: ''; position: absolute; top: 6px; bottom: 6px; left: -50px; display: block; width: 41px; height: 41px; background: url("../img/faq/ico_faq_a.png") 0 0 no-repeat; }
.faqList01 > .answerStyle { color: #eb8712; font-weight: 700; font-size: 129%; }

.u-body-size { height: 100%; min-width: 700px !important; overflow-y: scroll; background: #F7F9F8; }
@media screen and (min-width: 0px) and (max-width: 667px) { .u-body-size { width: 100% !important; min-width: 300px !important; } }
.u-body-size #container:after { display: none; }

.u-size-container { width: 700px !important; }
@media screen and (min-width: 0px) and (max-width: 667px) { .u-size-container { width: 100% !important; } }

.u-result-content { margin: 30px 0; }
.u-result-content .headingLv04 { background: #fff; }
.u-result-content .content-inner { margin: 0 20px; }
@media screen and (min-width: 0px) and (max-width: 667px) { .u-result-content .content-inner { margin: 0; } }
.u-result-content .content-inner.maker h5, .u-result-content .content-inner.maker table { display: none; }
.u-result-content .content-inner .name-wrap { margin-top: 30px; display: none; }
.u-result-content .content-inner .name-wrap:first-child { margin-top: 0; }

.u-size-data { margin-top: 10px; font-size: 86%; }

.u-table { width: 100%; background: #fff; }
.u-table thead th { padding: 4px 6px; font-weight: 700; text-align: center; background: #666; color: #fff; line-height: 1.2; border: 1px solid #666; }
.u-table tbody th, .u-table tbody td { padding: 4px 6px; text-align: center; word-break: break-all; border: 1px solid #ccc; vertical-align: middle; }
@media screen and (min-width: 0px) and (max-width: 667px) { .u-table tbody th, .u-table tbody td { padding: 2px 4px; } }
.u-table tbody th { width: 70%; }

.u-size-lexus { margin: 30px; padding: 20px; background: #EEEFEF; text-align: center; }
@media screen and (min-width: 0px) and (max-width: 667px) { .u-size-lexus { margin: 20px 0; } }
.u-size-lexus p { margin-top: 20px; }
.u-size-lexus p:first-child { margin-top: 0; }

@media screen and (min-width: 0px) and (max-width: 667px) { .u-select-sp { display: inline-block !important; zoom: 1; } }

.u-select-btn { display: none; width: 65px; height: 26px; line-height: 26px; text-align: center; vertical-align: middle; cursor: pointer; border: 1px solid #ccc; background-image: -webkit-linear-gradient(top, #ffffff 70%, #f2f4fa); }
@media screen and (min-width: 0px) and (max-width: 667px) { .u-select-btn { display: inline-block !important; zoom: 1; } }

.u-search-btn { cursor: pointer; }

.u-size-close { width: 100%; margin: 0 auto; text-align: center; }
.u-size-close .btnStyle05 { padding: 18px 30px 14px 30px; cursor: pointer; }
.u-size-close .btnStyle05:after { display: none !important; }

@media screen and (min-width: 0px) and (max-width: 667px) { .u-mb-width { width: 90% !important; } }

/*20231013追加*/
@media screen and (min-width: 0px) and (max-width: 667px){
	.bgwhiteEnd{
		line-height: 1rem;
		padding: 0.5rem;
		margin: 0.5rem 0;
		display: block;
		}
	.bgwhiteEnd span{
		color: #e81625;
	}
	.spHide{
		display: none;
	}
    /* 20251219追加 */
    #titleArea {
        margin-top: 20px;
    }
}
.new {
  color: #ff0000;      /* 赤文字 */
  font-weight: 700;    /* 太字 */
  font-size: 1.55rem;  /* フォントサイズ調整 */
  line-height: 1.4;    /* 行間を少し広げる */
  display: inline-block; /* ブロック扱いで高さ調整しやすい */
  padding: 2px 4px;    /* 文字まわりの余白 */
	position: relative;
  top: 3px;  /* ← これで“下に寄せる” */
}
.note {
  color: #000;         /* 黒字 */
  font-size: 1rem;  /* 小さめ文字 */
  display: inline-block;
  position: relative;
  top: 0px;            /* 下に寄せる量（調整OK） */
  margin-left: 5px;    /* 前の文字と少し間をあける */
}
@media screen and (max-width: 480px) {
  .new {
    font-size: 1.15rem;   /* ← スマホ用に小さく（お好みで調整） */
    top: 2px;            /* ← 位置も微調整可能 */
  }

  .note {
    font-size: 0.75rem;  /* ← 小さくする */
    top: 5px;            /* ← 下寄せの微調整 */
    margin-left: -3px;   /* ← 赤文字との寄せ幅を調整 */
  }
}
.gridList07 li.newBadge {
  position: relative;
}

.gridList07 li.newBadge::after {
  content: "新登場";
  position: absolute;
  top: 10px;
  right: 50px;
  background: #e60000; /* 赤 */
  color: #fff;         /* 白文字 */
  font-size: 0.75rem;
  font-weight: 700;
  padding: 2px 6px;
  border-radius: 4px;
  line-height: 1;
}

/* スマホ専用 新登場バッジ位置調整 */
@media screen and (max-width: 767px) {
  .gridList07 li.newBadge::after {
    top: 15px;            /* 画像の上から少し下 */
    left: 10px;          /* 画像より少し左に配置 */
    right: auto;
    background: #e60000;  /* 赤 */
    color: #fff;
    font-size: 1rem;    /* PCより小さく */
		padding: 3px 5px;      /* ← 上下の余白を均等に少し増やす */
    line-height: 1.2;      /* ← 文字が上下中央に来るよう安定 */

    border-radius: 3px;
    display: inline-block; /* ← バッジ内の高さを安定させる */
  }
}
/* ダイヤⅡキーパー選択時だけ赤枠にする */
/*.gridList07 li.dia2 a.active {
  border: 2px solid #e60000 !important;  /* 赤枠 */
/* }
.gridList07 a[href*="dia2"].active {
  border: 2px solid #e60000 !important;
} */

/* アイアン・プロテクトキーパー選択時だけ赤枠にする */
/* .gridList07 li.iron a.active {
    border: 2px solid #e60000 !important;
} */
/* .gridList07 a[href*="iron"].active {
    border: 2px solid #e60000 !important;
} */


/* ------------- プレミアム仕様 ------------- */
.premium {
    width: calc(100% - 4px);
    background: rgb(243, 241, 218);
    border: 2px solid rgb(194, 170, 80);
}
.premium .pre-container {
    width: calc(100% - 2rem);
    margin: 0 auto;
}
.pre-container > p	{
    font-weight: bold;
}
.premium .pre_title {
    display: flex;
    margin: 1rem auto;
    font-weight: bold;
}
.premium .flexWrap7Calc {
    margin: 0.5rem auto;
    display: flex;
    justify-content: space-between;
    flex-wrap: wrap;
}
.flexWrap7Calc div {
    width: calc(100% / 7 - 0.5rem);
    margin-bottom: 0.5rem;
}

/* 画像 & h3タイトル */
.premium .pre_title img {
    height: 30px;
    width: 153px;
}
.premium .pre_title h3 {
    display: flex;
    align-items: flex-end;
    width: auto;
    font-size: 1.2rem;
    margin-left: 0.5rem;
}

/* 1~13画像 & 文言 */
.premium .flexWrap7Calc div img {
    width: 100%;
    object-fit: cover;
}
.premium .flexWrap7Calc p {
    margin: 0.25rem 0;
    font-size: 0.7rem;
    width: 100%;
}

/* note */
.premium p.note {
    background: #fff;
    padding: 0.2rem;
    font-size: 0.7rem;
    margin: 0;
}
.premium p.note span {
    color: #e81625;
}
@media screen and (max-width: 667px) {
    .premium {
        width: calc(100% - 4px);
        background: none;
        border: none;
    }
    .premium .pre-container {
        width: 100%;
        margin: 0 auto;
    }
    .premium .flexWrap7Calc div {
        width: calc(100% / 3 - 0.5rem);
        margin-bottom: 0.5rem;
    }
    .premium .pre_title h3 {
        color: #eb8712;
        margin: 0;
    }
    .premium p.note {
        background-color: #f0f0f0;
        padding: 0.5rem;
    }
}
/* ------------- プレミアム仕様 end ------------- */

/* ==========================================================
    LABOのcoating.cssからメンテナンス価格表に関連する部分
    一部調整して流用・移植
========================================================== */

    /* ------------------------------- */
    /*flex justify-content 2060428追加 */
    /* ------------------------------ */
    .justifyCenter {
        justify-content: center !important;
    }
    .justifyBetween {
        justify-content: space-between !important;
    }
    .justifyAround {
        justify-content: space-around !important;
    }
    .justifyEvenly {
        justify-content: space-evenly !important;
    }

    /* ----------------------------------------------------------
        共通クラス　メンテナンス価格レイアウト　価格改定追加 20260318 更新20260508
        exkeeper.php / dia2.php / dia2_series.php
    ---------------------------------------------------------- */

    /* 汎用 */
    :root {
        /* コーティングのカラー変数 */
        --ex-main-color: #002C5C;
        --dia2-main-color: #0B3190;
        --diamond-main-color: #BBA14A;
        --diamond-sub-color: #EEEADE;
        --ecodia-main-color: #009F42;
        --ecodia-sub-color: #E1EFE2;

        /* メンテナンスBOX内　padding余白統一　変数 */
        --maintenance-p-25px: 25px;
        /* メンテナンスBOX内　margin余白統一　変数 */
        --maintenance-m-15px: 15px;
        --maintenance-m-25px: 25px;
    }
    .tac {
        text-align: center !important;
    }
    /* padding 必要に応じて追加*/
    .p-0 {
        padding: 0 !important;
    }
    /* margin 必要に応じて追加 */
    .maintenance-mb-15px {
        margin-bottom: 15px !important;
    }
    /* End 汎用 */

    .maintenance-section {
        text-align: center;
    }

    .maintenance-section .ms-title-wrap {
        display: flex;
        justify-content: center;
        align-items: center;
        width: 100%;
        margin-bottom: var(--maintenance-m-25px);
    }
    .maintenance-section .ms-title-wrap img {
        width: 150px;
        height: auto;
        margin-right: 8px;
    }
    .maintenance-section .ms-title-wrap .ms-title {
        font-size: 1.8rem;
        font-weight: 900;
    }

    .maintenance-section .ms-dispel {
        font-size: 0.8rem;
        font-weight: 600;
        margin-bottom: var(--maintenance-m-25px);
    }

    /* (W)ダイヤモンド＆エコダイヤ BOXの余白（ダイヤIIは余白無し）*/
    .maintenance-section .ms-ex-box,
    .maintenance-section .ms-diamond-box,
    .maintenance-section .ms-ecodia-box {
        padding: var(--maintenance-p-25px);
    }
    /* (W)ダイヤモンド＆エコダイヤ BOXのborder（EX、ダイヤIIはborder無し）*/
    .maintenance-section .ms-diamond-box,
    .maintenance-section .ms-ecodia-box {
        border: 1px solid #000000;
        margin-bottom: var(--maintenance-m-25px);
    }
    /* (W)ダイヤモンドのサブカラー */
    .maintenance-section .ms-diamond-box {
        background-color: var(--diamond-sub-color);
    }
    /* エコダイヤのサブカラー */
    .maintenance-section .ms-ecodia-box {
        background-color: var(--ecodia-sub-color);
    }

    /* (W)ダイヤモンド＆エコダイヤのタイトル */
    .maintenance-section .ms-diamond-box .diamond-title-wrap,
    .maintenance-section .ms-ecodia-box .ecodia-title-wrap {
        display: flex;
        justify-content: center;
        align-items: center;
        width: 100%;
        margin-bottom: var(--maintenance-m-25px);
    }
    .maintenance-section .ms-diamond-box .diamond-title-wrap img,
    .maintenance-section .ms-ecodia-box .ecodia-title-wrap img {
        width: 125px;
        height: auto;
        margin-right: 8px;
    }
    .maintenance-section .ms-diamond-box .diamond-title-wrap .diamond-title,
    .maintenance-section .ms-ecodia-box .ecodia-title-wrap .ecodia-title {
        font-weight: bold;
        font-size: 1.4rem;
    }


    .maintenance-section .maintenance-wrap {
        width: 100%;
        display: flex;
        justify-content: space-between;
        margin: 0 auto;
        gap: var(--maintenance-p-25px);
    }

    .maintenance-section .maintenance-wrap .maintenance-box {
        width: 100%;
        padding: var(--maintenance-p-25px);
    }

    /* ------------------------------------ */
    /* EX＆ダイヤII＆(W)ダイヤモンド＆エコダイヤ　メンテナンスBOXのカラー */

    /* EX */
    .maintenance-section .ms-ex-box .maintenance-wrap .maintenance-box {
        background-color: #f6f6f6;
    }
    /* ダイヤII */
    .maintenance-section .ms-dia2-box .maintenance-wrap .maintenance-box {
        background-color: #e0e0e0;
    }
    /* (W)ダイヤモンド＆エコダイヤ */
    .maintenance-section .ms-diamond-box .maintenance-wrap .maintenance-box,
    .maintenance-section .ms-ecodia-box .maintenance-wrap .maintenance-box {
        background-color: #FFFFFF;
    }

    /* End ダイヤII＆(W)ダイヤモンド＆エコダイヤ　メンテナンスBOXのカラー */
    /* ------------------------------------ */

    .maintenance-section .maintenance-wrap .maintenance-box .mb-table-wrap {
        display: flex;
        gap: 20px;
        align-items: flex-end;
        width: 100%;
        margin-bottom: 10px;
    }

    /* ------------------------------------ */
    .maintenance-section .maintenance-wrap .maintenance-box .mb-title-wrap .mb-title {
        font-size: 18px;
        color: #fff;
        font-weight:bold;
        padding: 3px 0;
        margin-bottom: var(--maintenance-m-15px);
    }

    /* EXのカラー */
    .maintenance-section .maintenance-wrap .maintenance-box .mb-title-wrap .ex-main-color {
        background-color: var(--ex-main-color);
    }
    /* DIA2のカラー */
    .maintenance-section .maintenance-wrap .maintenance-box .mb-title-wrap .dia2-main-color {
        background-color: var(--dia2-main-color);
    }
    /* (W)ダイヤモンドのカラー */
    .maintenance-section .maintenance-wrap .maintenance-box .mb-title-wrap .diamond-main-color {
        background-color: var(--diamond-main-color);
    }
    /* エコダイヤのカラー */
    .maintenance-section .maintenance-wrap .maintenance-box .mb-title-wrap .ecodia-main-color {
        background-color: var(--ecodia-main-color);
    }

    /* ------------------------------------ */
    .maintenance-section .maintenance-wrap .maintenance-box .mb-table-wrap .price-table table {
        border-collapse: collapse;
        font-size: 16px;
        border: 2px solid #666;
        width: auto;       /* 内容に合わせる */
        margin-left: auto; /* テーブルを右寄せ */
        margin-left: 0;
    }

    /* ------------------------------------ */

    /* 不要なら消す */
    .maintenance-section .maintenance-wrap .maintenance-box .mb-title-wrap .price-title {
        font-size: 18px;
        color: #fff;
        font-weight:bold;
        padding: 4px 10px;
        line-height:1.6;
    }

    /* ------------------------------------ */

    /* 作業時間 */
    .maintenance-section .maintenance-wrap .maintenance-box .mb-worktimelabel-wrap {
        margin-bottom: var(--maintenance-m-15px);
    }

    .maintenance-section .maintenance-wrap .maintenance-box .mb-worktimelabel-wrap .mb-worktimelabel {
        display: inline-block;
        padding: 5px 15px;
        /* font-size: 0.8rem; */
        font-size: 1rem;
        font-weight: 600;
    }

    /* ------------------------------------ */
    /* EX＆ダイヤII＆(W)ダイヤモンド＆エコダイヤ　メンテナンスBOXのカラー */

    /* ダイヤII */
    .maintenance-section .ms-dia2-box .maintenance-wrap .maintenance-box .mb-worktimelabel-wrap .mb-worktimelabel {
        background-color: #FFFFFF;
    }
    /* EX&(W)ダイヤモンド＆エコダイヤ */
    .maintenance-section .ms-ex-box .maintenance-wrap .maintenance-box .mb-worktimelabel-wrap .mb-worktimelabel,
    .maintenance-section .ms-diamond-box .maintenance-wrap .maintenance-box .mb-worktimelabel-wrap .mb-worktimelabel,
    .maintenance-section .m-ecodia-box .maintenance-wrap .maintenance-box .mb-worktimelabel-wrap .mb-worktimelabel {
        background-color: #e0e0e0;
    }

    /* End ダイヤII＆(W)ダイヤモンド＆エコダイヤ　メンテナンスBOXのカラー */
    /* ------------------------------------ */

    /* ダイヤIIメンテナンス被膜図 */
    .maintenance-section .maintenance-wrap .maintenance-box .mb-coating-image-wrap {
        width: 100%;
        margin: 0 auto;
        margin-bottom: var(--maintenance-m-25px);
    }
    .maintenance-section .maintenance-wrap .maintenance-box .mb-coating-image-wrap .ci-text {
        padding: var(--maintenance-p-25px);
        padding-bottom: 0;
        background-color: white;
        /* font-size: 0.85rem; */
        font-size: 1.1rem;
        font-weight: bold;
    }
    .maintenance-section .maintenance-wrap .maintenance-box .mb-coating-image-wrap .coating-image img {
        width: 100%;
    }
    /* End ダイヤIIメンテナンス被膜図 */

    /* 価格テーブルタイトル */
    .maintenance-section .maintenance-wrap .maintenance-box .mb-table-wrap .price-table p {
        /* font-size: 1rem; */
        font-size: 1.2rem;
        font-weight: bold;
        margin-bottom: 5px;
    }
    /* 価格テーブル */
    .maintenance-section .maintenance-wrap .maintenance-box .mb-table-wrap .price-table {
        width: 50%;
    }

    /* テーブル枠線 */
    .maintenance-section .maintenance-wrap .maintenance-box .mb-table-wrap .price-table table tbody tr th,
    .maintenance-section .maintenance-wrap .maintenance-box .mb-table-wrap .price-table table tbody tr td {
        border: 1px solid #666;
        padding: 5px 10px;
        white-space: nowrap;
    }

    .maintenance-section .maintenance-wrap .maintenance-box .mb-table-wrap .price-table table tbody tr th {
        width: 20%;
        background-color: #e0e0e0;
        text-align: center;
        /* font-weight: bold; */
    }
    .maintenance-section .maintenance-wrap .maintenance-box .mb-table-wrap .price-table table tbody tr td {
        width: 80%;
        background-color: #fff;
        text-align: right;
        /* font-weight: bold; */
    }
    /* End 価格テーブル */

    .maintenance-section .maintenance-wrap .maintenance-box .note-tax {
        /* font-size: 0.7rem; */
        font-size: 0.9rem;
        color: #333;
        text-align: right;
    }

    /* ----------------------------------------------------------
        End 共通クラス　メンテナンス価格レイアウト　価格改定追加 20260318 更新20260508
        exkeeper.php / dia2.php / dia2_series.php
    ---------------------------------------------------------- */

    /* ----------------------------------------------------------
        PROSHOP独自のクラス レスポンシブ
    ---------------------------------------------------------- */
    @media screen and (min-width:667px) {
        .md667Hide {
            display: none;
        }
    }

    @media screen and (max-width: 667px) {
        .maintenance-section .ms-title-wrap {
            flex-direction: column;
            gap: 10px;
        }
        .maintenance-section .maintenance-wrap {
            flex-direction: column;
            gap: var(--maintenance-m-15px);
        }
        .maintenance-section .maintenance-wrap .maintenance-box {
            width: auto;
        }
        .maintenance-section .ms-diamond-box .diamond-title-wrap,
        .maintenance-section .ms-ecodia-box .ecodia-title-wrap {
            flex-direction: column;
            gap: 10px;
        }
        .maintenance-section .ms-diamond-box .diamond-title-wrap img {
            margin-bottom: 5px;
        }
    }

    /* 画面幅が狭いとメンテナンステーブルのレイアウトが崩れるための対策 */
    @media screen and (max-width: 480px) {
        .maintenance-section .maintenance-wrap .maintenance-box .mb-table-wrap {
            flex-direction: column;
            align-items: center;
            width: 100%;
        }
        .maintenance-section .maintenance-wrap .maintenance-box .mb-table-wrap .price-table {
            width: 70%;
        }
        .maintenance-section .maintenance-wrap .maintenance-box .mb-table-wrap .price-table table {
            width: 100%;
        }
        .maintenance-section .maintenance-wrap .maintenance-box .mb-table-wrap .price-table img {
            width: 60%;
        }

        .maintenance-section .maintenance-wrap .maintenance-box .note-tax {
            font-size: 0.7rem;
            text-align: center;
        }
    }

    /* ----------------------------------------------------------
        End PROSHOP独自のクラス
    ---------------------------------------------------------- */

/* ==========================================================
    End LABOのcoating.cssからメンテナンス価格表に関連する部分
    一部調整して流用・移植
========================================================== */

/* -------------------------- */
.price-box {
    width: 442px;
    background-color: #e0e0e0; /* グレー背景 */
    text-align: center;
    padding: 20px;
    box-sizing: border-box;
}

.price-box-ex {
    width: 442px;
    background-color: #f3f3f3; /* グレー背景 */
    text-align: center;
    padding: 20px;
    box-sizing: border-box;
}


/*メンテナンス1種類*/
.price-image1 img {
    width: 477px;
    height: auto;
    max-height: 220px;
    object-fit: cover;
    margin-bottom: 15px;
    border-radius: 4px;
}


/*メンテナンス2種類*/
.price-image2 img {
    width: 100%;
    height: auto;
    max-height: 220px;
    object-fit: cover;
    margin-bottom: 15px;
    border-radius: 4px;
}

/*メンテナンス1種類*/
.price-image2iron img {
    height: auto;
    max-height: 220px;
    object-fit: cover;
    margin-bottom: 15px;
    border-radius: 4px;
}

/*メンテナンス2種類 EX KeePer用*/
.price-image2ex {
    width: 100%;
}

.price-image2ex .img-box {
    width: 100%;
    height: 220px;              /* ←高さを揃える基準 */
    display: flex;
    align-items: center;
    justify-content: center;
}

.price-image2ex .img-box img {
    width: auto;                /* ←重要：横を固定しない */
    height: auto;
    max-width: 100%;
    max-height: 100%;
    object-fit: contain;        /* ←全体表示 */
    display: block;
    margin-bottom: 40px;
}


.price-text > p {
  font-size: 18px;
  font-weight: bold;
  margin-bottom: 15px;
  line-height: 1.5;
  min-height: 3em; /* ←2行分確保 */
}

/* 右側文字（表下に配置） */
.price-right-text {
    font-size: 14px;
    color: #333;
    text-align: right;
    margin: 6px 0 0 0;
}

/* 左側側文字 */
.price-left-text {
    width: 180px;
    text-align: left;
}

.price-left-text p {
    font-size: 14px;
    line-height: 1.3;
    font-weight: bold;
    margin: 0;
}

.price-list th,
.price-list td {
    border: 1px solid #666;
    padding: 8px 10px;
    white-space: nowrap;
}

.price-list th {
    background-color: #c0c0c0;
    text-align: center;
    font-weight: bold;
}

.price-list td {
    background-color: #fff;
    text-align: right;
}

/* 表下の補足文字 */
.note-tax {
    margin-top: 8px;
    font-size: 14px;
    color: #333;
    text-align: right;
}
/* -------------------------- */

.note-one {
    position: absolute;
    right: 190px;    /* 右からの距離 */
    bottom: 14px;  /* 下からの距離 */
}

/* アイアン・プロテクトキーパーのメンテナンス用*/
/* 1画面用の新規ラッパー */
.price-section-one {
    width: 934px;
    margin: 0 auto;
}

/* ボックス */
.price-box-one {
    background-color: #e0e0e0;
    text-align: center;
    padding: 20px;
    box-sizing: border-box;
    padding-bottom: 40px;   /* ここを増やすだけ */
    position: relative;
}

/* 価格表エリア（横並び） */
.price-list-one {
    display: flex;
    align-items: center;
    gap: 10px;
    margin-top: 10px;
}

/* 横6列×2行テーブル */
.price-table-one {
    border-collapse: collapse;
    font-size: 16px;
    border: 2px solid #666;
    width: 60%;
}

.price-table-one th,
.price-table-one td {
    border: 1px solid #666;
    padding: 8px 10px;
    white-space: nowrap;
    text-align: center;
}

.price-table-one th {
    background-color: #c0c0c0;
    font-weight: bold;
}

.price-table-one td {
    background-color: #fff;
}

/* 価格表を少しコンパクトに */
.price-table-one {
  font-size: 14px;      /* 16px → 14px */
  width: auto;         /* 全幅 → 内容幅 */
}

.price-table-one th,
.price-table-one td {
  padding: 6px 8px;    /* 8px 10px → 6px 8px */
}
.price-table-one {
    margin-left: -10px;
}
/* 全体2カラム */
.dia2 .price-section {
    display: flex;
    gap: 30px;
    justify-content: center;
}

/* タイトル */
.price-text {
    text-align: center;
    margin-bottom: 10px;
}

.price-text span {
    display: inline-block;
    margin-top: 5px;
}

/* 画像 */
/* .price-image2 img {
    width: 100%;
    height: auto;
    margin-bottom: 15px;
} */

/* 価格エリア横並び */
.price-list-wrap {
    display: flex;
    gap: 20px;
    justify-content: space-between;
    align-items: flex-end;
}

/* 各テーブル */
.price-list {
    width: 48%;
}

/* プレミアムラベル */
.price-list img {
    display: block;
    margin: 0 auto 5px;
    width: 80px;
}

/* 見出し */
.price-table p {
    text-align: center;
    font-weight: bold;
    margin-bottom: 5px;
}

/* テーブル */
.price-list table {
    width: 100%;
    border-collapse: collapse;
    border: 2px solid #666;
    font-size: 14px;
}

.price-list th,
.price-list td {
    border: 1px solid #666;
    padding: 6px 8px;
}

.price-list th {
    width: 30%;
    background: #c0c0c0;
    text-align: center;
}

.price-list td {
    width: 70%;
    text-align: right;
    background: #fff;
}

/* 注釈 */
.price-section {
    display: flex;
    gap: 20px;
    justify-content: center;
}

/* =========================
   EXページスマホ対応
========================= */
@media screen and (max-width: 768px) {

    /* A → B を縦並び */
    .exkeeper_sp .price-section {
        display: flex;
        flex-direction: column !important;
        gap: 20px;
    }

    .exkeeper_sp .price-box-ex {
        width: 100% !important;
    }

    /* 中は横2列キープ */
    .exkeeper_sp .price-list-wrap {
        display: flex;
        flex-direction: row !important;
    }

    .exkeeper_sp .price-list {
        width: 48% !important;
    }
}

/* ===========================================
    exkeeper.ctp EXキーパー施工価格テーブル
=========================================== */
.ex-price-table table {
    width: 55%;
    border: 2px solid #000;
    margin: 0 auto;
}
.ex-price-table .ex-title-wrap {
    display: flex;
    align-items: center;
    width: 55%;
    margin: 0.5rem auto;
}
.ex-price-table .ex-title {
    padding-left: 0px;
    font-weight: bold;
    font-size: 1rem;
}
.ex-price-table table tr {
    text-align: center;
    background-color: #00000000;
}
.ex-price-table table tr th,
.ex-price-table table tr td {
    border: 1px solid #000;
    padding: 0.2rem 0.5rem;
}

.ex-price-table table tr th {
    background-color: #e0e0e0;
}
/* ===========================================
    End exkeeper.ctp EXキーパー施工価格テーブル
=========================================== */
