/* ------------------------------- トップコンテンツ ------------------------------- */ .home .main #container.innerBox { box-shadow: 0px 0px 4px rgb(0 0 0 / 10%); margin-top: 20px; margin-bottom: 30px; position: relative; background-color: #E83429; background-image: url(https://running-event.jp/hattori-miles/2023/wp-content/uploads/2022/07/top_bg.png); background-repeat: repeat; background-size: contain; padding: 25px 20px; box-sizing: border-box; } .home .content { position: relative; background: #fff; padding: 0 25px 20px; border-radius: 40px; margin: 0; } @media (max-width:767px) { .home .main #container.innerBox { margin-top: 10px; padding: 20px 10px !important; } .home .content { position: relative; background: #fff; padding: 0 10px 20px !important; border-radius: 20px; } } .top_contents { position: relative; background: #fff; padding: 0; font-family: "游明朝", YuMincho, "Hiragino Mincho ProN W3", "ヒラギノ明朝 ProN W3", "Hiragino Mincho ProN", "HG明朝E", "MS P明朝", "MS 明朝", serif; border-radius: 40px; } .top_contents:before { content: url(https://running-event.jp/hattori-miles/2023/wp-content/uploads/2023/07/img-runners01.png); position: absolute; bottom: -130px; right: -60px; z-index: 1; transform: scale(0.8); } .top_contents h4, .top_contents h2 { font-family: "游明朝", YuMincho, "Hiragino Mincho ProN W3", "ヒラギノ明朝 ProN W3", "Hiragino Mincho ProN", "HG明朝E", "MS P明朝", "MS 明朝", serif; font-size: 130% !important; } .top_contents .colwrap_main { padding: 0 30px; align-items: center; } .top_contents .colwrap_main p { font-size: 1.15em; margin-bottom: 0; } .top_contents .colwrap_main .txt { width: 60%; } .top_contents .colwrap_main .img { width: 35%; margin: 0 3%; box-sizing: border-box; } .top_contents .topCatch { background-image: url(https://running-event.jp/hattori-miles/2023/wp-content/uploads/2022/07/top_lead_bg.png); background-repeat: no-repeat; background-size: auto; } .top_contents .topCatch .colwrap_inner { justify-content: center; align-items: center; } .top_contents .topCatch .colwrap_inner figure { width: 70%; margin: 2% 0 0 3%; } .top_contents .topCatch .colwrap_inner .txt { font-size: 1.15em; } .top_contents .topCatch .colwrap_inner .tl { font-size: 2.3em; color: #fff; font-weight: bold; padding: 3px 0 0 60px; margin-bottom: 50px; } .top_contents .topCatch .colwrap_inner .btn a { position: relative; border: solid 1px #ec8e7d; display: inline-block; padding: 20px 20px 18px 70px; width: 380px; box-sizing: border-box; color: #e26663; background: #fff; text-decoration: none; font-size: 1.2em; font-weight: bold; } .top_contents .topCatch .colwrap_inner .btn a:before { content: ''; background-image: url(https://running-event.jp/hattori-miles/2023/wp-content/uploads/2023/07/icn-torii.png); position: absolute; top: 9px; left: 8px; width: 45px; height: 39px; } .top_contents .topCatch .colwrap_inner .btn a .fa-chevron-right:before { content: "\f054"; position: absolute; right: 10px; top: 22px; } .top_contents .topCatch .colwrap_inner .btn a:hover { border: solid 1px #ec8e7d; background: #FFF; color: #EA5455; transition:0.5s; } .top_contents .colwrap_top_entry { justify-content: center; align-items: center; } .top_contents .colwrap_top_entry div { width: 45%; } .top_contents .colwrap_top_entry div .btn { font-size: 1.5em; width: 90%; } .top_contents .syumoku { width: 75%; margin: 50px 0; } @media (max-width: 659px) { .content table.sp-tr-mb0 tbody tr { margin-bottom: 0px !important; } } @media (max-width:767px) { .top_contents { /*padding: 0 10px 50px;*/ border-radius: 15px; } .top_contents:before { content: url(https://running-event.jp/hattori-miles/2023/wp-content/uploads/2023/07/img-runners01.png); position: absolute; bottom: -105px; right: -120px; z-index: 1; transform: scale(0.5); display: none; } .top_contents .topCatch { background-size: contain; } .content [class^=colwrap_] { flex-wrap: wrap; } .top_contents .topCatch .colwrap_inner .txt { font-size: 1.15em; padding: 10px; } .top_contents .topCatch .colwrap_inner figure { width: 90%; margin: 0; } .top_contents .topCatch .colwrap_inner .tl { font-size: 1.65em; color: #fff; font-weight: bold; padding: 5px 0 0 25px; margin-bottom: 30px; } .top_contents .topCatch .colwrap_inner .btn a { position: relative; border: solid 1px #ec8e7d; display: inline-block; padding: 20px 20px 18px 60px; width: 100%; box-sizing: border-box; color: #e26663; background: #fff; text-decoration: none; font-size: 1em; font-weight: bold; } .top_contents .topCatch .colwrap_inner .btn a:before { content: ''; background-image: url(https://running-event.jp/hattori-miles/2023/wp-content/uploads/2023/07/icn-torii.png); position: absolute; top: 9px; left: 8px; width: 45px; height: 39px; } .top_contents .topCatch .colwrap_inner .btn a .fa-chevron-right:before { content: "\f054"; position: absolute; right: 10px; top: 22px; } .top_contents .topCatch .colwrap_inner .btn a:hover { border: solid 1px #ec8e7d; background: #FFF; color: #EA5455; transition:0.5s; } .top_contents .colwrap_top_entry { display: block; } .top_contents .colwrap_top_entry div .btn { font-size: 1.3em; } .top_contents .colwrap_main { padding: 0 10px !important; margin-bottom: 50px !important; } .top_contents .colwrap_main { padding: 0 20px; margin-bottom: 50px; align-items: center; } .top_contents .column-reverse { flex-direction: column-reverse; } .top_contents .colwrap_main .img { margin: 0 !important; } .top_contents .colwrap_main .txt { margin: 5px 0; } .top_contents .syumoku { width: 100%; margin: 40px 0 20px; } } @media screen and (min-width:768px) and (max-width:1024px){ .top_contents .pop_text { margin: 3.5% 2% 2% !important; } .top_contents .colwrap_main { padding: 0 20px; align-items: center; margin-bottom: 50px; } .top_contents:before { content: url(https://running-event.jp/hattori-miles/2023/wp-content/uploads/2023/07/img-runners01.png); position: absolute; bottom: -100px; right: -90px; z-index: 1; transform: scale(0.6); } } .top_contents .pop_text { position: relative; display: block; margin: 8% 5% 5%; font-size: 2em; line-height: 1.2; font-weight: bold; text-align: center; color: #c00e12; } /*.width-50 { width: 50%; } .fs135em { font-size: 1.35em !important; }*/ .top_contents .pop_text:before, .top_contents .pop_text:after { content: ''; position: absolute; top: 50%; display: inline-block; width: 38px; height: 2px; background-color: #c00e12; } .top_contents .pop_text:before { -webkit-transform: rotate(60deg); transform: rotate(60deg); } .top_contents .pop_text:after { -webkit-transform: rotate(-60deg); transform: rotate(-60deg); } .top_contents .pop_text:before { left:0; } .top_contents .pop_text:after { right: 0; } @media (max-width: 768px){ .top_contents .pop_text { font-size: 1.25em !important; line-height: 1.2em !important; margin: 0 0 1.5% !important; } /*.width-50 { width: 100%; margin: 0 auto 15px !important; }*/ .top_contents .pop_text:after { right: -9px; } .top_contents .pop_text:before { left: -9px; } } #container.innerBox { box-shadow: none; } @media (min-width: 970px){ .home .container { padding: 0; } } .content .colwrap_top_entry { justify-content: center; align-items: center; } .content .colwrap_top_entry div { width: 45%; } .content .colwrap_top_entry div .btn { font-size: 1.5em; width: 90%; } @media (max-width:768px) { .content .colwrap_top_entry { display: block; } .content .colwrap_top_entry div .btn { font-size: 1.3em; } } /*-----トップページリンクバナーエリア-----*/ .content .colwrap_top_linkbanner{ margin-top:50px; } .content .colwrap_top_linkbanner div:nth-child(odd){ width:35%; margin-right:5%; } .content .colwrap_top_linkbanner div:nth-child(even){ width:35%; margin-left:5%; } @media (max-width:767px){ .content .colwrap_top_linkbanner{ margin-top:0; margin-bottom:10px; } .content .colwrap_top_linkbanner div:nth-child(odd), .content .colwrap_top_linkbanner div:nth-child(even){ width:75% !important; margin:0 auto 20px; } } /*-----足祭りリンクボタン-----*/ .btn_footfes{ display: inline-block; background-color:#fff; border:1px solid #d9121a; box-sizing: border-box; border-radius:3px; margin-top: 5px; } .btn_footfes a{ display:block; padding:3px 6px 1px; text-decoration: none; color:#d9121a; border-bottom:none; } .btn_footfes:hover, .btn_footfes a:hover{ opacity:0.7; } /* ------------------------------- 背景 ------------------------------- */ #wrap { background-image: url(https://running-event.jp/hattori-miles/2023/wp-content/uploads/2023/07/bg-mian-full.png?); background-repeat: repeat; background-position: top center; background-size: auto; background-color:#2f2047; } @media screen and (max-width: 1219px) { #wrap { background-size: 130%; } } #topMainBnr{ background-color:#2f2047; } #wrap #gMenu .menu > li a{ border-style: solid; border-width: 1px; } /* ------------------------------- reset ------------------------------- */ @media (max-width: 768px){ .content.wide { width: auto; } } p,th,td,ul li,dt,dd{ line-height:155% !important; font-size:14px; color:#222; } @media screen and (min-width:415px){ p,th,td,li,dt,dd{ line-height:170% !important; } } .content p{ padding: 0px; } .content dt { margin-bottom: 0; } .content dd { margin: 0px 0px 20px; } #panList { margin: 8px 0 5px; } #panList *{ color: #fff !important; } .iconBox { background-color: #c00; } a { color: #c00; border-bottom: dotted 1px; text-decoration: none; } .content .infoList ul li .infoTxt a { border-bottom: none; } #siteBottom a { border-bottom: none; } /* ------------------------------- ヘッダー設定 ------------------------------- */ #header #site-title a img, .no-margin #header #site-title a img{ width: 100%; max-height: 100%; min-height: auto; display: block; margin: auto; } .no-margin #header .innerBox { padding: 10px 0; } /* ------------------------------- 凡用 ------------------------------- */ .pt0 {padding-top: 0 !important;} .pb0 {padding-bottom: 0 !important;} .mt0 {margin-top: 0 !important;} .mt5 {margin-top: 5px !important;} .mt10 {margin-top: 10px !important;} .mt15 {margin-top: 15px !important;} .mt20 {margin-top: 20px !important;} .mt30 {margin-top: 30px !important;} .mt40 {margin-top: 40px !important;} .mt50{margin-top:50px !important;} .mb0 {margin-bottom: 0 !important;} .mb5 {margin-bottom: 5px !important;} .mb10 {margin-bottom: 10px !important;} .mb15 {margin-bottom: 15px !important;} .mb20 {margin-bottom: 20px !important;} .mb30 {margin-bottom: 30px !important;} .mb40 {margin-bottom: 40px !important;} .mb50 {margin-bottom: 50px !important;} .ml0 {margin-left: 0 !important;} .ml15 {margin-left: 15px !important;} .ml25 {margin-left: 25px !important;} .pd0 {padding: 0 !important } .disp-ilb{display:inline-block!important;} .fw-b {font-weight: bold !important;} .fw-n {font-weight: normal !important;} .s_color{color:#474747 !important;} .fs085em {font-size: 85%;} .fs09em {font-size: 90%;} .fs11em {font-size: 110%;} .fs12em {font-size: 120%;} .fs13em {font-size: 130%;} .fs14em {font-size: 140%;} .fs15em {font-size: 150%;} @media (max-width: 414px){ .sp_fs085em {font-size: 85% !important;} .sp_fs09em {font-size: 90% !important;} .sp_fs11em {font-size: 110% !important;} .sp_fs12em {font-size: 120% !important;} .sp_fs13em {font-size: 130% !important;} .sp_fs14em {font-size: 140% !important;} .sp_fs15em {font-size: 150% !important;} } .txt-c {text-align: center !important;} .txt-r {text-align: right !important;} .txt-l {text-align: left !important;} .fl-r { float: right; !important;} .fl-l { float: left; !important;} @media (max-width:767px) { .fl-r,.fl-l { float: none; !important;} }} .blue{color:#0069c2 !important;} .bg_blue{background:#0069c2 !important;} .water{color:#0ba4f5 !important;} .bg_water{background:#0ba4f5 !important;} .yellow{color:#fff500 !important;} .bg_yellow{background:#fff500 !important;} .red{color:#c00 !important;} .s_red{color:#f00 !important;} .marker { background: linear-gradient(transparent 50%, yellow 50%); display: inline; } .sp {display:none;} .pc {display:block;} @media (max-width: 659px){ .sp {display:block;} .pc {display:none;} } /*--flex--*/ .content [class^=colwrap_]{ display:flex; /*flex-wrap:wrap;*/ justify-content:center; align-items: flex-start; } @media screen and (max-width:767px){ .content [class^=colwrap_] div{ width: 100% !important; margin:15px auto; } } .flex-center { display: flex; justify-content: center; margin: 0px 0px 20px 0; } @media (max-width:767px) { .flex-center { display: block !important; margin-left: 0 !important; } } .clearfix:before, .clearfix:after { content: ""; display: table; clear: both; } /*google map&Youtube*/ .emb { position: relative; height: 0; padding: 30px 0 56.25%; overflow: hidden; } .emb iframe { position: absolute; top: 0; left: 0; width: 100%; height: 100%; } /*.google-maps { position: relative; padding-bottom: 75%; height: 0; overflow: hidden; } .google-maps iframe { position: absolute; top: 0; left: 0; width: 100% !important; height: 100% !important; border:1px !important; }*/ /* ------------------------------- リスト ------------------------------- */ .content ul[class*="-list"], .content ul[class*="-list"] > li { list-style-type: none !important; } .content ul[class*="-list"] > li { margin-bottom: 5px; position: relative; /*padding-left: 1.25rem;*/ padding-left: 1rem; } .content ul[class*="-list"] > li:before { position: absolute; left: 0; } .content ul.dot-list > li:before { content: "\0030FB"; font-weight: bold; } .content ul.reference-list { font-size: 95%; } .content ul.reference-list > li:before { content: "\00203B"; padding-right: 0.45rem; } /*dl-lists*/ .content dl[class*="dl-list"] { line-height: 1.5; margin-bottom: 0.5rem; } .content dl[class*="dl-list"] > dt, .content dl[class*="dl-list"] > dd { position: relative; /*padding: 0 0 0 1.5rem;*/ padding: 0 0 0 1.2rem; margin-bottom: 0.25rem; } .content dl[class*="dl-list"] > dd + dt { margin-top: 0.75rem; } .content dl[class*="dl-list"] > dt:before { position: absolute; top: 0; left: 0; padding-left: 0.25rem; } .content dl[class*="dl-list"] > dd:before { position: absolute; top: 0; left: 0; padding-left: 0.25rem; } .content dl.dl-list--dt__dot > dt:before { content: "\0030FB"; font-weight: bold; } .content dl.dl-list--dd__dot > dd:before { content: "\002022"; font-weight: bold; padding-left: 0.5rem; } .content dl.dl-list--dd__kome dd { font-size: 95%; } .content dl.dl-list--dd__kome > dd:before { content: "\00203B"; padding-left: 0.5rem; } .content dl.dl-list--dt__circle > dt:before { content: "●"; font-weight: bold; } .content .list_none_ul li{ list-style-type:none !important; text-indent:-1em; padding-left:0; } .content .caution_ul{ margin-left:5px; margin-bottom: 0; } .content .caution_ul li{ list-style-type: none; font-size:0.95em; padding-left: 1em; text-indent: -1em; margin-bottom:5px; } /* ------------------------------- リンクボタン ------------------------------- */ p.btn { width: 90%; max-width: 640px; margin-left: auto; margin-right: auto; background-color: #fff; border: 1px solid #c00; border-radius: 50px; color: #c00; font-weight: bold; text-align: center; } p.btn a { display: block; text-decoration: none; color: #c00; box-sizing: border-box; border-bottom: none; } p.btn:hover { background-color: #c00; transition:0.5s; } p.btn:hover a { color: #fff; } @media screen and (min-width: 641px) { p.btn { font-size: 1.5rem; } p.btn a { padding: 14px 10px 10px; font-size: 0.8em; } } @media screen and (max-width: 640px) { p.btn { font-size: 4vw; } p.btn a { padding: 5%; } } /*リンク無効*/ /*.btn-nolink { position: relative; } .btn-nolink, .btn-nolink a { pointer-events: none; cursor: default; position: relative; } .btn-nolink:before { content: ''; position: absolute; background: #000; display: block; width: 100%; height: 100%; opacity: 0.6; border-radius: 50px; } .btn-nolink:after { content: "準備中"; position: absolute; font-size: 17px; color: #fff; font-weight: bold; display: block; opacity: 1; left: 50%; top: 45%; text-align: center; transform: translate(-50%, -50%); -ms-transform: translate(-50%, -50%); -webkit-transform: translate(-50%, -50%); -moz-transform: translate(-50%, -50%); margin: auto; right: 0; bottom: 0; }*/ /* ------------------------------- エントリーボタン無効 ------------------------------- */ #entryBtn li.btn-nolink .first { margin-right: 0; } #entryBtn li.btn-nolink { position: relative; } @media (min-width: 661px) { #entryBtn li.btn-nolink { float: left; width: 48% !important; margin-right: 2% !important; } #entryBtn li.btn-nolink:nth-of-type(even) { float: right !important; margin-right: 0 !important; } } @media (max-width: 660px) { #entryBtn li.btn-nolink { display: block; margin-bottom: 4%; } } #entryBtn li.btn-nolink a:hover { opacity: 1; } #entryBtn li.btn-nolink a:before { content: ""; position: absolute; display: block; top: 0; right: 0; bottom: 0; left: 0; background: #000000; opacity: 0.55; border-radius: 5px; } #entryBtn li.comingsoon a:after { content: "準備中"; font-size: 140%; color: white; /*font-weight: bold;*/ letter-spacing: 0.25em; padding-left: 0.125em; position: absolute; display: block; opacity: 1; left: 50%; top: 53%; transform: translate(-50%, -50%); -ms-transform: translate(-50%, -50%); -webkit-transform: translate(-50%, -50%); -moz-transform: translate(-50%, -50%); } #entryBtn li.end a:after { content: "エントリー受付終了"; font-size: 130%; color: white; font-weight: bold; letter-spacing: 0.25em; padding-left: 0.125em; position: absolute; display: block; opacity: 1; left: 50%; top: 50%; transform: translate(-50%, -50%); -ms-transform: translate(-50%, -50%); -webkit-transform: translate(-50%, -50%); -moz-transform: translate(-50%, -50%); width: 100%; text-align: center; } #entryBtn li.btn-nolink a { pointer-events: none; cursor: default; } #entryBtn li.btn-nolink a:hover { opacity: 1; } /* ------------------------------- メニュータブ ------------------------------- */ #gMenu .menu li a:hover, #gMenu .menu li a:hover, #gMenu .menu li.current_page_item > a, #gMenu .menu li.current-menu-ancestor > a, #gMenu .menu li.current-page-ancestor > a, #gMenu .menu li.current_page_ancestor > a { background-color: #FBFDEB; color:#000; opacity: 1; } #gMenu .menu li{ font-size:14px !important; } @media screen and (min-width: 768px){ #wrap #gMenu .menu > li { position: relative; width: calc(99.99% / 7); box-sizing: border-box; } #wrap #gMenu .menu > li a { box-sizing: border-box; min-height: 4em; padding: 0; } #wrap #gMenu .menu > li a strong { position: absolute; top: 50%; left: 50%; transform: translate(-50%, -50%); -ms-transform: translate(-50%, -50%); -webkit-transform: translate(-50%, -50%); -moz-transform: translate(-50%, -50%); width: 100%; } } @media (min-width: 768px){ #gMenu .menu li a { margin:7px 0; } #gMenu .menu li ul, #gMenu .menu li ul li { width: 100%; } ul.sub-menu li a{ text-align: center !important; padding: 15px 0 !important; } } @media (max-width: 767px){ #gMenu .menu, .menu-mobile-vertical #gMenu ul li ul li, .sidr ul li ul li{ font-size:14px; } .menu-mobile-vertical #gMenu .assistive-text { background-color:#2e2147; border-radius: 3px; border-style: solid; border-width: 1px; } ul.sub-menu li a{ padding-left:2em !important; } } #gMenu .assistive-text span { padding: 18px 0px; font-size:20px; } #mobileui{ border-radius:0; } #mobileui a.button{ width: 50px; height: 47px; } .sidr #sidr-id-menuber{ background:#014099; } /* ------------------------------- 開催要項 ------------------------------- */ #content table.main-table { border-top: 0px solid #ccc; text-align: left; font-size: 100%; } #content table.main-table th { margin-right: 0px; border: none; font-weight: bold; } #content table.main-table th, #content table.main-table td { margin-right: 0px; border: none; border-bottom:1px dotted #c00; text-align: left; } #content table.main-table td { padding: 20px; } #content table.main-table th { background-color: transparent; padding: 20px 50px 20px 0; } #content th.no_line, #content td.no_line { border: 0px !important; } @media screen and (max-width:679px) { #content table.main-table th, #content table.main-table td { display: block; padding: 10px !important; border: 1px dotted #c00; } #content table.main-table th { border-bottom: none; background: #F5F0F0; text-align: center; } } /* ------------------------------- entry ------------------------------- */ .content .entry-box { background: #f4f0f3; } .entry-box { padding: 8px; } /*--feetable--*/ .content table.fee-table th, .content table.fee-table td { /*font-size: 13px;*/ } .content table.fee-table th { font-weight: bold; } @media (min-width: 660px) { .content table.fee-table th, .content table.fee-table td { border: dotted 1px #c00; padding: 10px; border-left: none; border-right: none; vertical-align: middle; text-align: center; } .content table.fee-table thead th { background-color: #c00; color: #fff; } .content table.fee-table thead th:last-of-type { /*border-right-color: #0B57a5;*/ } .content table.fee-table tbody th { white-space: normal; background-color:#f5f0f0; color: #444; } } @media (max-width: 659px) { .content table.fee-table thead { display: none; } .content table.fee-table, .content table.fee-table tbody, .content table.fee-table tbody tr, .content table.fee-table tbody tr th, .content table.fee-table tbody tr td { display: block; border: none; } .content table.fee-table tbody tr { margin-bottom: 20px; } .content table.fee-table tbody tr th { border-color: #c00; background-color:#f5f0f0; color: #444; white-space: normal; } .content table.fee-table tbody tr td:before { content: attr(cellhead); float: left; font-weight: bold; color: #c00; } .content table.fee-table tbody tr td { text-align: right; border-bottom: 1px dotted #c00; } .content table.fee-table tbody tr td:last-of-type { border-bottom: none; } } h3.tl_entry { border-bottom: 2px solid #c00; padding: 7px 5px 6px 60px; margin: 40px 0px 20px; font-size: 1.5em; } h3.tl_entry:before { content: url(https://running-event.jp/hattori-miles/2023/wp-content/uploads/2023/07/icn-torii.png); border-left-color: #fff; } h3.tl_entry:after { content: url(https://running-event.jp/hattori-miles/2023/wp-content/uploads/2023/07/icn-run.png); position: absolute; top: 0; right: 5px; } .entry-box .inBox #entryBtn { flex-wrap: nowrap; justify-content: center; } .entry-box .inBox #entryBtn a.btnGreen { height: auto; } @media (min-width: 576px){ .entry-box .inBox #entryBtn li { width: 97%; padding: 0 !important; margin: 0.5%; box-sizing: border-box; } .entry-box .inBox #entryBtn li.realfinish { width: 50%; } } .entry-box .inBox ul.eny_alt li { font-size: 0.9em; } @media (max-width:767px) { .entry-box .inBox #entryBtn { flex-direction: column; } h3.sp-fs { font-size: 1.15em; } h3.sp-fs-12em { font-size: 1.2em; } } /* ------------------------------- 参加方法 ------------------------------- */ .content .flowBox > dl > dt { margin-bottom: 20px; } .content .flowBox > dl > dt:after { clear: both; content: ""; display: block; height: 5px; } .content .flowBox .iconBox { float: left; margin-right: 8px; text-align: center; } .content .flowBox .feCaption { line-height: 140%; display: block; float: left; width: calc(100% - 80px); } .content .flowBox > dl > dd > h4 { padding: 10px; } .label-gray { background: #ececec; /*padding: 3px 10px;*/ padding:3px; margin: 2px 5px; border-radius: 5px; color: #111; white-space: nowrap } .content [class^="col2"] .col2-blk { display: inline-block; list-style-type: none !important; width: 47.5% !important; padding: 0 !important; } .content [class^="col2"] .col2-blk:nth-child(odd) { margin-right: 0.5%; } .content [class^="col2"] .col2-blk:nth-child(even) { margin-left: 0.5%; } @media screen and (max-width: 660px) { .content .col2-spbreak .col2-blk { margin:0 auto 3.5%; margin-right: auto !important; margin-left: auto !important; width: 100% !important; } } .app-links > li > a { display: block; color: #FFF; text-align: center; padding: 15px 10px; font-size: 16px; -webkit-border-radius: 5px; -moz-border-radius: 5px; border-radius: 5px; overflow: hidden; text-decoration: none; max-width: 260px; background-color: #ddd; } .app-links li.app-links__Apple > a span { display: block; background: url('https://running-event.jp/hattori-miles/2023/wp-content/uploads/2022/07/app-store.png') right center no-repeat; padding-right: 160px; color: #000; font-size: 12px; } .app-links li.app-links__Google > a span { display: block; background: url('https://running-event.jp/hattori-miles/2023/wp-content/uploads/2022/07/google-play.png') right center no-repeat; padding-right: 160px; color: #000; font-size: 12px; } @media (min-width: 660px) { .app-links { display: flex; justify-content: center; } .app-links > li { margin: 15px; display: inline-block; } } @media (max-width: 659px) { .app-links > li { display: block; margin: 30px auto; } .app-links > li > a { margin: auto; } } /*--GPSウォッチ連携方法(GPSウォッチでの計測者のみ)--*/ .content [class^="col5"] { text-align: left; } .content [class^="col5"] .col5-blk{ display: block; list-style-type: none !important; padding: 0 !important; } .content [class^="col5"] .col5-blk:nth-child(odd){ float: left; width:25%; margin:0.5%; } .content [class^="col5"] .col5-blk:nth-child(even){ float: left; width:10%; margin:0.5%; } .content [class^="col5"]:after { content: ''; clear: both; display: block; } @media screen and (max-width:414px) { .content .col5-spbreak .col5-blk:nth-child(odd) { margin:0 auto 1%; float: none !important; width:60%; } .content .col5-spbreak .col5-blk:nth-child(even){ margin:0 auto 1%; float:none !important; width:15%; transform: rotate(90deg); } } .tatta_flex_fig { display: flex; align-items: flex-start; justify-content: space-evenly; } .tatta_flex_fig img:nth-child(odd) { width: 450px; margin-top: 8px; } .tatta_flex_fig img:nth-child(even) { width: 500px; } @media (max-width:767px) { .tatta_flex_fig { display: block; } .tatta_flex_fig img:nth-child(odd) { width: 89%; margin-top: 0; margin: 0 auto 5%; } } /* ------------------------------- 参加特典 ------------------------------- */ h2.sanka { padding: 1.1rem 2rem 0.6rem; border-left: 6px double #014099; color: #014099; border-right: 6px double #014099; background: #fff500; text-align: left; border-bottom: none; } .content .colwrap_prize { justify-content: space-around; align-items: flex-start; } .content .colwrap_prize figure { width: 40%; } @media (max-width:767px) { .content .colwrap_prize { flex-direction: column; } .content .colwrap_prize figure { width: 100%; } } .img-comingsoon, .content .colwrap_prize figure .cs { background: #efefef; height: 250px; display: flex; align-items: center; justify-content: center; box-sizing: border-box; font-size: 1.5em; font-weight: bold; color: #aaa; margin-top: 30px; } /* ------------------------------- 服部天神宮とは ------------------------------- */ #hattori_about { font-family: "游明朝", YuMincho, "Hiragino Mincho ProN W3", "ヒラギノ明朝 ProN W3", "Hiragino Mincho ProN", "HG明朝E", "MS P明朝", "MS 明朝", serif; } #hattori_about h3 { font-family: "游明朝", YuMincho, "Hiragino Mincho ProN W3", "ヒラギノ明朝 ProN W3", "Hiragino Mincho ProN", "HG明朝E", "MS P明朝", "MS 明朝", serif; } .page-id-1305 #container { background-image: url(https://running-event.jp/hattori-miles/2023/wp-content/uploads/2022/07/bg.png); background-repeat: repeat-y; background-position: top center; background-size: contain; box-shadow: 0px 3px 20px 0px #cc00002b !important; /*padding: 0 !important;*/ border-radius: 20px; box-sizing: border-box; background-color: #fffef4; } #hattori_about .tl_about { background: #c00; padding: 25px 30px 22px; margin: 15px 0px 15px; font-size: 2em; text-align: center; color: #fff; font-family: "游明朝", YuMincho, "Hiragino Mincho ProN W3", "ヒラギノ明朝 ProN W3", "Hiragino Mincho ProN", "HG明朝E", "MS P明朝", "MS 明朝", serif; position: relative; } #hattori_about .tl_about:before { content: url(https://running-event.jp/hattori-miles/2023/wp-content/uploads/2022/07/tl_left.png); position: absolute; top: 4px; left: 5px; } #hattori_about .tl_about:after { content: url(https://running-event.jp/hattori-miles/2023/wp-content/uploads/2022/07/tl_right.png); position: absolute; top: 4px; right: 5px; } @media (max-width:767px) { .page-id-1305 #container { padding: 10px 5px; } #hattori_about .inner { padding: 0 10px !important; } #hattori_about .inner .colwrap_lead, #hattori_about .inner .colwrap_photo, #hattori_about .inner .colwrap_map { display: block; } #hattori_about .inner .colwrap_photo figure:nth-child(odd) { margin-right: 0; margin-bottom: 2%; } #hattori_about .inner .colwrap_photo figure:nth-child(even) { margin-left: 0; } #hattori_about .tl_about { padding: 18px 20px 14px; margin: 20px 0px 20px; font-size: 1.3em; } } #hattori_about .inner { padding: 30px 20px 0; } #hattori_about .inner .colwrap_lead { align-items: flex-end; } #hattori_about .inner .colwrap_lead .txt { margin-right: 5%; line-height: 1.8; font-size: 1.15em; } #hattori_about .inner .colwrap_lead .btn a { position: relative; background-image: linear-gradient( 135deg, #FEB692 10%, #EA5455 100%); border: solid 1px #ec8e7d; display: inline-block; padding: 24px 20px 20px; width: 200px; color: #fff; text-decoration: none; font-size: 1.2em; } #hattori_about .inner .colwrap_lead .btn a i { position: absolute; right: 15px; } #hattori_about .inner .colwrap_lead .btn a:hover { border: solid 1px #ec8e7d; background: #FFF; color: #EA5455; transition:0.5s; } #hattori_about .inner .colwrap_photo { margin: 40px 0 50px; } #hattori_about .inner .colwrap_photo figure:nth-child(odd) { margin-right: 1.5%; } #hattori_about .inner .colwrap_photo figure:nth-child(even) { margin-left: 1.5%; } #hattori_about .inner .colwrap_map { justify-content: flex-start; align-items: flex-start; } #hattori_about .inner .colwrap_map .google-maps { width: 75%; margin-right: 2%; } #hattori_about .inner .colwrap_map .google-maps iframe { width: 100%; } .colwrap_ashimamori, .kigan { font-size: 1.1em; line-height: 1.5; } .colwrap_ashimamori figure { margin-right: 1%; } .colwrap_ashimamori figure:last-child { margin-right: 0; } @media (max-width:767px) { .colwrap_ashimamori { display: block !important; } .colwrap_ashimamori figure { margin-right: 0; margin-bottom: 2%; } #hattori_about .tl_entry { font-size: 1.25em; padding: 7px 5px 6px 50px; } #hattori_about .inner .colwrap_photo figure:nth-child(odd), #hattori_about .inner .colwrap_photo figure:nth-child(even) { margin-right: 0 !important; margin-left: 0 !important; } } .flex-control-nav li a, .flex-direction-nav li a{ color:unset !important; border: none !important; } .recommend_course{margin-bottom:100px;} @media screen and (max-width:767px){ .content .recommend_course_intro, .recommend_course{margin-bottom:50px;} } .flexwrap_2col{ display:flex; flex-wrap: wrap; justify-content: center; margin-bottom:30px; } /*- - - - - 北田さん紹介 - - - - -*/ .content .recommend_course_intro .lead{ background-image: url(https://running-event.jp/hattori-miles/2023/wp-content/uploads/2022/08/waku.jpg); background-repeat: repeat; padding: 15px 15px 3px; box-sizing: border-box; border-radius: 6px; margin-bottom: 20px; } .content .recommend_course_intro .lead h4 span{ font-size:0.8em; } .content .recommend_course_intro .lead h4{ font-size:2em; text-align:center; line-height:160%; margin-top:0; padding:15px 10px; border-radius:6px; color:#f00; background-color:#fff1e9; } @media screen and (max-width:767px){ .content .recommend_course_intro .lead h4 span{ font-size:0.9em; display: inline-block; margin-bottom:10px; } .content .recommend_course_intro .lead h4{ font-size:1.35em; line-height:135%; } } .content .recommend_course_intro .flexwrap_2col .left{ width:70%; } .content .recommend_course_intro .flexwrap_2col .right{ width:28%; margin-left:2%; } @media screen and (max-width:767px){ .content .recommend_course_intro .flexwrap_2col .left{ width:100%; } .content .recommend_course_intro .flexwrap_2col .right{ width:70%; text-align: center; } } /*- - - - - 各おすすめコース - - - - -*/ .recommend_course{ margin-bottom:100px;} .content .recommend_course .flexwrap_2col div:nth-child(odd){ width:38%; position:relative; } .content .recommend_course .flexwrap_2col div:nth-child(odd):after{ content:; font-size:1.35em; font-weight:bold; position: absolute; background-color:#fff202; box-shadow:2px 2px #000; color:#2f2047; padding:20px; border-radius:50%; top:-10px; left:5px; transform: rotate(-10deg); } .content .recommend_course .flexwrap_2col .distance01:after{content :"32.4km";} .content .recommend_course .flexwrap_2col .distance02:after{content :"17.3km";} .content .recommend_course .flexwrap_2col .distance03:after{content :"19.1km";} .content .recommend_course .flexwrap_2col .distance04:after{content :"16.1km";} .content .recommend_course .flexwrap_2col .distance05:after{content :"16.4km";} .content .recommend_course .flexwrap_2col .distance06:after{content :"39.8km \A D+1370m";white-space: pre;text-align: center;} .content .recommend_course .flexwrap_2col .distance07:after{content :"47.2km";} .content .recommend_course .flexwrap_2col .distance08:after{content :"50.5km \A D+1680m";white-space: pre;text-align: center;} .content .recommend_course .flexwrap_2col div:nth-child(even){ width:60%; margin-left:2%; } @media screen and (max-width:767px){ .flexwrap_2col{ margin-bottom:0; } .content .recommend_course .flexwrap_2col div:nth-child(odd){ width:100%; max-width:600px; text-align: center; margin:0 auto 15px; } .content .recommend_course .flexwrap_2col div:nth-child(even){ width:100%; margin:0 auto 15px; } } /*- - - - - 見出し - - - - -*/ .content .recommend_course h4{ position:relative; font-size:1.6em; line-height: 140%; text-indent: -1em; padding-left: 1em; margin-bottom:20px; padding-bottom:10px; border-bottom:2px solid #c00; } .content .recommend_course h4 span{ color:#c00; } .content .recommend_course h4:after{ content: url(https://running-event.jp/hattori-miles/2023/wp-content/uploads/2023/07/icn-run.png); position: absolute; padding-left: 1.5em; bottom: 0; } @media screen and (max-width:767px){ .content .recommend_course h4{ font-size:1.35em; } } /*- - - - - スタート・スポット - - - - -*/ .content .recommend_course dl{ margin-top:20px; font-size:0.9em; } .content .recommend_course dl dt{ float:left; font-size:0.9em; width:5em; margin-right:0.5em; padding-bottom:0; margin-bottom:12px; text-align:center; color:#fff; border-radius:4px; background-color:#086000; display:inline-block; padding: 2px 4px 1px; } .content .recommend_course dl dd{ margin-bottom:15px; overflow: hidden; } /*- - - - - コースのボタン - - - - -*/ .content .recommend_course .btn{ background-color: #5bb520; border:none; border-bottom:3px solid #428516; border-radius: 6px; border-radius:30px; font-size:1.2em; text-align: center; margin:0 auto; width:50%; } .content .recommend_course .btn a{ display:block; font-size:1.1em; padding:10px; color:#fff; text-decoration: none; } .content .recommend_course .btn:hover{ opacity: 0.7; } @media screen and (max-width:767px){ .content .recommend_course .btn a{ font-size:1em; } .content .recommend_course .btn{ width:90%; } } .content .recommend_course hr{ border-top:1px dotted #a00; } h4.ttl-movie{ color: #fff !important; font-size: 1.25rem !important; width: 560px; background: #c00; padding: 0.8rem; display: flex; align-items: center; justify-content: center; } .movie{ padding: 15px; } .mile-label{ display: inline-flex; align-items: center; justify-content: center; background: #c00; color:#fff; font-weight: bold; font-size: 16pt; padding: 0.5rem 1rem; border-radius: 0.5rem; } .btn-torii a { position: relative; border: solid 1px #ec8e7d; display: inline-block; padding: 20px 20px 18px 70px; width: 560px; margin: 15px; box-sizing: border-box; color: #e26663; background: #fff; text-decoration: none; font-size: 1.2em; font-weight: bold; } .btn-torii a:before { content: ''; background-image: url(https://running-event.jp/hattori-miles/2023/wp-content/uploads/2023/07/icn-torii.png); position: absolute; top: 9px; left: 8px; width: 45px; height: 39px; } .btn-torii a .fa-chevron-right:before { content: "\f054"; position: absolute; right: 10px; top: 22px; } @media screen and (max-width: 767px) { h4.ttl-movie{ width: 100%; } .btn-torii a{ width: 100%; margin: 0; } .movie iframe{ width: 100% !important; height: auto !important; } } .mb10b{ display: inline-block; margin-bottom: 10px; } .content #post-864 .colwrap_prize figure .cs{ height: 367px !important; } /* リアルフィニッシュの部 */ .content .day_sanka { border: dotted 5px #e99; padding: 25px; overflow: hidden; margin-top: 30px; background: #fefeea; }
新着情報
  • HOME »
  • 新着情報

