.hr-header { position: fixed; }

.hr-abrcy_bg { position: fixed; width: 100%; height: 100%; left: 0; right: 0; top: 0; bottom: 0; opacity: 0; pointer-events: none; }

.hr-abrcy_section01 { position: relative; background-color: #f1f2f4; background-position: center bottom; background-repeat: no-repeat; height: 100vh; }

@media print, all and (min-width: 768px) { .hr-abrcy_section01 { background-image: url(/theme-images/about/recycle/section_bg01_pc.jpg); background-size: cover; padding-top: 77px; } }

@media screen and (max-width: 767px) { .hr-abrcy_section01 { background-image: url(/theme-images/about/recycle/section_bg01_sp.jpg); background-size: 100% auto; padding-top: 51px; } }

.hr-abrcy_section01::before { position: absolute; background-position: center bottom; background-repeat: no-repeat; width: 100%; left: 0; right: 0; top: 0; bottom: 0; opacity: 0; -webkit-transition: opacity 350ms linear 0ms; -o-transition: opacity 350ms linear 0ms; transition: opacity 350ms linear 0ms; z-index: 3; pointer-events: none; }

@media print, all and (min-width: 768px) { .hr-abrcy_section01::before { background-size: cover; } }

@media screen and (max-width: 767px) { .hr-abrcy_section01::before { background-size: 100% auto; } }

.hr-abrcy_section01::after { position: absolute; background-position: left bottom; background-repeat: no-repeat; width: 50%; right: 0; top: 0; bottom: 0; opacity: 0; -webkit-transition: opacity 700ms linear 700ms; -o-transition: opacity 700ms linear 700ms; transition: opacity 700ms linear 700ms; z-index: 5; pointer-events: none; }

@media print, all and (min-width: 768px) { .hr-abrcy_section01::after { background-size: cover; } }

@media screen and (max-width: 767px) { .hr-abrcy_section01::after { background-size: 100% auto; } }

.hr-abrcy_section01.animated::before, .hr-abrcy_section01.animated::after { opacity: 1; }

.hr-abrcy_section01.rcy02::before { content: ""; }

@media print, all and (min-width: 768px) { .hr-abrcy_section01.rcy02::before { background-image: url(/theme-images/about/recycle/section02_bg01_pc.jpg); } }

@media screen and (max-width: 767px) { .hr-abrcy_section01.rcy02::before { background-image: url(/theme-images/about/recycle/section02_bg01_sp.jpg); } }

.hr-abrcy_section01.rcy02::after { content: ""; }

@media print, all and (min-width: 768px) { .hr-abrcy_section01.rcy02::after { background-image: url(/theme-images/about/recycle/section02_bg02_pc.jpg); } }

@media screen and (max-width: 767px) { .hr-abrcy_section01.rcy02::after { background-image: url(/theme-images/about/recycle/section02_bg02_sp.jpg); } }

.hr-abrcy_section01.rcy03::before { content: ""; }

@media print, all and (min-width: 768px) { .hr-abrcy_section01.rcy03::before { background-image: url(/theme-images/about/recycle/section03_bg01_pc.jpg); } }

@media screen and (max-width: 767px) { .hr-abrcy_section01.rcy03::before { background-image: url(/theme-images/about/recycle/section03_bg01_sp.jpg); } }

.hr-abrcy_section01.rcy03::after { content: ""; }

@media print, all and (min-width: 768px) { .hr-abrcy_section01.rcy03::after { background-image: url(/theme-images/about/recycle/section03_bg02_pc.jpg); } }

@media screen and (max-width: 767px) { .hr-abrcy_section01.rcy03::after { background-image: url(/theme-images/about/recycle/section03_bg02_sp.jpg); } }

.hr-abrcy_section01.rcy04 { background: #fff; }

.hr-abrcy_section01 .hr-main_breadcrumbs { position: absolute; left: 0; right: 0; }

@media print, all and (min-width: 768px) { .hr-abrcy_section01 .hr-main_breadcrumbs { top: 77px; } }

@media screen and (max-width: 767px) { .hr-abrcy_section01 .hr-main_breadcrumbs { top: 51px; } }

.hr-abrcy_block01 { position: relative; width: 100%; height: 100%; }

.hr-abrcy_block02 { display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-orient: vertical; -webkit-box-direction: normal; -ms-flex-direction: column; flex-direction: column; -webkit-box-pack: center; -ms-flex-pack: center; justify-content: center; -webkit-box-align: center; -ms-flex-align: center; align-items: center; position: relative; width: 100%; height: 100%; }

.hr-abrcy_sub01 { position: absolute; left: 50%; line-height: 0; text-align: center; opacity: 0; -webkit-transition: opacity 350ms linear 1750ms; -o-transition: opacity 350ms linear 1750ms; transition: opacity 350ms linear 1750ms; -webkit-transform: translate(-50%, -50%); -ms-transform: translate(-50%, -50%); transform: translate(-50%, -50%); z-index: 10; }

.hr-abrcy_sub01 > p { position: relative; width: 100%; height: 100%; }

.hr-abrcy_sub01 > p img { position: absolute; left: 50%; top: 50%; -webkit-transform: translate(-50%, -50%); -ms-transform: translate(-50%, -50%); transform: translate(-50%, -50%); }

@media print, all and (min-width: 768px) { .rcy02 .hr-abrcy_sub01 { width: 28.82%; height: 4.15%; bottom: 85.063%; } }

@media screen and (max-width: 767px) { .rcy02 .hr-abrcy_sub01 { width: 62%; height: 3.097%; bottom: 88.525%; } }

@media print, all and (min-width: 768px) { .rcy03 .hr-abrcy_sub01 { width: 37.014%; height: 4.15%; bottom: 85.063%; } }

@media screen and (max-width: 767px) { .rcy03 .hr-abrcy_sub01 { width: 79.6%; height: 3.097%; bottom: 83.789%; } }

.animated .hr-abrcy_sub01 { opacity: 1; }

.hr-abrcy_sub02 { position: relative; line-height: 0; text-align: center; z-index: 10; }

.hr-abrcy_sub02 > p { position: relative; width: 100%; height: 100%; }

.hr-abrcy_sub02 > p img { position: absolute; left: 50%; top: 50%; -webkit-transform: translate(-50%, -50%); -ms-transform: translate(-50%, -50%); transform: translate(-50%, -50%); }

@media print, all and (min-width: 768px) { .rcy04 .hr-abrcy_sub02 { width: 31.389%; height: 3.735%; } }

@media screen and (max-width: 767px) { .rcy04 .hr-abrcy_sub02 { width: 64.534%; height: 2.551%; } }

@media print, all and (min-width: 768px) { .hr-abrcy_sub02 + .hr-abrcy_video01 { margin-top: 3.473%; } }

@media screen and (max-width: 767px) { .hr-abrcy_sub02 + .hr-abrcy_video01 { margin-top: 9.867%; } }

.hr-abrcy_lead01 { position: absolute; left: 50%; line-height: 0; text-align: center; opacity: 0; -webkit-transition: opacity 350ms linear 0ms; -o-transition: opacity 350ms linear 0ms; transition: opacity 350ms linear 0ms; -webkit-transform: translate(-50%, -50%); -ms-transform: translate(-50%, -50%); transform: translate(-50%, -50%); z-index: 10; }

.hr-abrcy_lead01 > p { position: relative; width: 100%; height: 100%; }

.hr-abrcy_lead01 > p img { position: absolute; left: 50%; top: 50%; -webkit-transform: translate(-50%, -50%); -ms-transform: translate(-50%, -50%); transform: translate(-50%, -50%); }

@media print, all and (min-width: 768px) { .rcy01 .hr-abrcy_lead01 { width: 56.389%; height: 20.194%; bottom: 51.868%; } }

@media screen and (max-width: 767px) { .rcy01 .hr-abrcy_lead01 { width: 82.534%; height: 30.693%; bottom: 41.303%; } }

.animated .hr-abrcy_lead01 { opacity: 1; }

.hr-abrcy_lead01 + .hr-abrcy_img01 { -webkit-transition: opacity 700ms linear 700ms; -o-transition: opacity 700ms linear 700ms; transition: opacity 700ms linear 700ms; }

.hr-abrcy_lead02 { position: absolute; left: 50%; line-height: 0; text-align: center; opacity: 0; -webkit-transition: opacity 350ms linear 2100ms; -o-transition: opacity 350ms linear 2100ms; transition: opacity 350ms linear 2100ms; -webkit-transform: translate(-50%, -50%); -ms-transform: translate(-50%, -50%); transform: translate(-50%, -50%); z-index: 10; }

.hr-abrcy_lead02 > p { position: relative; width: 100%; height: 100%; }

.hr-abrcy_lead02 > p img { position: absolute; left: 50%; top: 50%; -webkit-transform: translate(-50%, -50%); -ms-transform: translate(-50%, -50%); transform: translate(-50%, -50%); }

@media print, all and (min-width: 768px) { .rcy02 .hr-abrcy_lead02 { width: 63.473%; height: 8.161%; bottom: 67.29%; } }

@media screen and (max-width: 767px) { .rcy02 .hr-abrcy_lead02 { width: 67.2%; height: 20.583%; bottom: 52.915%; } }

@media print, all and (min-width: 768px) { .rcy03 .hr-abrcy_lead02 { width: 40.764%; height: 8.161%; bottom: 67.29%; } }

@media screen and (max-width: 767px) { .rcy03 .hr-abrcy_lead02 { width: 57.067%; height: 15.939%; bottom: 55.146%; } }

.animated .hr-abrcy_lead02 { opacity: 1; }

.hr-abrcy_link01 { position: absolute; left: 50%; line-height: 1; text-align: center; opacity: 0; -webkit-transition: opacity 700ms linear 2450ms; -o-transition: opacity 700ms linear 2450ms; transition: opacity 700ms linear 2450ms; -webkit-transform: translate(-50%, -50%); -ms-transform: translate(-50%, -50%); transform: translate(-50%, -50%); z-index: 10; }

@media print, all and (min-width: 768px) { .hr-abrcy_link01 { bottom: 5.81%; font-size: 16px; } }

@media screen and (max-width: 767px) { .hr-abrcy_link01 { bottom: 3.598%; font-size: 10.5px; } }

.hr-abrcy_link01 > a { display: block; opacity: 0.75; cursor: pointer; }

.hr-abrcy_link01 > a::after { content: ""; display: block; background-image: url(/theme-images/main/arrow.png); background-position: center bottom; background-repeat: no-repeat; background-size: auto 60%; width: 100%; height: 1em; }

.hr-abrcy_link01 > a:hover { opacity: 0.25; }

.animated .hr-abrcy_link01 { opacity: 1; }

.hr-abrcy_img01 { position: absolute; left: 50%; line-height: 0; text-align: center; opacity: 0; -webkit-transition: opacity 700ms linear 0ms; -o-transition: opacity 700ms linear 0ms; transition: opacity 700ms linear 0ms; -webkit-transform: translate(-50%, -50%); -ms-transform: translate(-50%, -50%); transform: translate(-50%, -50%); z-index: 10; }

.hr-abrcy_img01 > figure { position: relative; width: 100%; height: 100%; }

.hr-abrcy_img01 > figure img { position: absolute; left: 50%; top: 50%; -webkit-transform: translate(-50%, -50%); -ms-transform: translate(-50%, -50%); transform: translate(-50%, -50%); }

@media print, all and (min-width: 768px) { .rcy01 .hr-abrcy_img01 { width: 10.417%; height: 19.364%; bottom: 24.758%; } }

@media screen and (max-width: 767px) { .rcy01 .hr-abrcy_img01 { width: 25.867%; height: 16.394%; bottom: 23.589%; } }

.animated .hr-abrcy_img01 { opacity: 1; }

.hr-abrcy_img01 + .hr-abrcy_lead01 { -webkit-transition: opacity 350ms linear 700ms; -o-transition: opacity 350ms linear 700ms; transition: opacity 350ms linear 700ms; }

.hr-abrcy_img01 + .hr-abrcy_link01 { -webkit-transition: opacity 350ms linear 2100ms; -o-transition: opacity 350ms linear 2100ms; transition: opacity 350ms linear 2100ms; }

.hr-abrcy_video01 { position: relative; line-height: 0; text-align: center; z-index: 10; }

.hr-abrcy_video01 > figure { position: absolute; width: 100%; height: 100%; left: 0; right: 0; top: 0; bottom: 0; }

.hr-abrcy_video01 > figure::after { content: ""; position: absolute; background-color: #808080; background-image: url(/theme-images/main/movie01.png); background-position: center center; background-repeat: no-repeat; background-size: contain; border-radius: 50%; width: 0; height: 0; left: 50%; top: 50%; -webkit-transform: translate(-50%, -50%); -ms-transform: translate(-50%, -50%); transform: translate(-50%, -50%); pointer-events: none; }

@media print, all and (min-width: 768px) { .hr-abrcy_video01 > figure::after { padding: 2.605%; } }

@media screen and (max-width: 767px) { .hr-abrcy_video01 > figure::after { padding: 6.25%; } }

.hr-abrcy_video01 > figure img { position: absolute; left: 50%; top: 50%; -webkit-transform: translate(-50%, -50%); -ms-transform: translate(-50%, -50%); transform: translate(-50%, -50%); }

@media print, all and (min-width: 768px) { .rcy04 .hr-abrcy_video01 { width: 53.334%; height: 59.752%; } }

@media screen and (max-width: 767px) { .rcy04 .hr-abrcy_video01 { width: 85.334%; height: 32.787%; } }
