/* body { background-color: white; }*/ body.windows { letter-spacing: 0; } /*#pgt_main_wrapper { display: block; width: 100%; height: 100%; }*/ #pgt_wrapper_central { min-width: 0; width: 100%; overflow: hidden !important; /*これでコンテンツ下のすきまを消す*/ } #pgt_wrapper_central:after { content:'.'; display:block; height:0; clear:both; visibility:hidden; } #pgt_wrapper_central .pgt_inwrapper { width: 100%; } #content_main:after { content:'.'; /*display:block;*/ height:0; clear:both; visibility:hidden; } .auto-fit #content { padding: 1em ; } #content #start .intro { padding: 2em 2em 0 2em; font-size: 15px; line-height: 26px; color: #444444; } /* スペース削除 */ .windows #content #start .intro { font-size: 12px; } .mac #content #start .intro { font-size: 14px; } /* banner追加対応 */ #content #start .banner .pc { text-align: center; /* padding-bottom: 2.5em */ padding-bottom: 1.5em; } #content #start .banner .smart-phone { display: none; background-color: #c4b7a6; } /* banner追加対応 */ #content #start .section.left { width: 100%; float: left; } #content #start .section.right { width: 25.683%; float: right; } #content #start .section .box { border: 1px solid #6e6e6e; } #content #start .section h2 { line-height: 50px; font-size: 20px; color: #fff; background-color: #c4b7a6; padding-left: 50px; } #content #start .section .inner-content { padding: 1.8em; } #content #start #map h2 { background: #6e6e6e url('../images_new/icon_home.png') no-repeat 20px 50%; background-size: 23px 25px; } #content #start #postal-code h2 { background: #c4b7a6 url('../images_new/icon_pin.png') no-repeat 20px 50%; background-size: 19px 23px; } #content #start #dealer-name h2 { background: #c4b7a6 url('../images_new/icon_car.png') no-repeat 20px 50%; background-size: 33px 22px; padding-left: 60px; } #content #start #map .inner-content { background: url('../images_new/map_bg.gif') no-repeat 42% 15px; background-size: 542px 361px; position: relative; height: 410px; } .iOS #content #start #map .inner-content { margin-left: -8px; } #content #start #map .item { width: 124px; border: 3px solid #afadc3; border-radius: 4px; background-color: white; position: absolute; } #content #start #map .item.chugoku, #content #start #map .item.kinki, #content #start #map .item.chubu, #content #start #map .item.hokkaido { top:30px; } #content #start #map .item.chugoku, #content #start #map .item.kyushu { left:161px; } #content #start #map .item.kinki { left:298px; } #content #start #map .item.chubu { left:434px; } #content #start #map .item.tokai { left:573px; } #content #start #map .item.hokkaido, #content #start #map .item.kanto { left:715px; } #content #start #map .item.kyushu, #content #start #map .item.kanto, #content #start #map .item.tokai { bottom:30px; } #content #start #map .item h3 { background: #afadc3 url('../images_new/arrow_right.png') no-repeat 95% 50%; background-size: 6px 11px; } #content #start #map .item h3:hover { opacity: 0.7; } #content #start #map .item h3 a { display: block; width: 100%; height: 100%; color: white; padding: 0 0 0 .5em; text-decoration: none; font-size: 16px; line-height: 35px; font-weight: normal; } .mac #content #start #map .item h3 span { letter-spacing: -.1em; margin-left: -.1em; } #content #start #map .item ul { padding: 10%; } #content #start #map .item ul li { display: inline-block; width: 47%; text-align: center; } #content #start #map .item ul li a { text-decoration: none; color: #646464; font-size: 14px; font-weight: normal; } #content #start #map .item ul li a:hover { text-decoration: underline; } #content #start #map .item ul li a.not-available { color: #bbb; } #content #start #map .item ul li a.not-available:hover { text-decoration: none; cursor: default; } #content #start #postal-code { height: 245px; margin-bottom: 16px; } #content #start #dealer-name { height: 244px; } /*.windows #content #start #postal-code { height: 235px; } .windows #content #start #dealer-name { height: 233px; }*/ .windows #content #start #postal-code p, .windows #content #start #dealer-name { font-size: 12px; } #content #start #submit { width: 100%; height: 40px; padding: 0; border: 0; border-radius: 4px; background: #2491b6 url('../images_new/button_search.png') no-repeat 50% 50%; background-size: 59px 21px; text-indent: -9999px; } #content #start #submit:hover { background-color: #38AFD8; cursor: pointer; } #content #start #input-box { width: 99%; padding:0; margin:8px 0; font-size:16px; height: 40px; border: 1px solid #71b8d5; text-indent: 1em; } #content #icon-description { border-top: 1px solid #646464; border-bottom: 1px solid #646464; margin: 16px 0; padding: 20px 0; height: 80px; } #content #icon-description .section { height: 100%; float: left; } #content #icon-description .section h3 { font-size: 16px; padding-left: 50px; line-height: 30px; margin-bottom: .5em; color: #646464; } #content #icon-description .section .box-s-c, #content #icon-description .section .box-c-c, #content #icon-description .section .box-e-c { height: 100%; width: 100%; } #content #icon-description .section .wrap { display: inline-block; height: auto; } #content #icon-description .section p { font-size: 12px; color: #646464; } #content #icon-description .section-header { width: 15%; border-right: 1px solid #2f2726; } #content #icon-description .section-header h3 { padding-left: 0px; margin-bottom: 0em; hieght: 1.2em;} #content #icon-description .section-01 { width: 26%; } #content #icon-description .section-02 { width: 27%; } #content #icon-description .section-03 { width: 31%; } #content #icon-description .section-01 h3 { background: url('../images_new/icon_showroom.png') no-repeat 0% 50%; background-size: 38px 26px; } #content #icon-description .section-02 h3 { background: url('../images_new/icon_approved.png') no-repeat 0% 50%; background-size: 38px 26px; } #content #icon-description .section-03 h3 { background: url('../images_new/icon_maintenance.png') no-repeat 0% 50%; background-size: 27px 26px; } .ie9 #content #icon-description .section-01 .wrap, .ie8 #content #icon-description .section-01 .wrap { padding-left: 60px; } #content #search-result .retry { float: right; margin-top: 10px; } #content #search-result .retry a { color: #646464; font-size: 14px; background: url('../images_new/arrow_up.png') no-repeat 100% 50%; background-size: 15px 9px; padding-right: 20px; } #content #search-result .inner-content, #content #rss .inner-content { background-color: #ebebed; padding: 30px; } #content #search-result:after { content:'.'; display:block; height:0; clear:both; visibility:hidden; } #content #search-result h2 { font-size: 20px; color: #646464; padding-left: 30px; padding-top: 5px; background: url('../images_new/icon_home_02.png') no-repeat 0 0; background-size: 23px 25px; margin-bottom: 10px; height: 25px; } #content #search-result h2 span { font-size: 14px; } #content #search-result .prefectural { margin-top: 30px; } #content #search-result .prefectural.first { margin-top: 0px; } #content #search-result h3 { background-color: #7bc3d9; display : inline-block; line-height: 33px; color: white; font-size: 16px; padding-left: 30px; margin-left: -30px; width: 60px; } #content #search-result ul { border-radius: 4px; background-color: white; } #content #search-result ul:after { content:'.'; display:block; height:0; clear:both; visibility:hidden; } #content #search-result ul li { display: block; float: left; margin:0; height: 85px; } #content #search-result ul li:after { content:'.'; display:block; height:0; clear:both; visibility:hidden; } #content #search-result ul li div { height: 100%; } #content #search-result ul li div.wrap { display: inline-block; height: auto; } #content #search-result ul li span { } #content #search-result ul li.services { width: 17%; position: relative; } #content #search-result ul li.dealer-name { width: 26%; font-size: 17px; line-height: 1.5em; } #content #search-result ul li.address { width: 32%; font-size: 14px; } #content #search-result ul li.map { width: 9.4%; text-align: center; } #content #search-result ul li.map div div { height: 58px; } #content #search-result ul li.web, #content #search-result ul li.test-drive { width: 7.4% ; text-align: center;} #content #search-result ul li a.button { display: block; text-indent: -9999px; border-radius: 4px; width: 58px; height: 58px; } #content #search-result ul li.map a.button { background: #eb6428 url('../images_new/icon_map.png') no-repeat 50% 50%; background-size: 53px 20px; width: 78px; height: 42px; border-bottom-left-radius: 0; border-bottom-right-radius: 0; } #content #search-result ul li.map a.text { display: block; text-decoration: none; font-size: 10px; color: #2f2726; line-height: 10px; padding-top: 5px; } #content #search-result ul li.web a.button { background: #eb6428 url('../images_new/icon_website.png') no-repeat 50% 50%; background-size: 31px 26px; } #content #search-result ul li.test-drive a.button { background: #eb6428 url('../images_new/icon_testdrive.png') no-repeat 50% 50%; background-size: 26px 26px; } #content #search-result ul li a.button:hover { opacity: 0.7; } #content #search-result ul.header { background-color: transparent; } #content #search-result ul.header li { font-size: 11px; height: 32px; line-height: 1.3em; color: #646464; } #content #search-result ul.header li.services .wrap { padding-left: 30px; } #content #search-result ul.header li.web i { font-style: normal; font-size: 12px; } #content #search-result ul li.services span { width: 38px; height: 26px; position: absolute; top:50%; margin-top: -12px; text-indent: -9999px; } #content #search-result ul li.services .showroom { background: url('../images_new/icon_showroom.png') no-repeat 50% 50%; background-size: 38px 26px; left:26px; } #content #search-result ul li.services .approved { background: url('../images_new/icon_approved.png') no-repeat 50% 50%; background-size: 38px 26px; left: 66px; } #content #search-result ul li.services .maintenance { background: url('../images_new/icon_maintenance.png') no-repeat 50% 50%; background-size: 27px 26px; left: 104px; } .iOS #content #search-result ul li.address, .iOS #content #search-result ul li.address { width: 34%; } .iOS #content #search-result ul li.map { width: 7.4% ; } .iOS #content #search-result ul li.map a.button, .smart-phone #content #search-result ul li.map a.button { background: #eb6428 url('../images_new/icon_map_ios@2x.png') no-repeat 50% 50%; background-size: 31px 40px; width: 58px; height: 58px; border-bottom-left-radius: 4px; border-bottom-right-radius: 4px; } #content #search-result ul li.note { height: auto; margin-left: 17%; padding-bottom: 1em;} .iOS #content #search-result ul li.map a.text, .smart-phone #content #search-result ul li.map a.text { display: none; } #content #search-result .no-result { margin-top: 2em; } #content #search-result ul.sosumi { margin-top: .5em; } #content #search-result ul.sosumi li { float: none; height: auto; line-height: 1.4em; font-size: 11px; color: #005e7f} #content #search-result ul.sosumi li:after { content:''; display: inline;} #content #rss h2 { font-size: 20px; color: #005e7f; padding-left: 0px; padding-top: 10px; margin-bottom: 10px; } #content #rss ul { padding: 20px; border-radius: 4px; background-color: white;} #content #rss ul li { font-size: 16px; line-height: 30px; } #content #rss ul li a { color: #0e98d1; } #content #rss ul li span { color: #929292; font-size: 12px; } #big-buttons { margin-top: 10px; margin-bottom: 50px; min-height: 225px; } .iOS #big-buttons { margin-bottom:0; } #big-buttons:after { content:'.'; display:block; height:0; clear:both; visibility:hidden; } #big-buttons .button { display: block; width: 334px; height: 225px; position: relative; float: left; margin-right: 10px; border-radius: 4px; overflow: hidden; } #big-buttons .button:nth-child(3n) { margin-right: 0; }/* 3列目の右余白リセット */ #big-buttons .button .belt { position: absolute; width: 100%; bottom:0; background-color: #6f94a8; padding: 5%; color: white; box-sizing: border-box; } #big-buttons .button:hover .belt { background-color: #2491b6; } #big-buttons .button .belt h3 { font-size: 18px; margin-bottom: .3em; } #big-buttons .button .belt p { font-size: 13px; } /* 以下、縮小時のスタイル（1023以下） */ .auto-fit #big-buttons .button { width: 494px; margin-bottom: 10px; } /* 縮小時に幅を変更 */ .auto-fit #big-buttons .button:nth-child(2n) { margin-right: 0; } /* 縮小時、2列時の右余白リセット */ .auto-fit #big-buttons .button .belt { padding: 2.5%; } /* Styles for Smart Phone */ .smart-phone { background-color: #131313; } .smart-phone #pgt_wrapper_central { min-height: 200px; } .smart-phone #content_main { width: 100%; } .smart-phone .pgt_inwrapper .wrap-ch { background-color: #c4b7a6; } .smart-phone .pgt_inwrapper .wrap-ch #content_header { text-align: center; } .smart-phone .pgt_inwrapper .wrap-ch #content_header h1 { float: none; display: block; width: 90% !important; color: black !important; border-bottom: 5px solid #eb6428; margin: 0 auto !important; padding:1em 0 !important; } .smart-phone #content { -webkit-text-size-adjust: none; margin-bottom: -12px; } .smart-phone #pgt_wrapper_breadcrumb, .smart-phone #content #start p.intro, .smart-phone #content #start #postal-code, .smart-phone #content #start #dealer-name, .smart-phone #content #start #map h2, .smart-phone #search-result h2, .smart-phone #big-buttons, .smart-phone #rss { display: none !important; } .smart-phone #content #start { background-color: #c4b7a6; } .smart-phone #content #start .banner .pc { display: none;} .smart-phone #content #start .banner .smart-phone { display: block; width: 90%; margin: 0 auto; padding: 1em 0; background-color: #c4b7a6; } .smart-phone #content #start .section.left { width: 100%; } .smart-phone #content #start .section.right { display : none; } .smart-phone #content #start #map { border:0; } .smart-phone #content #start #map .inner-content { background-image: none; height: auto; padding:0; margin:0; width: 100%; } .smart-phone #content #start #map .item { position: static; width: 100%; display: block; border-radius: 0; border:none; border-bottom: 1px solid #2f2726; } .smart-phone #content #start #map .item h3 { background-color: #ebebed; background-image: url('../images_new/arrow_bottom.png'); background-size: 15px 9px; } .smart-phone #content #start #map .item h3 a { font-size: 18px; padding: .4em 0 .4em 1em; color: #2f2726; } .smart-phone #content #start #map .item h3:hover { background-color: #f1f1f2; } .smart-phone #content #start #map .item div { margin:0 !important; } .smart-phone #content #start #map .item ul { padding:0; } .smart-phone #content #start #map .item ul li { display: list-item; box-sizing: content-box; width: 100%; text-align: left; padding: 1em 0 1em 0; margin:0; border-top: 1px solid #2f2726; } .smart-phone #content #start #map .item ul li a { padding: 0 10%; width: 75%; display: block; font-size: 18px; background: url('../images_new/arrow_bottom.png') no-repeat right 50%; background-size: 15px 9px; } .smart-phone #content #search-result { } .smart-phone #content #search-result .inner-content { padding:0 !important; } .smart-phone #content #search-result h3 { display: block; width: 100% !important; margin:0 !important; } .smart-phone #content #search-result .prefectural h3 { display: block; font-size: 20px; margin: 0px auto 1em !important; width: 88% !important; padding-left: 2%; } .smart-phone #content #search-result ul.header { display: none; } .smart-phone #content #search-result ul { position: relative; padding-bottom: 40px; border-bottom: 2px solid #2f2726; margin-bottom:0; border-radius: 0; } .smart-phone #content #search-result ul li { height: auto; } .smart-phone #content #search-result ul li.services { position: absolute; bottom:0; background-color: #ebebed; height: 2.8em; width: 100%; } .smart-phone #content #search-result ul li.services span { text-indent: 0px; background-image: none; width: 28%; height: auto; background-color: white; text-align: center; line-height: 1.2em; padding: .3em 0; top:.6em; margin:0; } .smart-phone #content #search-result ul li.services .showroom { left:5%; } .smart-phone #content #search-result ul li.services .approved { left: 36%; } .smart-phone #content #search-result ul li.services .maintenance { left: 67%; } .smart-phone #content #search-result ul li.dealer-name { width: 70%; padding: 3%% 5% 0; font-size: 18px; font-weight: bold; } .smart-phone #content #search-result ul li.dealer-name span { font-size: 14px; font-weight: normal; display:block; height: 18px; } .smart-phone #content #search-result ul li.address { width: 100%; padding: 3% 5% } .smart-phone #content #search-result ul li.address span a { color: #2491b6; font-weight: bold; } .smart-phone #content #search-result ul li.map { position: absolute; top: 8%; right:5%; width: 40px; } .smart-phone #content #search-result ul li.map a.button { height: 45px; width: 45px; background-size: 31px 40px;} .smart-phone #content #search-result ul li.web { width: 42.5%; margin: 0 2.5% 2.5% 5% } .smart-phone #content #search-result ul li.web a.button, .smart-phone #content #search-result ul li.test-drive a.button { background-position: 10px 50% ; text-indent: 30px; color: #fff; line-height: 40px; } /*.smart-phone #content #search-result ul li.web a.button { background-size: 27px 25px; }*/ .smart-phone #content #search-result ul li.test-drive { width: 42.5%; margin: 0 5% 2.5% 2.5%} /*.smart-phone #content #search-result ul li.test-drive a.button { background-size: 25px 25px;}*/ .smart-phone #content #search-result ul li.web .wrap, .smart-phone #content #search-result ul li.test-drive .wrap { width: 100%; display: block; } .smart-phone #content #search-result ul li.web a, .smart-phone #content #search-result ul li.test-drive a { width: 100%; height: 40px; } .smart-phone #content #icon-description { border-top: none; border-bottom: none; background-color: #fff; margin: 0; padding: 4% 5%; height: auto; } .smart-phone #content #icon-description .section { height: auto; float: none; width: 100%; } .smart-phone #content #icon-description .section .box-s-c, .smart-phone #content #icon-description .section .box-c-c, .smart-phone #content #icon-description .section .box-e-c { display:block !important; } .smart-phone #content #icon-description .section .box-e-c { display:block !important; } .smart-phone #content #icon-description .section h3 { color: #646464; padding: .5em 0 0 3em; background-position: 0 60%; } .smart-phone #content #icon-description .section-01 p br { display: none; } .smart-phone #content #icon-description .section-01 h3 { background-size: 38px 26px; } .smart-phone #content #icon-description .section-02 h3 { background-size: 38px 26px; } /*.smart-phone #content #icon-description .section-03 h3 { background-size: 27px 26px; background-image: url('../images_new/icon_maintenance_sp@2x.png'); }*/ .smart-phone #content #icon-description .section-header { border-right: none; } .smart-phone #content #icon-description .section-header h3 { color: black; padding:0 0 .6em; font-size: 18px; background-color: transparent; border-bottom: 2px solid #eb6428; border-right: none; text-align: center; } .smart-phone #content #search-result ul.sosumi { padding: 0 5% 5%; background-color: #f4f4f4; margin-top: 0; } .smart-phone .retry { float: none !important ; display: block; width: 100%; box-sizing: content-box; margin-top:0 !important; padding: 8% 0 ; background-color: #646464; } .smart-phone .retry a { display: block; width: 60%; padding: .8em 10% !important; margin: 0 auto !important; text-align: center; color: #005e7f; font-size: 16px !important; border-radius: 4px; background: white !important; } .smart-phone #retry-top { background: #646464; display: none; } .smart-phone #wrapper .header_wrapper_pc{display: none;} .smart-phone #wrapper .header_wrapper_sp{display: block;background: #fff; border-bottom: 1px solid #EAEAED;padding: 10px; text-align: center;} /* Retina Display */ @media all and (-webkit-min-device-pixel-ratio: 1.5) { #content #start #map .item h3 { background-image: url('../images_new/arrow_right@2x.png'); } #content #start #postal-code h2 { background-image: url('../images_new/icon_pin@2x.png') ; } #content #start #dealer-name h2 { background-image: url('../images_new/icon_car@2x.png') } #content #start #submit { background-image: url('../images_new/button_search@2x.png') } #content #search-result .retry a { background-image: url('../images_new/arrow_up@2x.png') ; } .smart-phone #content #start #map .item h3 { background-image: url('../images_new/arrow_bottom@2x.png'); } .smart-phone #content #start #map .item ul li a { background-image: url('../images_new/arrow_bottom@2x.png'); } } /*header*/ #header { width:100%;background-color: #fff;border-bottom: 1px solid #EAEAED; } #header .innerBox { width:100%;margin:0 auto;height:100px;position:relative;} #header .innerBox #ci { width:85px;margin-left:-46px;position:absolute;top:17px;left:50%;} #header .innerBox .headerBtn { float:right;width:108px;padding-top:40px;} #subHeader { width:100%;background-color:#655A54;} #subHeader .innerBox { width:100%;margin:0 auto;height:60px;text-align:center;position:relative;} #subHeader h1 { font-family: 'dsmediumregular';height: 60px;line-height:60px;text-align: center;margin:0 auto;color: #FFFFFF;} #subHeader .innerBox .headerBtn { width:108px;right:0;bottom:0;position:absolute;} #pgt_wrapper_central .pgt_inwrapper {color: #646464;} .smart-phone .pgt_inwrapper .wrap-ch{background: #fff;} #wrapper .header_wrapper_pc{padding:0 15px;background-color: #fff;} #wrapper .header{padding: 10px 0 15px;/margin: 0 auto;max-width:1280px;overflow: hidden;border-bottom:1px solid #EAEAED;font-family: citroen,Arial,Helvetica,sans-serif;} #wrapper .header a{text-decoration: none; color: #444;} #wrapper .header a:hover{text-decoration: none;} #wrapper .header .header_group1{overflow: hidden;} #wrapper .header .headLogo_citroenJapan{float: left;} #wrapper .header .headLogo_citroenJapan a{font-family: citroen,Arial,Helvetica,sans-serif;line-height: 25px;font-weight:700;color: #dc002c;font-size: 22px;} #wrapper .header .headLogo_citroenJapan a img{margin-right: 10px;margin-bottom: -4px;} #wrapper .header .headLogo_citroenJapan span{color: #646464;} #wrapper .header .nav1{float: right;overflow: hidden;} #wrapper .header .nav1 ul{margin: 0;} #wrapper .header .nav1 li{float:left;list-style:none;padding: 0 10px;vertical-align: top;} #wrapper .header .nav1 li:first-child a{background-color: #AD9D9A;color: #fff;font-size: 12px;padding: 5px 20px 5px 10px;} #wrapper .header .nav1 li:first-child img{width:16px;padding-right:10px;} #wrapper .header .nav1 li.dealer {font-size: 12px;} #wrapper .header .nav1 li.dealer img{margin-left: 20px;} #wrapper .header .nav2{float: left;margin-left: 0;} #wrapper .header .nav2 ul{padding: 0;margin-top: 26px;} #wrapper .header .nav2 li{float:left;list-style:none;padding: 5px 10px;vertical-align: top;font-size: 15px;} #wrapper .header .nav2 li:first-child {padding-left: 0;} #wrapper .header .nav2 li a:hover{color: #dc002e;} #wrapper .header_wrapper_sp{display: none;} /* _footer */ footer.ig-footer {width: 100%;height: 105px;background-color: #ebebed;font-size: 16px;display: table;padding: 0;} footer.ig-footer .footer__content {text-align: center;color: #646464;display: table-cell;padding: 0 10px;max-width: 100%;vertical-align: middle;} footer.ig-footer .footer__content .copy-right {text-align: center;vertical-align: middle;} footer.ig-footer .ig-footer-show-sp {display: none;} @media (max-width: 767px){ footer.ig-footer {font-size: 14px; height: 80px;} footer.ig-footer .footer__content .copy-right {display: inline-block;} footer.ig-footer .ig-footer-show-sp {display: initial;} }