@charset "utf-8";

/** escalator walkway common **/

/*navigation*/
#VerticalLocalNavi li li li li a{
padding: 9px 15px 9px 58px;
}
#VerticalLocalNavi li li li li.Current a strong{
margin: -9px -15px -9px -58px;
padding: 9px 15px 9px 58px;
}

/* es_select merit*/
.es_select_merit{
display: flex;
flex-direction: column;
gap: 15px;
max-width: 860px;
margin: 0 auto 60px;
}
.merit__item{
border: 2px solid #cc0000;
border-radius: 12px;
position: relative;
padding: 10px 22px;
display: flex;
align-items: stretch;
gap: 46px;
}
.merit__item::before{
display: block;
content: "";
width: 0;
height: 0;
border-style: solid;
border-width: 17.5px 0 17.5px 13px;
border-color: transparent transparent transparent #cc0000;
position: absolute;
left: 0;
top: 50%;
transform: translateY(-50%);
}
.merit_num{
display: flex;
flex-direction: column;
gap: 2px;
align-items: center;
color: #cc0000;
flex-shrink: 0;
}
.merit_num span:nth-child(1){
font-size: 90.63%;
font-weight: 700;
}
.merit_num span:nth-child(2){
font-size: 162.50%;
font-weight: 400;
font-family: "Noto Sans JP", "Yu Gothic UI", "Noto Sans" ,sans-serif;
}
.merit__text{
font-size: 100%;
font-weight: 700;
color: #222222;
display: flex;
align-items: center;
}

.l-main .l-box.specifications__container{
margin-right: auto;
padding: 1.9em 0 1.3214285714em;
}
.specifications__container .specifications__container__inner{
width: 93.3333333333%;
margin-left: auto;
margin-right: auto;
}
.c-column-set.-column2-pt2.singleItem{
justify-content: center;
}

@media screen and (min-width: 768px) {
.l-main .l-box.specifications__container{
padding: 2.28125em 0 2.8125em;
}
.specifications__container .specifications__container__inner{
width: 82.1052631579%;
}
.merit__item {
gap: 20px;
}
}

