@charset "UTF-8";
@media screen and (min-width: 768px),print {

.main-title{ background: url(../images/about-company/h1.png)no-repeat top right;}
/* ABOUT COMPANY は既存サイズ(240px)だと幅が足りないため縮小。箱の高さは既存(240px)のまま文字を下揃えにし、h1.jp の位置を既存ページとそろえる */
.main-title .en{display: flex;align-items: flex-end;height: 240px;font-size: min(180px, 11.5vw);letter-spacing: -0.06em;}
/* パンくず画像（幅362px）が既存ページより長いので、h1 を右へずらして重ならないように（既存は left:312px） */
.main-title .jp{left: 392px;}

#about-company main{margin: 0 auto 30px;}
#about-company .ac-head{width: min(1100px, 80vw);margin: 0 auto 100px;}
#about-company .ac-lead{font-size: 16px;line-height: 2;font-weight: 500;letter-spacing: 0.8px;margin-bottom: 50px;}
#about-company .ac-sec .ac-updated{font-size: 14px;line-height: 1.6;font-weight: 500;letter-spacing: 0.7px;color: #929292;text-align: right;}
#about-company .ac-toc{border: 2px solid #00B7FF;background: #191919;padding: 40px 50px;}
#about-company .ac-toc__ttl{font-size: 18px;line-height: 1.6;font-weight: 700;letter-spacing: 0.9px;color: #00B7FF;margin-bottom: 24px;}
#about-company .ac-toc ol{display: grid;grid-template-columns: repeat(3, 1fr);gap: 16px 30px;counter-reset: ac-toc;}
#about-company .ac-toc li{counter-increment: ac-toc;font-size: 16px;line-height: 1.6;font-weight: 500;letter-spacing: 0.8px;}
#about-company .ac-toc li::before{content: counter(ac-toc) ".";display: inline-block;width: 1.8em;color: #00B7FF;font-weight: 700;}
#about-company .ac-toc a{color: #fff;}

#about-company .ac-sec{width: min(1100px, 80vw);margin: 0 auto 110px;scroll-margin-top: 130px;}
#about-company .ac-sec h2{font-size: 30px;line-height: 1.5;font-weight: 700;letter-spacing: 2px;padding-bottom: 18px;border-bottom: 3px solid #00B7FF;margin-bottom: 40px;scroll-margin-top: 130px;}
#about-company .ac-sec h3{font-size: 20px;line-height: 1.6;font-weight: 700;letter-spacing: 1px;padding-left: 16px;border-left: 4px solid #00B7FF;margin-bottom: 20px;}
#about-company .ac-sec ul{list-style: disc;padding-left: 1.4em;}
#about-company .ac-sec ol{list-style: decimal;padding-left: 1.8em;}
#about-company .ac-sec ul li::marker,
#about-company .ac-sec ol li::marker{color: #00B7FF;font-weight: 700;}
#about-company .ac-sec li{font-size: 16px;line-height: 2;font-weight: 500;letter-spacing: 0.8px;}
#about-company .ac-sec li:not(:last-child){margin-bottom: 8px;}
#about-company .ac-sec p{font-size: 16px;line-height: 2;font-weight: 500;letter-spacing: 0.8px;}
#about-company .ac-sec > ul:not(:last-child),
#about-company .ac-sec > ol:not(:last-child),
#about-company .ac-sec > dl:not(:last-child),
#about-company .ac-sec > p:not(:last-child),
#about-company .ac-sec > div:not(:last-child){margin-bottom: 40px;}
#about-company .ac-sec > p.ac-link:not(:last-child){margin-bottom: 0;}
#about-company .ac-sec > ul + p.ac-link{margin-bottom: 0;}
#about-company .ac-sec > ul:has(+ p.ac-link){margin-bottom: 24px;}
#about-company .ac-sec > dl:has(+ p.ac-link){margin-bottom: 24px;}

#about-company .ac-table{display: grid;grid-template-columns: min(359px, 30vw) 1fr;border-top: 1px solid #DFDFDF;}
#about-company .ac-table dt{font-size: 16px;line-height: 2.5;font-weight: 700;letter-spacing: 0.8px;padding: 30px 27px 30px min(80px, 5vw);border-bottom: 1px solid #DFDFDF;}
#about-company .ac-table dd{font-size: 16px;line-height: 2.25;font-weight: 500;letter-spacing: 0.8px;padding: 30px 27px 30px 0;border-bottom: 1px solid #DFDFDF;}

#about-company .ac-pay{border: 2px solid #00B7FF;background: #191919;padding: 30px 40px;}
#about-company .ac-pay h3{margin-bottom: 14px;}

#about-company .ac-link a{color: #00B7FF;text-decoration: underline;text-underline-offset: 4px;}

#about-company .ac-faq{border-bottom: 1px solid #DFDFDF;}
#about-company .ac-faq dt{display: flex;font-size: 18px;line-height: 1.8;font-weight: 700;letter-spacing: 0.9px;padding: 26px 0 10px;border-top: 1px solid #DFDFDF;}
#about-company .ac-faq dd{display: flex;font-size: 16px;line-height: 2;font-weight: 500;letter-spacing: 0.8px;padding: 0 0 26px;}
#about-company .ac-faq dt span,
#about-company .ac-faq dd span{flex: none;width: 2em;font-weight: 700;}
#about-company .ac-faq dt span{color: #00B7FF;}
#about-company .ac-faq dd span{color: #fff;}

#about-company .ac-faq dt:first-child{border-top: 0;}
#about-company a:focus-visible{outline: 2px solid #00B7FF !important;outline-offset: 4px;}
}

