/* right */
* html #right01 {
width: 720px;
overflow-x:hidden;
}
#right01 .title01{padding:25px 0 0 0;}
#right01 .title01 h2{width:721px;height:48px;background:url(../IMAGES/p01_title01.gif) no-repeat;}
#comparision-01 .txt-01 {
margin: 30px 0 30px 0;
width: 663px;
height: 19px;
background: url(../IMAGES/p01_txt_01_01.gif) no-repeat 0 0;
}
#comparision-01 #slect-menu {
width: 720px;
margin-bottom: 64px;
}
#comparision-01 #slect-menu:after { content:""; display:block; clear:both; }
* html #comparision-01 #slect-menu { display:inline-block; }
*+html #comparision-01 #slect-menu { display:inline-block; }
#comparision-01 #slect-menu li,
#comparision-01 #slect-menu li a {
display: block;
width: 238px;
height: 140px;
}
#comparision-01 #slect-menu li {
position: relative;
float: left;
}
#comparision-01 #slect-menu li.ln01 { margin-right: 3px; }
#comparision-01 #slect-menu li.ln02 { margin-right: 3px; }
#comparision-01 #slect-menu li.ln03 { margin-right: 0; }
#comparision-01 #slect-menu li a {
background-repeat: no-repeat;
background-position: 0 0;
}
#comparision-01 #slect-menu li a:hover,
#comparision-01 #slect-menu li.current a {
background-position: -238px 0;
}
#comparision-01 #slect-menu li.current a {
cursor: default;
}
#comparision-01 #slect-menu li.ln01 a { background-image: url(../IMAGES/p01_btn_01_01.gif); }
#comparision-01 #slect-menu li.ln02 a { background-image: url(../IMAGES/p01_btn_01_02.gif); }
#comparision-01 #slect-menu li.ln03 a { background-image: url(../IMAGES/p01_btn_01_03.gif); }
#comparision-01 #slect-menu li .arrow {
position: absolute;
display: none;
width: 34px;
height: 20px;
left: 103px;
bottom: -17px;
background: url(../IMAGES/p01_btn_01_current.gif) no-repeat 0 0;
}
#comparision-01 #slect-menu li.current .arrow {
display: block;
}
.comparision-box {
display: none;
}
.comparision-box.current {
display: block;
}
/* 色でくらべる */
#comparision-02-01 {
width: 720px;
padding-bottom: 0;
}
#comparision-02-01 ul {
margin-left: 32px;
}
#comparision-02-01 ul:after { content:""; display:block; clear:both; }
* html #comparision-02-01 ul { display:inline-block; }
*+html #comparision-02-01 ul { display:inline-block; }
#comparision-02-01 ul li {
display: block;
width: 193px;
float: left;
margin: 0 40px 0 0;
}
#comparision-02-01 ul li#cbox-col-03,
#comparision-02-01 ul li#cbox-col-06 {
margin-right: 0;
}
#comparision-02-01 ul li a.btn-color {
display: block;
width: 169px;
height: 169px;
margin: 0 0 28px 12px;
background-position: 0 0;
background-repeat: no-repeat;
}
#comparision-02-01 ul li a.btn-color:hover {
background-position: -169px 0;
}
#comparision-02-01 ul li#cbox-col-01 a.btn-color { background-image: url(../IMAGES/cbox_col_01_01.gif); }
#comparision-02-01 ul li#cbox-col-02 a.btn-color { background-image: url(../IMAGES/cbox_col_02_01.gif); }
#comparision-02-01 ul li#cbox-col-03 a.btn-color { background-image: url(../IMAGES/cbox_col_03_01.gif); }
#comparision-02-01 ul li#cbox-col-04 a.btn-color { background-image: url(../IMAGES/cbox_col_04_01.gif); }
#comparision-02-01 ul li#cbox-col-05 a.btn-color { background-image: url(../IMAGES/cbox_col_05_01.gif); }
#comparision-02-01 ul li#cbox-col-06 a.btn-color { background-image: url(../IMAGES/cbox_col_06_01.gif); }
#comparision-02-01 ul li p {
display: block;
width: 193px;
height: 31px;
margin: 0 0 58px 0;
background-position: 0 0;
background-repeat: no-repeat;
}
#comparision-02-01 ul li#cbox-col-01 p { background-image: url(../IMAGES/cbox_col_01_02.gif); }
#comparision-02-01 ul li#cbox-col-02 p { background-image: url(../IMAGES/cbox_col_02_02.gif); }
#comparision-02-01 ul li#cbox-col-03 p { background-image: url(../IMAGES/cbox_col_03_02.gif); }
#comparision-02-01 ul li#cbox-col-04 p { background-image: url(../IMAGES/cbox_col_04_02.gif); }
#comparision-02-01 ul li#cbox-col-05 p { background-image: url(../IMAGES/cbox_col_05_02.gif); }
#comparision-02-01 ul li#cbox-col-06 p { background-image: url(../IMAGES/cbox_col_06_02.gif); }
/* LIGHT BOX */
.lb-box {
width: 100%;
}
.lb-box .box-inner {
position: relative;
width : 692px;
padding: 24px 12px 16px 12px;
background: #fff;
border-radius: 3px;
color: #666;
}
#lb-0001.lb-box .box-inner { border: solid 2px #929398; }
#lb-0002.lb-box .box-inner { border: solid 2px #000404; }
#lb-0003.lb-box .box-inner { border: solid 2px #f19dae; }
#lb-0004.lb-box .box-inner { border: solid 2px #ce2625; }
#lb-0005.lb-box .box-inner { border: solid 2px #1479b1; }
#lb-0006.lb-box .box-inner { border: solid 2px #623c25; }
.lb-box .box-inner h3 {
margin: 0 0 12px 0;
}
.lb-box .box-inner ul {
display: block;
width : 692px;
}
.lb-box .box-inner ul:after {
display: block;
clear: both;
content: "";
}
.lb-box .box-inner ul li {
display: block;
width: 20%;
float: left;
}
.lb-box .box-inner ul li .carimg {
text-align: center;
height: 80px;
}
.lb-box .box-inner ul li .carimg img {
width: 124px;
}
.lb-box .box-inner ul li h4 {
font-weight: bold;
font-size: 12px;
margin: 0 0 4px 0;
padding: 0 4px;
text-align: center;
}
.lb-box .box-inner ul li h4 a {
display: inline-block;
padding: 0 16px 0 0;
background: url(../IMAGES/LB/arrow_pc.png) no-repeat right center;
}
.lb-box .box-inner ul li h4 a,
.lb-box .box-inner ul li h4 a:link,
.lb-box .box-inner ul li h4 a:hover,
.lb-box .box-inner ul li h4 a:visited {
color: #666;
text-decoration: none;
}
.lb-box .box-inner ul li .colorname {
padding: 0 5px;
font-size: 10px;
line-height: 12px;
color: #666;
text-align: center;
}
/* おおきさでくらべる */
comparision-02-02 {
width: 720px;
}
#comparision-02-02 #cbox-size {
width: 680px;
margin: 0 0 58px 20px;
}
#comparision-02-02 #cbox-size th,
#comparision-02-02 #cbox-size td {
margin: 0;
padding: 0;
vertical-align: middle;
}
#comparision-02-02 #cbox-size th.val_top,
#comparision-02-02 #cbox-size td.val_top {
vertical-align: top;
}
#comparision-02-02 #cbox-size th { width: 120px; }
#comparision-02-02 #cbox-size td { width: 140px; }
#content #comparision-02-02 #cbox-size h3 {
margin: 0 0 8px 0;
}
#content #comparision-02-02 #cbox-size p {
margin: 0;
padding: 0;
}
#comparision-02-02 #cbox-size td.separator-01 {
height: 2px;
background: url(../IMAGES/cbox_size_separator_01.gif) repeat-x 0 0;
}
#comparision-02-02 #cbox-size td.separator-02 {
height: 66px;
background: url(../IMAGES/cbox_size_separator_02.gif) repeat-x 0 0;
}
/* お金でくらべる */
#comparision-02-03 {
width: 720px;
}
#comparision-02-03 .box-inner {
padding-bottom: 48px;
}
#comparision-02-03 ul#list-cost,
#comparision-02-03 ul#list-fuel {
display: block;
width: 701px;
margin: 0 0 0 9px;
background-repeat: no-repeat;
background-position: 0 0;
}
#comparision-02-03 ul:after { content:""; display:block; clear:both; }
* html #comparision-02-03 ul { display:inline-block; }
*+html #comparision-02-03 ul { display:inline-block; }
#comparision-02-03 ul#list-cost {
width: 701px;
height: 315px;
margin: 0 auto;
background-image: url(../IMAGES/cbox_cost_01.jpg);
}
#comparision-02-03 ul#list-fuel {
width: 701px;
height: 145px;
margin: 0 auto;
background-image: url(../IMAGES/cbox_fuel_01.gif);
}
#comparision-02-03 ul#list-cost li,
#comparision-02-03 ul#list-fuel li {
display: block;
text-align: center;
box-sizing: border-box;
width: 73px;
float: left;
margin: 0 0 0 1px;
}
#comparision-02-03 ul#list-cost li:first-child,
#comparision-02-03 ul#list-fuel li:first-child,
#comparision-02-03 ul#list-cost li.cbox-cost-01,
#comparision-02-03 ul#list-fuel li.cbox-cost-01 {
margin-left: 38px;
}
#comparision-02-03 ul#list-cost li.cbox-cost-02,
#comparision-02-03 ul#list-fuel li.cbox-cost-02,
#comparision-02-03 ul#list-cost li.cbox-cost-03,
#comparision-02-03 ul#list-fuel li.cbox-cost-03
#comparision-02-03 ul#list-cost li.cbox-cost-04,
#comparision-02-03 ul#list-fuel li.cbox-cost-04,
#comparision-02-03 ul#list-cost li.cbox-cost-06,
#comparision-02-03 ul#list-fuel li.cbox-cost-06,
#comparision-02-03 ul#list-cost li.cbox-cost-07,
#comparision-02-03 ul#list-fuel li.cbox-cost-07,
#comparision-02-03 ul#list-cost li.cbox-cost-08,
#comparision-02-03 ul#list-fuel li.cbox-cost-08{
margin-left: 0;
}
* html #comparision-02-03 ul#list-cost li.cbox-cost-01,
* html #comparision-02-03 ul#list-fuel li.cbox-cost-01 {
margin-left: 30px;
}
#comparision-02-03 ul#list-cost li .box-hidden,
#comparision-02-03 ul#list-fuel li .box-hidden{
display: none;
}
#comparision-02-03 ul.notes {
/*margin: 0 0 10px 61px;*/
width: 621px;
margin: 20px auto 10px auto;
}
#comparision-02-03 ul.notes li {
font-size: 10px;
margin-left: 30px;
margin-bottom: 0;
/*text-align: right;*/
}
#comparision-02-03 ul.notes li:after { content:""; display:block; clear:both; }
* html #comparision-02-03 ul.notes li { display:inline-block; }
*+html #comparision-02-03 ul.notes li { display:inline-block; }
#comparision-03 {
text-align: center;
}
/*---------------------------------------------------------------------*/
#right01 #comparision-voice {
width: 721px;
}
#right01 #comparision-voice .title01 {
padding:0 0 0 0;
}
#right01 #comparision-voice .title01 h2{
width:721px;
height:48px;
background:url(../IMAGES/p01_title02.gif) no-repeat;
}
#right01 #comparision-voice .txt-01 {
margin: 16px 0 0 0;
font-size: 14px;
color: #666;
}
#right01 #comparision-voice .box-voice-01 {
display: block;
margin: 0 -3px;
padding: 20px 0 96px 0;
}
#right01 #comparision-voice .box-voice-01::after {
display: block;
content: '';
clear: both;
}
#right01 #comparision-voice .box-voice-01 > li {
display: block;
width: 172px;
float: left;
margin: 0 0 0 13px;
}
#right01 #comparision-voice .box-voice-01 > li:first-child {
margin: 0 0 0 0;
}
#right01 #comparision-voice .box-voice {
display: none;
}
#right01 #comparision-voice .box-link {
margin: 0 0 3px 0;
padding: 0 0 0 0;
}
#right01 #comparision-voice .box-link li {
padding: 0 0 2px 10px;
}
#right01 #comparision-voice .box-link li a {
color: #333;
text-decoration: none;
font-weight: bold;
}
#right01 #comparision-voice .box-link li.box-link-01 a {
font-size: 14px;
}
#right01 #comparision-voice .box-link li.box-link-02 a {
font-size: 11px;
}
#right01 #comparision-voice .voice06 {
position: relative;
top: 2px;
left: 6px;
}