/* es_select select*/
.select_step{
max-width: 860px;
margin: 0 auto 10px;
}
.select3__bg{
background-color: #96fdcc;
padding-top: 14px;
display: flex;
}
.select2__bg{
background-color: #ffcbce;
padding-top: 13px;
width: 66.66%;
display: flex;
}
.select1__bg{
background-color: #96c5fd;;
padding: 13px;
width: 50%;
}
.select1__content{
display: flex;
height: 100%;
cursor: pointer;
}
.select2__content{
padding: 12px;
display: flex;
width: 50%;
height: 100%;
cursor: pointer;
}
.select3__content{
padding: 24px 12px 12px;
display: flex;
width: 33.33%;
height: 100%;
cursor: pointer;
}
.select1__content__head,
.select2__content__head,
.select3__content__head{
width: 76px;
display: flex;
flex-direction: column;
gap: 6px;
flex-shrink: 0;
align-items: center;
}
.select1__content__body,
.select2__content__body,
.select3__content__body{
width: calc(100% - 76px);
background-color: #fff;
display: flex;
flex-direction: column;
gap: 10px;
align-items: stretch;
padding: 10px 6px;
}
.select__content__title{
font-size: 106.88%;
font-weight: 700;
color: #737373;
min-height: 60px;
}
.select__content__item ul{
display: flex;
flex-direction: column;
gap: 6px;
}
.select__content__item li{
display: block;
font-size: 87.50%;
padding-left: 1em;
position: relative;
}
.select__content__item li::before{
content:"●";
display: block;
position: absolute;
left: 0;
top: 0;
font-size: 75.00%;
}
.select__content__item li a,
.select__content__item li a:link,
.select__content__item li a:visited,
.select__content__item li a:active{
text-decoration: none;
color: #222222;
}
.select__content__item li a:hover{
text-decoration: underline;
}
.head__text{
font-family: "Noto Sans JP", "Yu Gothic UI", "Noto Sans" ,sans-serif;
font-size: 121.25%;
font-weight: 400;
}
.head__num{
font-family: "Noto Sans JP", "Yu Gothic UI", "Noto Sans" ,sans-serif;
font-size: 242.50%;
font-weight: 700;
}
.select1__content__head .head__text,
.select1__content__head .head__num{
color: #004596;
}
.select2__content__head .head__text,
.select2__content__head .head__num{
color: #ff636c;
}
.select3__content__head .head__text,
.select3__content__head .head__num{
color: #00964e;
}
#icon_select1,
#icon_select2,
#icon_select3{
width: 66px;
height: auto;
margin-top: 12px;
}
.colorWhite{
fill: #fff;
}
.colorSelect1{
fill: #004596;
}
.colorSelect2{
fill: #ff636c;
}
.colorSelect3{
fill: #00964e;
}
body > .l-page p.index_es{
max-width: 768px;
margin-left: auto;
margin-right: auto;
}
body > .l-page p.construction_period{
max-width: 700px;
margin-left: auto;
margin-right: auto;
}
.es_select__columnSet {
justify-content: space-between;
gap: 40px;
flex-wrap: nowrap;
width: min(100%, 950px);
}
.es_select__columnSet .c-column-set__item:nth-child(1){
flex: 1 1 560px;
max-width: 560px;
min-width: 0;
}
.es_select__columnSet .c-column-set__item:nth-child(2){
flex: 1 1 350px;
max-width: 350px;
min-width: 0;
}
.icon__select__plus{
position: relative;
height: 40px;
margin: 15px 0;
}
.icon__select__plus::before,
.icon__select__plus::after{
display: block;
content: "";
width: 8px;
height: 37px;
background-color: #4d4d4d;
position: absolute;
left: 50%;
top: 50%;
transform: translate(-50%, -50%);
}
.icon__select__plus::after{
transform:  translate(-50%, -50%) rotate(-90deg);
}
.select_step__LEDPack{
max-width: 560px;
width: 100%;
display: flex;
border: 13px solid #FFEF95;
margin: 0 auto 60px;
cursor: pointer;
}
.select__led__content__head{
background-color: #FFEF95;
padding: 15px 10px;
display: flex;
flex-direction: column;
grid-auto-flow: 10px;
justify-content: center;
align-items: center;
}
.select__led__content__head span:nth-child(1){
font-size: 80.00%;
}
.select__led__content__head span:nth-child(1) strong{
font-size: 120.00%;
}
.select__led__content__body{
background-color: #fff;
padding: 25px;
}
.select__led__content__body .select__content__title{
min-height: auto;
margin-bottom: 25px;
}
.select__led__content__itemSet{
font-size: 87.50%;
display: flex;
gap: 15px;
}
.select__led__content__item::before{
content: "●";
display: inline-block;
margin-right: 2px;
}
.l-main .c-area-title.function__title-led{
border-left-color: #fdec96;
}

@media screen and (max-width: 768px) {
.select2__bg,
.select3__bg{
flex-direction: column;
}
.select3__bg{
padding-top: 0;
padding-right: 13px;
}
.select2__bg{
padding-top: 0;
padding-right: 13px;
}
.select1__bg,
.select2__bg,
.select2__content,
.select3__content{
width: 100%;
}
.select3__content{
padding-top: 12px;
}
.select1__content__body,
.select2__content__body,
.select3__content__body {
width: calc(100% - 64px);
}
.select1__content__body,
.select2__content__body,
.select3__content__body{
padding: 15px;
}
.select3__content__body{
margin-right: 13px;
}
.select__content__title{
min-height: auto;
}
.select__content__title{
font-size: 120%;
}
.select__content__item li{
font-size: 100.00%;
}
.es_select__columnSet{
flex-direction: column;
}
.es_select__columnSet .c-column-set__item:nth-child(1){
max-width: none;
width: 100%;
flex-basis: auto;
}
.es_select__columnSet .c-column-set__item:nth-child(2){
max-width: none;
width: 100%;
flex-basis: auto;
}
.select_step__LEDPack{
width: 100%;
}
.select__led__content__head span:nth-child(1){
font-size: 80.00%;
}
.select__led__content__head span:nth-child(1) strong{
font-size: 150.00%;
}
.select__led__content__head span:nth-child(2){
font-size: 80.00%;
}
.select__led__content__itemSet{
font-size: 100.00%;
}
}

