/*format */ $wid: 940px; $b3h: 1451px; $set-prefix: '' , -moz- , -webkit-; /*extend*/ .mar{ margin-right: auto; margin-left: auto; } div, span, object, iframe, h1, h2, h3, h4, h5, h6, p, blockquote, pre, abbr, address, cite, code, del, dfn, em, img, ins, kbd, q, samp, small, strong, sub, sup, var, b, i, dl, dt, dd, ol, ul, li, fieldset, form, label, legend, table, caption, tbody, tfoot, thead, tr, th, td, article, aside, canvas, details, figcaption, figure, footer, header, hgroup, menu, nav, section, summary, time, mark, audio, video { margin: 0; padding: 0; border: 0; outline: 0; font-size: 100%; vertical-align: baseline; background: transparent; } /*incrude*/ @mixin opacity($opacity) { opacity: $opacity; $opacityIE: $opacity * 100; filter: alpha(opacity=$opacityIE); } @mixin posa($w,$h) { position:absolute; display:block; top:0; left: 50%; margin-left: ($w/2); width: $w; height: $h; @content; } div.container { overflow: hidden; zoom: 1; height: 253px; margin-right: auto; margin-left: auto; background: center top; text-align: center; z-index:500; } .bg { height: 253px; margin: 0 auto 0px; padding: 0px; background: url(../images/product2_04.png) no-repeat center 0; } .kijyu{ width: auto; z-index: 100; position:relative; } .ab{ width: $wid; @extend .mar; color:#333; z-index: 110; padding-bottom:40px; } .box1{ width:369px; height:227px; float:right; margin-top:43px; background-image: url(../images/submenu_line.png); background-repeat: repeat-x; li{ width:31px; padding-left:10px; float:left; display:block; height:227px;} .bottun1 { background: url('../images/product_menu01.png'); height:227px; width:31px; display:block; background-position:-31px 0px; } .bottun1 a { background: url('../images/product_menu01.png'); height:227px; width:31px; display:block; } .bottun2 { background: url('../images/product_menu02.png'); height:227px; width:31px; display:block; background-position:-31px 0px; } .bottun2 a { background: url('../images/product_menu02.png'); height:227px; width:31px; display:block; } .bottun3 { background: url('../images/product_menu03.png'); height:227px; width:31px; display:block; background-position:-31px 0px; } .bottun3 a { background: url('../images/product_menu03.png'); height:227px; width:31px; display:block; } .bottun4 { background: url('../images/product_menu04.png'); height:227px; width:31px; display:block; background-position:-31px 0px; } .bottun4 a { background: url('../images/product_menu04.png'); height:227px; width:31px; display:block; background-position:-31px 0px; } .bottun5 { background: url('../images/product_menu05.png'); height:227px; width:31px; display:block; background-position:-31px 0px; } .bottun5 a { background: url('../images/product_menu05.png'); height:227px; width:31px; display:block; } .bottun6 { background: url('../images/product_menu06.png'); height:227px; width:31px; display:block; background-position:-31px 0px; } .bottun6 a { background: url('../images/product_menu06.png'); height:227px; width:31px; display:block; } .bottun7 { background: url('../images/product_menu07.png'); height:227px; width:31px; display:block; background-position:-31px 0px; } .bottun7 a { background: url('../images/product_menu07.png'); height:227px; width:31px; display:block; } .bottun8 { background: url('../images/product_menu08.png'); height:227px; width:31px; display:block; background-position:-31px 0px; } .bottun8 a { background: url('../images/product_menu08.png'); height:227px; width:31px; display:block; } .bottun9 { background: url('../images/product_menu09.png'); height:227px; width:31px; display:block; background-position:-31px 0px; } .bottun9 a { background: url('../images/product_menu09.png'); height:227px; width:31px; display:block; } .bottun10 { background: url('../images/product_menu10.png'); height:227px; width:31px; display:block; background-position:-31px 0px; } .bottun10 a { background: url('../images/product_menu10.png'); height:227px; width:31px; display:block; } } .box2{ z-index: 130; height: 163px; width:532px; padding-top:70px; float:left; img{ margin-bottom:25px; } .txt{ font-family:"MS P明朝", "MS PMincho", "ヒラギノ明朝 Pro W3", "Hiragino Mincho Pro", serif; font-size:14px; line-height:24px; padding-left:5px; } } .bbox{ margin-bottom:40px; height:270px; } #acMenu dt{ display:block; width:$wid; height:43px; border:#333 1px solid; cursor:pointer; background-image:url(../images/daihitsu_bnr.jpg); -moz-border-radius: 5px; -webkit-border-radius: 5px; -o-border-radius: 5px; -ms-border-radius: 5px; -khtml-border-radius: 5px; /* 最新バージョンでは出ません。 */ border-radius: 5px; .dttit{ float: left; font-family: "MS P明朝", "MS PMincho", "ヒラギノ明朝 Pro W3", "Hiragino Mincho Pro", serif; padding-left: 13px; font-size: 24px; line-height: 43px; color: #FFF; text-decoration: none; } .dttxt{ font-family: "ヒラギノ角ゴ Pro W3", "Hiragino Kaku Gothic Pro", "メイリオ", Meiryo, Osaka, "MS Pゴシック", "MS PGothic", sans-serif; font-size: 14px; float: right; padding-right: 13px; color: #333; line-height: 43px; text-decoration: none; } } #acMenu dd{ background:#FAF6F4; width:$wid; height:1442px; border:#666 1px solid; display:none;/*none非表示、編集時block*/ .dht{ width:796px; height:50px; padding:55px 72px; @extend .mar; .dhttxt{ font-family: "MS P明朝", "MS PMincho", "ヒラギノ明朝 Pro W3", "Hiragino Mincho Pro", serif; font-size: 14px; line-height: 24px; } .dhtbox{ font-family: "MS P明朝", "MS PMincho", "ヒラギノ明朝 Pro W3", "Hiragino Mincho Pro", serif; .dhtleft{ width:464px; height:294px; float:left; } .dhtright{ width:307px; float:right; } .dhtrtit{ font-size: 24px; line-height:24px; padding-top:15px; padding-bottom:30px; } .dhtrtxt{ font-size: 14px; line-height:24px; } } } } .slider-wrapper { width: 464; } .dhttit2{ font-family: "MS P明朝", "MS PMincho", "ヒラギノ明朝 Pro W3", "Hiragino Mincho Pro", serif; font-size: 24px; line-height:28px; } .dhtsub{ height:24px; padding-left:44px; font-family: "MS P明朝", "MS PMincho", "ヒラギノ明朝 Pro W3", "Hiragino Mincho Pro", serif; font-size: 14px; line-height:24px; background-repeat: no-repeat; background-position: left; span{ color:#D7471F;} } .dhtsub1{ @extend .dhtsub; background-image: url(../images/dht_no1.png); font-size: 16px; } .dhtsub2{ @extend .dhtsub; background-image: url(../images/dht_no2.png); font-size: 16px; } .dhtsub3{ @extend .dhtsub; background-image: url(../images/dht_no3.png); font-size: 16px; } .dhtbox2{ padding-top:12px; li{ float:left; font-family: "MS P明朝", "MS PMincho", "ヒラギノ明朝 Pro W3", "Hiragino Mincho Pro", serif; font-size: 14px; line-height:24px; span{ color:#D7471F;} } } .dhtbox3{ padding-top:12px; li{ float:left; font-family: "MS P明朝", "MS PMincho", "ヒラギノ明朝 Pro W3", "Hiragino Mincho Pro", serif; font-size: 14px; line-height:24px; span{ color:#D7471F;} } } .dhtbox4{ padding:6px 6px 6px 84px; font-family: "ヒラギノ角ゴ Pro W3", "Hiragino Kaku Gothic Pro", "メイリオ", Meiryo, Osaka, "MS Pゴシック", "MS PGothic", sans-serif; font-size: 14px; line-height:24px; background-image:url(../images/dht_img04.jpg); background-repeat: no-repeat; background-position: left; background-color:#ffd900; span{ font-weight: bold; color:#D7471F;} } .ac{ width:$wid - 20px; @extend .mar; height:43px; background-color:#FFF; background-image:url(../images/tenpo_back01.png); background-repeat: no-repeat; background-position: right; border: 1px solid #CCC; .txt{ width: 50%; a { float: left; font-family: "MS P明朝", "MS PMincho", "ヒラギノ明朝 Pro W3", "Hiragino Mincho Pro", serif; padding-left: 13px; font-size: 24px; line-height: 43px; color: #333; text-decoration: none; } a:hover { color: #333; } } } .box3{ z-index: 140; width: 940px; padding-top:40px; li{ width:229px; padding-bottom:50px; display:block; .img{ height:229px; a { display: inline-block; } a:hover{ color:#C00; } img { vertical-align: bottom; } } .tit{ color: #7E0024; width:229px; text-align:center; a { font-family:"MS P明朝", "MS PMincho", "ヒラギノ明朝 Pro W3", "Hiragino Mincho Pro", serif; font-size:16px; line-height:48px; color: #7E0024; text-decoration: none; } a:hover{ color:#C00; } } .txt{ font-family:"MS P明朝", "MS PMincho", "ヒラギノ明朝 Pro W3", "Hiragino Mincho Pro", serif; font-size:14px; line-height:32px; padding-left:5px; text-align:center; } .link{ padding-left:5px; text-align:center; a { font-family:"ヒラギノ角ゴ Pro W3", "Hiragino Kaku Gothic Pro", "メイリオ", Meiryo, Osaka, "MS Pゴシック", "MS PGothic", sans-serif; font-size:12px; color: #333; text-decoration: none; } a:hover{ color:#630; } } } } #page-pop { position: absolute; bottom: 20px; right: 0px; left:50%; margin-left:370px; font-size: 77%; z-index: 3000; } #page-pop a { background: #666; text-decoration: none; color: #fff; width: 100px; padding: 10px 0; text-align: center; display: block; border-radius: 5px; -webkit-border-radius: 5px; -moz-border-radius: 5px; } #page-pop a:hover { text-decoration: none; background: #999; }