/* ----------------------------------------------------------
General Settings
---------------------------------------------------------- */


/* ----------------------------------------------------------
Style for PCs
---------------------------------------------------------- */
@media screen and (min-width: 1025px) {


.about_topsec {
 width: 100%;
 height: auto;
 aspect-ratio: 16 / 11;
 display: flex;
 align-items: flex-start;
 background-image: url(../img/about/about_topimg_pc.webp);
 background-repeat: no-repeat;
 background-position: right top;
 background-size: 100% auto;
}
.about_topsec .abt_cc {
 width: 60%;
 height:auto;
 aspect-ratio: 16 / 11;
 display: block;
 padding:4% 0 0 5%;
}
.about_topsec .abt_cc h2 {
 font-size: clamp(26px, 4.5vw, 100px);
font-weight: 900;
color:var(--color-black);
font-style: italic;
letter-spacing: -0.08em;
line-height: 1.2em;
margin-bottom: 0.25em;
}
.about_topsec .abt_cc h3 {
 font-size: clamp(20px, 2vw, 80px);
font-weight: 900;
color:var(--color-black);
font-style: italic;
letter-spacing: -0.05em;
line-height: 1.4em;
margin:0 0 0.5em 0.25em;
}
.about_topsec .abt_cc h3 span {
 color: var(--color-1st);
letter-spacing: -0.02em;
 margin-right:0.05em;
}
.about_topsec .abt_cc p {
 font-size: clamp(14px, 1.25vw, 30px);
font-weight: 600;
color:var(--color-black);
font-style: italic;
letter-spacing: -0.05em;
line-height: 1.8em;
margin:0 0 0 0.25em!important;
}


/* Border */
.borderbox_t {
 background-image: url(../img/about/about-border01.webp);
 background-repeat: no-repeat;
 background-position: 0 0;
 background-size: 100% 80px;
 padding-top:80px;
}
.borderbox_b {
 background-image: url(../img/about/about-border02.webp);
 background-repeat: no-repeat;
 background-position: 0 99.9%;
 background-size: 100% 80px;
 padding-bottom:80px;
}


/* About Driver */
.aboutdrivers {
 width: 100%;
 height: auto;
 display: block;
}
.aboutdrivers_cc {
 width: 100%;
 height: auto;
 display: block;
 background-color: var(--color-f3);
}


/* About Race week */
.aboutraceweek {
 width: 100%;
 height: auto;
 display: block;
}

.racedaybox01 {
 width:100%;
 max-width:800px;
 height: auto;
 display: flex;
 flex-direction: column;
 padding:3em 2em;
 background-color: var(--color-f5);
 border-radius: 5px;
 margin:0 auto 30px;
 box-shadow: 0px 2px 15px rgba(0,0,0,0.3);
}

.racedaybox02 {
 width:100%;
 max-width:800px;
 height: auto;
 display: flex;
 flex-direction: column;
 padding:3em 2em;
 background-color: var(--color-white);
 border-radius: 5px;
 margin:0 auto 40px;
 box-shadow: 0px 2px 15px rgba(0,0,0,0.3);
}
.aboutraceweek h4 span {
width:60px;
height: 60px;
display: block;
border-radius: 9999px;
font-size:16px;
line-height: 60px;
font-family: var(--font-en);
text-align: center;
color:var(--color-white);
background-color: var(--color-1st);
margin:0 auto 10px;
}
.aboutraceweek h4 {
 width: 100%;
 height: auto;
 display: block;
 text-align: center;
 font-size: 20px;
 font-weight: 900;
 color:var(--color-black);
 font-style: italic;
 letter-spacing: -0.05em;
 line-height: 1.4em;
 padding:0;
 margin:0 0 1em 0;
}

.aboutraceweek h5 {
text-align: center;
font-size: 20px;
font-weight: 800;
color:var(--color-666);
font-style: italic;
letter-spacing: -0.05em;
line-height: 1em;
margin:0 0 0.2em 0;
}
.aboutraceweek .racedaybox01 p, .aboutraceweek .racedaybox02 p {
 text-align: center;
 line-height: 1.5em;
}
.aboutraceweek p.arw_bt_txt {
font-size: 16px;
font-weight: 600;
color:var(--color-black);
text-align: center;
font-style: italic;
letter-spacing: -0.05em;
line-height: 2em;
margin:0;
}


/* About Cars */
.aboutcar {
 width: 100%;
 height: auto;
 display: block;
}
.aboutcar_cc {
 width: 100%;
 height: auto;
 display: block;
 background-color: var(--color-f3);
}
.aboutcar_img {
 width: 70%;
 height: auto;
 display: block;
 margin:0 auto 30px;
}
.aboutcar h3 {
 font-size: 18px;
 font-weight: 800;
 line-height: 1.4em;
 text-align: center;
 margin-bottom: 20px;
}
.aboutcar h3 span {
 display: block;
 font-family: var(--font-en);
 color: var(--color-1st);
 font-size: 60px;
 font-style: italic;
 font-weight: 700;
 letter-spacing: -0.05em;
 line-height: 1em;
}
.aboutcar h4 {
 font-size: 18px;
 font-family: var(--font-en);
 font-style: italic;
 font-weight: 700;
 line-height: 1.4em;
 text-align: center;
 margin-bottom: 20px;
}
.aboutcar dl {
 width: 100%;
 height: auto;
 display: flex;
 flex-wrap: wrap;
}
.aboutcar dl dt {
 width:30%;
 height: auto;
 display: block;
 font-size:14px;
 font-weight: 400;
 line-height: 1.5em;
 color: var(--color-black);
 padding:1em 0.5em;
 border-bottom: 1px dotted var(--color-999);
}
.aboutcar dl dd {
 width:70%;
 height: auto;
 display: block;
 font-size:14px;
 font-weight: 400;
 line-height: 1.5em;
 color: var(--color-black);
 padding:1em 0.5em;
 border-bottom: 1px dotted var(--color-999);
}


}