/*select1*/
.selct1__coulumn{
gap: 50px;
flex-wrap: nowrap;
}
.selct1__coulumn01{
max-width: 500px;
flex-shrink: 1;
}
.selct1__coulumn02{
max-width: 400px;
flex-shrink: 0.5;
}

@media screen and (max-width: 768px) {
.selct1__coulumn{
gap: 40px;
flex-wrap: wrap;
flex-direction: column;
}
.selct1__coulumn01{
max-width: none;
width: 100%;
}
.selct1__coulumn02{
max-width: none;
width: 100%;
}
}

/*select2*/
.label--standard,
.label--paid,
.label--maintenance{
display: inline-block;
margin-left: 1em;
font-size: 72.728%;
line-height: 1em;
padding: 2px 4px;
}
.label--standard{
color: #FFFFFF;
border: 1px solid #737373;
background-color: #737373;
}
.label--paid{
color: #cc0000;
border: 1px solid #cc0000;
}
.label--maintenance{
color: #004596;
border: 1px solid #004596;
}
.selct2__coulumn{
gap: 50px;
flex-wrap: nowrap;
}
.selct2__coulumn01{
max-width: 500px;
flex-shrink: 1;
}
.selct2__coulumn02{
max-width: 400px;
flex-shrink: 0.5;
}

@media screen and (max-width: 768px) {
.selct2__coulumn{
gap: 40px;
flex-wrap: wrap;
flex-direction: column;
}
.selct2__coulumn01{
max-width: none;
width: 100%;
}
.selct2__coulumn02{
max-width: none;
width: 100%;
}
}

/*select3*/
.select3__subSection{
max-width: 800px;
margin: 0 auto;
}

/** 段階リニューアル **/
.listStyle-step{
padding-left: 0.75em;
display: flex;
flex-direction: column;
gap: 0.5em;
}
.listStyle-step li{
font-size: 112.50%;
position: relative;
text-indent: -0.75em;
margin-left: 0.75em;
}
.listStyle-step li::before{
content:"●";
color: #fa000f;
display: inline-block;
margin-right: 0.25em;
}
.l-main .stepNoteLink a{
display: inline;
}
body > .l-page {
p.step__upgrade-image {
max-width: 900px;
margin: 0 auto;
}
}

/** LED化リニューアル **/
body > .l-page {
p.led__caption{
font-size: 93.75%;
font-weight: 700;
margin-bottom: 30px;
}
}
.footlightSubSection{
padding-left: 40px;
}
.led__imgCaption-set{
position: relative;
}
.led__imgCaption{
position: absolute;
right: 0;
bottom: -20px;
pointer-events: all;
}

/** ハンドレール停止検出装置 **/
body > .l-page {
p.handrail_safety_01__text{
line-height: 1.8em;
}
}
.handrail_safety_01__text-20{
font-size: 125.00%;
font-weight: 700;
}
.handrail_safety_01__text span.text-red{
color: #cc0000;
}