イベントは本日23時59分までです!

本日がイベント最終日です。 TATTAとGPSウォッチを連携されている方は、イベント開催期間内にTATTA上に走行データ取り込みを完了させる必要があります。 また、本日(10月1日)23:00以降はアクセス集中により、デ …

【リアルフィニッシュの部】本日よりスタート!

足の神様・服部天神参るズ(HATTORI MILES)~服部足祭り~ リアルフィニッシュの部にエントリーいただいた皆さまへのご案内です。 いよいよ本日より計測がスタートしております。 参加時の注意等について今一度ご確認く …

【オンラインの部】本日よりスタート!

足の神様・服部天神参るズ(HATTORI MILES)~服部足祭り~ オンラインの部にエントリーいただいた皆さまへのご案内です。 いよいよ本日より計測がスタートしております。 参加時の注意等について今一度ご確認ください。 …

参加賞発送のお知らせ

参加賞を順次発送しております。 到着まで今しばらくお待ちください。 <オンラインの部にお申し込みの方> オリジナルTシャツをお送りいたします。 ※大会エントリー完了が8月27日以降の方はイベント終了後、11月中旬を目途に …

デザイン公開!

オリジナルゼッケン、オリジナルステッカーのデザインを公開いたしました。 ▼オリジナルゼッケン リアルフィニッシュの部にエントリーされている方に事前にお送りいたします。 ▼オリジナルステッカー リアルフィニッシュの会場とな …

大会公式ホームページをオープンしました!

大会公式ホームページをオープンしました! こちらからどんどん大会情報を発信してまいりますので、エントリーお待ちしております!

年別アーカイブ

PAGETOP