/* ----------------------------------------------------------
Style for iPad Pro
---------------------------------------------------------- */
@media screen and (min-width: 769px) and (max-width: 1024px) {

.about_topsec {
 width: 100%;
 height: auto;
 aspect-ratio: 16 / 11;
 display: flex;
 align-items: flex-start;
 background-image: url(../img/about/about_topimg_pc.webp);
 background-repeat: no-repeat;
 background-position: right top;
 background-size: 100% auto;
}
.about_topsec .abt_cc {
 width: 60%;
 height:auto;
 aspect-ratio: 16 / 11;
 display: block;
 padding:4% 0 0 5%;
}
.about_topsec .abt_cc h2 {
 font-size: 34px;
font-weight: 900;
color:var(--color-black);
font-style: italic;
letter-spacing: -0.08em;
line-height: 1.2em;
margin-bottom: 0.25em;
}
.about_topsec .abt_cc h3 {
 font-size: 22px;
font-weight: 900;
color:var(--color-black);
font-style: italic;
letter-spacing: -0.05em;
line-height: 1.4em;
margin:0 0 0.5em 0.25em;
}
.about_topsec .abt_cc h3 span {
 color: var(--color-1st);
letter-spacing: -0.02em;
 margin-right:0.05em;
}
.about_topsec .abt_cc p {
 font-size: 14px;
font-weight: 600;
color:var(--color-black);
font-style: italic;
letter-spacing: -0.05em;
line-height: 1.8em;
margin:0 0 0 0.25em!important;
}


/* Border */
.borderbox_t {
 background-image: url(../img/about/about-border01.webp);
 background-repeat: no-repeat;
 background-position: 0 0;
 background-size: 100% 80px;
 padding-top:80px;
}
.borderbox_b {
 background-image: url(../img/about/about-border02.webp);
 background-repeat: no-repeat;
 background-position: 0 99.9%;
 background-size: 100% 80px;
 padding-bottom:80px;
}


/* About Driver */
.aboutdrivers {
 width: 100%;
 height: auto;
 display: block;
}
.aboutdrivers_cc {
 width: 100%;
 height: auto;
 display: block;
 background-color: var(--color-f3);
}


/* About Race week */
.aboutraceweek {
 width: 100%;
 height: auto;
 display: block;
}

.racedaybox01 {
 width:100%;
 max-width:800px;
 height: auto;
 display: flex;
 flex-direction: column;
 padding:3em 2em;
 background-color: var(--color-f5);
 border-radius: 5px;
 margin:0 auto 30px;
 box-shadow: 0px 2px 15px rgba(0,0,0,0.3);
}

.racedaybox02 {
 width:100%;
 max-width:800px;
 height: auto;
 display: flex;
 flex-direction: column;
 padding:3em 2em;
 background-color: var(--color-white);
 border-radius: 5px;
 margin:0 auto 40px;
 box-shadow: 0px 2px 15px rgba(0,0,0,0.3);
}
.aboutraceweek h4 span {
width:60px;
height: 60px;
display: block;
border-radius: 9999px;
font-size:16px;
line-height: 60px;
font-family: var(--font-en);
text-align: center;
color:var(--color-white);
background-color: var(--color-1st);
margin:0 auto 10px;
}
.aboutraceweek h4 {
 width: 100%;
 height: auto;
 display: block;
 text-align: center;
 font-size: clamp(22px, 1.5vw, 80px);
 font-weight: 900;
 color:var(--color-black);
 font-style: italic;
 letter-spacing: -0.05em;
 line-height: 1.4em;
 padding:0;
 margin:0 0 1em 0;
}

.aboutraceweek h5 {
text-align: center;
font-size: clamp(28px, 2.5vw, 80px);
font-weight: 800;
color:var(--color-666);
font-style: italic;
letter-spacing: -0.05em;
line-height: 1em;
margin:0 0 0.2em 0;
}
.aboutraceweek .racedaybox01 p, .aboutraceweek .racedaybox02 p {
 text-align: center;
 line-height: 1.5em;
}
.aboutraceweek p.arw_bt_txt {
font-size: clamp(14px, 2.5vw, 30px);
font-weight: 600;
color:var(--color-black);
text-align: center;
font-style: italic;
letter-spacing: -0.05em;
line-height: 2em;
margin:0;
}


/* About Cars */
.aboutcar {
 width: 100%;
 height: auto;
 display: block;
}
.aboutcar_cc {
 width: 100%;
 height: auto;
 display: block;
 background-color: var(--color-f3);
}
.aboutcar_img {
 width: 70%;
 height: auto;
 display: block;
 margin:0 auto 30px;
}
.aboutcar h3 {
 font-size: clamp(18px, 2vw, 30px);
 font-weight: 800;
 line-height: 1.4em;
 text-align: center;
 margin-bottom: 20px;
}
.aboutcar h3 span {
 display: block;
 font-family: var(--font-en);
 color: var(--color-1st);
 font-size: clamp(40px, 8vw, 200px);
 font-style: italic;
 font-weight: 700;
 letter-spacing: -0.05em;
 line-height: 1em;
}
.aboutcar h4 {
 font-size: clamp(18px, 3vw, 40px);
 font-family: var(--font-en);
 font-style: italic;
 font-weight: 700;
 line-height: 1.4em;
 text-align: center;
 margin-bottom: 20px;
}
.aboutcar dl {
 width: 100%;
 height: auto;
 display: flex;
 flex-wrap: wrap;
}
.aboutcar dl dt {
 width:30%;
 height: auto;
 display: block;
 font-size:14px;
 font-weight: 400;
 line-height: 1.5em;
 color: var(--color-black);
 padding:1em 0.5em;
 border-bottom: 1px dotted var(--color-999);
}
.aboutcar dl dd {
 width:70%;
 height: auto;
 display: block;
 font-size:14px;
 font-weight: 400;
 line-height: 1.5em;
 color: var(--color-black);
 padding:1em 0.5em;
 border-bottom: 1px dotted var(--color-999);
}


}