/** ハンドレール コーティング **/
.handrail_coating__column-set{
gap: 76px;
justify-content: center;
margin: 0 auto;
}
body > .l-page {
.handrail_coating__column-subSet{
display: flex;
gap: 0;
}
.handrail_coating__column p:nth-child(1),
.handrail_coating__column p:nth-child(3){
max-width: 160px;
display: flex;
flex-direction: column;
gap: 10px;
}
.handrail_coating__column p:nth-child(2){
max-width: 60px;
width: 100%;
display: flex;
align-items: center;
justify-content: center;
padding-top: 20px;
}
.handrail_coating__column__title{
font-size: 112.50%;
font-weight: 700;
margin-bottom: 15px;
}
.handrail_coating__column p img,
.handrail_coating__column p span{
display: block;
}
.handrail_coating__column p span{
font-size: 82.80%;
line-height: 1em;
color: #fff;
border-radius: 4px;
padding: 2px;
}
.handrail_coating__column p span.before{
background-color: #4d4d4d;
}
.handrail_coating__column p span.after{
background-color: #cc0000;
}
.handrail_coating__column-set-2{
gap: 30px;
justify-content: center;
margin: 0 auto;
}
.handrail_coating__column-2{
display: flex;
flex-direction: column;
}
.handrail_coating__column-2 .c-image{
margin-bottom: 20px;
}
.handrail_coating__column-2-2{
display: flex;
flex-wrap: nowrap;
}
.handrail_coating__column-2-2 div{
display: flex;
flex-direction: column;
justify-content: space-between;
height: 100%;
}
.handrail_coating__column-2-2 div:nth-child(1) p{
padding-left: 35px;
}
.handrail_coating__column-2-2 div:nth-child(2) .c-image+p{
padding-left: 35px;
}
}

@media screen and (max-width: 768px) {
body > .l-page {
.handrail_coating__column-2-2 div:nth-child(1) p{
padding-left: 0;
}
}
}

/**エスカレーター ラッピングサービス**/
.wrapping_service__column-set{
display: grid;
grid-template-columns: repeat(3, 1fr);
grid-template-rows: repeat(2, 1fr);
gap: clamp(30px, calc(70px + -40 * ((100vw - 768px) / 507)), 70px);
margin-bottom: 100px;
}
.wrapping_service__column{
display: flex;
flex-direction: column;
justify-content: space-between;
}
.wrapping_service__column__title{
font-size: 137.50%;
font-weight: 700;
color: #707071;
margin-bottom: 10px;
max-width: 270px;
}
.wrapping_service__column p{
max-width: 270px;
}
body > .l-page {
.wrapping_service__column__title+p{
margin-bottom: 10px;
}
}

@media screen and (max-width: 768px) {
.wrapping_service__column-set{
grid-template-columns: repeat(2, 1fr);
grid-template-rows: repeat(3, 1fr);
gap: 30px;
}
}

.wrapping_service-info{
display: flex;
flex-direction: column;
gap: 10px;
width: 100%;
}
.product-info__item{
display: flex;
}
.product-info__item--header{
background-color: #e3e5e6;
padding: 10px;
width: 86px;
}
.product-info__item--body{
background-color: #f4f4f4;
padding: 20px 10px;
width: calc(100% - 86px);
}
.product-info__item--body > ul li{
text-indent: -1em;
margin-left: 1em;
}
.product-info__list{
width: 100%;
}
.product-info__list li{
font-size: 100%;
display: flex;
}
.product-info__list li span:nth-child(1){
width: 140px;
flex-shrink: 0;
}
.product-info__list li span:nth-child(2){
position: relative;
padding-left: 40px;
}
.product-info__list li span:nth-child(2)::before{
content: "・ ・ ・";
display: inline-block;
position: absolute;
left: 0;
top: 0;
}

@media screen and (max-width: 768px) {
.product-info__list{
display: flex;
flex-direction: column;
gap: 15px;
}
.product-info__list li {
flex-direction: column;
}
.product-info__list li span:nth-child(1){
width: auto;
font-weight: 700;
}
.product-info__list li span:nth-child(2){
padding-left: 0;
}
.product-info__list li span:nth-child(2)::before{
content: "";
display: none;
}
}

.wrapping_service__notice{
border: 1px solid #929395;
}
.wrapping_service__notice__head{
font-size: 86.97%;
line-height: 1em;
padding: 8px 10px;
background-color: #e3e5e6;
text-align: center;
}
.wrapping_service__notice__body{
font-size: 87.50%;
padding: 18px 28px;
}
.wrapping_service__notice__body li{
text-indent: -1em;
margin-left: 1em;
}

/**オンリーナイト工法**/

/**リニューアルのすすめ**/
.suggestImage{
text-align: right;
}

@media screen and (max-width: 768px) {
.suggestImage{
text-align: center;
}
}