@media screen and (min-width: 768px) and (any-hover: hover) {
#about-company .ac-toc a:hover{color: #00B7FF;}
#about-company .ac-link a:hover{color: #fff;}
}


@media screen and (max-width: 767px) {
.main-title{ background: url(../images/about-company/sp-h1.png)no-repeat top right;background-size: 100% auto;}
.main-title .en{display: flex;align-items: flex-end;height: 13.28vw;font-size: 11vw;letter-spacing: -0.06em;}

#about-company main{margin: 0 auto 10vw;}
#about-company .ac-head{margin: 0 8.8vw 14vw;}
#about-company .ac-lead{font-size: 3.38vw;line-height: 2;font-weight: 500;letter-spacing: 0.16vw;margin-bottom: 8vw;}
#about-company .ac-sec .ac-updated{font-size: 3.1vw;line-height: 1.6;font-weight: 500;letter-spacing: 0.1vw;color: #929292;text-align: right;}
#about-company .ac-toc{border: 0.4vw solid #00B7FF;background: #191919;padding: 6vw 5vw;}
#about-company .ac-toc__ttl{font-size: 4vw;line-height: 1.6;font-weight: 700;letter-spacing: 0.2vw;color: #00B7FF;margin-bottom: 4vw;}
#about-company .ac-toc ol{display: grid;grid-template-columns: 1fr;gap: 3vw;counter-reset: ac-toc;}
#about-company .ac-toc li{counter-increment: ac-toc;font-size: 3.6vw;line-height: 1.6;font-weight: 500;letter-spacing: 0.16vw;}
#about-company .ac-toc li::before{content: counter(ac-toc) ".";display: inline-block;width: 1.8em;color: #00B7FF;font-weight: 700;}
#about-company .ac-toc a{color: #fff;}

#about-company .ac-sec{margin: 0 8.8vw 16vw;scroll-margin-top: 28vw;}
#about-company .ac-sec h2{font-size: 4.83vw;line-height: 1.5;font-weight: 700;letter-spacing: 0.4vw;padding-bottom: 3vw;border-bottom: 0.6vw solid #00B7FF;margin-bottom: 6vw;scroll-margin-top: 28vw;}
#about-company .ac-sec h3{font-size: 4vw;line-height: 1.6;font-weight: 700;letter-spacing: 0.2vw;padding-left: 3vw;border-left: 1vw solid #00B7FF;margin-bottom: 4vw;}
#about-company .ac-sec ul{list-style: disc;padding-left: 1.4em;}
#about-company .ac-sec ol{list-style: decimal;padding-left: 1.8em;}
#about-company .ac-sec ul li::marker,
#about-company .ac-sec ol li::marker{color: #00B7FF;font-weight: 700;}
#about-company .ac-sec li{font-size: 3.38vw;line-height: 2;font-weight: 500;letter-spacing: 0.16vw;}
#about-company .ac-sec li:not(:last-child){margin-bottom: 2vw;}
#about-company .ac-sec p{font-size: 3.38vw;line-height: 2;font-weight: 500;letter-spacing: 0.16vw;}
#about-company .ac-sec > ul:not(:last-child),
#about-company .ac-sec > ol:not(:last-child),
#about-company .ac-sec > dl:not(:last-child),
#about-company .ac-sec > p:not(:last-child),
#about-company .ac-sec > div:not(:last-child){margin-bottom: 8vw;}
#about-company .ac-sec > p.ac-link:not(:last-child){margin-bottom: 0;}
#about-company .ac-sec > ul:has(+ p.ac-link){margin-bottom: 5vw;}
#about-company .ac-sec > dl:has(+ p.ac-link){margin-bottom: 5vw;}

#about-company .ac-table{display: block;border-top: 0.2vw solid #DFDFDF;}
#about-company .ac-table dt{font-size: 3.38vw;line-height: 2;font-weight: 700;letter-spacing: 0.16vw;padding: 3.2vw 2vw 0;}
#about-company .ac-table dd{font-size: 3.38vw;line-height: 1.64;font-weight: 500;letter-spacing: 0.16vw;padding: 0 2vw 3.7vw;border-bottom: 0.2vw solid #DFDFDF;}

#about-company .ac-pay{border: 0.4vw solid #00B7FF;background: #191919;padding: 5vw 5vw;}
#about-company .ac-pay h3{margin-bottom: 3vw;}

#about-company .ac-link a{color: #00B7FF;text-decoration: underline;text-underline-offset: 1vw;}

#about-company .ac-faq{border-bottom: 0.2vw solid #DFDFDF;}
#about-company .ac-faq dt{display: flex;font-size: 3.86vw;line-height: 1.8;font-weight: 700;letter-spacing: 0.16vw;padding: 5vw 0 2vw;border-top: 0.2vw solid #DFDFDF;}
#about-company .ac-faq dd{display: flex;font-size: 3.38vw;line-height: 2;font-weight: 500;letter-spacing: 0.16vw;padding: 0 0 5vw;}
#about-company .ac-faq dt span,
#about-company .ac-faq dd span{flex: none;width: 2em;font-weight: 700;}
#about-company .ac-faq dt span{color: #00B7FF;}
#about-company .ac-faq dd span{color: #fff;}

#about-company .ac-faq dt:first-child{border-top: 0;}
#about-company a:focus-visible{outline: 0.6vw solid #00B7FF !important;outline-offset: 1vw;}
}

@media screen and (max-width: 767px) and (any-hover: hover) {
#about-company .ac-toc a:hover{color: #00B7FF;}
#about-company .ac-link a:hover{color: #fff;}
}