/* ----------------------------------------------------------
Style for Smartphone
---------------------------------------------------------- */
@media screen and (max-width: 768px) {

 .about_topsec {
 width: 100%;
 height: auto;
 display: flex;
 flex-direction: column;
 justify-content: flex-end;
 background-image: url(../img/about/about_topimg_m.webp);
 background-repeat: no-repeat;
 background-position: center top;
 background-size: 100% auto;
}
.about_topsec .abt_cc {
 width: 100%;
 height:auto;
 display: flex;
 flex-direction: column;
 justify-content: flex-end;
 padding:90% 5% 0 5%;
}
.about_topsec .abt_cc h2 {
 font-size: clamp(36px, 8vw, 100px);
font-weight: 900;
color:var(--color-black);
font-style: italic;
letter-spacing: -0.08em;
line-height: 1.2em;
margin-bottom: 0.25em;
}
.about_topsec .abt_cc h3 {
 font-size: clamp(22px, 4vw, 80px);
font-weight: 900;
color:var(--color-black);
font-style: italic;
letter-spacing: -0.05em;
line-height: 1.4em;
margin:0 0 0.5em 0.25em;
}
.about_topsec .abt_cc h3 span {
 color: var(--color-1st);
letter-spacing: -0.02em;
 margin-right:0.05em;
}
.about_topsec .abt_cc p {
 font-size: clamp(14px, 3vw, 30px);
font-weight: 600;
color:var(--color-black);
font-style: italic;
letter-spacing: -0.05em;
line-height: 1.8em;
margin:0 0 0 0.25em!important;
}
.about_topsec .abt_cc p br {
 display: none;
}



/* Border */
.borderbox_t {
 background-image: url(../img/about/about-border01.webp);
 background-repeat: no-repeat;
 background-position: 0 0;
 background-size: 100% 80px;
 padding-top:80px;
}
.borderbox_b {
 background-image: url(../img/about/about-border02.webp);
 background-repeat: no-repeat;
 background-position: 0 99.9%;
 background-size: 100% 80px;
 padding-bottom:80px;
}


/* About Series */
.aboutseries p br {
display: none;
}

/* About Driver */
.aboutdrivers {
 width: 100%;
 height: auto;
 display: block;
}
.aboutdrivers_cc {
 width: 100%;
 height: auto;
 display: block;
 background-color: var(--color-f3);
}


/* About Race week */
.aboutraceweek {
 width: 100%;
 height: auto;
 display: block;
}

.racedaybox01 {
 width:100%;
 height: auto;
 display: flex;
 flex-direction: column;
 padding:3em 2em;
 background-color: var(--color-f5);
 border-radius: 5px;
 margin:0 auto 30px;
 box-shadow: 0px 2px 15px rgba(0,0,0,0.3);
}

.racedaybox02 {
 width:100%;
 height: auto;
 display: flex;
 flex-direction: column;
 padding:3em 2em;
 background-color: var(--color-white);
 border-radius: 5px;
 margin:0 auto 40px;
 box-shadow: 0px 2px 15px rgba(0,0,0,0.3);
}
.aboutraceweek h4 span {
width:60px;
height: 60px;
display: block;
border-radius: 9999px;
font-size:16px;
line-height: 60px;
font-family: var(--font-en);
text-align: center;
color:var(--color-white);
background-color: var(--color-1st);
margin:0 auto 10px;
}
.aboutraceweek h4 {
 width: 100%;
 height: auto;
 display: block;
 text-align: center;
 font-size: clamp(18px, 1.5vw, 80px);
 font-weight: 900;
 color:var(--color-black);
 font-style: italic;
 letter-spacing: -0.05em;
 line-height: 1.4em;
 padding:0;
 margin:0 0 1em 0;
}

.aboutraceweek h5 {
text-align: center;
font-size: clamp(24px, 2.5vw, 80px);
font-weight: 800;
color:var(--color-333);
font-style: italic;
letter-spacing: -0.05em;
line-height: 1em;
margin:0 0 0.4em 0;
}
.aboutraceweek .racedaybox01 p, .aboutraceweek .racedaybox02 p {
 font-size: clamp(12px, 1.5vw, 14px);
 text-align: center;
 line-height: 1.5em;
}
.aboutraceweek p.arw_bt_txt {
font-size: clamp(18px, 2.5vw, 30px);
font-weight: 600;
color:var(--color-black);
text-align: center;
font-style: italic;
letter-spacing: -0.05em;
line-height: 2em;
margin:0;
}


/* About Cars */
.aboutcar {
 width: 100%;
 height: auto;
 display: block;
}
.aboutcar_cc {
 width: 100%;
 height: auto;
 display: block;
 background-color: var(--color-f3);
}
.aboutcar_img {
 width: 90%;
 height: auto;
 display: block;
 margin:0 auto 30px;
}
.aboutcar h3 {
 font-size: clamp(18px, 2vw, 30px);
 font-weight: 800;
 line-height: 1.4em;
 text-align: center;
 margin-bottom: 20px;
}
.aboutcar h3 span {
 display: block;
 font-family: var(--font-en);
 color: var(--color-1st);
 font-size: clamp(50px, 8vw, 200px);
 font-style: italic;
 font-weight: 700;
 letter-spacing: -0.05em;
 line-height: 1em;
}
.aboutcar p br {
 display: none;
}
.aboutcar h4 {
 font-size: clamp(18px, 3vw, 40px);
 font-family: var(--font-en);
 font-style: italic;
 font-weight: 700;
 line-height: 1.4em;
 text-align: center;
 margin-bottom: 20px;
}
.aboutcar dl {
 width: 100%;
 height: auto;
 display: flex;
 flex-direction: column;
 flex-wrap: wrap;
}
.aboutcar dl dt {
 width:100%;
 height: auto;
 display: block;
 font-size:12px;
 font-weight: 400;
 line-height: 1.5em;
 color: var(--color-1st);
 padding:0 0 0.5em 0;
}
.aboutcar dl dd {
 width:100%;
 height: auto;
 display: block;
 font-size:14px;
 font-weight: 400;
 line-height: 1.5em;
 color: var(--color-black);
 padding:0 0 1em 0;
 border-bottom: 1px dotted var(--color-999);
 margin-bottom: 1em;
}


}