@charset "utf-8";
/*----------------------------------------------------
	共通
----------------------------------------------------*/
.subTitle__text { text-align: center; padding-bottom: 1.5em; font-weight: normal; line-height: 1.3; }
.subTitle__mainText { font-size: 5.5rem; font-family: 'Anuphan', sans-serif; color: var(--mainColor); }
.subTitle__subText { font-size: 2.0rem; letter-spacing: .1em; text-indent: .1em; font-weight: bold; color: var(--subColor); }
@media (max-width: 767px) { /* SP */
.subTitle__text { padding: 1.5em 0; font-weight: normal; }
.subTitle__mainText { font-size: 4.5rem; }
.subTitle__subText { font-size: 2.0rem; }
}


/*----------------------------------------------------
	トップページ
----------------------------------------------------*/
.top__main { background: url("../../index/images/back_top_main.jpg") no-repeat bottom right / cover; }
.top__main__en { font-size: clamp(2.8rem, 100vw * 65 / var(--mainSize), 6.5rem); font-family: 'Anuphan', sans-serif; line-height: 1.2; text-align: right; margin-top: 4em; margin-bottom: .3em; }


.top__products { background: url("../../index/images/back_top_products.jpg") no-repeat top left / cover; color: #fff; }
.top__products__en { font-size: clamp(4.5rem, 100vw * 100 / var(--mainSize), 10.0rem); font-family: 'Anuphan', sans-serif; line-height: 1.2; margin-bottom: .6em; }
.top__products__sub { font-size: clamp(4rem, 100vw * 55 / var(--mainSize), 5.5rem); font-family: 'Anuphan', sans-serif; color: var(--mainColor); }
.top__products__text { display: flex; justify-content: space-between; align-items: flex-end; }
.top__button { margin-left: 2em; }
@media (max-width: 767px) { /* SP */
.top__products__text { flex-direction: column; align-items: flex-start; }
.top__products__sub { color: #fff; }
}


.top__business { background: url("../../index/images/back_top_business.png") no-repeat top left / auto 100%; }
.top__business__wrap { display: flex; justify-content: space-between; padding-bottom: 4em; }
.top__business__item { width: 33%; }
.top__business__item.-second { margin-top: 3em; }
.top__business__item.-third { margin-top: 6em; }
.top__business__image { position: relative; text-align: center; }
.top__business__text { position: absolute; top: 70%; left: 50%; transform: translateX(-50%); width: 75%; margin: auto; padding: 1em 2em; box-shadow: 0px 0px 16px -6px rgba(0,0,0,0.6); }
.top__business__title { font-size: clamp(1.8rem, 100vw * 20 / var(--mainSize), 2.0rem); border-bottom: 2px var(--subColor) solid; line-height: 1.2; font-weight: bold; padding-bottom: .8em; margin-bottom: .6em; }
.top__business__title span { font-size: 1.2rem; line-height: 3.0; color: var(--subColor); }
a .top__business__text { background: #fff; text-align: center; color: #000; }
a:hover .top__business__text { background: var(--subColor); color: #fff; transition: .3s; opacity: .8; }
a:hover .top__business__title span { color: #fff; }
a:hover .top__business__title { border-bottom: 2px #fff solid; }
@media (max-width: 767px) { /* SP */
.top__business { background: url("../../index/images/back_top_business.png") no-repeat top left / 100% auto; }
.top__business__wrap { flex-direction: column; }
.top__business__item { width: 100%; }
.top__business__item.-second,
.top__business__item.-third { margin-top: 6em; }
}


.top__company { background: url("../../index/images/back_top_company.jpg") no-repeat bottom right / cover; }
.top__company__wrap { width: min(100%, 990px); margin-inline: auto; position: relative; padding-top: 4em; }
.top__company__text { background: #1f2736; opacity: .8; width: 70%; box-shadow: 0px 0px 16px -6px rgba(0,0,0,0.6); margin-left: auto; padding: 1.5em 3em 3em 10em; color: #fff; }
.top__company__image { width: 42%; position: absolute; top: 0; left: 0; }
.top__company__image img { box-shadow: 0px 0px 16px -6px rgba(0,0,0,0.6); }
.top__company__title { font-size: clamp(4rem, 100vw * 64 / var(--mainSize), 6.4rem); font-family: 'Anuphan', sans-serif; color: #fff; }
.top__company__wrap .top__button { position: absolute; bottom: -1em; right: -1em; }
.top__company__wrap .top__button a { color: #000; }
.top__company__wrap .top__button a::before { background-color: #000; }
.top__company__wrap .top__button a::after { background-color: #000; }
@media (max-width: 767px) { /* SP */
.top__company { background: url("../../index/images/back_top_company.jpg") no-repeat bottom left / auto 80%; }
.top__company__image { width: 100%; position: relative; }
.top__company__text { width: 100%; padding: 1.5em 3em; }
.top__company__wrap .top__button { position: relative; bottom: 0; right: 0; }
}


.top__button a { display: flex; justify-content: space-between; align-items: center; position: relative; margin: 1em auto 0; padding: .6em 1.5em; width: 230px; color: #fff; font-size: 1.8rem; background-color: var(--mainColor); transition: 0.3s; }
.top__button a::before { content: ''; position: absolute; top: calc(50% - 2px); right: -2em; transform: translateY(calc(-50% - 2px)) rotate(30deg); width: 20px; height: 2px; background-color: #fff; transition: 0.3s; }
.top__button a::after { content: ''; position: absolute; top: 50%; right: -2em; transform: translateY(-50%); width: 135px; height: 2px; background-color: #fff; transition: 0.3s; }
.top__button a:hover { text-decoration: none; background-color: #ffa74c; }
.top__button a:hover::before,
.top__button a:hover::after { right: -2.5em; }
@media (max-width: 767px) { /* SP */
.top__button { margin-left: 0; }
}


.top__topics { background: #fff; margin-bottom: -20em; position: relative; z-index: 10; box-shadow: 0px 0px 16px -6px rgba(0,0,0,0.6); }
.top__topics__wrap { display: flex; justify-content: space-between; }
.top__topics__title { width: 20%; background: url("../../index/images/back_top_title.png") no-repeat left top / 100% auto; writing-mode: vertical-rl; padding-top: 7em; }
.top__topics__en { font-size: clamp(4rem, 100vw * 64 / var(--mainSize), 6.4rem); font-family: 'Anuphan', sans-serif; line-height: 1; text-orientation: mixed; vertical-align: middle; }
.top__topics__ja { font-size: 2.1rem; color: var(--mainColor); font-weight: bold; text-orientation: mixed; vertical-align: middle; }
.top__topics__text { width: 80%; }
.top__topics__inner { padding: 4em 4em 2em 4em; }
@media (max-width: 767px) { /* SP */
.top__topics { width: 90%; margin-left: auto; margin-right: auto; margin-bottom: -15em; }
.top__topics__wrap { flex-direction: column; }
.top__topics__inner { padding: 2.5em 2.5em 1em 2.5em; }
.top__topics__title { background: url("../../index/images/back_top_title.png") no-repeat left top / auto 100%; writing-mode: horizontal-tb; padding-top: 2em; text-align: center; }
.top__topics__title,
.top__topics__text { width: 100%; }
}


/*----------------------------------------------------
	会社概要
----------------------------------------------------*/
.company__text { line-height: 2.0; text-align: justify; padding: 2em 0; }
.company__name { text-align: right; font-weight: bold; }
.company__name span { font-size: 2.4rem; }

.company__img img{ width: 100%; max-height: 600px; object-fit: cover; }

.company__wrap { background: url("../../company/images/bg_back_profile.png") repeat center center / cover; }
.company__bg { 
  background: url("../../company/images/bg_top_profile.png") no-repeat top left / 50% auto,
              url("../../company/images/bg_bottom_profile.png") no-repeat bottom right / 50% auto;
}
.company__table { width: 100%; line-height: 1.6; border-bottom: 1px solid var(--mainColor); border-spacing: 0; margin-bottom: 3em; }
.company__table th,.company__table td { display: block; width: 100%; text-align: center; border-top: 1px solid var(--mainColor); padding: 1.2em; }
.company__table th { line-height: 1.2; letter-spacing: 0.05em; font-weight: bold; background: rgba(170,180,200,0.2); }
.company__table__en { font-size: 1.2rem; color: var(--mainColor); }

@media (min-width:768px) { /* PC */
.company__table th,.company__table td { display: table-cell; width: auto; float: none; padding: 1em 1.5em; }
.company__table th { width: 28%; white-space: nowrap; }
.company__table td { text-align: left; }
}


/*----------------------------------------------------
	技術データ
----------------------------------------------------*/
.techno { margin-top: 5em; margin-bottom: 5em; padding-bottom: 10em; }
.techno.-solution { background: url("../../technology/images/back_techno_solution.jpg") no-repeat center center / cover; }
.techno.-detail { background: url("../../technology/images/back_techno_detail.jpg") no-repeat center center / cover; }
.techno__text { background: #fff; padding: 2em 4.5em 5em; width: 48%; line-height: 2.5; }
.techno__text.-detail { margin-left: auto; }
.techno__text__title { font-size: clamp(4rem, 100vw * 50 / var(--mainSize), 5.0rem); font-family: 'Anuphan', sans-serif; line-height: 1.5; }
.techno__text__title.-solution { color: var(--mainColor); }
.techno__text__title.-detail { color: var(--subColor); }
.techno__image { text-align: center; margin-top: 2em; margin-bottom: -50%; }
@media (max-width: 767px) { /* SP */
.techno__text { padding: 1em 3em 5em; width: 100%; line-height: 1.8; }
.techno__text__title { line-height: 1; margin-bottom: .5em; }
}


.techno__graph { display: flex; flex-wrap: wrap; align-items: center; gap: 5em; }
.techno__graph__item { width: calc((100% - 5em) / 2); }
.techno__graph__title { font-size: 2.8rem; line-height: 1.5; margin-bottom: .5em; color: var(--mainColor); }
.-reverse { flex-direction: row-reverse; }
.techno__graph .-lightgray { color: #aab4c8; }
.techno__graph .-darkgray { color: #737373; }
.techno__graph .-orange { color: var(--mainColor); }
.techno__graph .-blue { color: var(--subColor); }
@media (max-width: 767px) { /* SP */
.techno__graph { flex-direction: column; }
.techno__graph__item { width: 100%; }
}


.techno__puGraph { display: flex; flex-wrap: wrap; align-items: flex-start; gap: 5em; margin-top: 2em; }
.techno__puGraph__title { font-weight: bold; color: var(--subColor); margin-bottom: .5em; }
.techno__puGraph__table { border: #aab4c8 1px solid; width: max(100%, 300px); border-collapse: collapse; border-spacing: 0; line-height: 1.2; }
.techno__puGraph__table th,
.techno__puGraph__table td { font-size: 1.7rem; padding: .4em 1em; text-align: center; border: #aab4c8 1px solid; }
.techno__puGraph__table th {background: #d0d6e1; }
@media (max-width: 767px) { /* SP */
.techno__puGraph { gap: 1em; }
}


/*----------------------------------------------------
	製品
----------------------------------------------------*/
.products__false__wrap { display: flex; align-items: flex-start; gap: 2em; }
.products__false__image { width: 30%; }
.products__false__text { width: 70%; margin-left: -20em; z-index: 10; padding: 4em; margin-top: 5em; line-height: 2.2; background: url("../../products/images/back_products_false.jpg") no-repeat center / cover; }
.products__false__titleWrap { display: flex; flex-wrap: wrap; align-items: flex-start; justify-content: space-between; }
.products__false__title { width: 60%; }
.products__false__disk {  width: 40%; margin-top: -11em; text-align: center; }
.products__false__en { font-size: clamp(4.0rem, 100vw * 65 / var(--mainSize), 6.5rem); font-family: 'Anuphan', sans-serif; line-height: 1; }
.products__false__ja { font-size: 2.2rem; font-weight: bold; line-height: 1.5; margin-top: .5em; margin-bottom: 1.5em; color: var(--mainColor); }
@media (min-width: 768px) { /* PC */
.-falseReverse { flex-direction: row-reverse; }
}
@media (max-width: 767px) { /* SP */
.products__false__wrap,
.products__false__titleWrap { flex-direction: column; }
.products__false__image { width: 100%; padding: 0; }
.products__false__image.fullBoxLeft { margin-left: 0; }
.products__false__text { width: 100%; margin-left: 0; padding: 2em; }
.products__false__title { width: 100%; }
.products__false__disk { width: 60%; margin: 0 auto 1em; }
}


.products__pudisk__wrap { display: flex; justify-content: space-between; gap: 1em; }
.products__pudisk__item { background: var(--mainColor); padding: 3em 2em; border-radius: 1.5em; width: calc(100% - 2em / 3); }
.products__pudisk__title { font-size: 2.1rem; line-height: 1.3; text-align: center; font-weight: bold; position: relative; margin-bottom: 1.5em; }
.products__pudisk__title::before { background: #fff; bottom: -.5em; content: ""; width: 50px; height: 2px; left: 50%; position: absolute; transform: translateX(-50%); }
 @media (min-width: 768px) { /* PC */
.products__pudisk__item.-second { margin-top: 2em; }
.products__pudisk__item.-third { margin-top: 4em; }
.products__pudisk__item { max-height: 470px; }
.products__pudisk__item.-en { max-height: 560px; }
}
@media (max-width: 767px) { /* SP */
.products__pudisk__wrap { flex-direction: column; }
.products__pudisk__item { width: 100%; }
}


.products__wheel { background: url("../../products/images/back_products_wheel.jpg") no-repeat center /cover; }
.products__wheel__wrap { display: flex; justify-content: space-between; align-items: center; gap: 1em; }
.products__wheel__item { font-size: 1.7rem; color: #fff; line-height: 1.5; }
.products__wheel__title { font-size: 2.8rem; color: var(--mainColor); margin-bottom: .5em; }
@media (max-width: 767px) { /* SP */
.products__wheel__wrap { flex-direction: column; }
}


.wrapMedium { width: min(100% - 4rem, 900px); margin-inline: auto; }
.products__lineup__wrap { display: flex; align-items: center; justify-content: space-between; background: #fff; box-shadow: 0px 0px 16px -6px rgba(0,0,0,0.6); margin: 5em 0; }
.products__lineup__image { width: 55%; }
.products__lineup__text { width: 45%; max-inline-size: max-content; margin-inline: auto; padding: 3em; }
.products__lineup__title { font-size: clamp(2.4rem, 100vw * 30 / var(--mainSize), 3.0rem); font-weight: bold; line-height: 1.5; color: var(--mainColor); margin-bottom: .5em; }
.-reverse { flex-direction: row-reverse; }
@media (max-width: 767px) { /* SP */
.products__lineup__wrap { flex-direction: column; }
.products__lineup__image,
.products__lineup__text { width: 100%; }
}