/* ===================================================== * 共通 * ===================================================== */ * { margin: 0; padding: 0; font-family: "Hiragino Kaku Gothic ProN", Meiryo, sans-serif; line-height: 1.6em; box-sizing: border-box; -webkit-box-sizing: border-box; -moz-box-sizing: border-box; -ms-box-sizing: border-box; -o-box-sizing: border-box; } html, body, div, span, applet, object, iframe, h1, h2, h3, h4, h5, h6, p, blockquote, pre, a, abbr, acronym, address, big, cite, code, del, dfn, em, img, ins, kbd, q, s, samp, small, strike, strong, sub, sup, tt, var, b, u, i, center, dl, dt, dd, ol, ul, li, fieldset, form, label, legend, table, caption, tbody, tfoot, thead, tr, th, td, article, aside, canvas, details, embed, figure, figcaption, footer, header, hgroup, menu, nav, output, ruby, section, summary, time, mark, audio, video { margin: 0; padding: 0; border: 0; font-style: normal; font-weight: normal; font-size: 100%; vertical-align: baseline; } article, aside, details, figcaption, figure, footer, header, hgroup, menu, nav, section, main { display: block; } html { font-size: 14px; overflow-y: scroll; } body { margin:0; padding:0; color:#444; border-top:solid 3px #3F3935; /* background:#f2f5f3; */ font-family: "ヒラギノ角ゴ Pro W3", "Hiragino Kaku Gothic Pro", "メイリオ", Meiryo, Arial, Verdana, "ＭＳ Ｐゴシック", sans-serif; } table { width: 100%; } ul,li { margin:0; padding:0; list-style:none; } strong { font-weight:bold; } /* -------------------------------------* PC/SP * -------------------------------------*/ .pc { display: block; } .sp { display: none; } .spNone { display:inherit !important; } .pcNone { display:none !important; } .sp_on { display:none; } .sp_off { display:none; } .sp_inline { display:none; } .symbol_coming_soon { text-align:center; } .symbol_coming_soon img { max-width:70%; } /* -------------------------------------* 回りこみ解除 * -------------------------------------*/ .clearfix:after { display: block; clear: both; height: 0px; visibility: hidden; content: "."; } .clearfix { min-height: 1px; /* IE6、7対策 */ } * html .clearfix { height: 1px; /*¥*//*/ /* MAC IE5.x対策 */ height: auto; overflow: hidden; } .wordbreak {word-wrap: break-word;} /* -------------------------------------* イメージ * -------------------------------------*/ img { vertical-align:bottom; max-width:100%; -webkit-backface-visibility:hidden; } .icon { padding-right:1em; } /* -------------------------------------* リンク * -------------------------------------*/ a { color: #098adc; text-decoration: none; } a:hover { text-decoration: underline; } /* a,a:hover { -webkit-transition: 0.5s; -moz-transition: 0.5s; -o-transition: 0.5s; transition: 0.5s; } a img:hover { filter: alpha(opacity=75); -moz-opacity:0.75; opacity:0.75; } */ a.normal { text-decoration: none; color: #FF3366; } a.normal:hover { text-decoration: underline; color: #FCD500; } a.list,a.list:hover { -webkit-transition: 0; -moz-transition: 0; -o-transition: 0; transition: 0; text-decoration:none; } a.list img:hover { filter: alpha(opacity=100); -moz-opacity:1; opacity:1; } a.list:hover .thumb { opacity:0.5; } /* -------------------------------------* ブロック定義 * -------------------------------------*/ .wrapper { width:1000px; margin:0 auto; } .page_body { background:#fff; padding:30px 60px 180px 60px; } /* -------------------------------------* 部品 * -------------------------------------*/ p.list { text-indent:-1em; padding:0 0 0 1em; } .kakko { text-indent:-.5em; } /* -------------------------------------* 見出し定義 * -------------------------------------*/ h1.h_main { display:table; min-width:340px; margin:60px auto 80px auto; padding:22px 15px 24px 15px; text-align:center; font-size:80px; font-weight:bold; line-height:1em; letter-spacing:1px; position:relative; color:#efefef; } h1.h_main span { display:block; font-size:32px; color:#333; font-weight:bold; letter-spacing:.2em; padding-top:5px; margin-top:-40px; letter-spacing:0.1em; } /* h1.h_main span:before { content:"-"; } h1.h_main span:after { content:"-"; } */ h1.h_main:after { content:""; position:absolute; bottom:0; left:calc(50% - 30px); background-color:#f8b500; width:60px; height:4px; } .page_ttl { /* border-left:solid 4px #621d87; border-right:solid 4px #ea5504; */ font-size:22px; display:inline-block; text-align:left; padding:0 0 .5em 0; margin-bottom:40px; position:relative; } .page_ttl:after { content:""; position:absolute; bottom:0; left:0; background-color:#f8b500; width:30px; height:3px; } .marker_yellow { background:linear-gradient(transparent 10%, #ffff66 10%); } /* -------------------------------------* ヘッダ * -------------------------------------*/ .page_common #header { width:1000px; margin:0 auto; background-color:#fff; position:relative; } .page_common #header ul { display:flex; flex-flow:row; } .page_common #header li { margin-top:0; } .page_common #header #logo { width:340px; margin-left:60px; } .page_common #header #event_info { width: calc(100% - 640px); margin-left: 30px; margin-top: 0px; display: flex; align-items: center; justify-content: center; } .page_common #header #ask { margin-left:30px; width:120px; } .page_common #header #ask a.contact { display:block; margin-top:0; background:#3F3935; color:#fff; padding:.5em 1em; text-decoration:none; font-size:12px; text-align:center; letter-spacing:.1em; border-radius:0 0 .5em .5em; } .page_common #header #ask a + a { margin-top:10px; } .page_common #header #ask a.contact:hover { background:#F3B225; } /* -------------------------------------* フッタ * -------------------------------------*/ #footer { background:#3F3935; color:#fff; padding:20px 0; /*margin-top:120px;*/ } #footer #copyright { text-align:center; font-size:14px; } /* -------------------------------------* スポンサー * -------------------------------------*/ .flex_wrapper { display:flex; justyify-content:center; } #blk_sponcer { margin-top:60px; padding:20px 0 30px 0; background:#efefef; } #blk_sponcer .ttl { text-align:center; } #blk_sponcer .ttl span { display:inline-block; padding:0 0 1em 0; font-size:16px; letter-spacing:0.1em; } #blk_sponcer .ttl span:before { content:'-- '; } #blk_sponcer .ttl span:after { content:' --'; } #blk_sponcer ul { width:40%; margin:0 auto; } #blk_sponcer li { width:50%; padding:15px 25px; } #blk_social { margin-top:100px; } #blk_social .flex_wrapper .col_left { width:53%; } #blk_social .flex_wrapper .col_right { width:43%; margin-left:4%; } /* -------------------------------------* メニュー * -------------------------------------*/ #gmenu { width:100%; /* background:#84959e; */ background:#F3B225; /* padding:3px 0; */ padding:4px 0; border-top:solid 6px #3F3935; border-bottom:solid 6px #3F3935; } #gmenu .wrapper { background-color: #fff; } #gmenu ul { display:flex; flex-flow:row; /* justify-content:space-around; */ width:100%; /* background:#8FC31F; */ background:#F3B225; box-sizing:border-box; border-top:solid 3px #F3B225; border-bottom:solid 3px #F3B225; } #gmenu li { width:124px; background:#fff; box-sizing:border-box; } #gmenu li { border-left:solid 8px #F3B225; } #gmenu li:nth-child(1) { width:106px; } #gmenu li:nth-child(7) { width:131px; } #gmenu li:nth-child(8) { width:135px; } /* #gmenu li:nth-child(1) { border-left:solid 8px #F7EF12; width:106px; } #gmenu li:nth-child(2) { border-left:solid 8px #EA5504; } #gmenu li:nth-child(3) { border-left:solid 8px #F39800; } #gmenu li:nth-child(4) { border-left:solid 8px #EB6EA5; } #gmenu li:nth-child(5) { border-left:solid 8px #E50B72; } #gmenu li:nth-child(6) { border-left:solid 8px #621D87; } #gmenu li:nth-child(7) { border-left:solid 8px #00A0E9; width:131px; } #gmenu li:nth-child(8) { border-left:solid 8px #796BAF; width:135px; } */ #gmenu li a { display:block; padding:10px 0; color:#000; text-decoration:none; text-align:center; width:100%; } #gmenu li a:hover { background-color:#FFE57A; } /* -------------------------------------* 準備中 * -------------------------------------*/ .coming_soon { width:460px; margin:80px auto 300px auto; } /* ======================================================================================= * 各ページ定義 * ======================================================================================= */ /* -------------------------------------* TOPページ * -------------------------------------*/ /* -------------------------------------* 開催概要 * -------------------------------------*/ #outline { width:720px; margin:0 auto; } #outline h1.h_main { } #outline .about_catch { line-height:1.8em; margin-bottom:60px; font-size:16px; } #outline table { width:100%; border:solid 1px #666; border-collapse:collapse; } #outline th { vertical-align:middle; padding:1em; border-right:solid 1px #333; border-top:solid 1px #fff; text-align:center; font-weight:normal; background:#3F3935; color:#fff; white-space:nowrap; } #outline td { vertical-align:middle; padding:1em; border:solid 1px #333; } #outline td strong { font-weight:bold; font-size:18px; } #outline th.top { border-top:solid 1px #333; } #outline ul.date { display:inline-block; } #outline ul.date li { text-align:right; font-weight:bold; } #outline ul.ticket { display:inline-block; } #outline ul.ticket li { padding:.5em 0; } #outline ul.ticket li + li { border-top:solid 1px #ccc; } /* -------------------------------------* アクセス * -------------------------------------*/ /* 会場アクセス */ #access h1.h_main { border-top-color:#ea5504; border-bottom-color:#621d87; } #access .info_wrapper { border:solid 2px #036eb8; margin:0 auto 60px auto; padding:4px; } #access .info { border:solid 2px #036eb8; padding:20px 80px; font-size:26px; } #access .info .ttl { text-align:center; padding-bottom:10px; font-weight:bold; } #access .info .aonami { float:left; width:150px; } #access .info p { float:left; width:520px; padding:15px 0 0 40px; font-size:24px; line-height:1.3em; letter-spacing:0.1em; font-weight:bold; } #access .info p a { font-weight:bold; text-decoration:underline; } #access .info p a:hover { text-decoration:none; } #access ul { list-style:none; } #access ul li { float:left; width:48%; padding:10px 0; } #access ul li:nth-child(even) { margin-left:4%; } #access ul li h2 { font-size:24px; display:inline-block; padding:0 0 .5em 0; margin:1em 0 1em 0; position:relative; } #access ul li h2:after { content:""; position:absolute; bottom:0; left:0; background-color:#f8b500; width:30px; height:3px; } #access ul li p + h2 { margin-top:1.5em; } #access ul li p.list { margin-top:0.5em; } #access div.catch { color:#FF0000; margin:30px 0 15px 0; border:3px #efefef solid; padding:10px 20px; text-align:center; } #access div.att { background:#f2f5f3; padding:1em; margin-top:20px; } /* 自転車駐輪場 */ #parking { margin-top:120px; } #parking h1.h_main { border-top-color:#796baf; border-bottom-color:#f39800; } #parking h2 { border-left:solid 4px #cccc; border-right:solid 4px #cccc; font-size:24px; display:inline-block; padding:0 .5em; margin:1em 0 .6em 0; } #parking h2.place { border-left-color:#e61673; border-right-color:#f39800; } #parking h2.time { border-left-color:#00913a; border-right-color:#036eb8; } #parking .cycle_stop_exp { padding:0; width:560px; margin:30px auto; } #parking .cycle_stop_exp hr { border: none; border-bottom: dashed 1px #ccc; margin: 5px 0 10px 0; padding: 5px 0 0 0; } #parking .cycle_stop_exp p strong { color: #2BA339; } #parking .cycle_stop_exp .att { padding:20px 0; } /* -------------------------------------* チケット * -------------------------------------*/ #ticket { width:700px; margin:0 auto; } #ticket h1.h_main { border-top-color:#eb6ea5; border-bottom-color:#e50b72; } #ticket table { } #ticket table th { padding:20px 20px; background:#f2f5f3; font-weight:bold; } #ticket table td { padding:20px 20px; } #ticket table td strong { font-weight:bold; } #ticket .store { background:none; margin-top:60px; padding:20px 100px; font-size:21px; } #ticket .store .ttl { background:#e60012; color:#fff; width:220px; padding:0; text-align:center; margin:1px auto 20px auto; } #ticket .store .icon_logo { font-size:30px; padding:5px 0; } #ticket .store .icon_logo img { width:50px; margin:0 20px; } #ticket .store p { padding:20px 80px 0 80px; } #ticket .store p span { font-size:14px; } #ticket h2 { border-left:solid 6px #e61673; border-right:solid 6px #f39800; font-size:24px; width:460px; padding:.5em .5em; margin:60px auto 30px auto; text-align:center; background:#f2f5f3; } #ticket span.att { display:block; font-size:16px; font-weight:normal; padding-top:5px; color:#e60012; } #ticket h2 span { display:block; font-size:16px; font-weight:normal; padding-top:5px; color:#e60012; } #ticket p.list { font-size:14px; padding-top:.5em; } #ticket p.list span { color:#e60012; display:inline; } #ticket_ask { margin-top:80px; text-align:center; font-size:22px; } #ticket_ask h1 { border-left:solid 4px #e61673; border-right:solid 4px #f39800; font-size:24px; width:240px; padding:0 .5em; margin:60px auto 30px auto; text-align:center; } #ticket_ask .ttl { font-weight:bold; } /* サイスポ・コラボ */ /* #campaign { margin:120px 0 160px 0; } */ #campaign { margin:60px 0 160px 0; } #campaign .campaign_logo { width:450px; display:block; margin:0 auto; } #campaign .sub_ttl { color:#ab951e; font-size:40px; text-align:center; font-weight:bold; padding:0 0 20px 0; } #campaign .main_catch { font-size:32px; text-align:center; font-weight:bold; } #campaign .main_catch span { font-size:23px; font-weight:normal; padding:0 6px 0 2px; } #campaign .maru_sat { width:38px; vertical-align:-5px; } #campaign p.catch { font-size:18px; padding:20px 140px; } #campaign .att { width:400px; margin:0 auto; border:solid 3px #8364a9; color:#e60012; } #campaign .att p { font-size:16px; padding:10px 20px; } #campaign .att p span { font-weight:bold; color:#fff; background:#e60012; display:inline-block; padding-left:10px; margin-right:.5em; } #campaign .att_ttl { color:#fff; background:#8364a9; text-align:center; } #campaign .mihon { padding:0 130px 0px 130px; font-size:18px; } #campaign .mihon .note { position:relative; margin:60px 0; } #campaign .mihon .note .hasami { position:absolute; top:0; left:0; width:50px; } #campaign .mihon .note p { padding-left:80px; font-size:20px; } #campaign .mihon .note p span { display:inline-block; margin:0 .3em; } #campaign .mihon .note p span.clr { color:#E60012; } #campaign .mihon .note p span.bldclr{ color:#E60012; font-weight:bold; } #campaign .mihon .note p span.bgclr { background:#E60012; color:#fff; padding:0 .3em; } /* #campaign .magazine { width:640px; display:block; margin:60px auto 0 auto; } */ #campaign .magazine { width:320px; display:block; margin:60px auto 0 auto; } #campaign .magazine .ttl { background:#E46CA5; color:#fff; font-size:20px; font-weight:bold;text-align:center; padding:.5em 0; } #campaign .magazine p { text-align:center; font-size:18px; padding:1em 0; } /* #campaign .magazine li { float:left; width:50%; padding:0 40px; } */ #campaign .magazine li { float:left; width:100%; padding:0 40px; } #campaign .magazine li dl { } #campaign .magazine li dt { text-align:center; font-size:18px; font-weight:bold; padding:10px 0 0 0; } #campaign .magazine li dd { text-align:center; font-size:16px; } #campaign .magazine .btn_block { padding:30px 0; } #campaign .magazine .btn_block a { display:block; width:200px; margin:0 auto; padding:10px; background:#E46CA5; color:#fff; border-radius:100px; text-align:center; } #campaign .magazine .btn_block a:hover { background:#ccc; color:#fff; } /* -------------------------------------* アトラクション * -------------------------------------*/ /* イベントコンテンツ */ #event_timeline h1.h_main { border-top-color:#8fc31f; border-bottom-color:#fff100; } /* イベントコンテンツ */ #event_list h1.h_main { border-top-color:#1d2088; border-bottom-color:#e61673; } #event_list ul.p2s1 { display:flex; flex-wrap:wrap; justify-content:left; width:100%; } #event_list ul.p2s1 li { width:50%; padding:0 30px 80px 30px; } #event_list ul.p2s1 li h2 { font-size:17px; font-weight:bold; padding:0 0 .5em 0; margin:20px 0; position:relative; } #event_list ul.p2s1 li h2:after { content:""; position:absolute; bottom:0; left:0; background-color:#f8b500; width:30px; height:3px; } #event_list ul.p2s1 li h2 span { display:block; } /* #event_list ul.p2s1 p { font-size:14px; padding:0 0 1em 0; line-height:1.8em; } */ #event_list ul.p3s1 { display:flex; flex-wrap:wrap; justify-content:left; width:100%; } #event_list ul.p3s1 li { width:33.333333%; padding:0 10px 80px 10px; } #event_list ul.p3s1 li h2 { font-size:17px; font-weight:bold; padding:0 0 .5em 0; margin:20px 0; position:relative; } #event_list ul.p3s1 li h2:after { content:""; position:absolute; bottom:0; left:0; background-color:#f8b500; width:30px; height:3px; } #event_list ul.p3s1 li h2 span { display:block; } /* #event_list ul.p3s1 p { font-size:14px; padding:0 0 1em 0; line-height:1.8em; } */ #event_list table.event_detail th { border-top:1px solid #ccc; border-bottom:1px solid #ccc; vertical-align:top; width:6em; letter-spacing:0.4em; padding:5px 10px; text-align:center; background:#efefef; font-size:14px; } #event_list table.event_detail td { border-top:1px solid #ccc; border-bottom:1px solid #ccc; vertical-align:top; padding:5px 10px; word-wrap:break-word; font-size:14px; } #event_list div.list { padding:0 0 0 1em; text-indent:-1em; } /* タイムスケジュール */ #event_timeline { margin:0 0 180px 0; } #event_timeline .timeline_wrapper { padding:0 40px; } #event_timeline .timeline_wrapper { } #event_timeline table.timetable { width:100%; border:solid 8px #fff; border-collapse:collapse; font-size:16px; } #event_timeline table.timetable th { width:16%; text-align:center; padding:.8em 0; font-weight:bold; border:solid 8px #fff; } #event_timeline table.timetable td { padding:.5em .5em; min-height:4em; border:solid 8px #fff; text-align:center; } #event_timeline table.timetable th.cycle { width:42%; background:#c1e5f8; } #event_timeline table.timetable th.beginner { width:42%; background:#faf2b8; } #event_timeline table.timetable td.ttl_time { text-align:center; background:#f2f5f3; } #event_timeline table.timetable td.bg_grey { background:#f2f5f3; } #event_timeline table.timetable td span { display:block; text-align:center; } #event_timeline #tabs li { float:left; width:25%; box-sizing:border-box; } #event_timeline #tabs li a { display:block; padding:10px 0; text-align:center;background:#e1e4e2; text-decoration:none; color:#595757; border-top:solid 7px #e1e4e2; font-size:17px; padding:1em 0; font-weight:bold; } #event_timeline #tabs li a:hover { background:#aaa; border-top:solid 7px #aaa; } #event_timeline #tabs li a.tabulous_active { border-top:solid 7px #036eb8; } #event_timeline #tabs li a.tabulous_active:hover { background:#f2f5f3 !important; color:#231815 !important; border-top:solid 7px #036eb8; } #event_timeline #tabs li + li a.tabulous_active { border-top:solid 7px #E83828; } #event_timeline #tabs li + li a.tabulous_active:hover{ border-top:solid 7px #E83828; } #event_timeline #tabs_container { position:relative; background:#f2f5f3; padding:40px; min-height:960px; box-sizing:border-box; } #event_timeline #day24 { width:720px; background:#fff; padding:15px; } #event_timeline #day25 { width:720px; background:#fff; padding:15px; } #event_timeline #tabs p { padding:30px 10px; color:#e60012; } #event_timeline #tabs .transition { -webkit-transition: all .3s ease-in-out; -moz-transition: all .3s ease-in-out; -o-transition: all .3s ease-in-out; -ms-transition: all .3s ease-in-out; transition: all .3s ease-in-out; -webkit-transition-delay: .3s; -moz-transition-delay: .3s; -o-transition-delay: .3s; -ms-transition-delay: .3s; transition-delay: .3s; } #event_timeline #tabs .make_transist { -webkit-transition: all .3s ease-in-out; -moz-transition: all .3s ease-in-out; -o-transition: all .3s ease-in-out; -ms-transition: all .3s ease-in-out; transition: all .3s ease-in-out; } #event_timeline #tabs .hidescale { z-index:980px; display:none; /*-webkit-transform: scale(0.9); -moz-transform: scale(0.9); -o-transform: scale(0.9); -ms-transform: scale(0.9); transform: scale(0.9); -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=0)"; filter: alpha(opacity=0); filter: alpha(opacity=0); opacity: 0;*/ } #event_timeline #tabs .showscale { z-index:990px; display:block; -webkit-transform: scale(1); -moz-transform: scale(1); -o-transform: scale(1); -ms-transform: scale(1); transform: scale(1); -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=100)"; filter: alpha(opacity=100); opacity: 1; -webkit-transition-delay: .3s; -moz-transition-delay: .3s; -o-transition-delay: .3s; -ms-transition-delay: .3s; transition-delay: .3s; } #event_timeline #tabs .hideleft { -webkit-transform: translateX(-100%); -moz-transform: translateX(-100%); -o-transform: translateX(-100%); -ms-transform: translateX(-100%); transform: translateX(-100%); -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=0)"; filter: alpha(opacity=0); opacity: 0; } #event_timeline #tabs .showleft { -webkit-transform: translateX(0px); -moz-transform: translateX(0px); -o-transform: translateX(0px); -ms-transform: translateX(0px); transform: translateX(0px); -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=100)"; filter: alpha(opacity=100); opacity: 1; -webkit-transition-delay: .3s; -moz-transition-delay: .3s; -o-transition-delay: .3s; -ms-transition-delay: .3s; transition-delay: .3s; } #event_timeline #tabs .hidescaleup { -webkit-transform: scale(1.1); -moz-transform: scale(1.1); -o-transform: scale(1.1); -ms-transform: scale(1.1); transform: scale(1.1); -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=0)"; filter: alpha(opacity=0); opacity: 0; } #event_timeline #tabs .showscaleup { -webkit-transform: scale(1); -moz-transform: scale(1); -o-transform: scale(1); -ms-transform: scale(1); transform: scale(1); -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=100)"; filter: alpha(opacity=100); opacity: 1; -webkit-transition-delay: .3s; -moz-transition-delay: .3s; -o-transition-delay: .3s; -ms-transition-delay: .3s; transition-delay: .3s; } #event_timeline #tabs .hideflip { -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=0)"; filter: alpha(opacity=0); opacity: 0; -webkit-transform: rotatey(-90deg) scale(1.1); -moz-transform: rotatey(-90deg) scale(1.1); -o-transform: rotatey(-90deg) scale(1.1); -ms-transform: rotatey(-90deg) scale(1.1); transform: rotatey(-90deg) scale(1.1); -webkit-transform-origin: 50% 50%; -moz-transform-origin: 50% 50%; -o-transform-origin: 50% 50%; -ms-transform-origin: 50% 50%; transform-origin: 50% 50%; } #event_timeline #tabs .showflip { -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=100)"; filter: alpha(opacity=100); opacity: 1; -webkit-transition-delay: .3s; -moz-transition-delay: .3s; -o-transition-delay: .3s; -ms-transition-delay: .3s; transition-delay: .3s; -webkit-transform: rotatey(0deg) scale(1); -moz-transform: rotatey(0deg) scale(1); -o-transform: rotatey(0deg) scale(1); -ms-transform: rotatey(0deg) scale(1); transform: rotatey(0deg) scale(1); -webkit-transform-origin: 50% 50%; -moz-transform-origin: 50% 50%; -o-transform-origin: 50% 50%; -ms-transform-origin: 50% 50%; transform-origin: 50% 50%; } #event_timeline #tabs .tabulous_active { background:#f2f5f3 !important; color:#231815 !important; border-top:solid 7px #171c61; } #event_timeline #tabs .tabulousclear { display:block; clear:both; } /* -------------------------------------* 会場内マップ * -------------------------------------*/ #page_map section { padding-bottom:60px; } #page_map h1.h_main { border-top-color:#796baf; border-bottom-color:#2bac39; } #page_map .page_body { padding:30px 0px 30px 0px; } #page_map .blk_map { display:flex; padding-top:60px; /* background:#f2f5f3; background-image:url(../images/bg_map_head2.svg); background-repeat:repeat-x; background-position:left top; background-size:109px; */ } /* #page_map .blk_map #guide_map { width:580px; padding:0 0 0 30px; } #page_map .blk_map #booth_list { width:400px; padding:0 0 0 20px; } #page_map #tabs_container table { width:100%; border-collapse:collapse; } #page_map #tabs_container tr:nth-child(odd) { background:#f2f5f3; } #page_map #tabs_container th { width:4.5em; padding:2px 0px; white-space:nowrap; font-size:14px; } #page_map #tabs_container td { padding:2px 15px; margin:10px 0; border-left:solid 10px #fff; font-size:14px; } #page_map #tabs_container th span { display:block; width:100%; padding:2px 0; } #page_map #tabs { width:100%; margin:0 auto; margin-bottom:10px; } #page_map #tabs ul { } #page_map #tabs li { float:left; width:50%; box-sizing:border-box; } #page_map #tabs li a { display:block; padding:10px 0; text-align:center;background:#ccc; text-decoration:none; color:#595757; border-top:solid 7px #e1e4e2; } #page_map #tabs li a:hover { background:#aaa; border-top:solid 7px #e1e4e2; } #page_map #tabs li a.tabulous_active:hover { background:#f2f5f3 !important; color:#231815 !important; border-top:solid 7px #171c61; } #page_map #tabs_container { position:relative; background:#f2f5f3; min-height:840px; padding:0 20px; box-sizing:border-box; } #page_map #tabs #tabs-1 { width:350px; } #page_map #tabs #tabs-2 { width:350px; } #page_map #tabs .tab_inner { width:100%; display:block; height:760px; background:#fff; overflow:auto; padding:20px 10px 40px 10px; box-sizing:border-box; } #page_map #tabs .transition { -webkit-transition: all .3s ease-in-out; -moz-transition: all .3s ease-in-out; -o-transition: all .3s ease-in-out; -ms-transition: all .3s ease-in-out; transition: all .3s ease-in-out; -webkit-transition-delay: .3s; -moz-transition-delay: .3s; -o-transition-delay: .3s; -ms-transition-delay: .3s; transition-delay: .3s; } #page_map #tabs .make_transist { -webkit-transition: all .3s ease-in-out; -moz-transition: all .3s ease-in-out; -o-transition: all .3s ease-in-out; -ms-transition: all .3s ease-in-out; transition: all .3s ease-in-out; } #page_map #tabs .hidescale { z-index:980px; display:none; } #page_map #tabs .showscale { z-index:990px; display:block; -webkit-transform: scale(1); -moz-transform: scale(1); -o-transform: scale(1); -ms-transform: scale(1); transform: scale(1); -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=100)"; filter: alpha(opacity=100); opacity: 1; -webkit-transition-delay: .3s; -moz-transition-delay: .3s; -o-transition-delay: .3s; -ms-transition-delay: .3s; transition-delay: .3s; } #page_map #tabs .hideleft { -webkit-transform: translateX(-100%); -moz-transform: translateX(-100%); -o-transform: translateX(-100%); -ms-transform: translateX(-100%); transform: translateX(-100%); -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=0)"; filter: alpha(opacity=0); opacity: 0; } #page_map #tabs .showleft { -webkit-transform: translateX(0px); -moz-transform: translateX(0px); -o-transform: translateX(0px); -ms-transform: translateX(0px); transform: translateX(0px); -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=100)"; filter: alpha(opacity=100); opacity: 1; -webkit-transition-delay: .3s; -moz-transition-delay: .3s; -o-transition-delay: .3s; -ms-transition-delay: .3s; transition-delay: .3s; } #page_map #tabs .hidescaleup { -webkit-transform: scale(1.1); -moz-transform: scale(1.1); -o-transform: scale(1.1); -ms-transform: scale(1.1); transform: scale(1.1); -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=0)"; filter: alpha(opacity=0); opacity: 0; } #page_map #tabs .showscaleup { -webkit-transform: scale(1); -moz-transform: scale(1); -o-transform: scale(1); -ms-transform: scale(1); transform: scale(1); -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=100)"; filter: alpha(opacity=100); opacity: 1; -webkit-transition-delay: .3s; -moz-transition-delay: .3s; -o-transition-delay: .3s; -ms-transition-delay: .3s; transition-delay: .3s; } #page_map #tabs .hideflip { -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=0)"; filter: alpha(opacity=0); opacity: 0; -webkit-transform: rotatey(-90deg) scale(1.1); -moz-transform: rotatey(-90deg) scale(1.1); -o-transform: rotatey(-90deg) scale(1.1); -ms-transform: rotatey(-90deg) scale(1.1); transform: rotatey(-90deg) scale(1.1); -webkit-transform-origin: 50% 50%; -moz-transform-origin: 50% 50%; -o-transform-origin: 50% 50%; -ms-transform-origin: 50% 50%; transform-origin: 50% 50%; } #page_map #tabs .showflip { -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=100)"; filter: alpha(opacity=100); opacity: 1; -webkit-transition-delay: .3s; -moz-transition-delay: .3s; -o-transition-delay: .3s; -ms-transition-delay: .3s; transition-delay: .3s; -webkit-transform: rotatey(0deg) scale(1); -moz-transform: rotatey(0deg) scale(1); -o-transform: rotatey(0deg) scale(1); -ms-transform: rotatey(0deg) scale(1); transform: rotatey(0deg) scale(1); -webkit-transform-origin: 50% 50%; -moz-transform-origin: 50% 50%; -o-transform-origin: 50% 50%; -ms-transform-origin: 50% 50%; transform-origin: 50% 50%; } #page_map #tabs .tabulous_active { background:#f2f5f3 !important; color:#231815 !important; border-top:solid 7px #171c61; } #page_map #tabs .tabulousclear { display:block; clear:both; } */ #page_map table {} #page_map th { padding:.2em 1em; width:15%; } #page_map td { padding:.2em 1em; } #page_map td span { display:inline-block; margin-left:1em; color:#999; } #page_map td span:before { content:'<'; } #page_map td span:after { content:'>'; } #page_map .booth_list_wrapper { margin:60px 120px; } /* ブースタイプ */ .type-A span { display:block; width:100%; background:#DB2C7D; color:#fff; padding:.2em 0; } .type-B span { display:block; width:100%; background:#DB2C7D; color:#fff; padding:.2em 0; } .type-C span { display:block; width:100%; background:#DB2C7D; color:#fff; padding:.2em 0; } .type-D span { display:block; width:100%; background:#DB2C7D; color:#fff; padding:.2em 0; } .type-E span { display:block; width:100%; background:#796baf; color:#fff; padding:.2em 0; } .type-K span { display:block; width:100%; background:#3AB9BD; color:#fff; padding:.2em 0; } .type-S span { display:block; width:100%; background:#7DBD38; color:#fff; padding:.2em 0; } .type-brand span { display:block; width:100%; background:#e73278; color:#fff; padding:.2em 0; } .type-parts span { display:block; width:100%; background:#DB2C7D; color:#fff; padding:.2em 0; } .type-shop span { display:block; width:100%; background:#8ec43e; color:#fff; padding:.2em 0; } .type-variety span { display:block; width:100%; background:#37b9bc; color:#fff; padding:.2em 0; } /* 索引見出し */ .midashi_index { display:block; border-bottom:solid 1px #333; margin:0px 0 10px 0; } table + .midashi_index { margin:20px 0 10px 0; } /* -------------------------------------* 出展社リスト * -------------------------------------*/ #page_exhibition_list ul.p4s2 { display:flex; flex-wrap:wrap; justify-content:center; width:100%; } #page_exhibition_list ul.p4s2 li { width:25%; padding:0 15px 40px 15px; text-align:center; } #page_exhibition_list ul.p4s2 li img { /*border:solid 1px #ccc;*/ width:90%; } #page_exhibition_list ul.p4s2 a { /*color:#333;*/ text-align:center; } #page_exhibition_list ul.p4s2 a .exhibition_name span { font-weight:bold; } #page_exhibition_list ul.p4s2 a .exhibition_kana span { font-size:10px; } #page_exhibition_list .exhibition_kana span { font-size:10px; } /* #page_exhibition_list h1.h_main { padding:22px 0 14px 0; } */ /* #brand h1.h_main { border-top-color:#796baf; border-bottom-color:#ea5504; } #parts h1.h_main { border-top-color:#00903b; border-bottom-color:#00a0e9; } #shop h1.h_main { border-top-color:#f39800; border-bottom-color:#00903b; } #event h1.h_main { border-top-color:#00a0e9; border-bottom-color:#e50b72; } #tourism h1.h_main { border-top-color:#621d87; border-bottom-color:#e50b72; } #service h1.h_main { border-top-color:#fabe00; border-bottom-color:#eb6ea5; } */ #page_exhibition_list section { padding-bottom:60px; } #exhibition_list_menu { padding:60px 0; } #exhibition_list_menu ul { display:flex; flex-wrap:wrap; justify-content:space-between; width:100%; box-sizing:border-box; } #exhibition_list_menu .menu_p2s1 li { width:50%; padding:0px 80px; } #exhibition_list_menu .menu_p3s1 li { width:33.3333333%; padding:0px 80px; } #exhibition_list_menu .menu_p4s2 li { width:25%; padding:0px 26px; margin-top:30px; } #exhibition_list_menu li a { display:block; border-left:#efefef solid 3px; border-right:#efefef solid 3px; font-size:22px; font-weight:bold; text-align:center; color:#f8b500; padding:0; margin:0; } #exhibition_list_menu li a:hover { color:#f8b500; border-color:#f8b500; } /* #exhibition_list_menu li a.h_menu_brand { border-left-color:#796baf; border-right-color:#ea5504; } #exhibition_list_menu li a.h_menu_parts { border-left-color:#00903b; border-right-color:#00a0e9; } #exhibition_list_menu li a.h_menu_shop { border-left-color:#f39800; border-right-color:#00903b; } #exhibition_list_menu li a.h_menu_event { border-left-color:#00a0e9; border-right-color:#e50b72; } #exhibition_list_menu li a.h_menu_tourism { border-left-color:#621d87; border-right-color:#e50b72; } #exhibition_list_menu li a.h_menu_service { border-left-color:#fabe00; border-right-color:#eb6ea5; } */ /* -------------------------------------* 展示パーツ＆完成車リスト * -------------------------------------*/ #page_item_list h1.h_main { border-top-color:#796baf; border-bottom-color:#2bac39; } #page_item_list ul.p4s2 { display:flex; flex-wrap:wrap; justify-content:center; width:100%; } #page_item_list ul.p4s2 li { position:relative; width:23%; padding:10px; background:none; /*border-top:solid 2px #9fa0a0;*/ border-bottom:solid 2px #f8b500; margin:1%; } #page_item_list ul.p4s2 li img.main { /*border:solid 1px #ccc;*/ } #page_item_list ul.p4s2 a { color:#333; text-align:center; } #page_item_list ul.p4s2 p { font-weight:bold; text-align:left; font-size:12px; margin:10px 0; min-height:4em; word-break:break-all; } #page_item_list ul.p4s2 p span { font-weight:normal; color:#1E90FF; display:block; } #page_item_list ul.p4s2 p.sale { padding-right:30px; } #page_item_list .item_image_block { position:relative; } #page_item_list .exp_block { position:relative; } #page_item_list img.mk_testrun { position:absolute; bottom:10px; left:0; width:50px; z-index:990; } #page_item_list img.mk_sale { position:absolute; top:3px; right:0; width:22px; } /* -------------------------------------* 試乗車リスト * -------------------------------------*/ #about_testrun .page_body { padding-bottom:120px; } #about_testrun h1.h_main { border-top-color:#00a0e9; border-bottom-color:#796baf; } #about_testrun p.main_catch { padding:0 180px 40px 180px; text-align:center; } #about_testrun .testrun_guide { padding:0px 140px; } #about_testrun .testrun_guide a { text-decoration:none; display:block; padding:4px; background-color:#c30d23; } #about_testrun .testrun_guide a,#about_testrun .testrun_guide a:hover { /* background-image:url(../images/triangle_tl.svg),url(../images/triangle_tr.svg),url(../images/triangle_bl.svg),url(../images/triangle_br.svg); */ background-size:8px,8px,8px,8px; background-position:top left,top right,bottom left,bottom right; background-repeat:no-repeat,no-repeat,no-repeat,no-repeat; border-radius:5px; } #about_testrun .testrun_guide a:hover { color:#fff; background-color:#ff0000; } #about_testrun .testrun_guide a .a_wrapper { border:solid 1px #D89278; color:#fff; font-size:18px; text-align:center; padding:20px 0; border-radius:5px; } #about_testrun .testrun_guide p { padding:10px 0; color:#0059A6; font-size:12px; text-align:center; } #testrun_list .page_body { padding-bottom:10px; } /* #testrun_list h1.page_ttl { border-left:solid 4px #00913a; border-right:solid 4px #f8b62d; } */ #testrun_list .icon_guide { background:#f2f5f3; } #testrun_list .icon_guide .wrapper { padding:10px 60px 30px 60px; } #testrun_list .icon_guide li { width:50%; float:left; padding:0 30px; position:relative; } #testrun_list .icon_guide img { width:50px; position:absolute; top:15px; left:0; } #testrun_list .icon_guide li p { padding-left:40px; } #testrun_list ul.p4s2 { display:flex; flex-wrap:wrap; justify-content:center; width:100%; } #testrun_list ul.p4s2 li { position:relative; width:23%; padding:10px; background:none; /*border-top:solid 2px #9fa0a0;*/ border-bottom:solid 2px #f8b500; margin:1%; } #testrun_list ul.p4s2 li img.main { /*border:solid 1px #ccc;*/ } #testrun_list ul.p4s2 a { color:#333; text-align:center; } #testrun_list ul.p4s2 p { font-weight:bold; text-align:left; font-size:12px; margin:10px 0; min-height:6em; word-break:break-all; } #testrun_list ul.p4s2 p span { font-weight:normal; color:#1E90FF; display:block; } #testrun_list ul.p4s2 p.sale { padding-left:35px; } #testrun_list .item_image_block { position:relative; } #testrun_list .exp_block { position:relative; } #testrun_list .blk_icons { position:absolute; top:0px; left:0; width:22px; z-index:990; } #testrun_list .blk_icons img.mk_sale { position:relative; width:22px; margin-bottom:8px; } #testrun_list .blk_icons img.mk_woman { position:relative; width:22px; margin-bottom:8px; } #testrun_list .blk_icons img.mk_small { position:relative; width:22px; margin-bottom:8px; } /* -------------------------------------* 試乗手順のご案内 * -------------------------------------*/ #note_testrun h1.h_main { border-top-color:#00a0e9; border-bottom-color:#796baf; } #note_testrun .attention { padding:0 150px; } #note_testrun .attention .ttl { background:#f8b500; text-align:center; } #note_testrun .attention .ttl span { display:inline-block; width:260px; padding:1px 0; background:#fff; color:#e60012; font-size:24px; } #note_testrun .attention p.list { color:#e60012; font-size:16px; } #note_testrun ul.p4s2 { display:flex; flex-wrap:wrap; justify-content:center; width:100%; margin:30px 0; } #note_testrun ul.p4s2 li { position:relative; width:25%; padding:10px 20px; } #flow_testrun { padding:80px 40px 0 40px; } #flow_testrun .flow_wrapper { padding:0 20px; } #flow_testrun h1 { position:relative; font-size:22px; display:inline-block; padding:0 0 .5em 0; margin-bottom:20px; } #flow_testrun h1:after { content:""; position:absolute; bottom:0; left:0; background-color:#f8b500; width:30px; height:3px; } #flow_testrun ul.p4s2 { display:flex; flex-wrap:wrap; justify-content:center; width:100%; margin:30px 0; } #flow_testrun ul.p4s2 li { position:relative; width:25%; padding:15px; } #flow_testrun table { font-size:16px; } #flow_testrun th { width:200px; padding:40px 40px 40px 0; vertical-align:top; } #flow_testrun th span { display:none; } #flow_testrun th img { width:120px; padding-right:20px; } #flow_testrun th img span { } #flow_testrun td { padding:40px 0; vertical-align:middle; } #flow_testrun td h2 { padding:0 0 10px 0; font-size:20px; font-weight:bold; } #flow_testrun .blk_list { padding:20px 0 0 0; } #flow_testrun .seiyaku { background:#f2f5f3; padding:20px 20px; margin:10px 0 0 0; } #flow_testrun p.list { color:#e60012; font-size:14px; } #flow_testrun .blk_btn { padding:40px 0 0px 0; } #flow_testrun .blk_btn a { display:block; font-size:18px; width:240px; padding:15px 0; text-align:center; margin:0 auto; } #flow_testrun .blk_btn a.btn_entry { background:#e60012; color:#fff; border-radius:5px; } #flow_testrun .blk_btn a.btn_pdf { background:#000; color:#fff; font-size:14px; padding:10px 0; border-radius:5px; } #flow_testrun .blk_btn a.btn_list { background:#00a0e9; color:#fff; border-radius:5px; } #flow_testrun .blk_btn a:hover { text-decoration:none; background:#ccc; } #flow_testrun .blk_btn .entry p { padding:20px 0; text-align:left; font-size:14px;} #flow_testrun .blk_btn .pdf_entry { margin:10px 0px 0 0px; padding:30px 0 0 0; border-top:solid 1px #ccc; } #flow_testrun .blk_btn .pdf_entry p { padding:20px 0; text-align:center; font-size:14px; } #flow_testrun .blk_btn p.keiko { font-size:14px; padding:0; margin:20px 0; text-align:center; background:linear-gradient(transparent 0, #ffff66 0); } #attention_testrun { padding:80px 0 0 0; } #attention_testrun .blk_attention { padding:0px 40px 0 80px; } #attention_testrun h1 { position:relative; font-size:22px; display:inline-block; padding:0 0 .5em 0; margin-bottom:20px; } #attention_testrun h1:after { content:""; position:absolute; bottom:0; left:0; background-color:#f8b500; width:30px; height:3px; } #attention_testrun h2 { color:#e60012; font-size:18px; } #attention_testrun table { font-size:16px; } #attention_testrun th { width:140px; padding:20px 40px 20px 0; vertical-align:top; } #attention_testrun td { padding:1.6em 0 0 0; vertical-align:top; font-size:14px; } #attention_testrun td span { color:#e60012; } /* -------------------------------------* 試乗車の詳細情報 * -------------------------------------*/ #page_item_list .page_ttl { /* border-left:solid 4px #621d87; border-right:solid 4px #ea5504; */ } #item_detail { position:relative; min-height:500px; } #item_detail #detail_info { padding-left:440px; } #item_detail #detail_info h1 { font-size:28px; font-weight:bold; line-height:1.3em; letter-spacing:.1em; } #item_detail #detail_info .brandname { font-size:18px; } #item_detail #detail_info .brandname span { font-size:12px; display:inline-block; padding-left:.5em; color:#999; } #item_detail #detail_image { position:absolute; width:400px; height:254px; top:0; left:0; } #item_detail #detail_image img.main { border:solid 1px #efefef; } #item_detail #detail_image img.mk_testrun { position:absolute; /*top:210px;*/ bottom:20px; left:0; width:90px; z-index:990; } #item_detail #ask_info { position:absolute; width:400px; top:330px; left:0; word-wrap: break-word;} #item_detail #ask_info .ask_title { width:7em; background:#999; color:#fff; text-align:center; margin-bottom:.5em; } #item_detail #ask_info ul { list-style:none; } #item_detail #ask_info li.logo { float:left; width:40%; } #item_detail #ask_info li.logo img { /*border:solid 1px #ccc;*/ } #item_detail #ask_info li.ask { float:left; width:55%; font-size:12px; line-height:1.4em; padding-left:5%; } #item_detail #detail_info h2 { font-size: 20px; color: #FF9A02; } #item_detail #detail_info .ttl { font-weight:bold; } #item_detail #detail_info p { line-height: 1.8em; font-size: 14px; /*color: #0058A9;*/ } #item_detail .testrun_note { border:solid 6px #FFE57A; padding: 10px; margin: 10px 0 10px 0; } #item_detail .testrun_note .ttl2 { font-weight:bold; } #item_detail .sale_note { border:solid 6px #FFE57A; padding: 10px; margin: 10px 0 10px 0; } #item_detail .sale_note .ttl { font-weight:bold; } /* 出展リスト */ #product_list h1 { /* border-top:solid 5px #eb6ea5; border-bottom:solid 5px #00a0e9; */ font-size:22px; font-weight:bold; padding:.2em 0 .5em 0; position:relative; text-align:center; } #product_list h1:after { content:""; position:absolute; bottom:0; left:calc(50% - 15px); background-color:#f8b500; width:30px; height:3px; } #product_list ul.p4s2 { display:flex; flex-wrap:wrap; justify-content:left; width:100%; margin-top:30px; } #product_list ul.p4s2 li { position:relative; width:23%; padding:10px; background:none; /*border-top:solid 2px #f8b500;*/ border-bottom:solid 2px #f8b500; margin:1%; } #product_list ul.p4s2 li img.main { border:solid 1px #ccc; } #product_list ul.p4s2 a { color:#333; text-align:center; } #product_list ul.p4s2 p { font-weight:bold; text-align:left; font-size:12px; margin:10px 0; min-height:4em; } #product_list ul.p4s2 p span { font-weight:normal; } #product_list ul.p4s2 p.sale { padding-right:30px; } #product_list .item_image_block { position:relative; } #product_list .exp_block { position:relative; } #product_list img.mk_testrun { position:absolute; bottom:10px; left:0; width:50px; z-index:990; } #product_list img.mk_sale { position:absolute; top:3px; right:0; width:22px; } /* -------------------------------------* 出展社の詳細情報 * -------------------------------------*/ #exhibition_head table { width:760px; margin:0 auto 10px auto; display:flex; border-bottom:solid 1px #ccc; } #exhibition_head table th { width:360px; height:180px; vertical-align:middle; } #exhibition_head table th h1 { font-size:22px; font-weight:bold; position:relative; padding:1em 0 .5em 0; } #exhibition_head table th h1 span { display:block; font-size:18px; } #exhibition_head table th h1:after { content:""; position:absolute; bottom:0; left:calc(50% - 15px); background-color:#f8b500; width:30px; height:3px; } #exhibition_head table td { padding-left:40px; vertical-align:middle; } #exhibition_head table td ul { width:360px; margin:0 auto; } #exhibition_head table td ul li { width:140px; float:left; text-align:center; font-weight:bold; } #exhibition_head table td ul li + li{ margin-left:15px; } #exhibition_head .label { height:26px; } #exhibition_head .booth_wrapper { display:table; } #exhibition_head .booth_number { width:140px; height:60px; margin:5px auto 20px auto; border:solid 4px #666; font-size:22px; text-align:center; display:table-cell; vertical-align:middle; background:#fff; } #exhibition_head .guide_booth { width:140px; height:60px; margin:0 auto 0 auto; border:solid 4px #F3B225; font-size:18px; text-align:center; display:table-cell; vertical-align:middle; background:#F3B225; color:#fff; } #exhibition_head .guide_booth span { font-size:16px; display:block; margin-top:-.5em; } #exhibition_head .guide_booth:hover { border:solid 4px #FF3366; background:#FF3366; color:#fff; } #exhibition_head .booth_wrapper a { text-decoration:none; } #exhibition_head .booth_wrapper a:hover{ text-decoration:none; } #detail_info { padding:0; } #exhibition_detail ul { width:760px; margin:0 auto; } #exhibition_detail ul li { width:360px; float:left; } #exhibition_detail ul li + li { float:right; } #exhibition_ask { margin-top:30px; } #exhibition_ask h1 { text-align:center; font-weight:bold; position:relative; padding:1em 0; } #exhibition_ask h1:after { content:""; position:absolute; bottom:0; left:calc(50% - 15px); background-color:#f8b500; width:30px; height:3px; } #exhibition_ask #ask_info { /*background:#f2f5f3;*/ padding:30px 0; word-wrap:break-word; } #exhibition_ask #ask_info ul { width:760px; margin:0 auto; } #exhibition_ask #ask_info ul li { width:360px; float:left; text-align:right; } #exhibition_ask #ask_info ul li + li { float:right; text-align:left; padding:1.5em 0 0 0; } #exhibition_ask #ask_info ul li img { width:180px; } #page_exhibition .page_body { padding:30px 60px 30px 60px; } #page_exhibition #product_list { padding:30px 0; border-top:solid 1px #ccc; } #page_item_list #product_list { padding:30px 0; border-top:solid 1px #ccc; margin-top:60px; } /* #page_exhibition #product_list h1 { border-top:solid 5px #920783; border-bottom:solid 5px #00913a; } */ div.bike_type { margin: 10px 0; } div.bike_type div.icon { display: inline-block; padding: 1px 6px; font-size: 10px; background: #000; color: #fff; border-radius: 10px;} div.bike_type div.RB { background: #ff0000; color: #fff; } div.bike_type div.TB { background: #FFD464; color: #fff; } div.bike_type div.TT { background: #F26964; color: #fff; } div.bike_type div.TA { background: #1253A4; color: #fff; } div.bike_type div.FS { background: #2FCDB4; color: #fff; } div.bike_type div.HT { background: #0E7AC4; color: #fff; } div.bike_type div.CB { background: #FBA848; color: #fff; } div.bike_type div.CM { background: #F27398; color: #fff; } div.bike_type div.SS { background: #40AAEF; color: #fff; } div.bike_type div.SP { background: #8DCF3F; color: #fff; } div.bike_type div.WB { background: #93B8CA; color: #fff; } div.bike_type div.MB { background: #79D1B0; color: #fff; } div.bike_type div.FB { background: #F58E7E; color: #fff; } div.bike_type div.BX { background: #737373; color: #fff; } div.bike_type div.KB { background: #A18E5C; color: #fff; }