@charset "UTF-8";

@import url("https://fonts.googleapis.com/css?family=Montserrat");
@import url("https://fonts.googleapis.com/css?family=Barlow+Semi+Condensed");
@import url("https://fonts.googleapis.com/css?family=Roboto");
body {
font-family: -apple-system, BlinkMacSystemFont, "Helvetica Neue", "游ゴシック体", "Yu Gothic", YuGothic, "ヒラギノ角ゴ ProN W3", Hiragino Kaku Gothic ProN, Arial, "メイリオ", Meiryo, sans-serif;
font-weight: normal;
line-height: 1.8;
-webkit-backface-visibility: hidden;
backface-visibility: hidden;
color: #fff;
}
body, html {
margin: 0;
padding: 0;
}
img {
max-width: 100%;
box-sizing: border-box;
}
div {
box-sizing: border-box;
}
h1, h2, h3, h4, h5, h6 {
margin: 0;
box-sizing: border-box;
}
ul, ol {
padding: 0;
margin: 0;
list-style: none;
box-sizing: border-box;
}
ul li, ol li {
box-sizing: border-box;
}
dd, dt, dl {
padding: 0;
margin: 0;
box-sizing: border-box;
}
p {
font-size: 16px;
line-height: 2;
margin: 0;
box-sizing: border-box;
}
a {
box-sizing: border-box;
text-decoration: underline;
}
body.open {
overflow: hidden;
width: 100%;
height: 100%;
position: fixed;
} .stt-lang-select {
display: none;
background: none;
border: none;
}
#language {
display: none;
position: fixed;
bottom: -183px;
left: 32px;
height: 220px;
background: #d5ff06;
color: #333;
padding: 4px 20px 10px;
z-index: 10;
transition: 0.3s;
}
#language h4 {
display: block;
padding: 0 0 5px;
color: #10171e;
font-size: 15px;
font-family: "Montserrat", "游ゴシック体", "Yu Gothic", YuGothic, "ヒラギノ角ゴ ProN W3", Hiragino Kaku Gothic ProN, Arial, "メイリオ", Meiryo, sans-serif;
letter-spacing: 0.1em;
transform: scale(1, 0.9);
font-weight: normal;
}
#language h4:before {
content: "▼";
position: absolute;
right: 0;
top: 9px;
font-size: 10px;
line-height: 1;
color: #10171e;
transform: rotate(180deg);
}
@media screen and (min-width: 767px) {
#language.visible { display: block;
}
}
@media screen and (max-width: 767px) {
#language.visible { display: none;
}
}
#language.appear {
bottom: 0px;
transition: 0.3s;
}
#language.appear h4:before {
transform: rotate(0deg);
}
#language ul li a {
position: relative;
font-size: 13px;
font-family: "Montserrat", "游ゴシック体", "Yu Gothic", YuGothic, "ヒラギノ角ゴ ProN W3", Hiragino Kaku Gothic ProN, Arial, "メイリオ", Meiryo, sans-serif;
letter-spacing: 0.1em;
transform: scale(1, 0.9);
color: #10171e;
text-decoration: none;
margin-left: 17px;
transition: 0;
}
#language ul li a::before {
content: "●";
position: absolute;
left: -16px;
top: 4px;
font-size: 10px;
line-height: 1;
color: #10171e;
}
#language ul li a[data-stt-active]::before,
#language ul li a:hover::before {
content: "●";
position: absolute;
left: -16px;
top: 4px;
font-size: 10px;
line-height: 1;
color: #8a9f25;
transition: 0;
} header {
position: relative;
width: 100%;
z-index: 10;
}
@media screen and (min-width: 767px) {
header { }
}
@media screen and (max-width: 767px) {
header { height: 18vw;
}
}
header a {
text-decoration: none;
}
header a img {
transition: 0.3s;
}
header a:hover img {
opacity: 0.5;
transition: 0.3s;
}
header .hdrLogo {
position: relative;
}
@media screen and (min-width: 767px) {
header .hdrLogo { width: 164px;
height: auto;
left: 50%;
margin: 29px 0 23px -82px;
}
}
@media screen and (max-width: 767px) {
header .hdrLogo { width: 20%;
left: 50%;
margin-left: -10%;
top: 3vw;
}
}
header nav {
position: relative;
width: 100%;
}
@media screen and (min-width: 767px) {
header nav { display: block;
margin-bottom: 25px;
}
}
@media screen and (max-width: 767px) {
header nav { display: none;
}
}
header nav ul {
display: flex;
justify-content: center;
margin: 0px auto;
width: auto;
padding-left: 15px;
}
header nav ul li a:link,
header nav ul li a:visited {
display: block;
font-family: "Montserrat", "游ゴシック体", "Yu Gothic", YuGothic, "ヒラギノ角ゴ ProN W3", Hiragino Kaku Gothic ProN, Arial, "メイリオ", Meiryo, sans-serif;
letter-spacing: 0.1em;
transform: scale(1, 0.9);
font-size: 20px;
font-weight: 400;
color: #fff;
height: 100%;
padding: 0 30px;
line-height: 1;
border-right: #fff 1px solid;
transition: 0.3s;
}
header nav ul li a:hover {
transition: 0.3s;
color: #8899a6;
}
header nav ul li:last-child a {
border: none;
}
header #headerSubNav {
position: absolute;
top: 32px;
right: 32px;
}
@media screen and (min-width: 767px) {
header #headerSubNav { display: block;
}
}
@media screen and (max-width: 767px) {
header #headerSubNav { display: none;
}
}
header #headerSubNav ul li {
font-family: "Montserrat", "游ゴシック体", "Yu Gothic", YuGothic, "ヒラギノ角ゴ ProN W3", Hiragino Kaku Gothic ProN, Arial, "メイリオ", Meiryo, sans-serif;
letter-spacing: 0.1em;
transform: scale(1, 0.9);
font-size: 13px;
font-weight: 400;
text-align: right;
}
header #headerSubNav ul li + li {
margin-top: 0;
}
header #headerSubNav ul li a {
color: #fff;
transition: 0.3s;
}
header #headerSubNav ul li a:hover {
transition: 0.3s;
color: #8899a6;
}
@media screen and (min-width: 767px) {
header .fbLogo { width: 10px;
height: auto;
margin: 5px 0 0 15px;
}
}
@media screen and (max-width: 767px) {
header .fbLogo { display: none;
}
}
@media screen and (min-width: 767px) {
header .instaLogo { width: 18px;
height: auto;
margin: 5px 0 0 15px;
}
}
@media screen and (max-width: 767px) {
header .instaLogo { display: none;
}
} #fixedHeader {
position: fixed;
display: flex;
justify-content: space-between;
top: -200px;
left: 0;
width: 100%;
z-index: 10;
transition: 0.7s;
pointer-events: none;
z-index: 20;
background: linear-gradient(to bottom, rgba(0, 0, 0, 0.7), rgba(0, 0, 0, 0));
}
@media screen and (max-width: 767px) {
#fixedHeader { display: none;
}
}
#fixedHeader.appear {
top: 0;
transition: 0.7s;
}
#fixedHeader .fxdHdrLogo {
display: inline-block;
position: relative;
width: 150px;
padding: 20px 0px 30px 30px;
text-decoration: none;
transition: 0.3s;
pointer-events: auto;
}
#fixedHeader .fxdHdrLogo:hover {
opacity: 0.5;
transition: 0.3s;
}
#fixedHeader .fxdHdrLogo img {
width: 110px;
height: auto;
}
#fixedHeader nav#fxdNav {
position: relative;
display: block;
margin-bottom: 25px;
padding-top: 20px;
width: calc(100% - 150px);
}
#fixedHeader nav#fxdNav ul {
display: flex;
justify-content: flex-end;
margin-bottom: 5px;
margin-right: 30px;
}
#fixedHeader nav#fxdNav ul li + li {
border-left: #fff 1px solid;
}
#fixedHeader nav#fxdNav ul li a:link,
#fixedHeader nav#fxdNav ul li a:visited {
display: inline-block;
font-family: "Montserrat", "游ゴシック体", "Yu Gothic", YuGothic, "ヒラギノ角ゴ ProN W3", Hiragino Kaku Gothic ProN, Arial, "メイリオ", Meiryo, sans-serif;
letter-spacing: 0.1em;
transform: scale(1, 0.9);
font-size: 18px;
font-weight: 400;
color: #fff;
padding: 0 30px;
line-height: 1;
text-decoration: none;
transition: 0.3s;
pointer-events: auto;
}
#fixedHeader nav#fxdNav ul li a:hover {
transition: 0.3s;
color: #8899a6;
}
#fixedHeader nav#fxdNav ul li:last-child a {
border: none;
padding-right: 0;
}
#fixedHeader nav#fxdNav ul.subnav li a {
font-size: 14px;
padding: 0 20px;
}
#fixedHeader nav#fxdNav ul.subnav li a + a {
padding: 0 20px 0 10px;
}
#fixedHeader nav#fxdNav ul.subnav li:last-child a {
padding-right: 0;
}
#fixedHeader .fbLogo {
width: 10px;
height: auto;
margin: 5px 15px 0 0;
}
#fixedHeader .instaLogo {
width: 18px;
height: auto;
margin: 5px 15px 0 0;
}  #nav_toggle {
position: fixed;
top: 6vw;
right: 4vw;
width: 10vw;
height: 8vw;
z-index: 100;
}
@media screen and (min-width: 767px) {
#nav_toggle { display: none;
}
}
@media screen and (max-width: 767px) {
#nav_toggle { display: block;
}
}
#nav_toggle div {
position: relative;
}
#nav_toggle span {
display: block;
height: 3px;
background: #fff;
position: absolute;
width: 100%;
left: 0;
-webkit-transition: 0.2s ease-in-out;
-moz-transition: 0.2s ease-in-out;
transition: 0.2s ease-in-out;
}
#nav_toggle span:nth-child(1) {
top: 0px;
}
#nav_toggle span:nth-child(2) {
top: 2.5vw;
}
#nav_toggle span:nth-child(3) {
top: 5vw;
}
#nav_toggle.open { }
#nav_toggle.open span {
background: #fff;
}
#nav_toggle.open span:nth-child(1) {
top: 2.5vw;
transform: rotate(135deg);
}
#nav_toggle.open span:nth-child(2) {
width: 0;
left: 50%;
}
#nav_toggle.open span:nth-child(3) {
top: 2.5vw;
transform: rotate(-135deg);
}
.spNavWrap {
position: fixed;
display: block;
right: -55vw;
top: 0;
visibility: hidden;
margin: 0 auto;
width: 50vw;
height: 100%;
background: rgba(0, 0, 0, 0);
transition: 0.2s;
z-index: 50;
}
@media screen and (min-width: 767px) {
.spNavWrap { display: none;
}
}
@media screen and (max-width: 767px) {
.spNavWrap { display: block;
}
}
.spNavWrap ul.spNav {
display: none;
transition: 0.2s;
}
.spNavWrap.open {
display: flex;
justify-content: center;
align-items: center;
visibility: visible;
right: 0;
background: rgba(0, 0, 0, 0.9);
transition: 0.2s;
}
@media screen and (min-width: 767px) {
.spNavWrap.open { display: none;
}
}
.spNavWrap.open ul.spNav {
display: block;
width: 100%;
padding-right: 4vw;
transition: 0.2s;
}
.spNavWrap.open ul.spNav li {
width: 100%;
font-family: "Montserrat", "游ゴシック体", "Yu Gothic", YuGothic, "ヒラギノ角ゴ ProN W3", Hiragino Kaku Gothic ProN, Arial, "メイリオ", Meiryo, sans-serif;
letter-spacing: 0.1em;
transform: scale(1, 0.9);
font-size: 5vw;
font-weight: 300;
margin: 0 auto 15px;
text-align: right;
transition: 0.2s;
}
.spNavWrap.open ul.spNav li a {
display: block;
text-decoration: none;
line-height: 1.3;
color: #fff;
}
.spNavWrap.open ul.spNav li:first-child {
padding-top: 15px;
}
.spNavWrap.open ul.spNav li:nth-child(6) a {
padding-bottom: 30px;
}
.spNavWrap.open ul.spNav li:nth-child(n+7) {
font-size: 3.8vw;
line-height: 1.6;
margin-bottom: 10px;
}
.spNavWrap.open ul.spNav li img {
width: auto;
height: 4vw;
}
@media screen and (max-width: 767px) {
.spNavWrap.open ul.spNav li.sns { display: flex;
justify-content: flex-end;
}
.spNavWrap.open ul.spNav li.sns a + a {
margin-left: 20px;
}
.spNavWrap.open ul.spNav li.sns img {
width: auto;
height: 8vw;
}
}
.spNavWrap #spLanguage {
display: none;
position: absolute;
bottom: -180px;
width: 100%;
background: #d5ff06;
z-index: 100;
transition: 0.3s;
}
.spNavWrap #spLanguage h4 {
position: relative;
display: block;
font-size: 14px;
padding: 8px 3vw;
color: #10171e;
text-align: right;
}
.spNavWrap #spLanguage h4:before {
content: "▼";
position: absolute;
left: 4vw;
top: 15px;
font-size: 10px;
line-height: 1;
color: #10171e;
transform: rotate(180deg);
}
@media screen and (min-width: 767px) {
.spNavWrap #spLanguage.visible { display: none;
}
}
@media screen and (max-width: 767px) {
.spNavWrap #spLanguage.visible { display: block;
}
}
.spNavWrap #spLanguage.appear {
bottom: 0;
transition: 0.3s;
}
.spNavWrap #spLanguage.appear h4:before {
transform: rotate(0deg);
}
.spNavWrap #spLanguage ul {
padding: 8px 3vw;
}
.spNavWrap #spLanguage ul li {
color: #10171e;
text-align: right;
}
.spNavWrap #spLanguage ul li a {
position: relative;
font-size: 14px;
color: #10171e;
text-decoration: none;
padding-right: 20px;
transition: 0;
}
.spNavWrap #spLanguage ul li a::before {
content: "●";
position: absolute;
right: 0;
top: 4px;
font-size: 10px;
line-height: 1;
color: #10171e;
}
.spNavWrap #spLanguage ul li a[data-stt-active]::before,
.spNavWrap #spLanguage ul li a:hover::before {
content: "●";
position: absolute;
right: 0;
top: 4px;
font-size: 12px;
line-height: 1;
color: #8a9f25;
transition: 0;
}
.spNavWrap #spLanguage ul li a[data-stt-active] {
font-weight: bold;
} #topTitle p {
z-index: 20;
font-size: 18px;
font-family: "Montserrat", "游ゴシック体", "Yu Gothic", YuGothic, "ヒラギノ角ゴ ProN W3", Hiragino Kaku Gothic ProN, Arial, "メイリオ", Meiryo, sans-serif;
letter-spacing: 0.1em;
transform: scale(1, 0.9);
}
@media screen and (min-width: 767px) {
#topTitle p { position: absolute;
top: 25px;
left: 32px;
}
}
@media screen and (max-width: 767px) {
#topTitle p { margin: -10px 5% 0;
padding: 0 0 2vw;
text-align: center;
}
}
@media screen and (max-width: 767px) {
#topicpath { width: 96%;
margin: 0px auto;
}
}
#topicpath a {
text-decoration: none;
}
#topicpath ul {
z-index: 20;
}
@media screen and (min-width: 767px) {
#topicpath ul { position: absolute;
top: 32px;
left: 32px;
}
}
@media screen and (max-width: 767px) {
#topicpath ul { margin: 0px 3vw;
padding: 2vw 0;
display: flex;
justify-content: flex-start;
flex-wrap: wrap;
}
}
#topicpath ul li {
font-size: 13px;
font-family: "Montserrat", "游ゴシック体", "Yu Gothic", YuGothic, "ヒラギノ角ゴ ProN W3", Hiragino Kaku Gothic ProN, Arial, "メイリオ", Meiryo, sans-serif;
letter-spacing: 0.1em;
transform: scale(1, 0.9);
margin-bottom: 2px;
white-space: nowrap;
}
@media screen and (min-width: 767px) {
#topicpath ul li { width: 15em;
}
}
#topicpath ul li a {
position: relative;
white-space: nowrap;
transition: 0.3s;
}
@media screen and (min-width: 767px) {
#topicpath ul li a { color: #8899a6;
}
}
@media screen and (max-width: 767px) {
#topicpath ul li a { color: #fff;
}
}
#topicpath ul li a:hover {
color: #fff;
transition: 0.3s;
}
@media screen and (max-width: 767px) {
#topicpath ul li:not(:first-child) { margin-left: 20px;
}
}
#topicpath ul li:not(:first-child)::before {
content: "";
vertical-align: middle;
position: absolute;
top: 10px;
width: 4px;
height: 4px;
border-top: 1px solid #8899a6;
border-right: 1px solid #8899a6;
-webkit-transform: rotate(45deg);
transform: rotate(45deg);
}
@media screen and (min-width: 767px) {
#topicpath ul li:not(:first-child)::before { left: -15px;
}
}
@media screen and (max-width: 767px) {
#topicpath ul li:not(:first-child)::before { left: -15px;
}
}
@media screen and (min-width: 767px) {
#topicpath ul li:nth-child(2) { margin-left: 15px;
}
}
@media screen and (min-width: 767px) {
#topicpath ul li:nth-child(3) { margin-left: 30px;
}
}
@media screen and (min-width: 767px) {
#topicpath ul li:nth-child(4) { margin-left: 45px;
}
}
#topicpath ul li span {
display: block;
max-width: 15em;
overflow-x: hidden;
text-overflow: ellipsis;
}
.titImg {
line-height: 0;
margin: 0;
padding: 0;
}
#mainImage {
width: 100%;
}
@media screen and (min-width: 767px) {
#mainImage { margin-top: -205px;
}
}
@media screen and (max-width: 767px) {
#mainImage { margin-top: -100px;
}
}
#mainImage img {
width: 100%;
height: auto;
}
.imageblank {
width: 100%;
}
@media screen and (min-width: 767px) {
.imageblank { margin-bottom: 30px;
}
}
@media screen and (max-width: 767px) {
.imageblank { margin-bottom: 7vw;
}
}
.imageblank ul {
display: flex;
justify-content: center;
margin: 0px auto;
width: auto;
padding-left: 15px;
}
.imageblank ul li a {
text-decoration: none;
}
.imageblank ul li a:link,
.imageblank ul li a:visited {
display: inline-block;
font-family: "Montserrat", "游ゴシック体", "Yu Gothic", YuGothic, "ヒラギノ角ゴ ProN W3", Hiragino Kaku Gothic ProN, Arial, "メイリオ", Meiryo, sans-serif;
letter-spacing: 0.1em;
transform: scale(1, 0.9);
font-size: 20px;
font-weight: 400;
color: #fff;
padding: 0 30px;
line-height: 1;
border-right: #fff 1px solid;
transition: 0.3s;
}
@media screen and (max-width: 767px) {
.imageblank ul li a:link,
.imageblank ul li a:visited { font-size: 4vw;
padding: 2vw 4vw;
}
}
.imageblank ul li a:hover {
transition: 0.3s;
color: #8899a6;
}
.imageblank ul li:last-child a {
border: none;
}
@media screen and (max-width: 767px) {
.contents { width: 100%;
}
}
@media screen and (min-width: 1080px) {
.contents { width: 1080px;
margin: 0 auto 100px;
}
}
@media screen and (min-width: 1400px) {
.contents { width: 1200px;
margin: 0 auto 100px;
}
} .subNav {
position: relative;
}
@media screen and (min-width: 767px) {
.subNav { margin-bottom: 50px;
}
}
@media screen and (max-width: 767px) {
.subNav { margin-bottom: 30px;
}
}
.subNav h2 {
font-family: "Montserrat", "游ゴシック体", "Yu Gothic", YuGothic, "ヒラギノ角ゴ ProN W3", Hiragino Kaku Gothic ProN, Arial, "メイリオ", Meiryo, sans-serif;
letter-spacing: 0.1em;
transform: scale(1, 0.8);
font-weight: 400;
font-size: 23px;
line-height: 50px;
}
@media screen and (min-width: 767px) {
.subNav h2 { position: absolute;
left: 30px;
}
}
@media screen and (max-width: 767px) {
.subNav h2 { text-align: center;
line-height: 1;
padding-top: 10px;
}
}
.subNav .subNavWrap {
position: relative;
width: 100%;
height: 3em;
overflow: hidden;
}
.subNav .subNavWrap .subNavMask {
width: 100%;
height: 5em;
overflow-x: auto;
-webkit-overflow-scrolling: touch;
}
@media screen and (max-width: 767px) {
.subNav .subNavWrap { }
.subNav .subNavWrap::before {
content: "";
position: absolute;
right: 0;
top: 0;
width: 40px;
height: 2.5em;
z-index: 15;
}
.subNav .subNavWrap::after {
content: "";
vertical-align: middle;
position: absolute;
top: 1.2em;
right: 12px;
width: 6px;
height: 6px;
border-top: 2px solid #fff;
border-right: 2px solid #fff;
transform: rotate(45deg);
z-index: 15;
}
}
.subNav ul {
display: flex;
}
@media screen and (min-width: 767px) {
.subNav ul { width: 980px;
margin: 0 auto;
justify-content: center;
}
}
@media screen and (max-width: 767px) {
.subNav ul { width: 96%;
justify-content: flex-start;
}
}
.subNav ul li {
display: inline-block;
position: relative;
border-right: 1px solid rgba(255, 255, 255, 0.5);
margin: 10px 0;
}
.subNav ul li a {
display: inline-block;
position: relative;
font-family: "Montserrat", "游ゴシック体", "Yu Gothic", YuGothic, "ヒラギノ角ゴ ProN W3", Hiragino Kaku Gothic ProN, Arial, "メイリオ", Meiryo, sans-serif;
letter-spacing: 0.1em;
transform: scale(1, 0.9);
font-weight: 400;
display: inline-block;
font-size: 16px;
backface-visibility: hidden;
transition: 0.3s;
text-decoration: none;
}
@media screen and (min-width: 767px) {
.subNav ul li a { padding: 0px 28px;
}
}
@media screen and (max-width: 767px) {
.subNav ul li a { padding: 0px 15px;
width: 100%;
display: inline-block;
}
}
.subNav ul li a:hover {
color: #fff;
opacity: 0.5;
transition: 0.3s;
}
.subNav ul li:last-child {
border-right: none;
}
@media screen and (max-width: 767px) {
.subNav ul li:last-child a { padding-right: 40px;
}
}
@media screen and (min-width: 767px) {
.subNav ul li { }
.subNav ul li::before {
opacity: 0;
transition: 0.3s;
content: "";
position: absolute;
bottom: 0;
left: 0;
width: 100%;
height: 54px;
}
}
.subNav ul li:hover::before {
opacity: 1;
transition: 0.3s;
}
.subNav.super-gt {
background: #d31a25;
}
@media screen and (max-width: 767px) {
.subNav.super-gt .subNavWrap { }
.subNav.super-gt .subNavWrap::before {
background: linear-gradient(to left, rgba(211, 26, 37, 0.9) 70%, rgba(211, 26, 37, 0) 100%);
}
}
.subNav.tcr-japan {
background: #21a7a1;
}
@media screen and (max-width: 767px) {
.subNav.tcr-japan .subNavWrap { }
.subNav.tcr-japan .subNavWrap::before {
background: linear-gradient(to left, rgba(33, 167, 161, 0.9) 70%, rgba(33, 167, 161, 0) 100%);
}
}
.subNav.fia-f4 {
background: #00aeff;
}
@media screen and (max-width: 767px) {
.subNav.fia-f4 .subNavWrap { }
.subNav.fia-f4 .subNavWrap::before {
background: linear-gradient(to left, rgba(0, 174, 255, 0.9) 70%, rgba(0, 174, 255, 0) 100%);
}
}
.subNav.a1-fun-cup {
background: #dbfd3e;
}
.subNav.a1-fun-cup h2 {
color: #000;
}
.subNav.a1-fun-cup ul li {
border-right: 1px solid rgba(0, 0, 0, 0.5);
}
.subNav.a1-fun-cup ul li a {
color: #000;
border-color: rgba(0, 0, 0, 0.5);
}
.subNav.a1-fun-cup ul li a:hover {
color: #000;
}
@media screen and (max-width: 767px) {
.subNav.a1-fun-cup .subNavWrap { }
.subNav.a1-fun-cup .subNavWrap::before {
background: linear-gradient(to left, rgba(214, 252, 55, 0.9) 70%, rgba(214, 252, 55, 0) 100%);
}
.subNav.a1-fun-cup .subNavWrap::after {
border-top: 2px solid #000;
border-right: 2px solid #000;
}
}
.subNav.super-taikyu {
background: #312b7c;
}
@media screen and (max-width: 767px) {
.subNav.super-taikyu .subNavWrap { }
.subNav.super-taikyu .subNavWrap::before {
background: linear-gradient(to left, rgba(49, 43, 124, 0.9) 70%, rgba(49, 43, 124, 0) 100%);
}
}
.subNav.frj {
background: #878992;
}
@media screen and (max-width: 767px) {
.subNav.frj .subNavWrap { }
.subNav.frj .subNavWrap::before {
background: linear-gradient(to left, rgba(135, 137, 146, 0.9) 70%, rgba(135, 137, 146, 0) 100%);
}
}
.subNav.japan-cup {
background: #ee0000;
}
@media screen and (max-width: 767px) {
.subNav.japan-cup .subNavWrap { }
.subNav.japan-cup .subNavWrap::before {
background: linear-gradient(to left, rgba(238, 0, 0, 0.9) 70%, rgba(238, 0, 0, 0) 100%);
}
}
.subNav.free-practice-day {
background: #ff6600;
}
@media screen and (max-width: 767px) {
.subNav.free-practice-day .subNavWrap { }
.subNav.free-practice-day .subNavWrap::before {
background: linear-gradient(to left, rgba(255, 102, 0, 0.9) 70%, rgba(255, 102, 0, 0) 100%);
}
}
.subNav.customer-racing {
background: #ff6600;
}
@media screen and (max-width: 767px) {
.subNav.customer-racing .subNavWrap { }
.subNav.customer-racing .subNavWrap::before {
background: linear-gradient(to left, rgba(255, 102, 0, 0.9) 70%, rgba(255, 102, 0, 0) 100%);
}
}
.subNav.fia-f4 {
background: #00aeff;
}
@media screen and (max-width: 767px) {
.subNav.fia-f4 .subNavWrap { }
.subNav.fia-f4 .subNavWrap::before {
background: linear-gradient(to left, rgba(0, 174, 255, 0.9) 70%, rgba(0, 174, 255, 0) 100%);
}
.subNav.fia-f4 .subNavWrap::after {
border-color: #000;
}
} .backtotop {
display: inline-block;
opacity: 0;
transition: 0.3s;
}
@media screen and (min-width: 767px) {
.backtotop { position: fixed;
bottom: 30px;
right: 30px;
}
}
@media screen and (max-width: 767px) {
.backtotop { position: fixed;
bottom: 20px;
right: 7px;
}
}
.backtotop img {
width: 11px;
height: auto;
}
.backtotop.hide {
opacity: 0;
transition: 0.3s;
}
.backtotop.appear {
opacity: 1;
transition: 0.3s;
}
.backtotop:hover {
opacity: 0.5;
transition: 0.3s;
}
footer {
position: relative;
box-sizing: border-box;
}
@media screen and (min-width: 767px) {
footer { width: 100%;
padding: 50px 35px;
}
}
@media screen and (max-width: 767px) {
footer { margin: 0 auto 50px;
width: 96%;
}
}
footer a {
text-decoration: none;
}
footer .inner {
display: flex;
justify-content: space-between;
flex-wrap: wrap;
margin-bottom: 15px;
}
@media screen and (min-width: 767px) {
footer .inner div { width: 25%;
padding: 0 30px;
border-right: 1px solid #42455b;
}
}
@media screen and (max-width: 767px) {
footer .inner div { width: 100%;
padding: 20px 3vw;
border-bottom: 1px solid #42455b;
}
}
@media screen and (min-width: 767px) {
footer .inner div:first-child { padding-left: 0;
}
}
@media screen and (max-width: 767px) {
footer .inner div:first-child { border-top: 1px solid #42455b;
}
}
footer .inner div:last-child {
border: none;
}
footer .inner div p.name {
font-family: "Montserrat", "游ゴシック体", "Yu Gothic", YuGothic, "ヒラギノ角ゴ ProN W3", Hiragino Kaku Gothic ProN, Arial, "メイリオ", Meiryo, sans-serif;
letter-spacing: 0.1em;
transform: scale(1, 0.9);
font-size: 18px;
color: #fff;
margin-bottom: 10px;
}
footer .inner div p.address {
color: #8899a6;
font-size: 11px;
font-weight: 600;
}
footer .inner div dl {
display: flex;
justify-content: flex-start;
flex-wrap: wrap;
width: 100%;
color: #8899a6;
font-size: 11px;
font-weight: 600;
}
footer .inner div dl dt {
width: 70px;
}
footer .inner div dl dd {
width: calc(100% - 70px);
margin-bottom: 10px;
}
footer .inner div ul li {
font-family: "Montserrat", "游ゴシック体", "Yu Gothic", YuGothic, "ヒラギノ角ゴ ProN W3", Hiragino Kaku Gothic ProN, Arial, "メイリオ", Meiryo, sans-serif;
letter-spacing: 0.1em;
transform: scale(1, 0.9);
font-size: 15px;
font-weight: 400;
margin-bottom: 5px;
}
footer .inner div ul li a {
color: #fff;
transition: 0.3s;
}
footer .inner div ul li a:hover {
transition: 0.3s;
color: #8899a6;
}
footer .inner div ul li .fbLogo {
display: inline-block;
}
@media screen and (min-width: 767px) {
footer .inner div ul li .fbLogo { width: 10px;
height: auto;
margin: 5px 15px 0 0;
}
}
@media screen and (max-width: 767px) {
footer .inner div ul li .fbLogo { display: none;
}
}
footer .inner div ul li .instaLogo {
display: inline-block;
}
@media screen and (min-width: 767px) {
footer .inner div ul li .instaLogo { width: 18px;
height: auto;
margin: 5px 15px 0 0;
}
}
@media screen and (max-width: 767px) {
footer .inner div ul li .instaLogo { display: none;
}
}
footer .copyright {
font-family: "Barlow Semi Condensed", "游ゴシック体", "Yu Gothic", YuGothic, "ヒラギノ角ゴ ProN W3", Hiragino Kaku Gothic ProN, Arial, "メイリオ", Meiryo, sans-serif;
letter-spacing: 0.1em;
color: #8899a6;
font-size: 13px;
font-weight: 300;
margin-bottom: 20px;
}
@media screen and (min-width: 767px) {
footer .copyright { margin-bottom: 50px;
}
}
@media screen and (max-width: 767px) {
footer .copyright { padding-left: 3vw;
}
}
.floatbanner {
display: block;
position: fixed;
bottom: 15px;
right: 30px;
z-index: 100;
}
@media screen and (max-width: 767px) {
.floatbanner { width: 60%;
}
}
.floatbanner img {
width: auto;
}
@media screen and (max-width: 767px) {
.floatbanner img { width: 100%;
}
}
.floatbanner .btnClose {
position: absolute;
top: -21px;
right: -21px;
width: auto;
}
@media screen and (max-width: 767px) {
.floatbanner .btnClose { width: 7vw;
top: -3.5vw;
right: -3.5vw;
}
}
.floatbanner.hide {
display: none;
} table.tblBasic {
border-collapse: collapse;
border-top: 1px solid #2e3236;
border-bottom: 1px solid #2e3236;
}
table.tblBasic tbody {
width: 100%;
display: table;
}
table.tblBasic tr th {
font-family: "Montserrat", "游ゴシック体", "Yu Gothic", YuGothic, "ヒラギノ角ゴ ProN W3", Hiragino Kaku Gothic ProN, Arial, "メイリオ", Meiryo, sans-serif;
letter-spacing: 0.1em;
font-size: 13px;
font-weight: 300;
line-height: 1.2;
padding: 10px;
background: #1a2939;
text-align: center;
border-right: 1px solid #2e3236;
}
table.tblBasic tr th:first-child {
border-left: 1px solid #2e3236;
}
table.tblBasic tr td {
font-family: "Montserrat", "游ゴシック体", "Yu Gothic", YuGothic, "ヒラギノ角ゴ ProN W3", Hiragino Kaku Gothic ProN, Arial, "メイリオ", Meiryo, sans-serif;
letter-spacing: 0.1em;
font-size: 14px;
padding: 10px;
text-align: left;
border-right: 1px solid #2e3236;
}
table.tblBasic tr td:first-child {
border-left: 1px solid #2e3236;
}
table.tblBasic tr td img {
width: 23px;
height: 23px;
}
table.tblBasic tr td.td-split {
padding: 0;
}
table.tblBasic tr td.td-split span {
display: block;
height: 50%;
padding: 5px;
box-sizing: border-box;
white-space: nowrap;
}
table.tblBasic tr td.td-split span + span {
border-top: 1px solid #2e3236;
}
table.tblBasic tr:nth-child(odd) {
background: #1a2939;
}
.tblWrap {
margin: 0 auto 20px;
}
@media screen and (min-width: 767px) {
.tblWrap { width: 670px;
}
}
@media screen and (max-width: 767px) {
.tblWrap { width: 96%;
overflow-x: scroll;
}
}
table.tblFrexible {
margin: 0 auto 50px;
border-collapse: collapse;
border-top: 1px solid #2e3236;
border-bottom: 1px solid #2e3236;
box-sizing: border-box;
}
@media screen and (min-width: 767px) {
table.tblFrexible { width: 100%;
}
}
@media screen and (max-width: 767px) {
table.tblFrexible { width: 670px;
min-width: 96%;
}
}
table.tblFrexible tr th {
font-family: "Montserrat", "游ゴシック体", "Yu Gothic", YuGothic, "ヒラギノ角ゴ ProN W3", Hiragino Kaku Gothic ProN, Arial, "メイリオ", Meiryo, sans-serif;
letter-spacing: 0.1em;
font-size: 13px;
font-weight: 300;
line-height: 1.2;
padding: 10px;
background: #1a2939;
text-align: left;
border-right: 1px solid #2e3236;
border-bottom: 1px solid #2e3236;
}
table.tblFrexible tr th:first-child {
border-left: 1px solid #2e3236;
}
table.tblFrexible tr td {
font-family: "Montserrat", "游ゴシック体", "Yu Gothic", YuGothic, "ヒラギノ角ゴ ProN W3", Hiragino Kaku Gothic ProN, Arial, "メイリオ", Meiryo, sans-serif;
letter-spacing: 0.1em;
font-size: 14px;
padding: 10px;
text-align: left;
border-right: 1px solid #2e3236;
border-bottom: 1px solid #2e3236;
}
table.tblFrexible tr td:first-child {
border-left: 1px solid #2e3236;
} .schedule {
position: relative;
}
@media screen and (min-width: 767px) {
.schedule .linkResult { position: absolute;
top: 5px;
right: 50px;
}
}
@media screen and (max-width: 767px) {
.schedule .linkResult { display: block;
text-align: center;
margin-bottom: 30px;
margin-top: -20px;
}
}
@media screen and (min-width: 1400px) {
.schedule .linkResult { position: absolute;
top: 5px;
right: 110px;
}
}
.schedule .linkResult a {
position: relative;
font-size: 14px;
text-decoration: none;
padding-left: 15px;
}
.schedule .linkResult a::before {
position: absolute;
content: "";
vertical-align: middle;
top: 6px;
left: 0px;
width: 5px;
height: 5px;
border-top: 1px solid #fff;
border-right: 1px solid #fff;
-webkit-transform: rotate(45deg);
transform: rotate(45deg);
}
table.tblSchedule {
border-collapse: collapse;
}
@media screen and (min-width: 767px) {
table.tblSchedule { width: 980px;
margin: 0 auto 115px;
}
}
@media screen and (max-width: 767px) {
table.tblSchedule { width: 90%;
margin: 0 auto;
}
}
table.tblSchedule tr th.result {
width: 100px;
}
table.tblSchedule tr td {
text-align: center;
}
table.tblSchedule tr td.title {
text-align: left;
width: 50%;
}
table.tblSchedule tr td.circuit {
text-align: left;
width: 30%;
}
table.tblSchedule tr td.circuit {
letter-spacing: 0;
}
table.tblSchedule tr td.report {
line-height: 0;
}
table.tblSchedule tr td.date {
white-space: nowrap;
}
table.tblSchedule tr td.driver {
white-space: nowrap;
}
table.tblSchedule tr td.twolines {
border-bottom: 1px solid #2e3236;
}
table.tblSchedule tr:nth-child(odd) {
background: #1a2939;
}
table.tblSchedule tr.light {
background: #1a2939;
}
table.tblSchedule tr.dark {
background: none;
}
table.tblResult {
border-collapse: collapse;
}
@media screen and (min-width: 767px) {
table.tblResult { width: 980px;
margin: 0 auto 115px;
}
}
@media screen and (max-width: 767px) {
table.tblResult { width: 90%;
margin: 0 auto;
}
}
table.tblResult tr td {
text-align: center;
}
table.tblResult tr td.round {
width: 10%;
}
table.tblResult tr td.pdf {
width: 30%;
}
table.tblResult tr:nth-child(odd) {
background: #1a2939;
}
table.tblResult tr.light {
background: #1a2939;
}
table.tblResult tr.dark {
background: none;
} @media screen and (min-width: 767px) {
table.tblSpec { width: 700px;
margin: 0 auto 50px;
}
}
@media screen and (max-width: 767px) {
table.tblSpec { width: 90%;
margin: 0 auto 50px;
}
}
table.tblSpec tr td {
width: 70%;
}
table.tblSpec tr td:first-child {
width: 30%;
} @media screen and (min-width: 767px) {
.tblPointWrap { width: 980px;
margin: 0 auto 115px;
}
}
@media screen and (max-width: 767px) {
.tblPointWrap { width: 96%;
margin: 0 auto 50px;
overflow-x: scroll;
}
}
.tblPointWrap p {
text-align: left;
}
@media screen and (min-width: 767px) {
.tblPointWrap + .tblPointNote { margin-top: -100px;
}
}
@media screen and (max-width: 767px) {
.tblPointWrap + .tblPointNote { margin-top: -50px;
}
}
@media screen and (min-width: 767px) {
.tblPointNote { width: 980px;
margin: 0 auto 115px;
}
}
@media screen and (max-width: 767px) {
.tblPointNote { width: 96%;
margin: 0 auto 50px;
}
}
.tblPointNote p {
position: relative;
text-align: left;
font-size: 14px;
padding-left: 1rem;
}
.tblPointNote p:before {
content: "※";
font-size: 14px;
position: absolute;
left: 0px;
top: 0;
}
table.tblPoint {
border-collapse: collapse;
}
@media screen and (min-width: 767px) {
table.tblPoint { width: 980px;
margin: 0 auto 115px;
}
}
@media screen and (max-width: 767px) {
table.tblPoint { min-width: 90%;
margin: 0 auto 20px;
}
}
table.tblPoint tr th {
line-height: 1.6;
}
@media screen and (max-width: 767px) {
table.tblPoint tr th { white-space: nowrap;
}
}
table.tblPoint tr td {
text-align: center;
}
@media screen and (max-width: 767px) {
table.tblPoint tr td { white-space: nowrap;
}
}
table.tblPoint tr td strong {
color: #d5ff06;
font-weight: bold;
}
table.tblPoint tr:nth-child(odd) {
background: #1a2939;
}
table.tblPoint tr.light {
background: #1a2939;
}
table.tblPoint tr.sanka th {
border-top: 1px solid #2e3236;
border-bottom: 1px solid #2e3236;
} @media screen and (min-width: 767px) {
table.tblCompanyProfile { width: 700px;
margin: 0 auto 50px;
}
}
@media screen and (max-width: 767px) {
table.tblCompanyProfile { width: 100%;
margin: 0 auto;
}
}
table.tblCompanyProfile tr td {
width: 70%;
}
table.tblCompanyProfile tr td:first-child {
width: 30%;
} @media screen and (min-width: 767px) {
ul.linklist { width: 980px;
margin: 0 auto 100px;
}
}
@media screen and (max-width: 767px) {
ul.linklist { width: 94vw;
margin: 0 auto 100px;
}
}
ul.linklist li {
margin-bottom: 1rem;
}
ul.linklist li a {
position: relative;
display: inline-block;
font-size: 14px;
text-decoration: none;
padding-left: 15px;
padding: 5px 20px 5px 30px;
background: #d5ff06;
border-radius: 3px;
color: #000;
transition: 0.3s;
}
ul.linklist li a::before {
position: absolute;
content: "";
vertical-align: middle;
top: 0.9rem;
left: 10px;
width: 5px;
height: 5px;
border-top: 1px solid #000;
border-right: 1px solid #000;
-webkit-transform: rotate(45deg);
transform: rotate(45deg);
}
ul.linklist li a:hover {
background: #fff;
transition: 0.3s;
}
@media screen and (max-width: 767px) {
ul.linklist li a { display: block;
}
} @media screen and (min-width: 767px) {
#mainColumn .postList { width: 100%;
}
}
@media screen and (max-width: 767px) {
#mainColumn .postList { width: 96%;
margin: 0 auto;
}
}
.ajax-load-more-wrap {
margin-bottom: 30px;
}
.newsList ul.postList li div.text p.race,
.galleryList ul.postList li div.text p.race {
display: none;
}
@keyframes show {
from {
opacity: 0;
}
to {
opacity: 1;
}
}
ul.yearlist {
display: flex;
justify-content: center;
}
@media screen and (min-width: 767px) {
ul.yearlist { width: 100%;
margin: 0 auto 50px;
}
}
@media screen and (max-width: 767px) {
ul.yearlist { width: 96%;
margin: 0 auto 30px;
flex-wrap: wrap;
}
}
ul.yearlist li {
display: inline-block;
font-weight: bold;
border: 1px solid #8899a6;
border-radius: 3px;
margin: 0 5px;
cursor: pointer;
transition: 0.3s;
}
@media screen and (min-width: 767px) {
ul.yearlist li { padding: 5px 50px;
}
}
@media screen and (max-width: 767px) {
ul.yearlist li { padding: 5px 10px;
margin-bottom: 10px;
}
}
ul.yearlist li span {
display: block;
font-family: "Montserrat", "游ゴシック体", "Yu Gothic", YuGothic, "ヒラギノ角ゴ ProN W3", Hiragino Kaku Gothic ProN, Arial, "メイリオ", Meiryo, sans-serif;
letter-spacing: 0.1em;
transform: scale(1, 0.9);
color: #8899a6;
transition: 0.3s;
}
ul.yearlist li:hover {
background: #8899a6;
transition: 0.3s;
}
ul.yearlist li:hover span {
color: #fff;
transition: 0.3s;
}
ul.yearlist li.active {
background: #8899a6;
cursor: default;
}
ul.yearlist li.active span {
color: #fff;
}
ul.postList {
display: flex;
justify-content: space-between;
flex-wrap: wrap; }
@media screen and (min-width: 767px) {
ul.postList { width: 100%;
margin: 0 auto 50px;
}
}
@media screen and (max-width: 767px) {
ul.postList { width: 96%;
margin: 0 auto 30px;
}
}
ul.postList li {
margin-bottom: 7px;
background: #10171e;
background: linear-gradient(#070d12 70%, #15202a 100%);
border: 1px solid rgba(0, 0, 0, 0.5);
box-sizing: border-box;
}
@media screen and (min-width: 767px) {
ul.postList li { width: calc((100% - 10px) / 3);
}
}
@media screen and (max-width: 767px) {
ul.postList li { width: calc((100% - 10px) / 2);
}
}
ul.postList li a {
position: relative;
display: block;
text-decoration: none;
}
ul.postList li .thumb {
position: relative;
width: 100%;
height: 100%;
}
ul.postList li .thumb::before {
content: "";
display: block;
padding-top: 100%;
}
ul.postList li .image {
position: absolute;
top: 0;
left: 0;
width: 100%;
height: 100%;
overflow: hidden;
background: #000;
}
ul.postList li .image img {
width: 100%;
height: 100%;
line-height: 0;
position: absolute;
bottom: 0;
transition: 0.5s;
}
@media screen and (min-width: 767px) {
ul.postList li .image img { }
}
@media screen and (max-width: 767px) {
ul.postList li .image img { height: 49vw;
}
}
ul.postList li .image.thumbMovie img {
height: 75%;
top: 12.5%;
}
ul.postList li:hover .image img {
transform: scale(1.05);
transition: 0.5s;
}
ul.postList li div.text {
display: flex;
justify-content: flex-start;
flex-wrap: wrap;
}
@media screen and (min-width: 767px) {
ul.postList li div.text { padding: 20px 30px 30px;
}
}
@media screen and (max-width: 767px) {
ul.postList li div.text { padding: 10px;
}
}
ul.postList li div.text h4 {
width: 100%;
letter-spacing: 0.05em;
line-height: 1.6;
margin-bottom: 10px;
text-align: left;
font-feature-settings: "palt";
}
@media screen and (min-width: 767px) {
ul.postList li div.text h4 { font-size: 20px;
}
}
@media screen and (max-width: 767px) {
ul.postList li div.text h4 { font-size: 16px;
}
}
ul.postList li div.text p {
font-size: 14px;
font-weight: 400;
line-height: 1;
}
@media screen and (min-width: 767px) {
ul.postList li div.text p { margin-bottom: 10px;
}
}
@media screen and (max-width: 767px) {
ul.postList li div.text p { margin-bottom: 5px;
}
}
ul.postList li div.text p.detail {
line-height: 1.4;
}
ul.postList li div.text p.race {
position: relative;
font-family: "Montserrat", "游ゴシック体", "Yu Gothic", YuGothic, "ヒラギノ角ゴ ProN W3", Hiragino Kaku Gothic ProN, Arial, "メイリオ", Meiryo, sans-serif;
letter-spacing: 0.1em;
font-size: 16px;
font-feature-settings: "palt";
letter-spacing: 0.05em;
color: #fff;
padding-left: 24px;
padding-right: 17px;
}
ul.postList li div.text p.race span {
display: block;
transform: scale(1, 0.8);
margin-top: -1px;
}
ul.postList li div.text p.race:before {
content: "";
position: absolute;
width: 10px;
height: 12px;
top: 0;
left: 3px;
}
@media screen and (min-width: 1080px) {
ul.postList li div.text p.race { width: auto;
}
}
@media screen and (max-width: 1080px) {
ul.postList li div.text p.race { width: 100%;
}
}
@media screen and (max-width: 767px) {
ul.postList li div.text p.race { width: 100%;
}
}
ul.postList li div.text p.super-gt:before {
transform: skewX(-23deg);
background-color: #d2232e;
}
ul.postList li div.text p.tcr-japan:before {
transform: skewX(-13deg);
background-color: #009c9a;
border-radius: 0 0 3px 0;
}
ul.postList li div.text p.a1-fun-cup:before {
background: url(https://hitotsuyamaracing.net/site_renewal/wp-content/themes/hitotsuyama/img/symbol_a1.svg) left top no-repeat;
background-size: contain;
}
ul.postList li div.text p.super-taikyu:before {
content: "";
position: absolute;
width: 13px;
height: 12px;
top: 0;
left: 3px;
background-color: #312b7c;
}
ul.postList li div.text p.frj:before {
content: "";
position: absolute;
width: 13px;
height: 12px;
top: 0;
left: 3px;
clip-path: polygon(50% 0%, 100% 38%, 82% 100%, 18% 100%, 0% 38%);
background-color: #878992;
}
ul.postList li div.text p.japan-cup:before {
content: "";
position: absolute;
width: 13px;
height: 13px;
border-radius: 13px;
top: 0;
left: 3px;
background-color: #ee0000;
}
ul.postList li div.text p.free-practice-day:before {
content: "";
position: absolute;
width: 13px;
height: 13px;
border-radius: 13px;
top: 0;
left: 3px;
background-color: #ff6600;
}
ul.postList li div.text p.customer-racing:before {
content: "";
position: absolute;
width: 13px;
height: 13px;
border-radius: 13px;
top: 0;
left: 3px;
background-color: #ff6600;
}
ul.postList li div.text p.fia-f4:before {
transform: skewX(-23deg);
background-color: #00aeff;
border-radius: 2.5px 0 2.5px 0;
}
ul.postList li div.text p.term {
padding-right: 10px;
}
ul.postList li div.text p.term,
ul.postList li div.text p.date {
font-size: 13px;
letter-spacing: 0.1em;
font-weight: 600;
font-family: "Barlow Semi Condensed", "游ゴシック体", "Yu Gothic", YuGothic, "ヒラギノ角ゴ ProN W3", Hiragino Kaku Gothic ProN, Arial, "メイリオ", Meiryo, sans-serif;
letter-spacing: 0.1em;
color: #8899a6;
padding-top: 1px;
}
@media screen and (min-width: 767px) {
ul.postList li div.text p.term,
ul.postList li div.text p.date { }
}
@media screen and (max-width: 767px) {
ul.postList li div.text p.term,
ul.postList li div.text p.date { margin-bottom: 12px;
letter-spacing: 0.05em;
}
}
@media screen and (min-width: 767px) {
ul.postList::after { content: "";
display: block;
width: calc((100% - 10px) / 3);
}
}
ul.movieList li .thumb::before {
padding-top: 75%;
}
@media screen and (max-width: 767px) {
ul.movieList li .image img { height: auto;
}
}
ul.postListGallery {
display: none;
}
ul.postListGallery:first-child {
display: flex;
}
ul.postListGallery.appear {
display: flex;
animation: show 0.5s linear 0s;
} .alm-btn-wrap {
text-align: center;
display: block;
width: 100%;
margin: 0;
}
.alm-btn-wrap .moreBtn {
text-align: center;
background: #10171e;
border: none;
color: #fff;
margin-top: 20px;
width: 150px;
height: 30px;
font-size: 14px;
border: 1px solid #fff;
border-radius: 15px;
outline: none;
transition: 0.3s;
font-family: "Montserrat", "游ゴシック体", "Yu Gothic", YuGothic, "ヒラギノ角ゴ ProN W3", Hiragino Kaku Gothic ProN, Arial, "メイリオ", Meiryo, sans-serif;
letter-spacing: 0.1em;
transform: scale(1, 0.9);
}
.alm-btn-wrap .moreBtn.done {
display: none;
}
.alm-btn-wrap .moreBtn:hover {
background: #fff;
color: #10171e;
transition: 0.3s;
}
.scroller-status {
display: none;
margin: 20px auto 0;
width: 100%;
}
.infinite-scroll-request {
animation: scroll-request 1.1s infinite linear;
border: 6px solid #8899a6;
border-left: 6px solid #10171e;
border-radius: 50%;
height: 36px;
margin: auto;
width: 36px;
}
@keyframes scroll-request {
0% {
transform: rotate(0deg);
}
100% {
transform: rotate(360deg);
}
}
.infinite-scroll-last,
.infinite-scroll-error {
color: #757575;
text-align: center;
}
#toppageWrap {
position: relative;
margin: 0 auto;
display: flex;
justify-content: space-between;
flex-wrap: wrap;
flex-flow: row-reverse;
}
@media screen and (max-width: 1400px) {
#toppageWrap { width: 100%;
}
}
@media screen and (min-width: 1400px) {
#toppageWrap { width: 1380px;
}
}
#toppageWrap #rightColumn {
width: 240px;
margin-right: 5px;
}
@media screen and (min-width: 767px) {
#toppageWrap #rightColumn { display: block;
}
}
@media screen and (max-width: 767px) {
#toppageWrap #rightColumn { display: none;
}
}
#toppageWrap #topResult {
width: 100%;
}
@media screen and (min-width: 767px) {
#toppageWrap #topResult { display: none;
}
}
@media screen and (max-width: 767px) {
#toppageWrap #topResult { display: block;
}
}
#toppageWrap #rightColumnTrig {
width: 100%;
}
@media screen and (min-width: 767px) {
#toppageWrap #rightColumnTrig { display: none;
}
}
@media screen and (max-width: 767px) {
#toppageWrap #rightColumnTrig { display: block;
}
}
@media screen and (min-width: 1400px) {
#toppageWrap #mainColumn { width: 945px;
}
}
@media screen and (min-width: 767px) {
#toppageWrap #mainColumn { width: calc(100% - 255px);
margin-left: 5px;
}
}
@media screen and (max-width: 767px) {
#toppageWrap #mainColumn { width: 100%;
}
} .staticBanner {
position: relative;
width: 100%;
box-sizing: border-box;
line-height: 0;
}
@media screen and (min-width: 767px) {
.staticBanner { margin-bottom: 5px;
}
}
.staticBanner img {
width: 100%;
height: auto;
}
.staticBanner a {
transition: 0.3s;
}
.staticBanner a:hover {
opacity: 0.7;
transition: 0.3s;
}
.staticWideBanner {
position: relative;
margin: 0 auto;
padding-bottom: 56.25%; height: 0;
line-height: 0;
overflow: hidden;
width: 100%;
}
@media screen and (max-width: 767px) {
.staticWideBanner { margin: 0 auto;
}
}
.staticWideBanner iframe {
position: absolute;
top: 0;
left: 0;
width: 100%;
height: 100%;
margin-top: -60px;
}
@media screen and (max-width: 767px) {
.staticWideBanner iframe { margin-top: 0;
}
}
#youtubeMov {
position: absolute;
top: 0px;
left: 0;
width: 100%;
z-index: -9999;
}
#mainvisualWide {
position: relative;
width: 100%;
box-sizing: border-box;
}
@media screen and (min-width: 767px) {
#mainvisualWide { margin-bottom: 5px;
}
}
@media screen and (max-width: 767px) {
#mainvisualWide { }
}
#mainvisualWide ul li img {
width: 100%;
height: auto;
}
.spMainImg {
display: none;
}
.sp_youtube {
display: none;
}
.sp_youtube {
display: block;
background-color: #000;
text-align: center;
}
.sp_youtube iframe {
display: block;
width: 100%;
height: 235px;
}
.mask {
width: 100%;
height: 50px;
margin-top: -105px;
line-height: 0;
background: #10171e;
}
@media screen and (max-width: 767px) {
.mask { display: none;
}
}
#mainvisual {
position: relative;
width: 100%;
border: 1px solid rgba(0, 0, 0, 0.5);
box-sizing: border-box;
}
@media screen and (min-width: 767px) {
#mainvisual { margin-bottom: 5px;
}
}
@media screen and (max-width: 767px) {
#mainvisual { }
}
#mainvisual ul li img {
width: 100%;
height: auto;
}
.slider {
opacity: 0;
transition: opacity 0.3s linear;
}
.slider.slick-initialized {
opacity: 1;
} #information {
position: relative;
display: flex;
justify-content: space-between;
align-items: center;
background: linear-gradient(#070d12 70%, #15202a 100%);
border: 1px solid #434c54;
}
@media screen and (min-width: 767px) {
#information { margin-bottom: 15px;
padding: 10px 0;
}
}
@media screen and (max-width: 767px) {
#information { flex-wrap: wrap;
margin: 3vw;
}
}
#information h2 {
text-align: center;
padding: 10px 0;
font-size: 16px;
font-family: "Montserrat", "游ゴシック体", "Yu Gothic", YuGothic, "ヒラギノ角ゴ ProN W3", Hiragino Kaku Gothic ProN, Arial, "メイリオ", Meiryo, sans-serif;
letter-spacing: 0.1em;
transform: scale(1, 0.9);
font-weight: normal;
}
@media screen and (min-width: 767px) {
#information h2 { width: 200px;
line-height: 1;
}
}
@media screen and (max-width: 767px) {
#information h2 { width: 100%;
padding: 10px 3vw 0;
}
}
@media screen and (min-width: 767px) {
#information .infowrap { width: calc(100% - 200px);
padding-bottom: 5px;
border-left: 1px solid #434c54;
}
}
@media screen and (max-width: 767px) {
#information .infowrap { }
}
#information .infowrap p {
text-align: left;
}
@media screen and (min-width: 767px) {
#information .infowrap p { padding: 10px 40px 5px;
line-height: 1;
}
}
@media screen and (max-width: 767px) {
#information .infowrap p { padding: 0 3vw;
margin-bottom: 10px;
}
}
#information .infowrap p span {
position: relative;
display: inline-block;
font-family: "Barlow Semi Condensed", "游ゴシック体", "Yu Gothic", YuGothic, "ヒラギノ角ゴ ProN W3", Hiragino Kaku Gothic ProN, Arial, "メイリオ", Meiryo, sans-serif;
letter-spacing: 0.1em;
color: #8899a6;
font-weight: bold;
font-size: 14px;
}
@media screen and (min-width: 767px) {
#information .infowrap p span { width: 100px;
top: -4px;
}
}
@media screen and (max-width: 767px) {
#information .infowrap p span { width: 100%;
}
}
#information .infowrap p a {
position: relative;
display: inline-block;
text-decoration: none;
font-size: 15px;
}
@media screen and (min-width: 767px) {
#information .infowrap p a { width: calc(100% - 100px);
line-height: 1.2;
white-space: nowrap;
overflow: hidden;
text-overflow: ellipsis;
padding-right: 20px;
}
}
@media screen and (max-width: 767px) {
#information .infowrap p a { }
} #rightColumn h3 {
position: relative;
display: block;
text-align: center;
color: #8899a6;
background: #000;
font-size: 16px;
font-weight: bold;
padding: 15px 0 20px;
font-family: "Barlow Semi Condensed", "游ゴシック体", "Yu Gothic", YuGothic, "ヒラギノ角ゴ ProN W3", Hiragino Kaku Gothic ProN, Arial, "メイリオ", Meiryo, sans-serif;
letter-spacing: 0.1em;
}
#rightColumn h3::before {
content: "▼";
text-align: center;
position: absolute;
bottom: 3px;
left: 0;
color: #8899a6;
width: 100%;
font-size: 10px;
}
.resultBlock {
text-align: center;
padding-bottom: 4px;
}
.resultBlock a {
text-decoration: none;
}
.resultBlock .title {
padding-top: 10px;
background: linear-gradient(#000 0%, #15202b 100%);
margin-bottom: 2px;
}
.resultBlock .title h2 {
position: relative;
padding-top: 20px;
}
.resultBlock .title h2:before {
content: "";
position: absolute;
width: 14px;
height: 18px;
top: 0;
left: 50%;
margin-left: -7px;
}
.resultBlock .title h2 span {
display: block;
font-family: "Montserrat", "游ゴシック体", "Yu Gothic", YuGothic, "ヒラギノ角ゴ ProN W3", Hiragino Kaku Gothic ProN, Arial, "メイリオ", Meiryo, sans-serif;
letter-spacing: 0.1em;
transform: scale(1, 0.8);
font-size: 24px;
font-feature-settings: "palt";
font-weight: 400;
letter-spacing: 0.05em;
}
.resultBlock .title a.viewall {
display: inline-block;
margin-bottom: 15px;
padding: 0px 10px 2px;
transition: 0.3s;
}
.resultBlock .title a.viewall span {
font-size: 12px;
font-family: "Montserrat", "游ゴシック体", "Yu Gothic", YuGothic, "ヒラギノ角ゴ ProN W3", Hiragino Kaku Gothic ProN, Arial, "メイリオ", Meiryo, sans-serif;
letter-spacing: 0.1em;
font-weight: 600;
}
.resultBlock .title a.viewall:hover {
background: #fff;
transition: 0.3s;
}
.resultBlock .detail {
background: #15202b;
padding-bottom: 4px;
}
.resultBlock .detail p {
color: #fff;
font-size: 14px;
padding: 8px 5px;
line-height: 1.6;
}
.resultBlock .detail p span {
font-family: "Montserrat", "游ゴシック体", "Yu Gothic", YuGothic, "ヒラギノ角ゴ ProN W3", Hiragino Kaku Gothic ProN, Arial, "メイリオ", Meiryo, sans-serif;
letter-spacing: 0.1em;
font-weight: 500;
letter-spacing: 0em;
}
.resultBlock .detail ul {
width: 232px;
margin: 0 auto 4px;
display: flex;
justify-content: space-between;
}
.resultBlock .detail ul li {
width: 114px;
padding: 7px 0;
font-size: 12px;
background: #10171e;
color: #fff;
font-family: "Barlow Semi Condensed", sans-serif;
font-weight: 400;
}
.resultBlock .detail ul li strong {
font-family: "Montserrat", "游ゴシック体", "Yu Gothic", YuGothic, "ヒラギノ角ゴ ProN W3", Hiragino Kaku Gothic ProN, Arial, "メイリオ", Meiryo, sans-serif;
letter-spacing: 0.1em;
font-weight: 400;
font-size: 14px;
}
.resultBlock .detail a.viewReport {
position: relative;
display: block;
margin: 0 auto;
padding: 13px 0;
background: #2f363d;
font-size: 12px;
font-family: "Montserrat", "游ゴシック体", "Yu Gothic", YuGothic, "ヒラギノ角ゴ ProN W3", Hiragino Kaku Gothic ProN, Arial, "メイリオ", Meiryo, sans-serif;
letter-spacing: 0.1em;
font-weight: 400;
transition: 0.3s;
}
.resultBlock .detail a.viewReport:hover {
color: #000;
background: #fff;
transition: 0.3s;
}
.resultBlock.super-gt {
border-top: 3px solid #d31a25;
}
.resultBlock.super-gt h2:before {
background-color: #d2232e;
transform: skewX(-23deg);
}
.resultBlock.super-gt a.viewall {
background: #d31a25;
}
.resultBlock.super-gt a.viewall:hover {
color: #d31a25;
}
.resultBlock.tcr-japan {
border-top: 3px solid #21a7a1;
}
.resultBlock.tcr-japan h2:before {
transform: skewX(-13deg);
background-color: #009c9a;
border-radius: 0 0 3px 0;
}
.resultBlock.tcr-japan a.viewall {
background: #21a7a1;
}
.resultBlock.tcr-japan a.viewall:hover {
color: #21a7a1;
}
.resultBlock.a1-fun-cup {
border-top: 3px solid #dbfd3e;
}
.resultBlock.a1-fun-cup h2:before {
background: url(https://hitotsuyamaracing.net/site_renewal/wp-content/themes/hitotsuyama/img/symbol_a1.svg) left top no-repeat;
background-size: contain;
}
.resultBlock.a1-fun-cup a.viewall {
color: #15202b;
background: #dbfd3e;
}
.resultBlock.super-taikyu {
border-top: 3px solid #312b7c;
}
.resultBlock.super-taikyu h2:before {
content: "";
position: absolute;
width: 20px;
height: 18px;
top: 0;
left: 50%;
margin-left: -10px;
background-color: #312b7c;
}
.resultBlock.super-taikyu a.viewall {
background: #282456;
}
.resultBlock.super-taikyu a.viewall:hover {
color: #282456;
}
.resultBlock.frj {
border-top: 3px solid #878992;
}
.resultBlock.frj h2:before {
content: "";
position: absolute;
width: 20px;
height: 18px;
top: 0;
left: 50%;
margin-left: -10px;
clip-path: polygon(50% 0%, 100% 38%, 82% 100%, 18% 100%, 0% 38%);
background-color: #878992;
}
.resultBlock.frj a.viewall {
background: #878992;
}
.resultBlock.frj a.viewall:hover {
color: #282456;
}
.resultBlock.japan-cup {
border-top: 3px solid #ee0000;
}
.resultBlock.japan-cup h2:before {
content: "";
position: absolute;
width: 20px;
height: 20px;
border-radius: 100%;
top: 0;
left: 50%;
margin-left: -10px;
background-color: #ee0000;
}
.resultBlock.japan-cup a.viewall {
background: #ee0000;
}
.resultBlock.japan-cup a.viewall:hover {
color: #282456;
}
.resultBlock.free-practice-day {
border-top: 3px solid #ff6600;
}
.resultBlock.free-practice-day h2:before {
content: "";
position: absolute;
width: 20px;
height: 20px;
border-radius: 20px;
top: 0;
left: 50%;
margin-left: -10px;
background-color: #ff6600;
}
.resultBlock.free-practice-day a.viewall {
background: #ff6600;
}
.resultBlock.free-practice-day a.viewall:hover {
color: #282456;
}
.resultBlock.fia-f4 {
border-top: 3px solid #00aeff;
}
.resultBlock.fia-f4 h2:before {
transform: skewX(-23deg);
background-color: #00aeff;
}
.resultBlock.fia-f4 a.viewall {
background: #00aeff;
}
.resultBlock.fia-f4 a.viewall:hover {
color: #00aeff;
} #toppageWrap #topResult {
position: relative;
margin-bottom: 3vw; }
#toppageWrap #topResult h3 {
position: relative;
display: block;
text-align: center;
color: #8899a6;
background: #000;
font-size: 16px;
font-weight: bold;
margin: 0;
padding: 6px 0 8px;
font-family: "Barlow Semi Condensed", "游ゴシック体", "Yu Gothic", YuGothic, "ヒラギノ角ゴ ProN W3", Hiragino Kaku Gothic ProN, Arial, "メイリオ", Meiryo, sans-serif;
letter-spacing: 0.1em;
background: #000;
}
#toppageWrap #topResult #result_toggle {
position: absolute;
top: 20px;
right: 13px;
width: 4vw;
height: 4vw;
z-index: 10;
}
@media screen and (min-width: 767px) {
#toppageWrap #topResult #result_toggle { display: none;
}
}
@media screen and (max-width: 767px) {
#toppageWrap #topResult #result_toggle { display: block;
}
}
#toppageWrap #topResult #result_toggle div {
position: relative;
}
#toppageWrap #topResult #result_toggle span {
display: block;
height: 2px;
background: #8899a6;
position: absolute;
width: 100%;
left: 0;
-webkit-transition: 0.2s ease-in-out;
-moz-transition: 0.2s ease-in-out;
transition: 0.2s ease-in-out;
}
#toppageWrap #topResult #result_toggle span:nth-child(1) {
top: 50%;
}
#toppageWrap #topResult #result_toggle span:nth-child(2) {
top: 0;
transform: rotate(90deg);
}
#toppageWrap #topResult #result_toggle.open { }
#toppageWrap #topResult #result_toggle.open span {
background: #8899a6;
}
#toppageWrap #topResult #result_toggle.open span:nth-child(1) {
top: 0;
transform: rotate(135deg);
}
#toppageWrap #topResult #result_toggle.open span:nth-child(2) {
top: 0;
transform: rotate(225deg);
}
#toppageWrap #topResult #topResultWrap {
display: none;
width: 100%;
padding: 5vw 0;
background: #000;
}
#toppageWrap #topResult .resultBlock {
text-align: center;
padding-bottom: 4px;
width: 90%;
margin: 0 auto;
}
#toppageWrap #topResult .resultBlock a {
text-decoration: none;
}
#toppageWrap #topResult .resultBlock .title {
position: relative;
display: flex;
justify-content: space-between;
padding-top: 10px;
background: none;
margin-bottom: 0;
margin-bottom: 2px;
}
#toppageWrap #topResult .resultBlock .title h2 {
position: relative;
padding-top: 0px;
padding-left: 0px;
margin-left: 10px;
text-align: left;
line-height: 1.4;
}
#toppageWrap #topResult .resultBlock .title h2:before {
content: "";
position: absolute;
width: 14px;
height: 18px;
top: 5px;
left: 3px;
margin-left: 0px;
}
#toppageWrap #topResult .resultBlock .title h2 span {
display: block;
font-family: "Montserrat", "游ゴシック体", "Yu Gothic", YuGothic, "ヒラギノ角ゴ ProN W3", Hiragino Kaku Gothic ProN, Arial, "メイリオ", Meiryo, sans-serif;
letter-spacing: 0.1em;
transform: scale(1, 0.8);
font-size: 20px;
font-feature-settings: "palt";
font-weight: 400;
letter-spacing: 0.05em;
padding-left: 30px;
}
#toppageWrap #topResult .resultBlock .title a.viewall {
display: inline-block;
margin-bottom: 15px;
padding: 0px 10px 2px;
transition: 0.3s;
line-height: 1.4;
}
#toppageWrap #topResult .resultBlock .title a.viewall span {
font-size: 12px;
font-family: "Montserrat", "游ゴシック体", "Yu Gothic", YuGothic, "ヒラギノ角ゴ ProN W3", Hiragino Kaku Gothic ProN, Arial, "メイリオ", Meiryo, sans-serif;
letter-spacing: 0.1em;
font-weight: 600;
}
#toppageWrap #topResult .resultBlock .title a.viewall:hover {
background: #fff;
transition: 0.3s;
}
#toppageWrap #topResult .resultBlock .detail {
background: none;
padding-bottom: 4px;
}
#toppageWrap #topResult .resultBlock .detail .scheduleBlock {
margin-bottom: 0;
}
#toppageWrap #topResult .resultBlock .detail .btnReport {
background: none;
}
#toppageWrap #topResult .resultBlock .detail .btnReport a {
position: relative;
display: block;
margin: 0 auto;
padding: 1vw 0;
background: #2f363d;
font-size: 15px;
font-family: "Montserrat", "游ゴシック体", "Yu Gothic", YuGothic, "ヒラギノ角ゴ ProN W3", Hiragino Kaku Gothic ProN, Arial, "メイリオ", Meiryo, sans-serif;
letter-spacing: 0.1em;
font-weight: 400;
border-radius: 3px;
} #news {
margin: 0 auto;
}
@media screen and (min-width: 767px) {
#news { width: 700px;
}
}
@media screen and (max-width: 767px) {
#news { width: 100%;
}
}
@media screen and (min-width: 767px) {
#news p { padding: 0 15px;
}
}
@media screen and (max-width: 767px) {
#news p { width: 96%;
margin-left: auto;
margin-right: auto;
padding: 0 5vw;
}
}
#news p.date,
#news p.term {
display: inline-block;
width: 49%;
}
#news p.term {
text-align: right;
}
@media screen and (max-width: 767px) {
#news h2,
#news h1 { width: 96%;
margin-left: auto;
margin-right: auto;
padding: 0 5vw;
}
}
#news h1 {
line-height: 1.6;
}
@media screen and (min-width: 767px) {
#news h1 { font-size: 30px;
margin-bottom: 10px;
padding: 0 15px;
}
}
@media screen and (max-width: 767px) {
#news h1 { font-size: 24px;
margin-bottom: 15px;
}
}
#news h2 {
color: #fff;
text-align: left;
margin-bottom: 20px;
background: #000;
font-size: 20px;
}
@media screen and (min-width: 767px) {
#news h2 { padding: 5px 15px;
}
}
@media screen and (max-width: 767px) {
#news h2 { padding: 3px 3vw;
line-height: 1.4;
width: 92%;
}
}
#news h2.reportTitle {
font-family: "Barlow Semi Condensed", "游ゴシック体", "Yu Gothic", YuGothic, "ヒラギノ角ゴ ProN W3", Hiragino Kaku Gothic ProN, Arial, "メイリオ", Meiryo, sans-serif;
letter-spacing: 0.1em;
color: #8899a6;
font-weight: bold;
text-align: left;
margin-bottom: 20px;
background: none;
}
@media screen and (min-width: 767px) {
#news h2.reportTitle { padding: 0 15px;
}
}
@media screen and (max-width: 767px) {
#news h2.reportTitle { font-size: 16px;
padding: 0 5vw;
width: 96%;
}
}
#news h3 {
font-family: "Barlow Semi Condensed", "游ゴシック体", "Yu Gothic", YuGothic, "ヒラギノ角ゴ ProN W3", Hiragino Kaku Gothic ProN, Arial, "メイリオ", Meiryo, sans-serif;
letter-spacing: 0.1em;
transform: scale(1, 1);
margin-bottom: 30px;
text-align: left;
font-size: 20px;
}
#news .wp-caption-text {
text-align: center;
font-size: 0.8em;
margin: 10px 0 20px;
padding: 0;
}
#news .alignleft {
float: left;
margin-right: 20px;
}
@media screen and (max-width: 767px) {
#news .alignleft { float: none;
margin: 0 auto;
}
}
#news .alignright {
float: right;
margin-left: 20px;
}
@media screen and (max-width: 767px) {
#news .alignright { float: none;
margin: 0 auto;
}
}
@media screen and (min-width: 767px) {
#news p { margin-bottom: 30px;
}
}
@media screen and (max-width: 767px) {
#news p { margin: 0 auto 30px;
}
}
#news p.date {
font-size: 15px;
letter-spacing: 0.1em;
font-family: "Barlow Semi Condensed", "游ゴシック体", "Yu Gothic", YuGothic, "ヒラギノ角ゴ ProN W3", Hiragino Kaku Gothic ProN, Arial, "メイリオ", Meiryo, sans-serif;
letter-spacing: 0.1em;
color: #8899a6;
}
@media screen and (min-width: 767px) {
#news p.date { margin: 0;
}
}
@media screen and (max-width: 767px) {
#news p.date { margin: 0 auto;
}
}
#news p.term {
font-size: 15px;
letter-spacing: 0.1em;
font-family: "Barlow Semi Condensed", "游ゴシック体", "Yu Gothic", YuGothic, "ヒラギノ角ゴ ProN W3", Hiragino Kaku Gothic ProN, Arial, "メイリオ", Meiryo, sans-serif;
letter-spacing: 0.1em;
color: #8899a6;
margin-bottom: 10px;
}
@media screen and (max-width: 767px) {
#news iframe { display: block;
width: 96%;
margin: 0 auto 30px;
}
}
#news .article iframe {
display: block;
position: relative;
margin: 0 auto 50px;
background: #fff;
}
#news .article p.strong {
font-weight: bold;
}
#news .article dl {
display: flex;
justify-content: space-between;
flex-wrap: wrap;
width: 100%;
border-bottom: 1px solid #fff;
}
#news .article dl dt {
width: 33%;
padding: 15px 20px;
background: #000;
border-left: 1px solid #fff;
border-top: 1px solid #fff;
}
#news .article dl dd {
width: 67%;
padding: 15px 20px;
border-left: 1px solid #fff;
border-top: 1px solid #fff;
border-right: 1px solid #fff;
}
#news .article dl p {
margin: 0;
}
#news .article dl a {
text-decoration: underline;
}
#news .article table {
width: 100%;
border-bottom: 1px solid #fff;
border-left: 1px solid #fff;
margin-bottom: 10px;
border-collapse: collapse;
}
#news .article table tr {
width: 100%;
}
#news .article table tr th, #news .article table tr td {
padding: 15px 20px;
border: 0;
border-right: 1px solid #fff;
border-top: 1px solid #fff;
}
#news .article table tr th p, #news .article table tr td p {
margin: 0;
}
#news .article table tr th a, #news .article table tr td a {
text-decoration: underline;
}
#news .article table tr th.left, #news .article table tr td.left {
text-align: left;
}
#news .article table tr th.center, #news .article table tr td.center {
text-align: center;
}
#news .article table tr th.right, #news .article table tr td.right {
text-align: right;
}
#news .article table tr th {
background: #000;
}
#news .article .drivers,
#news .article .ambassadors {
display: flex;
gap: 20px; justify-content: center; margin-bottom: 30px;
}
@media screen and (max-width: 767px) {
#news .article .drivers,
#news .article .ambassadors { flex-wrap: wrap;
flex-direction: column;
align-items: center; }
}
#news .article .drivers figure,
#news .article .ambassadors figure {
text-align: center;
}
#news .article .drivers figure figcaption,
#news .article .ambassadors figure figcaption {
font-size: 14px;
margin: 10px 10px 0;
}
#news .article .drivers figure img,
#news .article .ambassadors figure img {
display: block;
}
@media screen and (min-width: 767px) {
#news .article .drivers figure img,
#news .article .ambassadors figure img { max-width: auto;
}
}
@media screen and (max-width: 767px) {
#news .article .drivers figure img,
#news .article .ambassadors figure img { }
}
@media screen and (min-width: 767px) {
#news .article .ambassadors figure { max-width: 33%;
}
}
@media screen and (max-width: 767px) {
#news .article .ambassadors figure { }
}
#news .article .ambassadors figure img {
display: block;
}
@media screen and (min-width: 767px) {
#news .article ul:not([class]) { margin: 0 15px 30px;
}
}
@media screen and (max-width: 767px) {
#news .article ul:not([class]) { width: 96%;
margin: 0 auto 30px;
padding: 0 5vw;
}
}
#news .article ul:not([class]) li {
position: relative;
line-height: 1.5;
list-style: none;
}
@media screen and (min-width: 767px) {
#news .article ul:not([class]) li {
padding: 0 0 0 20px;
font-size: 16px;
}
}
@media screen and (max-width: 767px) {
#news .article ul:not([class]) li {
padding: 0 0 0 20px;
font-size: 16px;
}
}
#news .article ul:not([class]) li a {
text-decoration: underline;
}
@media screen and (min-width: 767px) {
#news .article ul:not([class]) li + li {
margin-top: 10px;
}
}
@media screen and (max-width: 767px) {
#news .article ul:not([class]) li + li {
margin-top: 10px;
}
}
#news .article ul:not([class]) li::before {
content: "●";
position: absolute;
top: 0;
left: 0;
transform: scale(50%);
}
#news .article figure {
margin: 0 0 15px;
padding: 0;
}
@media screen and (min-width: 767px) {
#news .article .table-wrap { padding: 0 15px;
margin: 0 auto 50px;
}
}
@media screen and (max-width: 767px) {
#news .article .table-wrap { width: 96%;
padding: 0 5vw;
margin: 0 auto 50px;
}
}
#news .article .leftImg {
display: flex;
justify-content: space-between;
flex-wrap: wrap;
margin-bottom: 30px;
}
@media screen and (min-width: 767px) {
#news .article .leftImg { padding: 0 15px;
}
}
@media screen and (min-width: 767px) {
#news .article .leftImg .pic { width: 250px;
}
}
@media screen and (max-width: 767px) {
#news .article .leftImg .pic { width: 50%;
margin: 0 auto 10px;
text-align: center;
}
}
#news .article .leftImg .pic figure {
width: 100%;
text-align: center;
}
@media screen and (max-width: 767px) {
#news .article .leftImg .pic figure img { width: 100%;
}
}
@media screen and (min-width: 767px) {
#news .article .leftImg .text { width: calc(100% - 250px);
}
}
@media screen and (max-width: 767px) {
#news .article .leftImg .text { width: 100%;
}
}
@media screen and (min-width: 767px) {
#news .article .leftImg .text p { padding: 0 0 0 30px;
}
}
@media screen and (max-width: 767px) {
#news .article .leftImg .text p { }
} .contents#driver {
width: 100%;
}
@media screen and (min-width: 767px) {
.contents#driver .profileWrap { margin-bottom: 150px;
}
}
@media screen and (max-width: 767px) {
.contents#driver .profileWrap { margin-bottom: 50px;
}
}
.contents#driver .profileWrap .wide .profile {
background-position: center top;
background-repeat: no-repeat;
}
@media screen and (min-width: 767px) {
.contents#driver .profileWrap .wide .profile { min-height: 650px;
margin-bottom: -100px;
}
}
@media screen and (max-width: 767px) {
.contents#driver .profileWrap .wide .profile { width: 100%;
background-size: 200% auto !important;
background-position-x: 10% !important;
padding-top: 90vw;
}
}
.contents#driver .profileWrap .wide .profile h2 {
font-feature-settings: "palt";
}
@media screen and (min-width: 767px) {
.contents#driver .profileWrap .wide .profile h2 { font-size: 32px;
text-align: left;
}
}
@media screen and (max-width: 767px) {
.contents#driver .profileWrap .wide .profile h2 { font-size: 24px;
text-align: center;
}
}
@media screen and (min-width: 767px) {
.contents#driver .profileWrap .wide .profile .text { width: 500px;
position: relative;
left: 50%;
padding-top: 180px;
margin-left: 50px;
}
}
@media screen and (max-width: 767px) {
.contents#driver .profileWrap .wide .profile .text { width: 96%;
margin: 0 auto;
}
}
@media screen and (max-width: 767px) {
.contents#driver .profileWrap .wide .profile .text p { padding: 0 3vw;
}
}
.contents#driver .profileWrap .wide .profile .text p.english {
font-family: "Barlow Semi Condensed", "游ゴシック体", "Yu Gothic", YuGothic, "ヒラギノ角ゴ ProN W3", Hiragino Kaku Gothic ProN, Arial, "メイリオ", Meiryo, sans-serif;
letter-spacing: 0.1em;
color: #8899a6;
margin-bottom: 20px;
}
@media screen and (max-width: 767px) {
.contents#driver .profileWrap .wide .profile .text p.english { text-align: center;
}
}
.contents#driver .profileWrap .small ul {
display: flex;
justify-content: space-between;
flex-wrap: wrap;
margin: 0 auto;
}
@media screen and (min-width: 767px) {
.contents#driver .profileWrap .small ul { width: 1080px;
}
}
@media screen and (max-width: 767px) {
.contents#driver .profileWrap .small ul { width: 96%;
}
}
@media screen and (min-width: 767px) {
.contents#driver .profileWrap .small ul li { width: calc((100% - 10px) / 3);
margin-bottom: 50px;
}
}
@media screen and (max-width: 767px) {
.contents#driver .profileWrap .small ul li { width: 100%;
margin-bottom: 50px;
}
}
.contents#driver .profileWrap .small ul li h4 {
color: #fff;
margin: 0 auto;
text-align: center;
font-size: 24px;
line-height: 1.4;
}
.contents#driver .profileWrap .small ul li h5 {
text-align: center;
font-family: "Montserrat", "游ゴシック体", "Yu Gothic", YuGothic, "ヒラギノ角ゴ ProN W3", Hiragino Kaku Gothic ProN, Arial, "メイリオ", Meiryo, sans-serif;
letter-spacing: 0.1em;
font-size: 16px;
font-weight: 300;
color: #8899a6;
margin-bottom: 10px;
}
@media screen and (min-width: 767px) {
.contents#driver .profileWrap .small ul li img { width: 100%;
height: auto;
margin-bottom: 15px;
}
}
@media screen and (max-width: 767px) {
.contents#driver .profileWrap .small ul li img { width: 100%;
margin-bottom: 20px;
}
}
.contents#driver .profileWrap .small ul li p {
letter-spacing: 0;
text-align: center;
font-size: 16px;
line-height: 1.6;
}
@media screen and (min-width: 767px) {
.contents#driver .profileWrap .small ul::after { content: "";
display: block;
width: calc((100% - 10px) / 3);
}
}
@media screen and (min-width: 767px) {
.contents#driver .postList { width: 1080px;
margin: 50px auto;
}
}
@media screen and (max-width: 767px) {
.contents#driver .postList { }
} .contents#machine .lead {
margin-top: 0;
}
.contents#machine h2 {
text-align: center;
color: #8899a6;
padding-top: 20px;
margin-bottom: 20px;
}
.contents#machine h3 {
font-family: "Montserrat", "游ゴシック体", "Yu Gothic", YuGothic, "ヒラギノ角ゴ ProN W3", Hiragino Kaku Gothic ProN, Arial, "メイリオ", Meiryo, sans-serif;
letter-spacing: 0.1em;
transform: scale(1, 0.9);
font-weight: 400;
color: #8899a6;
margin-bottom: 20px;
text-align: center;
}
.contents#machine .spec {
margin-bottom: 50px;
}
.contents#machine ul.machine_gallery {
display: flex;
justify-content: space-between;
flex-wrap: wrap;
margin-bottom: 100px;
}
@media screen and (max-width: 767px) {
.contents#machine ul.machine_gallery { width: 90%;
margin: 0 auto 50px;
}
}
@media screen and (min-width: 767px) {
.contents#machine ul.machine_gallery li { width: calc((100% - 60px) / 4);
margin-bottom: 20px;
}
}
@media screen and (max-width: 767px) {
.contents#machine ul.machine_gallery li { width: calc((100% - 10px) / 2);
margin-bottom: 5px;
}
}
.contents#machine ul.machine_gallery li img {
width: 100%;
height: auto;
}
.contents#machine .mainPic img {
width: 100%;
height: auto;
margin-bottom: 50px;
} .contents#gallery .lead {
margin-top: 0;
}
@media screen and (min-width: 767px) {
.contents#gallery .lead { margin-bottom: 50px;
}
}
@media screen and (max-width: 767px) {
.contents#gallery .lead { margin-bottom: 20px;
}
}
.contents#gallery .lead p {
line-height: 1.6;
}
@media screen and (min-width: 767px) {
.contents#gallery .lead p { text-align: center;
}
}
@media screen and (max-width: 767px) {
.contents#gallery .lead p { text-align: left;
margin-bottom: 30px;
}
}
.contents#gallery h2 {
width: 90%;
margin: 0 auto 20px;
line-height: 1.4;
}
@media screen and (min-width: 767px) {
.contents#gallery h2 { text-align: center;
}
}
@media screen and (max-width: 767px) {
.contents#gallery h2 { }
}
.contents#gallery .backtoList {
display: block;
width: 300px;
font-weight: bold;
text-align: center;
margin: 0 auto;
cursor: pointer;
border: 1px solid #8899a6;
border-radius: 3px;
transition: 0.3s;
}
@media screen and (min-width: 767px) {
.contents#gallery .backtoList { margin-bottom: 50px;
}
}
@media screen and (max-width: 767px) {
.contents#gallery .backtoList { margin-bottom: 60px;
}
}
.contents#gallery .backtoList a {
display: block;
font-family: "Montserrat", "游ゴシック体", "Yu Gothic", YuGothic, "ヒラギノ角ゴ ProN W3", Hiragino Kaku Gothic ProN, Arial, "メイリオ", Meiryo, sans-serif;
letter-spacing: 0.1em;
color: #8899a6;
transition: 0.3s;
text-decoration: none;
}
@media screen and (min-width: 767px) {
.contents#gallery .backtoList a { padding: 5px 50px;
}
}
@media screen and (max-width: 767px) {
.contents#gallery .backtoList a { padding: 5px 10px;
}
}
.contents#gallery .backtoList:hover {
background: #8899a6;
transition: 0.3s;
}
.contents#gallery .backtoList:hover a {
color: #fff;
transition: 0.3s;
}
.contents#gallery ul.photoGallery {
display: flex;
justify-content: space-between;
flex-wrap: wrap;
margin-bottom: 50px;
}
@media screen and (max-width: 767px) {
.contents#gallery ul.photoGallery { width: 90%;
margin: 0 auto 30px;
}
}
.contents#gallery ul.photoGallery::before {
content: "";
display: block;
order: 1;
}
@media screen and (min-width: 767px) {
.contents#gallery ul.photoGallery::before { width: calc((100% - 60px) / 4);
}
}
@media screen and (max-width: 767px) {
.contents#gallery ul.photoGallery::before { width: calc((100% - 20px) / 3);
}
}
.contents#gallery ul.photoGallery::after {
content: "";
display: block;
}
@media screen and (min-width: 767px) {
.contents#gallery ul.photoGallery::after { width: calc((100% - 60px) / 4);
}
}
@media screen and (max-width: 767px) {
.contents#gallery ul.photoGallery::after { width: calc((100% - 20px) / 3);
}
}
.contents#gallery ul.photoGallery li {
margin-bottom: 20px;
transition: 0.3s;
}
@media screen and (min-width: 767px) {
.contents#gallery ul.photoGallery li { width: calc((100% - 60px) / 4);
}
}
@media screen and (max-width: 767px) {
.contents#gallery ul.photoGallery li { width: calc((100% - 20px) / 3);
}
}
.contents#gallery ul.photoGallery li img {
width: 100%;
height: auto;
}
.contents#gallery ul.photoGallery li:hover {
opacity: 0.5;
transition: 0.3s;
} h1.titSponsor {
text-align: center;
font-family: "Montserrat", "游ゴシック体", "Yu Gothic", YuGothic, "ヒラギノ角ゴ ProN W3", Hiragino Kaku Gothic ProN, Arial, "メイリオ", Meiryo, sans-serif;
letter-spacing: 0.1em;
transform: scale(1, 1);
color: #fff;
font-weight: 400;
margin-bottom: 50px;
background: #192530;
background-position: center center;
background-repeat: no-repeat;
margin: 0 0 50px;
line-height: 1;
}
@media screen and (min-width: 767px) {
h1.titSponsor { font-size: 30px;
padding: 70px 0;
}
}
@media screen and (max-width: 767px) {
h1.titSponsor { font-size: 24px;
padding: 30px 0;
background-size: cover;
}
}
h1.titSponsor span {
display: block;
transform: scale(1, 0.9);
}
#sponsorList ul {
display: flex;
justify-content: end;
flex-wrap: wrap;
margin: 0 auto 50px;
}
@media screen and (min-width: 767px) {
#sponsorList ul { width: 1080px;
}
}
@media screen and (max-width: 767px) {
#sponsorList ul { width: 100%;
}
}
#sponsorList ul li {
margin-bottom: 7px;
box-sizing: border-box;
text-align: center;
transition: 0.3s;
}
@media screen and (min-width: 767px) {
#sponsorList ul li { width: calc((100% - 10px) / 3);
}
}
@media screen and (max-width: 767px) {
#sponsorList ul li { width: calc((100% - 10px) / 2);
}
}
#sponsorList ul li:hover {
opacity: 0.5;
transition: 0.3s;
}
#sponsorList ul li .sponsorLogo {
position: relative;
display: table-cell;
text-align: center;
vertical-align: middle;
}
@media screen and (min-width: 767px) {
#sponsorList ul li .sponsorLogo { height: 250px;
}
}
@media screen and (max-width: 767px) {
#sponsorList ul li .sponsorLogo { height: 30vw;
}
}
#sponsorList ul li .sponsorLogo img {
position: relative;
display: block;
width: 80%;
height: auto;
max-height: 250px;
margin: 0 auto 10px;
}
#sponsorList ul li h2 {
text-align: center;
font-size: 16px;
}
@media screen and (min-width: 767px) {
#sponsorList ul::after { content: "";
display: block;
width: calc((100% - 10px) / 3);
}
}
#sponsor {
margin: 0 auto;
}
@media screen and (min-width: 767px) {
#sponsor { width: 700px;
}
}
@media screen and (max-width: 767px) {
#sponsor { width: 90%;
}
}
#sponsor .logo {
text-align: center;
margin-bottom: 30px;
}
@media screen and (min-width: 767px) {
#sponsor .logo { padding: 80px 0;
}
}
@media screen and (max-width: 767px) {
#sponsor .logo { padding: 50px 0;
}
}
@media screen and (min-width: 767px) {
#sponsor .logo img { width: auto;
height: auto;
}
}
@media screen and (max-width: 767px) {
#sponsor .logo img { width: 50%;
height: auto;
margin: 0 auto;
}
}
#sponsor h2 {
line-height: 1.6;
font-family: inherit;
text-align: center;
color: #fff;
transform: scale(1, 1);
}
@media screen and (min-width: 767px) {
#sponsor h2 { font-size: 24px;
}
}
@media screen and (max-width: 767px) {
#sponsor h2 { font-size: 20px;
}
}
#sponsor p {
margin-bottom: 30px;
}
#sponsor p.eng {
text-align: center;
font-family: "Barlow Semi Condensed", "游ゴシック体", "Yu Gothic", YuGothic, "ヒラギノ角ゴ ProN W3", Hiragino Kaku Gothic ProN, Arial, "メイリオ", Meiryo, sans-serif;
letter-spacing: 0.1em;
color: #8899a6;
font-size: 16px;
font-weight: 600;
}
#sponsor .article p.strong {
font-weight: bold;
}
#sponsor .article dl {
display: flex;
justify-content: space-between;
flex-wrap: wrap;
width: 100%;
border-bottom: 1px solid #fff;
}
#sponsor .article dl dt {
width: 30%;
padding: 15px 20px;
background: #000;
border-left: 1px solid #fff;
border-top: 1px solid #fff;
}
#sponsor .article dl dd {
width: 70%;
padding: 15px 20px;
border-left: 1px solid #fff;
border-top: 1px solid #fff;
border-right: 1px solid #fff;
}
#sponsor .article dl p {
margin: 0;
}
#sponsor .article dl a {
text-decoration: underline;
}
#sponsor .article figure {
margin: 0;
padding: 0;
} h1.titAbout {
text-align: center;
font-family: "Montserrat", "游ゴシック体", "Yu Gothic", YuGothic, "ヒラギノ角ゴ ProN W3", Hiragino Kaku Gothic ProN, Arial, "メイリオ", Meiryo, sans-serif;
letter-spacing: 0.1em;
transform: scale(1, 1);
color: #fff;
font-weight: 400;
line-height: 1;
background: #192530;
background-position: center center;
background-repeat: no-repeat;
}
@media screen and (min-width: 767px) {
h1.titAbout { font-size: 30px;
padding: 70px 0;
}
}
@media screen and (max-width: 767px) {
h1.titAbout { font-size: 24px;
margin: 0 0 20px;
padding: 30px 0;
background-size: cover;
}
}
h1.titAbout span {
display: block;
transform: scale(1, 0.9);
}
#privacypolicy {
margin: 0 auto 100px;
}
@media screen and (min-width: 767px) {
#privacypolicy { width: 740px;
padding-top: 50px;
}
}
@media screen and (max-width: 767px) {
#privacypolicy { width: 96%;
padding: 30px 3vw 0;
}
}
#privacypolicy p {
margin-bottom: 30px;
}
#privacypolicy h2 {
color: #8899a6;
text-align: center;
margin-bottom: 50px;
}
#privacypolicy h3 {
margin-bottom: 15px;
}
#basicWrap {
margin: 0 auto 100px;
}
@media screen and (min-width: 767px) {
#basicWrap { width: 1080px;
}
}
@media screen and (max-width: 767px) {
#basicWrap { width: 96%;
}
}
#basicWrap p {
margin-bottom: 30px;
}
#basicWrap h3 {
margin-bottom: 15px;
}
@media screen and (min-width: 767px) {
#aboutWrap { width: 1080px;
margin: 0 auto 100px;
}
}
@media screen and (max-width: 767px) {
#aboutWrap { width: 96%;
margin: 0 auto 50px;
}
}
#aboutWrap .tab ul {
display: flex;
justify-content: space-between;
}
@media screen and (min-width: 767px) {
#aboutWrap .tab ul { width: 1080px;
padding-top: 30px;
margin: 0 auto 50px;
}
}
@media screen and (max-width: 767px) {
#aboutWrap .tab ul { width: 100%;
flex-wrap: wrap;
margin: 0 auto 30px;
}
}
#aboutWrap .tab ul li {
text-align: center;
line-height: 1.2;
font-weight: bold;
transition: 0.3s;
border-right: 1px solid #42455b;
cursor: pointer;
}
@media screen and (min-width: 767px) {
#aboutWrap .tab ul li { width: 25%;
}
}
@media screen and (max-width: 767px) {
#aboutWrap .tab ul li { width: 50%;
}
}
@media screen and (min-width: 767px) {
#aboutWrap .tab ul li:first-child { border-left: 1px solid #42455b;
}
}
@media screen and (max-width: 767px) {
#aboutWrap .tab ul li:first-child { border-bottom: 1px solid #42455b;
}
}
@media screen and (max-width: 767px) {
#aboutWrap .tab ul li:nth-child(2) { border-right: none;
border-bottom: 1px solid #42455b;
}
}
@media screen and (max-width: 767px) {
#aboutWrap .tab ul li:nth-child(3) { border-bottom: none;
}
}
@media screen and (max-width: 767px) {
#aboutWrap .tab ul li:nth-child(4) { border: none;
}
}
#aboutWrap .tab ul li a {
display: block;
text-decoration: none;
}
@media screen and (min-width: 767px) {
#aboutWrap .tab ul li a { padding: 10px 0;
font-size: 18px;
}
}
@media screen and (max-width: 767px) {
#aboutWrap .tab ul li a { padding-bottom: 5px;
padding-top: 15px;
font-size: 3.5vw;
}
}
#aboutWrap .tab ul li a:hover {
color: #8899a6;
transition: 0.3s;
}
#aboutWrap .tab ul li span {
display: block;
font-family: "Montserrat", "游ゴシック体", "Yu Gothic", YuGothic, "ヒラギノ角ゴ ProN W3", Hiragino Kaku Gothic ProN, Arial, "メイリオ", Meiryo, sans-serif;
letter-spacing: 0.1em;
color: #8899a6;
font-weight: 400;
font-size: 14px;
transform: scale(1, 0.9);
padding: 5px 0;
}
@media screen and (min-width: 767px) {
#aboutWrap .tab ul li span { line-height: inherit;
}
}
@media screen and (max-width: 767px) {
#aboutWrap .tab ul li span { line-height: 1.2;
}
}
#aboutWrap .inner h2 {
color: #8899a6;
margin-bottom: 30px;
text-align: center;
}
@media screen and (min-width: 767px) {
#aboutWrap .inner .about { width: 700px;
margin: 0 auto;
}
}
#aboutWrap .inner .about p {
margin-bottom: 30px;
}
#aboutWrap .inner .history dl {
display: flex;
justify-content: space-between;
flex-wrap: wrap;
padding-top: 15px;
width: 100%;
font-family: "Barlow Semi Condensed", "游ゴシック体", "Yu Gothic", YuGothic, "ヒラギノ角ゴ ProN W3", Hiragino Kaku Gothic ProN, Arial, "メイリオ", Meiryo, sans-serif;
letter-spacing: 0.1em;
}
@media screen and (min-width: 767px) {
#aboutWrap .inner .history dl { border-top: 1px solid #8899a6;
}
}
#aboutWrap .inner .history dl dt {
margin-bottom: 15px;
font-size: 20px;
}
@media screen and (min-width: 767px) {
#aboutWrap .inner .history dl dt { width: 130px;
padding-bottom: 15px;
border-bottom: 1px solid #8899a6;
}
}
@media screen and (max-width: 767px) {
#aboutWrap .inner .history dl dt { width: 100%;
background: #000;
padding: 1vw 2vw;
}
}
#aboutWrap .inner .history dl dd {
display: flex;
justify-content: space-between;
flex-wrap: wrap;
align-items: flex-start;
margin-bottom: 15px;
}
@media screen and (min-width: 767px) {
#aboutWrap .inner .history dl dd { width: calc(100% - 130px);
border-bottom: 1px solid #8899a6;
}
}
@media screen and (max-width: 767px) {
#aboutWrap .inner .history dl dd { width: 100%;
padding: 0 2vw;
}
}
@media screen and (min-width: 767px) {
#aboutWrap .inner .history dl dd div { width: calc(100% - 330px);
}
}
@media screen and (max-width: 767px) {
#aboutWrap .inner .history dl dd div { width: 100%;
}
}
#aboutWrap .inner .history dl dd div h3 {
font-size: 20px;
margin-bottom: 10px;
line-height: 1.6;
}
#aboutWrap .inner .history dl dd div h3 span {
font-size: 17px;
margin-left: 5px;
padding: 0 5px;
border-radius: 2px;
border: 1px solid #fff;
}
#aboutWrap .inner .history dl dd div dl {
padding: 0;
border: none;
}
@media screen and (min-width: 767px) {
#aboutWrap .inner .history dl dd div dl { margin-bottom: 20px;
}
}
@media screen and (max-width: 767px) {
#aboutWrap .inner .history dl dd div dl { margin-bottom: 20px;
}
}
#aboutWrap .inner .history dl dd div dl dt {
width: 90px;
margin-bottom: 5px;
padding: 0;
border: none;
font-size: inherit;
background: none;
}
#aboutWrap .inner .history dl dd div dl dt span {
display: inline-block;
width: 80px;
font-size: 13px;
font-weight: bold;
line-height: 1.5;
text-align: center;
color: #10171e;
background: #fff;
border-radius: 2px;
}
#aboutWrap .inner .history dl dd div dl dd {
width: calc(100% - 90px);
padding: 0;
border: none;
margin-bottom: 5px;
}
@media screen and (min-width: 767px) {
#aboutWrap .inner .history dl dd .pic { width: 300px;
}
}
@media screen and (max-width: 767px) {
#aboutWrap .inner .history dl dd .pic { width: 100%;
}
}
#aboutWrap .inner .history dl dd .pic img {
width: 100%;
height: auto;
margin-top: 10px;
margin-bottom: 15px;
}
#aboutWrap .inner .information p {
margin-bottom: 50px;
}
@media screen and (min-width: 767px) {
#aboutWrap .inner .information p { text-align: center;
}
}
@media screen and (max-width: 767px) {
#aboutWrap .inner .information p { text-align: left;
}
}
#aboutWrap .inner .information dl {
display: flex;
justify-content: space-between;
flex-wrap: wrap;
padding-top: 15px;
}
@media screen and (min-width: 767px) {
#aboutWrap .inner .information dl { width: 700px;
margin: 0 auto;
}
}
@media screen and (max-width: 767px) {
#aboutWrap .inner .information dl { }
}
#aboutWrap .inner .information dl dt {
font-family: "Barlow Semi Condensed", "游ゴシック体", "Yu Gothic", YuGothic, "ヒラギノ角ゴ ProN W3", Hiragino Kaku Gothic ProN, Arial, "メイリオ", Meiryo, sans-serif;
letter-spacing: 0.1em;
color: #8899a6;
font-weight: 400;
font-size: 16px;
}
@media screen and (min-width: 767px) {
#aboutWrap .inner .information dl dt { width: 130px;
margin-bottom: 15px;
padding-bottom: 15px;
}
}
@media screen and (max-width: 767px) {
#aboutWrap .inner .information dl dt { width: 100%;
padding: 0 3vw;
}
}
@media screen and (min-width: 767px) {
#aboutWrap .inner .information dl dd { width: 570px;
margin-bottom: 15px;
padding-bottom: 15px;
}
}
@media screen and (max-width: 767px) {
#aboutWrap .inner .information dl dd { width: 100%;
padding: 0 3vw 20px;
}
}
#aboutWrap .inner .information dl dd a {
text-decoration: none;
}
@media screen and (max-width: 767px) {
.infoArticle table { width: 90%;
margin: 0 auto 15px;
}
}
h1.titActivities {
font-family: "Montserrat", "游ゴシック体", "Yu Gothic", YuGothic, "ヒラギノ角ゴ ProN W3", Hiragino Kaku Gothic ProN, Arial, "メイリオ", Meiryo, sans-serif;
letter-spacing: 0.1em;
text-align: center;
transform: scale(1, 1);
color: #fff;
font-weight: 400;
line-height: 1;
background: #192530;
background-position: center center;
background-repeat: no-repeat;
}
@media screen and (min-width: 767px) {
h1.titActivities { font-size: 30px;
padding: 70px 0;
margin-bottom: 30px;
}
}
@media screen and (max-width: 767px) {
h1.titActivities { font-size: 24px;
padding: 30px 0;
margin-bottom: 30px;
background-size: cover;
}
}
h1.titActivities span {
display: block;
transform: scale(1, 0.9);
}
@media screen and (min-width: 767px) {
#activitiesWrap { width: 1080px;
margin: 0 auto 100px;
}
}
@media screen and (max-width: 767px) {
#activitiesWrap { width: 96%;
margin: 0 auto 30px;
padding: 0 3vw;
}
}
#activitiesWrap .tab ul {
display: flex;
justify-content: space-between;
align-items: center;
}
@media screen and (min-width: 767px) {
#activitiesWrap .tab ul { width: 1080px;
margin: 0 auto 50px;
}
}
@media screen and (max-width: 767px) {
#activitiesWrap .tab ul { width: 100%;
flex-wrap: wrap;
margin: 0 auto 30px;
}
}
#activitiesWrap .tab ul li {
text-align: center;
line-height: 1.2;
font-weight: bold;
transition: 0.3s;
border-right: 1px solid #42455b;
cursor: pointer;
width: 33.3333333333%;
}
#activitiesWrap .tab ul li a {
display: block;
text-decoration: none;
}
@media screen and (min-width: 767px) {
#activitiesWrap .tab ul li a { padding: 10px 0;
font-size: 18px;
}
}
@media screen and (max-width: 767px) {
#activitiesWrap .tab ul li a { padding: 0;
font-size: 4vw;
}
}
@media screen and (min-width: 767px) {
#activitiesWrap .tab ul li:first-child { border-left: 1px solid #42455b;
}
}
@media screen and (max-width: 767px) {
#activitiesWrap .tab ul li:nth-child(2) { }
#activitiesWrap .tab ul li:nth-child(2) a {
line-height: 2.4em;
}
}
@media screen and (max-width: 767px) {
#activitiesWrap .tab ul li:nth-child(3) { border-right: none;
}
}
#activitiesWrap .tab ul li:hover {
color: #8899a6;
transition: 0.3s;
}
#activitiesWrap .tab ul li span {
display: block;
font-family: "Montserrat", "游ゴシック体", "Yu Gothic", YuGothic, "ヒラギノ角ゴ ProN W3", Hiragino Kaku Gothic ProN, Arial, "メイリオ", Meiryo, sans-serif;
letter-spacing: 0.1em;
transform: scale(1, 0.9);
color: #8899a6;
font-weight: 400;
padding: 5px 0;
}
@media screen and (min-width: 767px) {
#activitiesWrap .tab ul li span { font-size: 14px;
line-height: inherit;
}
}
@media screen and (max-width: 767px) {
#activitiesWrap .tab ul li span { font-size: 12px;
line-height: 1.2;
display: none;
}
}
#activitiesWrap h2 {
font-family: "Barlow Semi Condensed", "游ゴシック体", "Yu Gothic", YuGothic, "ヒラギノ角ゴ ProN W3", Hiragino Kaku Gothic ProN, Arial, "メイリオ", Meiryo, sans-serif;
letter-spacing: 0.1em;
text-align: center;
color: #8899a6;
font-weight: bold;
}
@media screen and (min-width: 767px) {
#activitiesWrap h2 { font-size: 30px;
margin-bottom: 50px;
}
}
@media screen and (max-width: 767px) {
#activitiesWrap h2 { font-size: 24px;
margin-bottom: 20px;
}
}
#activitiesWrap h3 {
font-family: "Barlow Semi Condensed", "游ゴシック体", "Yu Gothic", YuGothic, "ヒラギノ角ゴ ProN W3", Hiragino Kaku Gothic ProN, Arial, "メイリオ", Meiryo, sans-serif;
letter-spacing: 0.1em;
color: #8899a6;
font-size: 24px;
font-weight: bold;
margin-bottom: 10px;
}
#activitiesWrap h4 {
font-family: "Barlow Semi Condensed", "游ゴシック体", "Yu Gothic", YuGothic, "ヒラギノ角ゴ ProN W3", Hiragino Kaku Gothic ProN, Arial, "メイリオ", Meiryo, sans-serif;
letter-spacing: 0.1em;
color: #8899a6;
font-size: 18px;
font-weight: bold;
margin-bottom: 10px;
}
#activitiesWrap p {
margin-bottom: 30px;
}
#activitiesWrap p.note {
font-size: 13px;
color: #8899a6;
}
#activitiesWrap p.lead {
text-align: left;
}
@media screen and (min-width: 767px) {
#activitiesWrap p.lead { width: 780px;
margin: 0 auto 80px;
}
}
@media screen and (max-width: 767px) {
#activitiesWrap p.lead { width: 96%;
margin: 0 auto 30px;
}
}
#activitiesWrap ul.notice {
margin-bottom: 50px;
}
#activitiesWrap ul.notice li {
margin-left: 20px;
list-style: disc;
}
#activitiesWrap.activitiesTop p.lead {
margin-bottom: 50px;
}
#activitiesWrap.activitiesTop ul {
display: flex;
justify-content: space-between;
flex-wrap: wrap;
}
#activitiesWrap.activitiesTop ul li {
transition: 0.3s;
}
@media screen and (min-width: 767px) {
#activitiesWrap.activitiesTop ul li { width: calc((100% - 10px) / 3);
}
}
@media screen and (max-width: 767px) {
#activitiesWrap.activitiesTop ul li { width: 100%;
}
}
#activitiesWrap.activitiesTop ul li img {
width: 100%;
height: auto;
}
@media screen and (min-width: 767px) {
#activitiesWrap.activitiesTop ul li img { margin-bottom: 15px;
}
}
@media screen and (max-width: 767px) {
#activitiesWrap.activitiesTop ul li img { margin-bottom: 5px;
}
}
#activitiesWrap.activitiesTop ul li p {
font-size: 20px;
line-height: 1.6;
text-align: center;
font-weight: bold;
}
#activitiesWrap.activitiesTop ul li:hover {
opacity: 0.5;
transition: 0.3s;
}
#activitiesWrap.activitiesTop ul li a {
text-decoration: none;
}
#activitiesWrap.maintenance .machineMaintenance {
display: flex;
justify-content: space-between;
flex-wrap: wrap;
margin-bottom: 30px;
}
#activitiesWrap.maintenance .machineMaintenance li {
width: 100%;
}
#activitiesWrap.maintenance .machineMaintenance li .pics {
display: flex;
justify-content: space-between;
flex-wrap: wrap;
}
#activitiesWrap.maintenance .machineMaintenance li img {
height: auto;
}
@media screen and (min-width: 767px) {
#activitiesWrap.maintenance .machineMaintenance li img { width: 49%;
margin-bottom: 20px;
}
}
@media screen and (max-width: 767px) {
#activitiesWrap.maintenance .machineMaintenance li img { width: 100%;
margin-bottom: 3vw;
}
}
@media screen and (min-width: 767px) {
#activitiesWrap .rentalcar { margin-bottom: 100px;
}
}
@media screen and (max-width: 767px) {
#activitiesWrap .rentalcar { margin-bottom: 50px;
}
}
@media screen and (max-width: 767px) {
#activitiesWrap .rentalcar h3 { text-align: center;
}
}
@media screen and (min-width: 767px) {
#activitiesWrap .rentalcar .img { margin-bottom: 30px;
}
}
@media screen and (max-width: 767px) {
#activitiesWrap .rentalcar .img { margin-bottom: 15px;
}
}
#activitiesWrap .rentalcar .img img {
width: 100%;
height: auto;
}
#activitiesWrap .rentalcar .datawrap {
display: flex;
justify-content: space-between;
flex-wrap: wrap;
}
@media screen and (min-width: 767px) {
#activitiesWrap .rentalcar .datawrap .spec { width: 360px;
}
}
@media screen and (max-width: 767px) {
#activitiesWrap .rentalcar .datawrap .spec { width: 100%;
}
}
@media screen and (max-width: 767px) {
#activitiesWrap .rentalcar .datawrap .spec table td { width: 50%;
}
}
@media screen and (min-width: 767px) {
#activitiesWrap .rentalcar .datawrap .package { width: 660px;
}
}
@media screen and (max-width: 767px) {
#activitiesWrap .rentalcar .datawrap .package { width: 100%;
}
}
#activitiesWrap .rentalcar .datawrap .package table {
width: 100%;
}
@media screen and (max-width: 767px) {
#activitiesWrap .rentalcar .datawrap .package table td { width: 50%;
}
}
#activitiesWrap .rentalcar .datawrap table {
margin-bottom: 15px;
}
#activitiesWrap .rentalcar .datawrap ul.notice li {
font-size: 13px;
}
@media screen and (min-width: 767px) {
#activitiesWrap .sellcar { margin-bottom: 100px;
}
}
@media screen and (max-width: 767px) {
#activitiesWrap .sellcar { margin-bottom: 50px;
}
}
#activitiesWrap .sellcar .titSellcar {
display: flex;
justify-content: space-between;
flex-wrap: wrap;
}
@media screen and (min-width: 767px) {
#activitiesWrap .sellcar .titSellcar h3 { width: 70%;
}
}
@media screen and (max-width: 767px) {
#activitiesWrap .sellcar .titSellcar h3 { width: 100%;
margin-bottom: 0;
text-align: center;
}
}
#activitiesWrap .sellcar .titSellcar p {
font-family: "Barlow Semi Condensed", "游ゴシック体", "Yu Gothic", YuGothic, "ヒラギノ角ゴ ProN W3", Hiragino Kaku Gothic ProN, Arial, "メイリオ", Meiryo, sans-serif;
letter-spacing: 0.1em;
color: #8899a6;
font-weight: bold;
}
@media screen and (min-width: 767px) {
#activitiesWrap .sellcar .titSellcar p { width: 30%;
font-size: 22px;
text-align: right;
line-height: 2.3;
margin-bottom: 15px;
}
}
@media screen and (max-width: 767px) {
#activitiesWrap .sellcar .titSellcar p { width: 100%;
font-size: 18px;
text-align: center;
margin-bottom: 20px;
}
}
@media screen and (min-width: 767px) {
#activitiesWrap .sellcar .img { margin-bottom: 20px;
}
}
@media screen and (max-width: 767px) {
#activitiesWrap .sellcar .img { }
}
#activitiesWrap .sellcar .img img {
width: 100%;
height: auto;
}
#activitiesWrap .sellcar table.tblBasic {
margin: 0 auto 15px;
}
@media screen and (min-width: 767px) {
#activitiesWrap .sellcar table.tblBasic { width: 100%;
}
}
@media screen and (max-width: 767px) {
#activitiesWrap .sellcar table.tblBasic { width: 100%;
}
}
#activitiesWrap .sellcar table.tblBasic tr td:first-child {
width: 20%;
}
#activitiesWrap .sellcar table.tblBasic tr td:last-child {
width: 80%;
}
#contactus {
margin: 0 auto 50px;
}
@media screen and (min-width: 767px) {
#contactus { width: 740px;
padding-top: 50px;
}
}
@media screen and (max-width: 767px) {
#contactus { width: 96%;
padding-top: 30px;
}
}
#contactus p {
margin-bottom: 30px;
}
#contactus h2 {
color: #8899a6;
text-align: center;
}
@media screen and (min-width: 767px) {
#contactus h2 { margin-bottom: 50px;
}
}
@media screen and (max-width: 767px) {
#contactus h2 { margin-bottom: 30px;
}
}
#contactus h3 {
margin-bottom: 15px;
}
#contactus p.thanks {
text-align: center;
margin-bottom: 200px;
}
#contactus .mw_wp_form table {
margin-bottom: 50px;
border-bottom: 1px solid #42455b;
border-right: none;
border-left: none;
border-top: none;
}
#contactus .mw_wp_form table tr th {
color: #fff;
font-weight: bold;
background: #10171e;
border-top: 1px solid #42455b;
border-right: none;
border-left: none;
border-bottom: none;
}
@media screen and (max-width: 767px) {
#contactus .mw_wp_form table tr th { padding: 0.5em 0 0;
}
}
#contactus .mw_wp_form table tr td {
color: #fff;
background: #10171e;
border-right: none;
border-left: none;
border-bottom: none;
}
@media screen and (min-width: 767px) {
#contactus .mw_wp_form table tr td { border-top: 1px solid #42455b;
}
}
@media screen and (max-width: 767px) {
#contactus .mw_wp_form table tr td { border-top: none;
padding: 0.5em 0 1em;
}
}
#contactus .mw_wp_form table tr td .notes {
color: #fff;
font-size: 14px;
}
#contactus .mw_wp_form table tr td input, #contactus .mw_wp_form table tr td textarea {
width: 100%;
border: none;
padding: 10px;
}
#contactus .mw_wp_form table tr td .mwform-radio-field {
width: calc(100% - 60px);
display: block;
margin-bottom: 5px;
margin-left: 30px;
padding-left: 30px;
text-indent: -30px;
}
#contactus .mw_wp_form table tr td .mwform-radio-field input {
width: 20px;
}
#contactus .mw_wp_form table tr td .horizontal-item + .horizontal-item {
margin-left: 30px;
}
#contactus .mw_wp_form .action-buttons input {
background: #d5ff06;
font-weight: bold;
color: #000;
border: none;
box-shadow: none;
text-shadow: none;
padding: 25px 0;
font-size: 18px;
transition: 0.3s;
border: 1px solid #d5ff06;
}
@media screen and (min-width: 767px) {
#contactus .mw_wp_form .action-buttons input { width: 300px;
}
}
@media screen and (max-width: 767px) {
#contactus .mw_wp_form .action-buttons input { width: 70%;
margin: 0 auto;
}
}
#contactus .mw_wp_form .action-buttons input:hover {
color: #fff;
background: #10171e;
transition: 0.3s;
border: 1px solid #fff;
}
#contactus .mw_wp_form .action-buttons input[name=submitBack] {
background: #666;
color: #fff;
border: 1px solid #666;
}
@media screen and (min-width: 767px) {
#contactus .mw_wp_form .action-buttons input[name=submitBack] { width: 150px;
margin-right: 20px;
}
}
@media screen and (max-width: 767px) {
#contactus .mw_wp_form .action-buttons input[name=submitBack] { width: 70%;
margin: 0 auto;
padding: 10px 0;
margin-bottom: 15px;
}
}
#contactus .mw_wp_form .action-buttons input[name=submitBack]:hover {
color: #fff;
background: #10171e;
transition: 0.3s;
border: 1px solid #666;
} .mw_wp_form_g-standard {
margin: 0 0 1em;
}
.mw_wp_form_g-standard table {
margin: 0 0 1em;
table-layout: fixed;
border-collapse: collapse;
border: #ddd solid 1px;
font-size: 100%;
width: 100%;
}
.mw_wp_form_g-standard table th,
.mw_wp_form_g-standard table td {
border: #ddd solid 1px;
font-size: 100%;
font-weight: normal;
padding: 1em;
text-align: left;
vertical-align: top;
}
.mw_wp_form_g-standard table th {
background-color: #f5f5f5;
width: 30%;
}
.mw_wp_form_g-standard table td {
background-color: #fff;
}
@media screen and (max-width: 767px) {
.mw_wp_form_g-standard table,
.mw_wp_form_g-standard table tbody,
.mw_wp_form_g-standard table tr,
.mw_wp_form_g-standard table th,
.mw_wp_form_g-standard table td {
display: block;
width: auto;
}
.mw_wp_form_g-standard table {
border-right: none;
border-bottom: none;
border-left: none;
}
.mw_wp_form_g-standard table th {
border-top: none;
padding: 0.5em 1em;
}
.mw_wp_form_g-standard table td {
border-top: none;
}
} .mw_wp_form_g-standard .mw-wp-form_image {
margin-top: 5px;
}
.mw_wp_form_g-standard .mw-wp-form_image img {
max-width: 100%;
} .mw_wp_form_g-standard .require {
color: #b70000;
} .mw_wp_form_g-standard .notes {
color: #999;
display: block;
font-size: 12px;
margin: 5px 0 0;
} .mw_wp_form_g-standard .error {
color: #b70000;
display: block;
margin: 5px 0 0;
} .mw_wp_form_g-standard .action-buttons {
text-align: center;
} .mw_wp_form_g-standard input,
.mw_wp_form_g-standard select,
.mw_wp_form_g-standard textarea {
box-sizing: border-box;
max-width: 100%;
font-size: 100%;
margin: 0;
padding: 0;
vertical-align: baseline;
width: auto;
} .mw_wp_form_g-standard input[type=submit],
.mw_wp_form_g-standard input[type=button],
.mw_wp_form_g-standard button {
border: 1px solid #ccc;
border-color: #ccc #ccc #bbb #ccc;
border-radius: 3px;
background: #e6e6e6;
box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.5), inset 0 15px 17px rgba(255, 255, 255, 0.5), inset 0 -5px 12px rgba(0, 0, 0, 0.05);
color: rgba(0, 0, 0, 0.8);
cursor: pointer;
-webkit-appearance: button;
line-height: 1;
padding: 0.7em 1.5em;
text-shadow: 0 1px 0 rgba(255, 255, 255, 0.8);
}
.mw_wp_form_g-standard input[type=submit]:hover,
.mw_wp_form_g-standard input[type=button]:hover,
.mw_wp_form_g-standard button:hover {
border-color: #ccc #bbb #aaa #bbb;
box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.8), inset 0 15px 17px rgba(255, 255, 255, 0.8), inset 0 -5px 12px rgba(0, 0, 0, 0.02);
}
.mw_wp_form_g-standard input[type=submit]:focus,
.mw_wp_form_g-standard input[type=submit]:active,
.mw_wp_form_g-standard input[type=button]:focus,
.mw_wp_form_g-standard input[type=button]:active,
.mw_wp_form_g-standard button:focus,
.mw_wp_form_g-standard button:active {
border-color: #aaa #bbb #bbb #bbb;
box-shadow: inset 0 -1px 0 rgba(255, 255, 255, 0.5), inset 0 2px 5px rgba(0, 0, 0, 0.15);
} .mw_wp_form_g-standard label {
display: inline-block;
margin: 0 5px 0 0;
}
.mw_wp_form_g-standard label input[type=checkbox],
.mw_wp_form_g-standard label input[type=radio] {
margin: 0 5px 0 0;
} .mw_wp_form_g-standard input[type=text],
.mw_wp_form_g-standard input[type=password],
.mw_wp_form_g-standard input[type=number],
.mw_wp_form_g-standard input[type=email],
.mw_wp_form_g-standard input[type=url],
.mw_wp_form_g-standard textarea {
border: 1px solid #ccc;
border-radius: 3px;
padding: 3px;
} .mw_wp_form_g-standard textarea {
overflow: auto;
vertical-align: top;
width: 100%;
} .mw_wp_form_g-standard input[type=file] {
display: inline;
} h1.titA1funcup {
text-align: center;
transform: scale(1, 1);
color: #fff;
font-weight: bold;
line-height: 1.4;
background-position: center center;
background-repeat: no-repeat;
background-size: cover;
margin: 0 0 50px;
font-feature-settings: "palt";
}
@media screen and (min-width: 767px) {
h1.titA1funcup { font-size: 20px;
padding: 100px 0 0;
margin-top: -50px;
margin-bottom: 50px;
height: 330px;
letter-spacing: 0.1em;
}
}
@media screen and (max-width: 767px) {
h1.titA1funcup { font-size: 4vw;
padding: 25px 0;
margin-top: -30px;
margin-bottom: 30px;
background-size: cover;
letter-spacing: 0;
}
}
h1.titA1funcup span {
display: block;
}
@media screen and (min-width: 767px) {
h1.titA1funcup span { font-size: 40px;
padding-top: 10px;
}
}
@media screen and (max-width: 767px) {
h1.titA1funcup span { padding-top: 5px;
font-size: 7vw;
letter-spacing: 0.1em;
}
}
#a1EntryWrap {
display: flex;
justify-content: space-between;
flex-wrap: wrap;
}
@media screen and (min-width: 767px) {
#a1EntryWrap { width: 900px;
margin: 0 auto 50px;
}
}
@media screen and (max-width: 767px) {
#a1EntryWrap { width: 90%;
margin: 0 auto 30px;
}
}
@media screen and (min-width: 767px) {
#a1EntryWrap .entryBlock { width: 900px;
margin: 0 auto 80px;
}
}
@media screen and (max-width: 767px) {
#a1EntryWrap .entryBlock { width: 100%;
margin-bottom: 50px;
}
}
#a1EntryWrap .entryBlock table {
width: 100%;
margin-bottom: 15px;
}
#a1EntryWrap .entryBlock table th {
white-space: nowrap;
background-color: inherit;
width: 25%;
}
@media screen and (min-width: 767px) {
#a1EntryWrap .entryBlock table th { padding: 15px 20px;
}
}
#a1EntryWrap .entryBlock table td {
width: 75%;
}
@media screen and (min-width: 767px) {
#a1EntryWrap .entryBlock table td { padding: 15px 25px;
}
}
#a1EntryWrap .entryBlock img {
margin-bottom: 10px;
}
#a1EntryWrap #prize img {
margin-top: -20px;
}
@media screen and (min-width: 767px) {
#a1EntryWrap #prize img { width: 928px !important;
max-width: 928px !important;
margin-top: -50px;
}
}
#a1EntryWrap h2 {
color: #8899a6;
text-align: center;
}
@media screen and (min-width: 767px) {
#a1EntryWrap h2 { margin-bottom: 30px;
}
}
@media screen and (max-width: 767px) {
#a1EntryWrap h2 { margin-bottom: 15px;
}
}
#a1EntryWrap h3 {
margin-bottom: 10px;
}
#a1EntryWrap p {
width: 100%;
margin-bottom: 20px;
}
#a1EntryWrap p.note {
font-size: 13px;
color: #8899a6;
}
#a1EntryWrap ul {
width: 100%;
margin-bottom: 20px;
display: flex;
justify-content: space-between;
flex-wrap: wrap;
}
#a1EntryWrap ul li {
list-style: disc;
margin-left: 30px;
}
@media screen and (min-width: 767px) {
#a1EntryWrap ul li { width: 350px;
}
}
@media screen and (max-width: 767px) {
#a1EntryWrap ul li { width: 100%;
}
}
#a1EntryWrap .package {
background: #1a2939;
border: 1px solid rgba(221, 221, 221, 0.15);
}
@media screen and (min-width: 767px) {
#a1EntryWrap .package { padding: 30px 40px 20px;
}
}
@media screen and (max-width: 767px) {
#a1EntryWrap .package { padding: 15px 5% 5px;
}
}
#a1EntryWrap .twocolumns {
display: flex;
justify-content: space-between;
flex-wrap: wrap;
}
@media screen and (min-width: 767px) {
#a1EntryWrap .twocolumns .image { width: 450px;
}
}
@media screen and (max-width: 767px) {
#a1EntryWrap .twocolumns .image { width: 100%;
margin-bottom: 10px;
}
}
#a1EntryWrap .twocolumns .image img {
width: 100%;
}
@media screen and (min-width: 767px) {
#a1EntryWrap .twocolumns .text { width: 450px;
padding-left: 40px;
}
}
@media screen and (max-width: 767px) {
#a1EntryWrap .twocolumns .text { width: 100%;
}
}
#a1EntryWrap .twocolumns .text h3 {
font-size: 24px;
line-height: 1.6;
}
#a1EntryWrap .condition {
margin: 0 auto inherit;
}
#a1EntryWrap .condition ul {
display: block;
margin-bottom: 0;
padding-top: 10px;
border-top: 1px solid rgba(221, 221, 221, 0.15);
}
#a1EntryWrap .condition ul li {
display: block;
position: relative;
width: 100%;
padding-left: 52px;
margin-bottom: 10px;
padding-bottom: 10px;
margin-left: 0;
font-size: 20px;
font-weight: bold;
font-feature-settings: "palt";
border-bottom: 1px solid rgba(221, 221, 221, 0.15);
}
@media screen and (min-width: 767px) {
#a1EntryWrap .condition ul li { letter-spacing: 0.2em;
}
}
@media screen and (max-width: 767px) {
#a1EntryWrap .condition ul li { letter-spacing: 0.1em;
}
}
#a1EntryWrap .condition ul li::before {
position: absolute;
content: "";
top: 4px;
left: 10px;
width: 30px;
height: 27px;
background: url(https://hitotsuyamaracing.net/site_renewal/wp-content/themes/hitotsuyama/img/icon_check.svg) left top no-repeat;
}
#a1EntryWrap a.linkbtn {
margin: 0 auto;
}
.tabs {
position: relative;
display: flex;
justify-content: center;
margin: 0px auto;
max-width: 980px;
}
@media screen and (min-width: 767px) {
.tabs { margin: 0 auto 40px;
}
}
@media screen and (max-width: 767px) {
.tabs { margin: 0 auto 40px;
}
}
.tabs::before {
content: "";
position: absolute;
bottom: 0;
left: 0;
width: 100%;
height: 1px;
background-color: #2e3236;
}
.tab {
display: flex;
justify-content: center;
align-items: center;
font-family: "Montserrat", "游ゴシック体", "Yu Gothic", YuGothic, "ヒラギノ角ゴ ProN W3", Hiragino Kaku Gothic ProN, Arial, "メイリオ", Meiryo, sans-serif;
letter-spacing: 0.1em;
font-weight: 400;
color: #8899a6;
transition: 0.3s;
border-bottom: 3px solid #10171e;
}
@media screen and (min-width: 767px) {
.tab { font-size: 20px;
min-width: 120px;
padding: 5px 0;
}
.tab:hover {
transition: 0.3s;
color: #8899a6;
cursor: pointer;
opacity: 0.5;
}
}
@media screen and (max-width: 767px) {
.tab { font-size: 16px;
padding: 5px 0;
}
.tab + .tab {
margin-left: 8px;
}
}
.tab.active {
pointer-events: none;
color: #dbfd3e;
border-bottom: 3px solid #dbfd3e;
}
.tab.active:hover {
pointer-events: none;
}
.tab-content {
display: none;
max-width: 980px;
margin: 0 auto 115px;
}
.tab-content.active {
display: block;
}
@keyframes show {
from {
opacity: 0;
}
to {
opacity: 1;
}
}
@keyframes hide {
from {
opacity: 1;
}
to {
opacity: 0;
}
}
body {
-webkit-font-smoothing: antialiased;
-moz-osx-font-smoothing: grayscale;
background: #10171e url(//hitotsuyamaracing.net/site_renewal/wp-content/themes/hitotsuyama/img/bg_footer.jpg) left bottom no-repeat;
}
@media screen and (min-width: 767px) {
body { }
}
@media screen and (max-width: 767px) {
body { background-size: 100% auto;
}
}
@media screen and (min-width: 767px) {
.pc { display: block;
}
}
@media screen and (max-width: 767px) {
.pc { display: none;
}
}
@media screen and (min-width: 767px) {
.sp { display: none;
}
}
@media screen and (max-width: 767px) {
.sp { display: block;
}
}
a:link {
color: #fff;
transition: 0.3s;
}
a:visited {
color: #fff;
}
a:hover {
color: #8899a6;
transition: 0.3s;
}
a:active {
color: #fff;
} .raceTopTitle {
position: relative;
display: inline-block;
font-family: "Montserrat", "游ゴシック体", "Yu Gothic", YuGothic, "ヒラギノ角ゴ ProN W3", Hiragino Kaku Gothic ProN, Arial, "メイリオ", Meiryo, sans-serif;
letter-spacing: 0.1em;
font-weight: 300;
text-align: center;
border-bottom: 1px solid #8899a6;
}
@media screen and (min-width: 767px) {
.raceTopTitle { font-size: 40px;
padding-top: 55px;
margin-bottom: 15px;
}
}
@media screen and (max-width: 767px) {
.raceTopTitle { font-size: 7vw;
padding-top: 60px;
}
}
.raceTopTitle:before {
content: "";
position: absolute;
width: 36px;
height: 45px;
top: 0;
left: 50%;
margin-left: -17px;
}
.raceTopTitle.super-gt:before {
transform: skewX(-23deg);
background-color: #d2232e;
}
.raceTopTitle.tcr-japan:before {
transform: skewX(-13deg);
background-color: #009c9a;
border-radius: 0 0 7px 0;
}
.raceTopTitle.super-taikyu:before {
width: 50px;
height: 45px;
margin-left: -25px;
background-color: #312b7c;
}
.raceTopTitle.frj:before {
width: 50px;
height: 50px;
margin-left: -25px;
clip-path: polygon(50% 0%, 100% 38%, 82% 100%, 18% 100%, 0% 38%);
background-color: #878992;
}
.raceTopTitle.japan-cup:before {
width: 50px;
height: 50px;
margin-left: -25px;
background-color: #ee0000;
}
.raceTopTitle.a1-fun-cup:before {
background: url(https://hitotsuyamaracing.net/site_renewal/wp-content/themes/hitotsuyama/img/symbol_a1.svg) left top no-repeat;
background-size: contain;
}
.raceTopTitle span {
display: block;
transform: scale(1, 0.8);
}
.pageSubTitle {
font-family: "Barlow Semi Condensed", "游ゴシック体", "Yu Gothic", YuGothic, "ヒラギノ角ゴ ProN W3", Hiragino Kaku Gothic ProN, Arial, "メイリオ", Meiryo, sans-serif;
letter-spacing: 0.1em;
font-weight: 400;
letter-spacing: 0.05em;
color: #8899a6;
margin-bottom: 30px;
line-height: 1.6;
font-feature-settings: "palt";
}
@media screen and (min-width: 767px) {
.pageSubTitle { font-size: 26px;
}
}
@media screen and (max-width: 767px) {
.pageSubTitle { font-size: 7vw;
}
}
.lead {
text-align: center;
}
@media screen and (min-width: 767px) {
.lead { width: 694px;
margin: 0px auto 80px;
}
}
@media screen and (max-width: 767px) {
.lead { width: 90%;
margin: 0 auto 50px;
}
}
@media screen and (max-width: 767px) {
.lead.racetopLead { margin-top: -50px;
}
}
.lead h1 {
text-align: center;
font-family: "Montserrat", "游ゴシック体", "Yu Gothic", YuGothic, "ヒラギノ角ゴ ProN W3", Hiragino Kaku Gothic ProN, Arial, "メイリオ", Meiryo, sans-serif;
letter-spacing: 0.1em;
font-weight: 300;
margin-bottom: 30px;
}
@media screen and (min-width: 767px) {
.lead h1 { font-size: 32px;
}
}
@media screen and (max-width: 767px) {
.lead h1 { font-size: 5vw;
}
}
.lead h2 {
position: relative;
display: inline-block;
font-family: "Montserrat", "游ゴシック体", "Yu Gothic", YuGothic, "ヒラギノ角ゴ ProN W3", Hiragino Kaku Gothic ProN, Arial, "メイリオ", Meiryo, sans-serif;
letter-spacing: 0.1em;
font-weight: 300;
margin-bottom: 1rem;
border-bottom: 1px solid #8899a6;
}
@media screen and (min-width: 767px) {
.lead h2 { font-size: 40px;
padding-top: 45px;
margin-bottom: 15px;
}
}
@media screen and (max-width: 767px) {
.lead h2 { font-size: 7vw;
padding-top: 60px;
}
}
.lead h2:before {
content: "";
position: absolute;
width: 36px;
height: 45px;
top: 0;
left: 50%;
margin-left: -17px;
}
.lead h2.super-gt:before {
transform: skewX(-23deg);
background-color: #d2232e;
}
.lead h2.tcr-japan:before {
transform: skewX(-13deg);
background-color: #009c9a;
border-radius: 0 0 7px 0;
}
.lead h2.super-taikyu:before {
width: 50px;
height: 45px;
margin-left: -25px;
background-color: #312b7c;
}
.lead h2.frj:before {
width: 50px;
height: 45px;
margin-left: -25px;
clip-path: polygon(50% 0%, 100% 38%, 82% 100%, 18% 100%, 0% 38%);
background-color: #878992;
}
.lead h2.japan-cup:before {
width: 50px;
height: 50px;
border-radius: 100%;
margin-left: -25px;
background-color: #ee0000;
}
.lead h2.a1-fun-cup:before {
background: url(https://hitotsuyamaracing.net/site_renewal/wp-content/themes/hitotsuyama/img/symbol_a1.svg) left top no-repeat;
background-size: contain;
}
.lead h2 span {
display: block;
transform: scale(1, 0.8);
}
.lead h3 {
font-family: "Barlow Semi Condensed", "游ゴシック体", "Yu Gothic", YuGothic, "ヒラギノ角ゴ ProN W3", Hiragino Kaku Gothic ProN, Arial, "メイリオ", Meiryo, sans-serif;
letter-spacing: 0.1em;
font-weight: 400;
letter-spacing: 0.05em;
color: #8899a6;
margin-bottom: 30px;
line-height: 1.6;
font-feature-settings: "palt";
}
@media screen and (min-width: 767px) {
.lead h3 { font-size: 26px;
}
}
@media screen and (max-width: 767px) {
.lead h3 { font-size: 7vw;
}
}
.lead p {
color: #8899a6;
text-align: left;
}
@media screen and (min-width: 767px) {
.lead p { line-height: 2.4;
}
}
@media screen and (max-width: 767px) {
.lead p { line-height: 2;
}
} .pageTitle {
text-align: center;
margin: 0;
padding: 0;
width: 100%;
background-position: center top;
background-repeat: no-repeat;
}
.pageTitle h2 {
position: relative;
display: inline-block;
font-family: "Montserrat", "游ゴシック体", "Yu Gothic", YuGothic, "ヒラギノ角ゴ ProN W3", Hiragino Kaku Gothic ProN, Arial, "メイリオ", Meiryo, sans-serif;
letter-spacing: 0.1em;
font-weight: 300;
}
@media screen and (min-width: 767px) {
.pageTitle h2 { font-size: 40px;
margin-bottom: 15px;
}
}
@media screen and (max-width: 767px) {
.pageTitle h2 { font-size: 7vw;
}
}
.pageTitle h2 span {
display: block;
transform: scale(1, 0.8);
}
.contents h2 {
letter-spacing: 0.05em;
}
.contents h3 {
font-family: "Montserrat", "游ゴシック体", "Yu Gothic", YuGothic, "ヒラギノ角ゴ ProN W3", Hiragino Kaku Gothic ProN, Arial, "メイリオ", Meiryo, sans-serif;
letter-spacing: 0.1em;
transform: scale(1, 0.9);
font-size: 24px;
font-weight: 300;
text-align: center;
color: #8899a6;
}
@media screen and (max-width: 767px) {
.contents h3 { margin: 30px 0;
}
}
.scheduleBlock {
width: 96%;
margin: 0 auto 30px;
}
@media screen and (max-width: 767px) {
.scheduleBlock:last-child { margin-bottom: 50px;
}
}
.scheduleBlock h4 {
font-family: "Montserrat", "游ゴシック体", "Yu Gothic", YuGothic, "ヒラギノ角ゴ ProN W3", Hiragino Kaku Gothic ProN, Arial, "メイリオ", Meiryo, sans-serif;
letter-spacing: 0.1em;
font-size: 14px;
font-weight: 300;
background: #000;
padding: 1vw 2vw;
text-align: left;
}
.scheduleBlock p {
font-family: "Montserrat", "游ゴシック体", "Yu Gothic", YuGothic, "ヒラギノ角ゴ ProN W3", Hiragino Kaku Gothic ProN, Arial, "メイリオ", Meiryo, sans-serif;
letter-spacing: 0.1em;
font-size: 14px;
padding: 2vw;
}
.scheduleBlock table {
width: 100%;
margin: 0 0 3vw;
box-sizing: border-box;
border-top: 1px solid #242424;
border-collapse: collapse;
}
.scheduleBlock table tr th {
width: 50%;
padding: 0.7vw 1vw 0.7vw 2vw;
border-right: 1px solid #242424;
border-bottom: 1px solid #242424;
text-align: left;
background: none;
}
.scheduleBlock table tr td {
width: 50%;
padding: 0.7vw 1vw;
text-align: center;
border: none;
background: none;
border-bottom: 1px solid #242424;
}
.scheduleBlock table tr td.td-split {
padding: 0;
}
.scheduleBlock table tr td.td-split span {
display: inline-block;
width: 50%;
height: 100%;
padding: 5px;
box-sizing: border-box;
}
.scheduleBlock table tr td.td-split span + span {
border-left: 1px solid #2e3236;
}
.scheduleBlock table tr td.report a {
position: relative;
display: block;
font-family: "Montserrat", "游ゴシック体", "Yu Gothic", YuGothic, "ヒラギノ角ゴ ProN W3", Hiragino Kaku Gothic ProN, Arial, "メイリオ", Meiryo, sans-serif;
letter-spacing: 0.1em;
font-size: 14px;
padding: 1vw;
text-align: center;
text-decoration: none;
background: #2f363d;
border-radius: 3px;
}
.scheduleBlock table tr td.report a::before {
content: "";
vertical-align: middle;
position: absolute;
top: 13px;
left: 5px;
width: 6px;
height: 6px;
border-top: 2px solid #fff;
border-right: 2px solid #fff;
-webkit-transform: rotate(45deg);
transform: rotate(45deg);
}
.scheduleBlock table tr:nth-child(odd) {
background: none;
}
.scheduleBlock .btnReport {
margin: 0 0 20px;
background: #2f363d;
border-radius: 3px;
}
.scheduleBlock .btnReport a {
position: relative;
display: block;
font-family: "Montserrat", "游ゴシック体", "Yu Gothic", YuGothic, "ヒラギノ角ゴ ProN W3", Hiragino Kaku Gothic ProN, Arial, "メイリオ", Meiryo, sans-serif;
letter-spacing: 0.1em;
font-size: 15px;
padding: 1vw;
text-align: center;
text-decoration: none;
}
.scheduleBlock .btnReport a::before {
content: "";
vertical-align: middle;
position: absolute;
top: 13px;
left: 15px;
width: 6px;
height: 6px;
border-top: 2px solid #fff;
border-right: 2px solid #fff;
-webkit-transform: rotate(45deg);
transform: rotate(45deg);
}
a.linkbtn {
position: relative;
display: block;
text-align: center;
color: #000;
font-size: 20px;
font-weight: bold;
background: #d5ff06;
margin: 30px auto 50px;
padding: 15px 0;
border-radius: 5px;
transition: 0.3s;
text-decoration: none;
}
@media screen and (min-width: 767px) {
a.linkbtn { width: 50%;
}
}
@media screen and (max-width: 767px) {
a.linkbtn { width: 80%;
}
}
a.linkbtn:hover {
background: #fff;
transition: 0.3s;
}
a.linkbtn::before {
content: "";
vertical-align: middle;
position: absolute;
top: 0;
bottom: 0;
margin: auto;
left: 30px;
width: 8px;
height: 8px;
border-top: 3px solid #000;
border-right: 3px solid #000;
-webkit-transform: rotate(45deg);
transform: rotate(45deg);
}
@media screen and (min-width: 767px) {
a.linkbtn::before { left: 30px;
}
}
@media screen and (max-width: 767px) {
a.linkbtn::before { left: 8%;
}
}
ul.sns {
display: flex;
justify-content: center;
align-items: center;
margin: 0 auto 30px;
}
@media screen and (min-width: 767px) {
ul.sns { width: 340px;
}
}
@media screen and (max-width: 767px) {
ul.sns { width: 90%;
}
}
ul.sns li {
display: inline-block;
vertical-align: middle;
text-align: center;
height: 32px;
}
@media screen and (min-width: 767px) {
ul.sns li { width: 160px;
margin: 0 7px;
}
}
@media screen and (max-width: 767px) {
ul.sns li { width: 46%;
margin: 0 2%;
}
}
ul.sns a {
display: inline-block;
width: 100%;
height: 100%;
padding: 8px 4px 8px 20px;
text-align: center;
line-height: 1.2;
color: #fff;
font-weight: bold;
font-size: 13px;
position: relative;
text-decoration: none;
vertical-align: middle;
border-radius: 3px;
transition: 0.3s;
}
ul.sns a svg {
width: 30px;
height: 20px;
position: absolute;
top: 0;
bottom: 0;
left: 5px;
margin: auto;
}
ul.sns a .fill {
fill: #ffffff;
}
ul.sns a.btnFb {
background-color: #3b5a9b;
}
ul.sns a.btnFb:hover {
background-color: #fff;
color: #3b5a9b;
}
ul.sns a.btnFb:hover .fill {
fill: #3b5a9b;
}
ul.sns a.btnTw {
background-color: #000000;
}
ul.sns a.btnTw:hover {
background-color: #fff;
color: #000000;
}
ul.sns a.btnTw:hover .fill {
fill: #000000;
}