@charset "UTF-8";
     .only-sp {
display: none; }
@media (max-width: 767px) {
.only-sp {
display: block; } }
@media (max-width: 767px) {
.only-pc {
display: none; } }
@media (max-width: 960px) {
.only-pc {
display: none; } }
.only-tab {
display: none; }
@media (max-width: 960px) {
.only-tab {
display: block; } }
@media (max-width: 767px) {
.only-tab {
display: none; } }
@media (max-width: 960px) {
.no-tab {
display: none; } }
@media (max-width: 767px) {
.no-tab {
display: block; } }
@media (max-width: 767px) {
.only-exsp {
display: none; } }
.only-expc {
display: none; }
@media (max-width: 960px) {
.only-expc {
display: block; } } html {
font-family: "BIZ UDPGothic", sans-serif;
font-weight: 500;
font-size: 62.5%;
color: #333333;
-webkit-text-size-adjust: 100%; } body {
margin: 0; font-size: 1.8rem;
line-height: 180%; }
@media (max-width: 767px) {
body {
font-size: 1.6rem; } }
* {
margin: 0;
padding: 0; }
p, h1, h2, h3, h4, h5, h6, figure {
margin: 0; }
h1, h2, h3, h4, h5, h6 {
line-height: 150%; }
p {
line-height: 180%;
text-align: justify; }
li {
list-style: none; } article, aside, details, figcaption, figure, footer, header, main, menu, nav, section, summary { display: block; } audio, canvas, progress, video {
display: inline-block; } input[type=text], input[type=email], input[type=tel], textarea, select {
-webkit-appearance: none;
appearance: none;
border: 1px solid #767676;
border-radius: 0px; }
select {
background: #fff url(data:image/svg+xml;charset=US-ASCII,%3Csvg%20width%3D%2220%22%20height%3D%2220%22%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%3E%3Cpath%20d%3D%22M5%206l5%205%205-5%202%201-7%207-7-7%202-1z%22%20fill%3D%22%23555%22%2F%3E%3C%2Fsvg%3E) no-repeat right 5px top 55%;
background-size: 16px 16px;
cursor: pointer;
color: #333333; } .clearfix:after {
content: " ";
display: block;
visibility: hidden;
clear: both;
height: 0;
line-height: 0; } a:link {
text-decoration: none;
color: #333333; }
a:visited {
text-decoration: none;
color: #333333; }
a:hover {
text-decoration: none; }
a:active {
text-decoration: none; } @font-face {
font-family: 'icomoon';
src: url(//www.holon.ne.jp/wp-content/themes/holon_original/fonts/icomoon.eot?1xt2m5);
src: url(//www.holon.ne.jp/wp-content/themes/holon_original/fonts/icomoon.eot?1xt2m5#iefix) format("embedded-opentype"), url(//www.holon.ne.jp/wp-content/themes/holon_original/fonts/icomoon.ttf?1xt2m5) format("truetype"), url(//www.holon.ne.jp/wp-content/themes/holon_original/fonts/icomoon.woff?1xt2m5) format("woff"), url(//www.holon.ne.jp/wp-content/themes/holon_original/fonts/icomoon.svg?1xt2m5#icomoon) format("svg");
font-weight: normal;
font-style: normal;
font-display: block; }
[class^="icon-"], [class*=" icon-"] { font-family: 'icomoon' !important;
speak: never;
font-style: normal;
font-weight: normal;
font-variant: normal;
text-transform: none;
line-height: 1; -webkit-font-smoothing: antialiased;
-moz-osx-font-smoothing: grayscale; }
.icon-mail:before {
content: "\e902"; }
.icon-under_link:before {
content: "\e903"; }
.icon-upper_link:before {
content: "\e904"; }
.icon-upper_arrow:before {
content: "\e900"; }
.icon-link_mark:before {
content: "\e901"; }
.icon-under_arrow:before {
content: "\ea1c"; }
.icon-new-tab:before {
content: "\ea7e"; } html, body {
margin: 0;
padding: 0; } html.is-loading,
html.is-loading body {
overflow: hidden; } html.skip-loading #loading {
display: none !important; }
#main-content {
display: block; position: relative; }
#loading {
position: fixed;
top: 0;
left: 0;
width: 100%;
height: 100%;
background: #f7f7f7;
display: flex;
justify-content: center;
align-items: center;
z-index: 9999; }
#loading::after {
content: '';
position: absolute;
top: 0;
left: 0;
height: 100%;
width: 0;
background: #148560;
transition: width 1s ease; }
#loading .loading-logo-img {
position: relative;
z-index: 2; opacity: 0; transition: opacity 2s ease; }
#loading .loading-logo-img img {
width: 150px;
height: auto; }
#loading.start::after {
width: 100%; }
#loading.start .loading-logo-img {
opacity: 1; }
#loading.end {
transform: translateX(100%);
transition: transform 1s ease; }
.hidden {
visibility: hidden;
opacity: 0;
transition: opacity 1s ease, visibility 1s ease; }    .trigger-off {
opacity: 0; }
.trigger-off.trigger-on {
opacity: 1; } .fadein.trigger-on {
animation-name: fadeUpAnime;
animation-duration: 1s;
animation-fill-mode: forwards; } .simple-fadein-text.trigger-on {
animation-name: basicFadeIn;
animation-duration: 2s;
animation-fill-mode: forwards; } .simple-fadein.trigger-on {
animation-name: basicFadeIn;
animation-duration: 4s;
animation-fill-mode: forwards; } .fadedown.trigger-on {
animation-name: fadeDownAnime;
animation-duration: 1s;
animation-fill-mode: forwards; } @keyframes fadeUpAnime {
from {
opacity: 0;
transform: translateY(100px); }
to {
opacity: 1;
transform: translateY(0); } } @keyframes basicFadeIn {
0% {
opacity: 0; }
100% {
opacity: 1; } } @keyframes bggradient {
0% {
background-position: 0% 50%; }
50% {
background-position: 100% 50%; }
100% {
background-position: 0% 50%; } } @keyframes arrowmove {
0% {
bottom: 1%; }
50% {
bottom: 15%; }
100% {
bottom: 1%; } } @keyframes popanime {
from {
bottom: -80px; }
to {
bottom: 0px; } } @keyframes readpopanime {
from {
bottom: -30px; }
to {
bottom: 0px; } } @keyframes headingpopanime {
from {
bottom: -50px; }
to {
bottom: 0px; } } @keyframes rotation {
0% {
transform: rotate(0deg); }
100% {
transform: rotate(360deg); } } @keyframes headline {
0% {
left: 100vw; }
50% {
left: 0px; }
65% {
left: 30px; }
100% {
left: 0px; } } @keyframes linkarrow {
0% {
left: 0; }
50% {
left: 10px; }
100% {
left: 0; } } @keyframes bgappear {
0% {
width: 0%;
height: 2px; }
50% {
width: 100%;
height: 2px; }
100% {
width: 100%;
height: 100%;
background: #FFF5E0;
filter: drop-shadow(4px 4px 4px rgba(0, 0, 0, 0.5)); } } @keyframes shine {
100% {
left: 125%; } } @keyframes fadeDownAnime {
from {
opacity: 0;
transform: translateY(-50px); }
to {
opacity: 1;
transform: translateY(0); } } @keyframes skewanime {
100% {
left: -10%; } } .delay02 {
animation-delay: 0.2s; }
@media (max-width: 767px) {
.delay02 {
animation-delay: inherit; } }
.delay03 {
animation-delay: 0.3s; }
@media (max-width: 767px) {
.delay03 {
animation-delay: inherit; } }
.delay04 {
animation-delay: 0.4s; }
@media (max-width: 767px) {
.delay04 {
animation-delay: inherit; } }
.delay06 {
animation-delay: 0.6s; }
@media (max-width: 767px) {
.delay06 {
animation-delay: inherit; } }
.delay08 {
animation-delay: 0.8s; }
@media (max-width: 767px) {
.delay08 {
animation-delay: inherit; } }
.delay10 {
animation-delay: 1.0s; }
@media (max-width: 767px) {
.delay10 {
animation-delay: inherit; } } .fade {
animation-name: basicFadeIn;
animation-duration: 1.5s;
animation-fill-mode: forwards;
opacity: 0; }
.fadeinout {
animation-name: basicFadeIn;
animation-delay: .5s;
animation-duration: 1.5s;
animation-fill-mode: forwards;
opacity: 0; } @keyframes fadeInFVAnime {
from {
transform: translateY(30px);
opacity: 0; }
to {
transform: translateY(0);
opacity: 1; } } @keyframes fadeInFVSideAnime {
from {
transform: translateX(-100px);
opacity: 0; }
to {
transform: translateX(0);
opacity: 1; } } .eachTextAnime span {
opacity: 0; }
.eachTextAnime.appeartext span {
animation: basicFadeIn 1s ease-out forwards; } @keyframes basicFadeOut {
0% {
opacity: 1; }
100% {
opacity: 0; } } @keyframes moveTopAnime {
from {
transform: translateY(-100vh);
opacity: 0; }
to {
transform: translateY(0);
opacity: .8; } }  html {
overflow-y: scroll; }
.flex-box {
display: flex;
justify-content: space-between;
flex-wrap: wrap; }
.fb {
font-weight: bold; }
table {
border-collapse: collapse; } .w1100 {
max-width: 1140px;
width: 100%;
padding: 0 20px;
box-sizing: border-box;
margin: 0 auto; }
@media (max-width: 767px) {
.w1100 {
max-width: 500px; } }
a, a * {
transition: .3s; }
@media (min-width: 768px) {
a.op-link:hover {
opacity: .7; } }
a span {
transition: 0s; }
.float-text.trigger-off {
display: block;
overflow: hidden;
line-height: 1;
font-size: 4.5rem; }
@media (max-width: 767px) {
.float-text.trigger-off {
font-size: 2.5rem; } }
.float-text.trigger-off.trigger-on span {
position: relative;
bottom: -30px;
animation: headingpopanime .5s ease-out forwards; } .circle-chara {
border: 1px solid #000;
border-radius: 50%;
width: 20px;
height: 20px;
line-height: 20px;
text-align: center;
font-weight: bold;
margin-right: 2px; }
@media (max-width: 767px) {
.circle-chara {
width: 16px;
height: 16px;
line-height: 16px; } } body {
width: 100%;
height: 100%;
background-image: linear-gradient(100deg, rgba(20, 133, 96, 0.3) 10%, white 35%, white 65%, rgba(255, 159, 107, 0.3) 90%);
background-size: 200% 200%; background-repeat: no-repeat;
animation: bggradient 20s ease infinite; }
#particles-js {
position: fixed; z-index: -1; width: 100%;
height: 100%; }
#wrapper {
position: relative; z-index: 1; width: 100%;
height: 100%; } .breadcrumb {
text-align: end;
line-height: 150%;
font-size: 1.3rem;
margin: 10px auto;
position: absolute;
right: 35px;
top: 90px;
z-index: 1;
padding-left: 50px; }
@media screen and (max-width: 1200px) {
.breadcrumb {
right: 20px;
padding-left: 20px; } }
@media (max-width: 767px) {
.breadcrumb {
text-align: left;
padding: 0 20px;
right: inherit;
left: 0;
top: 70px; } }
.breadcrumb ul li {
display: inline; }
.breadcrumb ul li a {
display: inline-block; }
.breadcrumb ul li::after {
content: ">";
margin: 0 10px; }
.breadcrumb ul li:last-child {
font-weight: bold;
color: #148560; }
.breadcrumb ul li:last-child::after {
content: none; }
@media (min-width: 768px) {
.breadcrumb ul li a:hover {
text-decoration: underline;
color: #148560; } } .inner-link {
display: block;
position: absolute;
padding-top: 150px;
margin-top: -150px; }
.inner-link.inner-link-addr {
padding-top: 30px;
margin-top: -30px; }
@media (max-width: 767px) {
.inner-link.inner-link-addr {
padding-top: 90px;
margin-top: -90px; } }
.inner-link.inner-link-seminar {
padding-top: 5px;
margin-top: -5px; }
@media (max-width: 767px) {
.inner-link.inner-link-seminar {
padding-top: 70px;
margin-top: -70px; } } .contact-banner-icon {
position: fixed;
right: 130px;
bottom: 30px;
z-index: 400; }
@media (min-width: 768px) {
.contact-banner-icon a:hover .contact-img {
background: #148560; }
.contact-banner-icon a:hover .contact-img i {
color: #f7f7f7; }
.contact-banner-icon a:hover .circleText__text {
fill: #148560; } }
@media screen and (max-width: 1200px) {
.contact-banner-icon {
right: 115px; } }
@media (max-width: 767px) {
.contact-banner-icon {
right: inherit;
left: 20px; } }
.contact-banner-icon .contact-img {
position: absolute;
width: 85%;
height: 85%;
bottom: 0;
top: 0;
right: 0;
left: 0;
margin: auto;
display: flex;
justify-content: center;
align-items: center;
border: 1px solid #148560;
border-radius: 300px;
background: #f7f7f7; }
.contact-banner-icon .contact-img i {
font-size: 2.8rem;
color: #148560; }
@media (max-width: 767px) {
.contact-banner-icon .contact-img i {
font-size: 2.6rem; } }
.contact-block {
width: 80px;
height: 80px;
margin: auto; }
@media (max-width: 767px) {
.contact-block {
width: 65px;
height: 65px; } }
.circleText {
overflow: visible;
animation: rotation 18s linear infinite; }
.circleText__circle {
fill: none; }
.circleText__text {
fill: #333333;
font-size: 1.3rem;
letter-spacing: 0.05em;
text-shadow: 1px 1px 1px white, -1px 1px 1px white, 1px -1px 1px white, -1px -1px 1px white; } .contact-attention-recaptcha {
text-align: center;
margin-top: 0;
font-size: 1.1rem; }
.contact-attention-recaptcha a {
color: #007185;
text-decoration: underline; }
@media (min-width: 768px) {
.contact-attention-recaptcha a:hover {
opacity: .7; } }
.grecaptcha-badge {
visibility: hidden; } #page_top {
width: 70px;
height: 70px;
position: fixed;
right: -200px;
bottom: 32px;
z-index: 500; }
@media (max-width: 767px) {
#page_top {
width: 50px;
height: 50px;
bottom: 35px;
right: 20px; } }
#page_top a {
display: flex;
width: 70px;
height: 70px;
text-align: center;
justify-content: center;
flex-direction: column;
border-radius: 100px;
background: #148560;
opacity: 0.7; }
@media (min-width: 768px) {
#page_top a:hover {
opacity: 1; } }
@media (max-width: 767px) {
#page_top a {
width: 50px;
height: 50px;
opacity: .9; } }
#page_top a::before {
color: #fff;
margin: 5px 0; }
#page_top a::after {
content: 'PageTop';
font-size: 1.1rem;
color: #fff;
white-space: pre;
line-height: 1.1; }
@media (max-width: 767px) {
#page_top a::after {
content: none; } } section:has(.particle-wrapper) {
position: relative; }
.particle-wrapper {
position: absolute;
width: 100%;
top: 0;
left: 0;
z-index: -1;
opacity: .4; }
@media (max-width: 767px) {
.particle-wrapper {
width: 130%;
top: -50px; left: inherit;
right: 0; }
.particle-wrapper.particle-wrapper-left {
left: 0; }
#consulting .particle-wrapper { width: 120%; }
#callcenter .particle-wrapper {
width: 115%; } }
.particle-wrapper.footer-link-text {
top: -100px; }
@media (max-width: 767px) {
.particle-wrapper.footer-link-text {
top: -60px; } }
@media (max-width: 960px) {
.particle-wrapper:has(.two-line) {
top: -40px; } }
@media (max-width: 767px) {
.particle-wrapper:has(.two-line) {
width: 100%;
top: -190px;
left: 0; } }
.first-view .particle-wrapper {
top: 250px; }
.first-view .particle-wrapper:has(.two-line) {
top: 120px; }
@media (max-width: 767px) {
.first-view .particle-wrapper:has(.two-line) {
width: 100%;
top: 75px; } }
.first-view .particle-wrapper.info-particle-wrapper {
top: 250px; }
@media (max-width: 767px) {
.first-view .particle-wrapper.info-particle-wrapper {
top: 190px; } }
@media (max-width: 767px) {
.first-view .particle-wrapper {
top: 120px; } }
#privacy-policy .first-view .particle-wrapper {
top: 80px; }
@media (max-width: 767px) {
#privacy-policy .first-view .particle-wrapper {
top: 75px; } }
#requirements .first-view .particle-wrapper {
top: 260px; }
@media (max-width: 767px) {
#requirements .first-view .particle-wrapper {
top: 60px; } }
#news .first-view .particle-wrapper {
top: 100px; }
@media (max-width: 767px) {
#news .first-view .particle-wrapper {
top: 40px;
right: 0;
left: inherit;
width: 130%; } }
#contact .first-view .particle-wrapper, #entry .first-view .particle-wrapper {
top: 80px; }
@media (max-width: 767px) {
#contact .first-view .particle-wrapper, #entry .first-view .particle-wrapper {
top: 60px; } }
.seminar-archive-form .particle-wrapper {
top: 50px; }
@media (max-width: 767px) {
.seminar-archive-form .particle-wrapper {
width: 100%;
top: 80px; } }
.single-post .particle-wrapper {
top: 120px; }
@media (max-width: 767px) {
.single-post .particle-wrapper {
top: 90px; } }
.particle-wrapper .particle-text {
width: 100%;
height: 200px;
padding: 0 20px;
box-sizing: border-box; }
@media (max-width: 767px) {
.particle-wrapper .particle-text {
width: 100%;
height: 167px; } }
.particle-wrapper .particle-text.two-line {
height: 350px; }
@media (max-width: 767px) {
.particle-wrapper .particle-text.two-line {
width: min(127.8vw, 500px); } }
.first-view .particle-wrapper .particle-text.two-line {
height: 320px; }
@media (max-width: 767px) {
.first-view .particle-wrapper .particle-text.two-line {
width: 100%; } }
#requirements .first-view .particle-wrapper .particle-text {
height: 250px; }
@media (max-width: 767px) {
#requirements .first-view .particle-wrapper .particle-text {
width: 110%; } } .open {
position: relative;
cursor: pointer;
transition: all .5s ease; }
.open span {
position: absolute;
right: 25px;
font-size: 1.4rem;
font-weight: normal; }
@media (min-width: 768px) {
.open:hover {
color: #148560; }
.open:hover::before, .open:hover::after {
background-color: #148560; } }
.open::before, .open::after {
position: absolute;
content: '';
width: 18px;
height: 2px;
background-color: #333333;
top: 45%;
right: 0;
transition: .5s; }
@media (max-width: 767px) {
.open::before, .open::after {
width: 15px; } }
.open::before {
transform: rotate(0deg); }
.open::after {
transform: rotate(90deg); }
@media (min-width: 768px) {
.open.close:hover {
color: #333333; } }
.open.close::before {
transform: rotate(45deg); }
.open.close::after {
transform: rotate(-45deg); }
.open.close::before, .open.close::after {
background-color: #148560; }
.open-box {
display: none; padding-top: 15px; }  .hide-area {
display: none; }
.modaal-container {
max-height: calc(100vh - 120px);
overflow-y: auto;
max-width: 730px; }
@media (max-width: 767px) {
.modaal-container {
max-width: 500px; } }
.modaal-content-container {
padding: 30px 30px 20px; }
@media (max-width: 767px) {
.modaal-content-container {
padding: 20px; } } .modaal-close:after,
.modaal-close:before {
background: #fff; }
.modaal-close:focus:after,
.modaal-close:focus:before,
.modaal-close:hover:after,
.modaal-close:hover:before {
background: #666; }
.modaal-close {
z-index: 2000; }
@media (max-width: 767px) {
.modaal-close {
top: 10px;
right: 10px; } }
.close-btn {
position: inherit;
background: #62B8A4 !important;
width: 240px;
height: 30px;
border-radius: 100px;
filter: drop-shadow(2px 2px 2px rgba(0, 0, 0, 0.5));
margin: 20px auto 0;
display: block;
transform: translateZ(0px); }
.close-btn::before, .close-btn::after {
content: none; }
.close-btn span {
position: inherit !important;
overflow: visible;
font-size: 1.5rem;
color: #fff;
transition: .3s; }
@media (min-width: 768px) {
.close-btn:hover {
background: #D5ECEA !important; }
.close-btn:hover span {
color: #333333; } }
.modaal-inner-wrapper:has(.img-expansion) {
padding: 30px 75px; }
@media (max-width: 767px) {
.modaal-inner-wrapper:has(.img-expansion) {
padding: 55px 20px 30px; } }
.modaal-inner-wrapper:has(.img-expansion) .modaal-container {
max-height: none;
overflow-y: hidden;
max-width: none; }
.modaal-inner-wrapper:has(.img-expansion) .modaal-container:has(img) {
width: auto; }
.modaal-inner-wrapper:has(.img-expansion) .modaal-content-container {
padding: 0; }
.modaal-inner-wrapper:has(.img-expansion) iframe {
width: 100%;
height: calc(100vh - 140px);
display: block; }
@media (max-width: 767px) {
.modaal-inner-wrapper:has(.img-expansion) iframe {
height: calc(100vh - 165px); } }
.modaal-inner-wrapper:has(.img-expansion) img {
max-height: calc(100vh - 140px);
vertical-align: top;
width: 100%; }
@media (max-width: 767px) {
.modaal-inner-wrapper:has(.img-expansion) img {
width: 100%;
height: auto; } }
.modaal-inner-wrapper:has(.img-expansion) .close-btn {
margin-bottom: 20px; } body:has(.modaal-wrapper) {
overflow-y: hidden; } .modal-block {
font-size: 1.5rem; }
@media (max-width: 767px) {
.modal-block {
font-size: 1.4rem; } }
.modal-block .privacy-ttl {
text-align: center; }
@media (max-width: 767px) {
.modal-block .privacy-ttl {
text-align: left; } }
.modal-block ul {
margin: 15px 0 10px; }
@media (max-width: 767px) {
.modal-block ul {
margin: 15px 0 5px; } }
.modal-block ul .only-contact, .modal-block ul .only-dl {
display: none; }
#downloads .modal-block ul .only-dl {
display: block; }
#contact .modal-block ul .only-contact {
display: block; }
.modal-block ul.second-line {
margin: 5px 0 10px; }
.modal-block li {
padding-left: 2.5em;
text-indent: -1.2em;
line-height: 1.5;
margin-bottom: 10px; }
@media (max-width: 767px) {
.modal-block li {
padding-left: 2.2rem;
text-indent: -1.4em; }
.modal-block li:last-of-type {
margin-bottom: 0; } }
.modal-block li.second-line {
padding-left: 1.8em;
text-indent: -1.8em;
line-height: 1.5;
margin-bottom: 5px; }
.modal-block .privacy-link {
text-align: center; }
.modal-block .privacy-link a {
text-align: center;
color: #148560;
text-decoration: underline; }
@media (max-width: 767px) {
.modal-block .privacy-link a {
font-size: 1.1rem; } }
@media (min-width: 768px) {
.modal-block .privacy-link a:hover {
opacity: .7; } }
.modal-block .manager {
font-size: 1.6rem;
text-align: center;
font-weight: bold;
margin: 10px 0; }
@media (max-width: 767px) {
.modal-block .manager {
font-size: 1.5rem; } } .error404 .footer-banner {
display: none; }
.error404 .contact-banner {
display: none; }
.error404 .contents-404 {
padding: 0; }
.error404 .contents-404 .w_inner {
height: calc(100vh - 415px);
display: flex;
justify-content: center;
flex-direction: column;
min-height: 230px; }
@media (max-width: 960px) {
.error404 .contents-404 .w_inner {
min-height: 380px; } }
@media (max-width: 767px) {
.error404 .contents-404 .w_inner {
height: calc(100vh - 103px); } }
.error404 .contents-404 p {
text-align: center;
line-height: 1; }
.error404 .contents-404 .ttl-404 {
color: #62B8A4;
font-weight: bold;
font-size: 11.0rem; }
@media (max-width: 767px) {
.error404 .contents-404 .ttl-404 {
font-size: 7.0rem; } }
.error404 .contents-404 .ttl-404 span {
display: block;
font-size: 3.0rem; }
@media (max-width: 767px) {
.error404 .contents-404 .ttl-404 span {
font-size: 2.0rem; } }
.error404 .contents-404 .text-404 {
font-size: 2.0rem;
margin-top: 20px; }
@media (max-width: 767px) {
.error404 .contents-404 .text-404 {
font-size: 1.8rem; } }
.error404 .contents-404 .top-link-404 {
font-size: 2.0rem;
text-align: center;
margin-top: 30px;
text-decoration: underline;
color: #148560; }  /*/*/.menu-wrapper {
width: 100%;/**/position: fixed;
z-index: 999; }
.menu-wrapper .top-logo {
width: 100px;
height: auto;
position: absolute;
top: 20px;
left: 50px; }
@media screen and (max-width: 1200px) {
.menu-wrapper .top-logo {
left: 20px; } }
.menu-wrapper .hamburger:not(.hamburger-close) {
display: block;
position: absolute;
z-index: 900;
left: calc(100vw - 120px);
top: 20px;
width: 70px;
height: 70px;
background: #148560;
border-radius: 100px;
cursor: pointer;
text-align: center;
-webkit-transition: 0.5s all;
-moz-transition: 0.5s all;
transition: 0.5s all; }
@media screen and (max-width: 1200px) {
.menu-wrapper .hamburger:not(.hamburger-close) {
left: calc(100vw - 105px); } }
@media (max-width: 767px) {
.menu-wrapper .hamburger:not(.hamburger-close) {
right: 20px;
top: 20px;
left: auto;
width: 50px;
height: 50px; } }
.menu-wrapper .hamburger:not(.hamburger-close) .hamburger-contents:not(.hamburger-close) {
-webkit-transition: 0.5s all;
-moz-transition: 0.5s all;
transition: 0.5s all;
width: 100%;
height: 55px; }
.menu-wrapper .hamburger:not(.hamburger-close) span {
position: absolute;
width: 33px;
height: 2px;
left: 0;
right: 0;
margin: auto;
background: #f7f7f7; }
@media (max-width: 767px) {
.menu-wrapper .hamburger:not(.hamburger-close) span {
width: 30px; } }
.menu-wrapper .hamburger:not(.hamburger-close) span:nth-child(1) {
top: 23px; }
@media (max-width: 767px) {
.menu-wrapper .hamburger:not(.hamburger-close) span:nth-child(1) {
top: 20px; } }
.menu-wrapper .hamburger:not(.hamburger-close) span:nth-child(2) {
top: 33px; }
@media (max-width: 767px) {
.menu-wrapper .hamburger:not(.hamburger-close) span:nth-child(2) {
top: 30px; } }
.menu-wrapper .hamburger:not(.hamburger-close)::after {
content: "Menu";
position: absolute;
bottom: 3px;
color: #f7f7f7;
font-size: 1.2rem;
left: 0;
right: 0; }
@media (max-width: 767px) {
.menu-wrapper .hamburger:not(.hamburger-close)::after {
content: none; } }
.hamburger:has(.active)::after {
content: "Close"; }
@media (max-width: 767px) {
.hamburger:has(.active)::after {
content: none; } } .hamburger-contents.active:not(.hamburger-close) {
-webkit-transform: rotate(360deg);
transform: rotate(360deg); }
.hamburger-contents.active:not(.hamburger-close) span {
width: 30px; }
.hamburger-contents.active:not(.hamburger-close) span:nth-child(1) {
top: 27px;
-webkit-transform: rotate(-45deg);
-moz-transform: rotate(-45deg);
transform: rotate(-45deg); }
@media (max-width: 767px) {
.hamburger-contents.active:not(.hamburger-close) span:nth-child(1) {
top: 25px; } }
.hamburger-contents.active:not(.hamburger-close) span:nth-child(2) {
top: 27px;
-webkit-transform: rotate(45deg);
-moz-transform: rotate(45deg);
transform: rotate(45deg); }
@media (max-width: 767px) {
.hamburger-contents.active:not(.hamburger-close) span:nth-child(2) {
top: 25px; } }
.circle-bg {
position: fixed;
z-index: 3; width: 100px;
height: 100px;
border-radius: 50%;
background: #D5ECEA; transform: scale(0); right: -50px;
top: -50px;
transition: all .8s; }
.circle-bg.circleactive {
transform: scale(50); } .menu-contents-block {
display: none;  position: fixed;
z-index: 500;
width: 100%;
height: 100vh;
overflow: auto;
-webkit-overflow-scrolling: touch; }
.globalmenu.panelactive .menu-contents-block {
display: block; } .globalmenu.panelactive ul {
opacity: 1; } .globalmenu.panelactive ul li {
animation-name: basicFadeIn;
animation-duration: 1s;
animation-delay: .2s; animation-fill-mode: forwards;
opacity: 0; }  .grobal-menu-box {
margin: 100px auto 50px;
max-width: 850px; }
.grobal-menu-box .grobal-logo-box {
width: 100%;
text-align: center;
margin-bottom: 10px; }
.grobal-menu-box .grobal-logo-box img {
width: 150px; }
.grobal-menu-box .grobal-menu-line {
line-height: 100%; }
.grobal-menu-box .grobal-menu-line .grobal-menu-ttl {
font-weight: bold;
font-size: 1.8rem;
margin-top: 20px;
color: #148560; }
.grobal-menu-box .grobal-menu-line .grobal-menu-ttl span {
font-weight: normal;
font-size: 1.4rem;
color: #333333;
transition: .3s; }
.grobal-menu-box .grobal-menu-line .grobal-menu-ttl a {
color: #148560; }
.grobal-menu-box .grobal-menu-line .grobal-menu-item-container {
font-weight: normal;
font-size: 1.5rem; }
.grobal-menu-box .grobal-menu-line .grobal-menu-item {
line-height: 250%;
margin-left: 1em; }
.grobal-menu-box .grobal-menu-line .grobal-menu-item:first-of-type {
margin-top: 10px; }
.grobal-menu-box .grobal-menu-line .grobal-menu-item::before {
content: "- "; }
.grobal-menu-box .grobal-menu-line .grobal-menu-item a {
color: #333333; }
.grobal-menu-box .grobal-menu-line .grobal-menu-item.grobal-menu-item-external a::after {
content: "\ea7e"; font-family: "icomoon";
color: #333333;
margin-left: 5px;
position: relative;
top: 2px;
font-size: 1.7rem;
transition: .3s; }
@media (min-width: 768px) {
.grobal-menu-box .grobal-menu-line .grobal-menu-item.grobal-menu-item-external a:hover::after {
color: #148560; } }
@media (min-width: 768px) {
.grobal-menu-box .grobal-menu-line a:hover {
color: #148560;
text-decoration: underline; }
.grobal-menu-box .grobal-menu-line a:hover::after {
color: #148560; }
.grobal-menu-box .grobal-menu-line a:hover span {
color: #148560;
text-decoration: underline; } }
.grobal-menu-box .grobal-menu-line a.no-underline:hover {
text-decoration: none; }
.grobal-menu-box .grobal-menu-line a.no-underline:hover span {
color: #333333;
text-decoration: none; } .grobal-menu-box-sp {
margin: 20px auto 40px; }
.grobal-menu-box-sp li {
border-bottom: 1px solid white; }
.grobal-menu-box-sp li:last-child {
border: none; }
.grobal-menu-box-sp li a {
display: block;
padding: 0 20px; }
.grobal-menu-box-sp li.open {
padding: 0 20px; }
.grobal-menu-box-sp li.open::before, .grobal-menu-box-sp li.open::after {
width: 16px;
top: 50%;
right: 20px;
background-color: #148560; }
.grobal-menu-box-sp li.open-box {
border: none;
padding: 0; }
.grobal-menu-box-sp li.sp-grobal-menu-product {
padding: 0 20px;
border: none;
margin-bottom: 30px; }
.grobal-menu-box-sp .grobal-logo-box {
text-align: center;
padding-bottom: 5px; }
.grobal-menu-box-sp .grobal-logo-box img {
width: 120px; }
.grobal-menu-box-sp .menu-item-en {
font-size: 1.8rem;
font-weight: bold;
color: #148560;
line-height: 55px; }
.grobal-menu-box-sp .menu-item-en span {
font-weight: normal;
font-size: 1.4rem;
color: #333333;
position: relative;
right: 0; }
.grobal-menu-box-sp .grobal-menu-second.grobal-menu-link a {
position: relative; }
.grobal-menu-box-sp .grobal-menu-second.grobal-menu-link a::after {
content: "＞";
transform: scale(0.8, 1);
display: inline-block;
position: absolute;
right: 20px; }
.grobal-menu-box-sp .grobal-menu-second {
line-height: 45px;
text-indent: 1em;
font-size: 1.4rem;
background: rgba(255, 255, 255, 0.2); }
.grobal-menu-box-sp .grobal-menu-second a::before {
content: "- "; }
.grobal-menu-box-sp .ex-item a::after {
content: "\ea7e";
font-family: "icomoon";
color: #333333;
margin-left: 5px;
position: relative;
top: 2px;
font-size: 1.7rem;
transition: .3s; }
.grobal-menu-box-sp .grobal-menu-product {
margin-top: -5px; }
.grobal-menu-box-sp .grobal-menu-product-box {
width: 47%; }
.grobal-menu-box-sp .grobal-menu-product-box a {
padding: 0; }
.grobal-menu-box-sp .grobal-menu-product-box .grobal-menu-product-img-box {
height: 60px;
position: relative;
background-size: cover;
background-position: center; }
.grobal-menu-box-sp .grobal-menu-product-box .grobal-menu-product-img-box::before {
content: "";
width: 100%;
height: 100%;
position: absolute; }
.grobal-menu-box-sp .grobal-menu-product-box .grobal-menu-product-img-box.grobal-menu-product-img-box-apv {
background-image: url(//www.holon.ne.jp/wp-content/themes/holon_original/img/apv-footer-banner.jpg); }
.grobal-menu-box-sp .grobal-menu-product-box .grobal-menu-product-img-box.grobal-menu-product-img-box-apv::before {
background-color: rgba(0, 104, 183, 0.4); }
.grobal-menu-box-sp .grobal-menu-product-box .grobal-menu-product-img-box.grobal-menu-product-img-box-ece {
background-image: url(//www.holon.ne.jp/wp-content/themes/holon_original/img/ece-footer-banner.jpg); }
.grobal-menu-box-sp .grobal-menu-product-box .grobal-menu-product-img-box.grobal-menu-product-img-box-ece::before {
background-color: rgba(230, 0, 18, 0.4); }
.grobal-menu-box-sp .grobal-menu-product-box .menu-product-img {
width: 100%;
height: 100%;
object-fit: cover; }
.grobal-menu-box-sp .grobal-menu-product-box .menu-product-logo {
position: absolute;
top: 0;
bottom: 0;
right: 0;
left: 0;
margin: auto;
width: 80%;
height: auto; }
.grobal-menu-box-sp .grobal-menu-product-box .grobal-menu-product-name {
font-size: 1.3rem;
line-height: 1.5;
margin-top: 5px;
font-weight: normal; }
.grobal-menu-box-sp .grobal-menu-product-box .grobal-menu-product-name span {
display: block;
position: relative;
font-size: 1.5rem;
font-weight: bold; }
.grobal-menu-box-sp .grobal-menu-product-box .grobal-menu-product-name span::after {
content: "\ea7e";
font-family: "icomoon";
margin-left: 3px;
position: absolute;
bottom: 0;
font-size: 1.8rem; }
.grobal-menu-box-sp .close-btn {
text-align: center;
color: #f7f7f7; }   .main-visual {
height: 100vh;
position: relative;
align-items: center;
padding-bottom: 100px;
min-height: 530px;
margin-bottom: 150px; }
@media (max-width: 767px) {
.main-visual {
margin-bottom: 50px; } }
.main-visual .catch-box {
z-index: 50; }
@media (max-width: 767px) {
.main-visual .catch-box {  margin-bottom: 60px; } }
.main-visual .catch-box p {
font-size: 2.0rem;
overflow: hidden;
text-shadow: 1px 1px 3px white, -1px 1px 3px white, 1px -1px 3px white, -1px -1px 3px white; }
.main-visual .catch-box p .wrap {
display: block;
overflow: hidden; }
.main-visual .catch-box p .popanime {
position: relative;
bottom: -30px; }
@media (max-width: 767px) {
.main-visual .catch-box p .popanime {
bottom: -60px; } }
@media (max-width: 767px) {
.main-visual .catch-box p {
font-size: 1.8rem; } }
.main-visual h2 {
font-size: 5.8rem;
z-index: 1;
text-shadow: 1px 1px 7px rgba(255, 255, 255, 0.7), -1px 1px 7px rgba(255, 255, 255, 0.7), 1px -1px 7px rgba(255, 255, 255, 0.7), -1px -1px 7px rgba(255, 255, 255, 0.7);
line-height: 135%;
margin-bottom: 5px; }
.main-visual h2 .wrap {
display: block;
overflow: hidden; }
.main-visual h2 .popanime {
bottom: -80px;
position: relative; }
.main-visual h2 .little-letter {
font-size: 4.0rem; }
@media (max-width: 767px) {
.main-visual h2 .little-letter {
font-size: 1.8rem; } }
@media (max-width: 960px) {
.main-visual h2 {
font-size: min(6.6vw, 5.8rem); } }
@media (max-width: 767px) {
.main-visual h2 {
font-size: 2.5rem; } }
.main-visual .scrollallow {
position: absolute;
bottom: 40px;
left: 150px; }
@media (max-width: 767px) {
.main-visual .scrollallow {
left: 0;
right: 0;
text-align: center; } }
.main-visual .scrollallow a {
flex-direction: column;
position: relative;
height: 80px;
cursor: default; }
@media (max-width: 767px) {
.main-visual .scrollallow a {
display: inline-block; } }
.main-visual .scrollallow p {
font-size: 1.2rem; }
@media (max-width: 767px) {
.main-visual .scrollallow p {
text-align: center; } }
.main-visual .scrollallow img {
position: absolute;
bottom: 1%;
right: 0;
left: 0;
margin: auto; animation: arrowmove 1s ease-in-out infinite; }
.main-visual .mainimg-box {
position: absolute;
width: 400px;
height: 400px;
bottom: 100px;
top: 0;
right: 20px;
margin: auto; }
@media (max-width: 767px) {
.main-visual .mainimg-box {
width: 320px;
height: 320px;
bottom: 0; } }
.main-visual .mainimg-box::before {
position: absolute;
content: "";
background-color: rgba(255, 255, 255, 0.2);
width: 100%;
height: 100%;
z-index: 20;
border-radius: 200px; }
.main-visual .mainimg-box::after {
position: absolute;
content: "";
background-color: #148560;
width: 100%;
height: 100%;
z-index: -1;
border-radius: 200px;
left: 15px;
top: 10px;
opacity: .5; }
.main-visual .mainimg-box .mainimg {
width: 100%;
height: 100%;
clip-path: circle(200px at center);
object-fit: cover; }
@media (max-width: 767px) {
.main-visual .mainimg-box .mainimg {
clip-path: circle(160px at center); } }
.main-visual p.kinkyu {
margin-top: 20px; }
.main-visual p.kinkyu a {
color: red;
text-decoration: underline; }
@media (max-width: 767px) {
.main-visual p.kinkyu a {
font-size: 1.5rem; } }
.main-visual p.kinkyu a span {
background: red;
display: inline-block;
color: white;
text-shadow: none;
font-size: 1.3rem;
padding: 0 5px;
line-height: 200%;
position: relative;
bottom: 3px;
margin-right: 10px; }
@media (max-width: 767px) {
.main-visual p.kinkyu a span {
display: block;
width: fit-content;
bottom: 0; } }
@media (hover: hover) {
.main-visual p.kinkyu a:hover {
opacity: .7; } }
.main-visual p.kinkyu.kinkyu-green a {
color: #148560; }
.main-visual p.kinkyu.kinkyu-green a span {
background: #148560; } .event-banner .event-banner-wrapper {
display: flex;
justify-content: space-between;
flex-wrap: wrap;
align-items: center;
border: 1px solid #A0A0A0;
padding: 20px;
background: #f7f7f7; }
.event-banner .event-banner-img {
width: 45%;
box-shadow: 2px 2px 4px rgba(0, 0, 0, 0.3); }
.event-banner .event-banner-img img {
display: block;
width: 100%;
height: auto; }
.event-banner .event-banner-text {
width: 52%;
text-align: left; }
.event-banner .event-banner-text .event-crown {
font-size: 1.6rem;
margin: 0;
border: 1px solid #000;
padding: 3px 15px;
display: inline-block; }
.event-banner .event-banner-text .event-crown span {
font-weight: bold;
color: #148560; }
.event-banner .event-banner-text h2 {
font-size: min(2.8vw, 2.8rem);
margin: 10px 0 0; }
.event-banner .event-banner-text .date {
font-size: 1.6rem;
text-align: end;
margin: 0;
font-weight: bold; }
.event-banner .event-banner-text a {
font-size: 2.0rem;
padding: 0;
line-height: 45px;
margin: 15px auto 0;
box-shadow: 2px 2px 4px rgba(0, 0, 0, 0.3);
color: #fff;
background: #148560;
width: 80%;
display: block;
text-align: center; } .topnews { padding-left: calc(((100vw - 1100px) / 2) - 20px);
overflow: hidden;
margin-top: 30px;
margin-left: 20px; }
.topnews .topnews-box {
position: relative;
filter: drop-shadow(1px 5px #148560);
margin-bottom: 30px;
transform: translateZ(0px); }
.topnews .topnews-box .topnews-wrap {
position: relative;
padding: 15px 50px;
border-radius: 100px;
border: 1px solid #148560;
background: #f7f7f7;
width: 100vw;
display: block; }
@media (max-width: 767px) {
.topnews .topnews-box .topnews-wrap {
border-radius: 20px;
padding: 15px 20px; } }
@media (min-width: 768px) {
.topnews .topnews-box .topnews-wrap a:hover p {
color: #148560;
text-decoration: underline; } }
.topnews .topnews-box p {
text-indent: -5.2em;
padding-left: 5em;
max-width: 1030px;
width: calc(100vw - 110px);
box-sizing: border-box; }
@media (max-width: 767px) {
.topnews .topnews-box p {
font-size: 1.5rem;
text-indent: 0;
padding-left: 0;
width: calc(100vw - 70px);
line-height: 1.5; }
.topnews .topnews-box p span {
font-weight: bold;
color: #148560; } }
@media (min-width: 768px) {
.topnews .topnews-box:nth-of-type(2) {
margin-left: 50px; }
.topnews .topnews-box:nth-of-type(2) p {
max-width: 980px;
width: calc(100vw - 160px); }
.topnews .topnews-box:nth-of-type(3) {
margin-left: 100px; }
.topnews .topnews-box:nth-of-type(3) p {
max-width: 930px;
width: calc(100vw - 210px); }
.topnews .topnews-box:nth-of-type(4) {
margin-left: 150px; }
.topnews .topnews-box:nth-of-type(4) p {
max-width: 880px;
width: calc(100vw - 260px); }
.topnews .topnews-box:nth-of-type(5) {
margin-left: 200px; }
.topnews .topnews-box:nth-of-type(5) p {
max-width: 830px;
width: calc(100vw - 310px); } }
.topnews .headline.trigger-on {
animation: headline 1.5s forwards; } .top-banner {
margin: 10px auto 200px; }
.movie-banner {
border: 3px solid #148560;
background-image: linear-gradient(-45deg, #148560, #7fb3d5);
overflow: hidden;
border-radius: 20px;
filter: drop-shadow(4px 4px 4px rgba(0, 0, 0, 0.5));
position: relative;
transform: translateZ(0px); }
@media (max-width: 767px) {
.movie-banner {
border-radius: 10px; } }
.movie-banner .movie-banner-img-box {
flex: 1;
flex-wrap: nowrap;
position: relative; }
.movie-banner .movie-banner-img-box img {
width: 43%;
height: 100%;
object-fit: cover;
clip-path: polygon(0 0, 80% 0, 100% 100%, 20% 100%);
position: absolute; }
@media (max-width: 767px) {
.movie-banner .movie-banner-img-box img {
width: 130%; } }
.movie-banner .movie-banner-img-box img:first-child {
left: -8%; }
@media (max-width: 767px) {
.movie-banner .movie-banner-img-box img:first-child {
left: -24%; } }
.movie-banner .movie-banner-img-box img:nth-child(2) {
left: -3%;
right: 0;
margin: auto; }
.movie-banner .movie-banner-img-box img:last-child {
right: -5%; }
.movie-banner .movie-banner-text-box {
align-items: center;
justify-content: center;
color: #f7f7f7;
width: 43%;
transition: .3s; }
@media (max-width: 767px) {
.movie-banner .movie-banner-text-box {
width: 63%; } }
.movie-banner .movie-banner-text-box .movie-banner-ttl {
padding: 3% 0;
font-size: min(2.8vw, 2.8rem);
font-weight: bold;
line-height: 1.5;
letter-spacing: .1em;
letter-spacing: 1px;
display: inline-block; }
@media (max-width: 767px) {
.movie-banner .movie-banner-text-box .movie-banner-ttl {
padding: 15px 0;
font-size: 1.5rem; } }
.movie-banner .movie-banner-text-box .movie-banner-ttl span {
font-size: min(2.2vw, 2.2rem); }
@media (max-width: 767px) {
.movie-banner .movie-banner-text-box .movie-banner-ttl span {
font-size: 1.2rem; } } .what {
justify-content: flex-end;
margin-bottom: 250px; }
@media (max-width: 767px) {
.what {
margin-bottom: 130px; } }
.what p {
line-height: 200%; }
@media (max-width: 767px) {
.what p {
font-size: 1.5rem;
line-height: 180%; } }
.what p:first-of-type {
margin: 30px 0 20px; }
@media (max-width: 767px) {
.what p:first-of-type {
margin: 20px 0; } } .product {
margin-bottom: 250px;
position: relative; }
@media (max-width: 767px) {
.product {
margin-bottom: 130px; } }
.product h2 {
margin: 90px 0 40px 200px; }
@media (max-width: 767px) {
.product h2 {
margin: 0; } }
.product .product-wrapper {
width: 100%; }
.product .product-box {
width: 49%; }
@media (max-width: 767px) {
.product .product-box {
width: 100%; } }
.product .proimg-wrap {
filter: drop-shadow(4px 4px 4px rgba(0, 0, 0, 0.5)); }
.product .proimg-box {
width: 100%;
clip-path: polygon(10% 0, 100% 0, 90% 100%, 0% 100%);
position: relative;
left: 100vw;
aspect-ratio: 9 / 2;
display: flex; }
.product .proimg-box.trigger-on {
animation-name: headline;
animation-duration: 2s;
animation-fill-mode: forwards; }
.product .proimg-box .pro-logo {
position: absolute;
width: 50%;
top: 0;
bottom: 0;
margin: auto;
right: 0;
left: 0;
z-index: 1; }
.product .proimg-box .pro-backimg {
width: 100%;
height: 100%;
object-fit: cover; }
.product .proimg-box .pro-backimg.pro-backimg-ece {
object-position: top; }
.product .proimg-box::after {
position: absolute;
content: "";
top: 0;
left: 0;
width: 100%;
aspect-ratio: 9 / 2; }
.product .proimg-box.proimg-box-apv::after {
background-image: linear-gradient(220deg, rgba(0, 56, 148, 0.7), rgba(0, 185, 239, 0.3)); }
.product .proimg-box.proimg-box-ece::after {
background-image: linear-gradient(220deg, rgba(230, 0, 18, 0.7), rgba(243, 152, 0, 0.5)); }
.product .pro-catch {
margin: 0 0 5px 10%;
font-size: min(1.7vw, 1.8rem); }
@media (max-width: 767px) {
.product .pro-catch {
font-size: 1.4rem;
margin: 20px 0 5px; } }
.product .pro-ttl {
text-align: right;
margin: 5px 10% 0 0;
font-size: min(1.9vw, 2rem); }
@media (max-width: 767px) {
.product .pro-ttl {
font-size: 1.4rem;
text-align: center;
margin: 5px 0 0; } }
.product .pro-ttl span {
font-weight: bold; }
.product .pro-ttl span.apv {
color: #1D3894; }
.product .pro-ttl span.ece {
color: #E62A0E; }
.product .pro-ttl::after {
content: '\ea7e';
font-family: "icomoon";
font-size: 2.0rem;
vertical-align: bottom;
margin-left: 5px;
display: inline-block; } .about {
margin-bottom: 250px;  }
@media (max-width: 767px) {
.about {
margin-bottom: 130px; } }
.about h2 {
margin: 90px 0 60px 460px; }
@media (max-width: 960px) {
.about h2 {
margin-left: auto; } }
@media (max-width: 767px) {
.about h2 {
margin: 0 0 0 auto; } }
.about .about-wrapper-pc {
width: 100%; }
.about .about-wrapper-pc .about-container {
width: 23%;
box-sizing: border-box; }
.about .about-wrapper-pc .about-box {
width: 200px;
height: 200px;
justify-content: center;
transition: .3s;
opacity: 0; }
@media (min-width: 768px) {
.about .about-wrapper-pc .about-box.has-second:hover .about-link {
transform: scale(0.9); }
.about .about-wrapper-pc .about-box.has-second:hover .about-img-box::before {
background-color: rgba(0, 0, 0, 0.5); }
.about .about-wrapper-pc .about-box.has-second:hover .about-link-second {
transform: scale(1.4) rotate(-45deg);
filter: drop-shadow(2px 2px 2px rgba(0, 0, 0, 0.3)); }
.about .about-wrapper-pc .about-box.has-second:hover .about-link-second.about-link-second-triple {
transform: scale(1.38) rotate(-60deg); } }
.about .about-wrapper-pc .about-link {
width: 200px;
height: 200px;
display: block;
position: relative;
transition: .3s; }
.about .about-wrapper-pc .about-link.direct-link {
border-radius: 100px; }
@media (min-width: 768px) {
.about .about-wrapper-pc .about-link.direct-link:hover {
transform: scale(0.95); }
.about .about-wrapper-pc .about-link.direct-link:hover .about-img-box::before {
background-color: rgba(14, 138, 99, 0.5); }
.about .about-wrapper-pc .about-link.direct-link:hover .about-img-box img {
transform: scale(1.2); } }
.about .about-wrapper-pc .about-img-box {
filter: drop-shadow(4px 4px 4px rgba(0, 0, 0, 0.5));
position: relative;
z-index: 2;
border-radius: 100px;
transition: .3s; }
.about .about-wrapper-pc .about-img-box::before {
content: "";
background-color: rgba(0, 0, 0, 0.3);
position: absolute;
width: 200px;
height: 200px;
z-index: 1;
border-radius: 100px;
transition: .3s; }
.about .about-wrapper-pc .about-img-box .about-img-wrap {
overflow: hidden;
width: 200px;
height: 200px;
border-radius: 100px; }
.about .about-wrapper-pc .link-backimg {
width: 200px;
height: 200px;
clip-path: circle(100px at center);
object-fit: cover;
transition: .3s; }
.about .about-wrapper-pc .link-backimg.link-backimg-recruit {
object-position: right; }
.about .about-wrapper-pc p {
position: absolute;
top: 0;
right: 0;
color: #f7f7f7;
font-size: 3rem;
font-weight: bold;
width: 200px;
line-height: 200px;
text-align: center;
z-index: 2;
border-radius: 100px;
transition: .3s; }
.about .about-wrapper-pc p span {
display: block;
font-size: 1.6rem;
font-weight: normal;
position: absolute;
width: 200px;
height: 0;
top: 30px; }
.about .about-wrapper-pc .about-link-second {
position: absolute;
width: 200px;
height: 200px;
top: 0;
transition: .3s; }
@media (min-width: 768px) {
.about .about-wrapper-pc .second-link:hover .about-link-second-backimg .st0 {
fill: #148560; } }
.about .about-wrapper-pc .about-link-second-backimg {
position: absolute;
margin: auto; }
.about .about-wrapper-pc .about-link-second-backimg .st0 {
fill: #62B8A4; }
.about .about-wrapper-pc .about-link-second-backimg.about-link-second-backimg-top {
top: 0;
left: 0;
right: 0;
width: 126px;
height: 89px; }
.about .about-wrapper-pc .about-link-second-backimg.about-link-second-backimg-left {
top: 0;
left: 0;
bottom: 0;
width: 89px;
height: 126px; }
.about .about-wrapper-pc .about-link-second-backimg.about-link-second-backimg-bottom {
bottom: 0;
left: 0;
right: 0;
width: 126px;
height: 89px; }
.about .about-wrapper-pc .about-link-second-backimg.about-link-second-backimg-right {
top: 0;
bottom: 0;
right: 0;
width: 89px;
height: 126px; }
.about .about-wrapper-pc .about-link-second-backimg.about-link-second-backimg-first {
top: 0;
right: 0;
width: 94px;
height: 143px; }
.about .about-wrapper-pc .about-link-second-backimg.about-link-second-backimg-second {
top: 0;
left: 0;
width: 94px;
height: 143px; }
.about .about-wrapper-pc .about-link-second-backimg.about-link-second-backimg-third {
left: 0;
bottom: 0;
right: 0;
width: 164px;
height: 93px; }
.about .about-wrapper-pc .about-link-second-backimg.about-link-second-backimg-recruit-top {
top: 2px;
right: 2px;
width: 92px;
height: 92px; }
.about .about-wrapper-pc .about-link-second-backimg.about-link-second-backimg-recruit-left {
top: 2px;
left: 2px;
width: 92px;
height: 92px; }
.about .about-wrapper-pc .about-link-second-backimg.about-link-second-backimg-recruit-bottom {
bottom: 2px;
left: 2px;
width: 92px;
height: 92px; }
.about .about-wrapper-pc .about-link-second-backimg.about-link-second-backimg-recruit-right {
bottom: 2px;
right: 2px;
width: 92px;
height: 92px; }
.about .about-wrapper-pc .link-contents {
position: absolute;
margin: auto; }
.about .about-wrapper-pc .link-contents.link-contents-system {
width: 126px;
height: 89px;
left: 0;
right: 0;
top: 1px; }
.about .about-wrapper-pc .link-contents.link-contents-consultiong {
width: 89px;
height: 126px;
top: 0;
bottom: 0;
left: 1px; }
.about .about-wrapper-pc .link-contents.link-contents-callcenter {
width: 126px;
height: 89px;
bottom: 1px;
right: 0;
left: 0; }
.about .about-wrapper-pc .link-contents.link-contents-solution {
width: 89px;
height: 126px;
top: 0;
bottom: 0;
right: 1px; }
.about .about-wrapper-pc .link-contents.link-contents-greeting {
width: 94px;
height: 143px;
top: 1px;
right: 1px; }
.about .about-wrapper-pc .link-contents.link-contents-outline {
width: 94px;
height: 143px;
top: 1px;
left: 1px; }
.about .about-wrapper-pc .link-contents.link-contents-policy {
width: 164px;
height: 93px;
left: 0;
bottom: 1px;
right: 0; }
.about .about-wrapper-pc .link-contents.link-contents-recruittop {
width: 92px;
height: 92px;
right: 3px;
top: 3px; }
.about .about-wrapper-pc .link-contents.link-contents-voice {
width: 92px;
height: 92px;
left: 3px;
top: 3px; }
.about .about-wrapper-pc .link-contents.link-contents-faq {
width: 92px;
height: 92px;
left: 3px;
bottom: 3px; }
.about .about-wrapper-pc .link-contents.link-contents-requirements {
width: 92px;
height: 92px;
bottom: 3px;
right: 3px; }
.about .about-wrapper-expc {
width: 100%; }
@media (max-width: 767px) {
.about .about-wrapper-expc {
margin-top: 70px; } }
.about .about-wrapper-expc .about-wrapper {
gap: 10px 0;
padding: 0 20px; }
@media (max-width: 767px) {
.about .about-wrapper-expc .about-wrapper {
padding: 0;
gap: 70px 0; } }
.about .about-wrapper-expc .about-container {
width: 50%;
justify-content: flex-start;
align-items: center;
opacity: 0; }
@media (max-width: 767px) {
.about .about-wrapper-expc .about-container {
width: 45%;
display: block;
position: relative; } }
.about .about-wrapper-expc .about-container:nth-child(3), .about .about-wrapper-expc .about-container:nth-child(4) {
justify-content: flex-end; }
.about .about-wrapper-expc .about-img-wrap {
width: min(40%, 150px);
position: relative;
margin-right: 15px;
display: flex; }
@media (max-width: 767px) {
.about .about-wrapper-expc .about-img-wrap {
width: 100%;
margin: 0;
position: absolute;
top: 20px; } }
.about .about-wrapper-expc .about-img-wrap::before {
content: "";
background-color: rgba(0, 0, 0, 0.5);
position: absolute;
width: 100%;
aspect-ratio: 1 / 1;
z-index: 1;
border-radius: 300px; }
@media (max-width: 767px) {
.about .about-wrapper-expc .about-img-wrap::before {
background-color: rgba(255, 255, 255, 0.8); } }
.about .about-wrapper-expc .about-img-wrap img {
width: 100%;
height: auto;
aspect-ratio: 1 / 1;
border-radius: 300px;
object-fit: cover; }
.about .about-wrapper-expc .about-img-wrap img.link-backimg-recruit {
object-position: 80% 50%; }
.about .about-wrapper-expc .about-img-wrap .link-ttl {
position: absolute;
color: #f7f7f7;
z-index: 2;
font-size: 2.0rem;
font-weight: bold;
width: 100%;
text-align: center;
top: 50%;
left: 50%;
line-height: 1;
transform: translate(-50%, -50%);
-webkit-transform: translate(-50%, -50%);
-ms-transform: translate(-50%, -50%); }
@media (max-width: 767px) {
.about .about-wrapper-expc .about-img-wrap .link-ttl {
width: 100%;
color: #148560;
text-shadow: 2px 2px 2px rgba(255, 255, 255, 0.8);
text-align: left;
top: -45px; } }
.about .about-wrapper-expc .about-img-wrap .link-ttl span {
display: block;
font-weight: normal;
font-size: 1.4rem;
margin-top: 10px; }
@media (max-width: 767px) {
.about .about-wrapper-expc .about-link-wrap {
position: relative;
z-index: 1; } }
.about .about-wrapper-expc .about-link-wrap li {
margin: 10px 0;
line-height: 1; }
.about .about-wrapper-expc .about-link-wrap li a {
font-size: min(1.8vw, 1.8rem);
text-indent: -0.7em;
padding-left: 1.4em;
line-height: 1.5;
display: inline-block; }
.about .about-wrapper-expc .about-link-wrap li a::before {
content: "●";
color: #148560;
text-decoration: none;
display: inline-block;
margin-right: 5px; }
@media (min-width: 768px) {
.about .about-wrapper-expc .about-link-wrap li a:hover {
color: #148560; } }
@media (max-width: 767px) {
.about .about-wrapper-expc .about-link-wrap li a {
text-decoration: underline;
font-size: 1.6rem; } } .news {
margin-bottom: 200px; }
@media (max-width: 767px) {
.news {
margin-bottom: 80px; } }
.news h2 {
margin: 90px 0 60px;
width: 100%; }
@media (max-width: 767px) {
.news h2 {
margin: 0 0 5px; } }
.news .news-wrapper {
width: 100%;
max-width: 800px;
margin: auto; }
.news .news-wrapper:has(.no-news) .more-link {
display: none; }
@media (max-width: 960px) {
.news .news-wrapper {
padding: 0 60px;
box-sizing: border-box; } }
@media (max-width: 767px) {
.news .news-wrapper {
padding: 0; } }
.news .news-container {
width: 100%; }
.news .news-box {
justify-content: flex-start;
border-bottom: 1px solid #939292;
padding: 20px 0;
position: relative; }
@media (max-width: 767px) {
.news .news-box {
display: block;
font-size: 1.5rem;
padding: 15px 0; } }
.news .news-box .news-date {
width: 175px;
color: #939292; }
.news .news-box .news-ttl {
flex: 1; }
@media (min-width: 768px) {
.news .news-box a:hover {
color: #148560;
text-decoration: underline; } }
.news .news-box:last-of-type {
border-bottom: none; }
.news .news-box.new::before {
content: "New";
color: #f7f7f7;
background: #148560;
position: absolute;
font-size: 1.4rem;
font-weight: bold;
line-height: 190%;
padding: 0 8px;
left: -60px;
top: 23px;
border-radius: 5px; }
@media (max-width: 767px) {
.news .news-box.new::before {
content: none; } }
@media (max-width: 767px) {
.news .news-box.new .news-date::after {
content: "New";
color: #f7f7f7;
background: #148560;
font-size: 1.3rem;
font-weight: bold;
line-height: 180%;
padding: 0 8px;
bottom: 2px;
border-radius: 5px;
display: inline-block;
position: relative;
margin-left: 10px; } }
.news .news-box.no-news {
font-size: 2.0rem; }
.more-link {
justify-content: flex-end;
font-size: 1.6rem;
width: 100%; }
.more-link a {
position: relative;
overflow: hidden;
padding: 16px 10px; }
.more-link a span {
position: absolute;
top: 0;
transition: all .3s;
display: block;
opacity: 1;
white-space: nowrap; }
.more-link a span:nth-child(2) {
opacity: 0;
transform: translate(0, 100%); }
@media (min-width: 768px) {
.more-link a:hover span:nth-child(1) {
opacity: 0;
transform: translate(0, -100%); }
.more-link a:hover span:nth-child(2) {
opacity: 1;
transform: translate(0, 0);
color: #148560; }
.more-link a:hover .link-arrow::before, .more-link a:hover .link-arrow::after {
background: #148560; } }
.link-arrow {
position: relative;
bottom: -5px;
width: 140px;
animation: linkarrow 1s ease-in-out infinite; }
.link-arrow::before {
content: "";
position: absolute;
bottom: 4px;
right: 0;
width: 12px;
height: 1px;
background: #333333;
transform: skewY(31deg);
transition: .3s; }
.link-arrow::after {
content: "";
position: absolute;
bottom: 0;
right: 0;
width: 40px;
height: 1px;
background: #333333;
transition: .3s; }  .first-view h1 {
font-size: 5.5rem;
z-index: 1;
margin-top: 210px;
line-height: 135%; }
@media (max-width: 767px) {
.first-view h1 {
font-size: 3.0rem;
margin-top: 190px; } }
.first-view h1 .wrap {
display: block;
overflow: hidden; }
.first-view h1 .popanime {
bottom: -80px;
position: relative;
animation-name: popanime;
animation-duration: 1s;
animation-fill-mode: forwards; }
.main-copy {
position: relative;
margin: 400px auto 200px; }
@media (max-width: 767px) {
.main-copy {
margin: 130px auto 100px; } }
.main-copy .heading {
font-size: 2.5rem;
margin-bottom: 5px;
text-shadow: 1px 1px 7px rgba(255, 255, 255, 0.7), -1px 1px 7px rgba(255, 255, 255, 0.7), 1px -1px 7px rgba(255, 255, 255, 0.7), -1px -1px 7px rgba(255, 255, 255, 0.7); }
@media (max-width: 767px) {
.main-copy .heading {
font-size: 1.8rem; } }
.main-copy.main-copy-right {
justify-content: flex-end; }
.main-copy.main-copy-right .mainimg-box {
right: inherit;
left: 20px; }
@media (max-width: 767px) {
.main-copy.main-copy-right .mainimg-box {
left: inherit;
right: 20px; } }
.main-copy .main-catch {
font-size: 4.5rem;
z-index: 1;
text-shadow: 1px 1px 7px rgba(255, 255, 255, 0.7), -1px 1px 7px rgba(255, 255, 255, 0.7), 1px -1px 7px rgba(255, 255, 255, 0.7), -1px -1px 7px rgba(255, 255, 255, 0.7);
line-height: 150%; }
@media (max-width: 767px) {
.main-copy .main-catch {
font-size: 2.5rem; } }
.main-copy .main-catch .wrap {
display: block;
overflow: hidden; }
.main-copy .main-read {
margin-top: 20px;
font-size: 1.8rem;
line-height: 200%;
max-width: 800px;
text-shadow: 1px 1px 3px #f7f7f7, -1px 1px 3px #f7f7f7, 1px -1px 3px #f7f7f7, -1px -1px 3px #f7f7f7; }
@media (max-width: 767px) {
.main-copy .main-read {
font-size: 1.5rem;
line-height: 1.8;
margin-top: 20px; } }
.main-copy .mainimg-box {
position: absolute;
width: 400px;
height: 400px;
bottom: 0;
top: 0;
right: 35px;
margin: auto;
z-index: -1; }
@media (max-width: 767px) {
.main-copy .mainimg-box {
width: 250px;
height: 250px;
top: -20px;
margin: 0;
right: 20px; } }
.main-copy .mainimg-box::before {
position: absolute;
content: "";
background-color: rgba(255, 255, 255, 0.2);
width: 100%;
height: 100%;
z-index: 20;
border-radius: 200px; }
@media (max-width: 960px) {
.main-copy .mainimg-box::before {
background-color: rgba(255, 255, 255, 0.5); } }
.main-copy .mainimg-box::after {
position: absolute;
content: "";
background-color: #148560;
width: 100%;
height: 100%;
z-index: -1;
border-radius: 200px;
left: 15px;
top: 10px;
opacity: .5; }
@media (max-width: 960px) {
.main-copy .mainimg-box::after {
opacity: .3; } }
@media (max-width: 767px) {
.main-copy .mainimg-box::after {
left: 5px; } }
.main-copy .mainimg-box .mainimg {
width: 100%;
height: 100%;
clip-path: circle(200px at center);
object-fit: cover; }
@media (max-width: 767px) {
.main-copy .mainimg-box .mainimg {
clip-path: circle(125px at center); } }
.info-mainimg-box {
position: absolute;
width: 400px;
height: 400px;
bottom: 0;
top: 0;
right: 35px;
margin-top: 150px;
z-index: -3; }
@media (max-width: 767px) {
.info-mainimg-box {
width: 250px;
height: 250px;
right: 20px; } }
.info-mainimg-box::before {
position: absolute;
content: "";
background-color: rgba(255, 255, 255, 0.2);
width: 100%;
height: 100%;
z-index: 20;
border-radius: 200px; }
@media (max-width: 767px) {
.info-mainimg-box::before {
background-color: rgba(255, 255, 255, 0.5); } }
.info-mainimg-box::after {
position: absolute;
content: "";
background-color: #148560;
width: 100%;
height: 100%;
z-index: -1;
border-radius: 200px;
left: 15px;
top: 10px;
opacity: .5; }
@media (max-width: 767px) {
.info-mainimg-box::after {
left: 5px; } }
.info-mainimg-box img {
width: 100%;
height: 100%;
clip-path: circle(200px at center);
object-fit: cover; }
@media (max-width: 767px) {
.info-mainimg-box img {
clip-path: circle(125px at center); } }
.popanime-wrap {
display: block;
overflow: hidden; }
.parallax {
display: flex;
justify-content: center;
align-items: center;
background-attachment: fixed;
background-position: center;
background-size: cover;
background-repeat: no-repeat;
position: relative;
margin-bottom: 150px; }
@media (max-width: 767px) {
.parallax {
margin-bottom: 80px; } }
.parallax h2, .parallax .contents-catch {
color: #f7f7f7;
text-shadow: 2px 2px 7px #333333; }
.parallax::after {
content: "";
background-image: linear-gradient(180deg, rgba(0, 0, 0, 0.3), rgba(255, 255, 255, 0) 3%, 50%, rgba(255, 255, 255, 0) 97%, rgba(0, 0, 0, 0.3));
width: 100%;
height: 100%;
position: absolute;
top: 0; }
.parallax.parallax-white h2, .parallax.parallax-white .contents-catch {
color: #333333;
text-shadow: 2px 2px 7px #f7f7f7; }
.parallax.parallax-white::after {
background-image: linear-gradient(180deg, rgba(0, 0, 0, 0.1), rgba(255, 255, 255, 0) 2%, 50%, rgba(255, 255, 255, 0) 98%, rgba(0, 0, 0, 0.1)); }
.parallax div {
z-index: 1;
position: relative; } @supports (-webkit-touch-callout: none) { .parallax {
background-attachment: inherit; } }
.contents-ttl.float-text.trigger-off {
font-size: 3.8rem;
margin-bottom: 15px; }
@media (max-width: 767px) {
.contents-ttl.float-text.trigger-off {
font-size: 2.5rem; } }
.contents-catch {
margin-bottom: 20px; }
@media (max-width: 767px) {
.contents-catch {
font-size: 1.5rem; } }   #news .first-view h1 {
margin-top: 150px; }
#news .news {
margin-top: 150px; }
@media (max-width: 767px) {
#news .news {
margin-top: 60px; } }
#news .news-container {
margin: 10px 0; }
.pagenation {
margin: 0 auto;
font-size: 1.6rem; }
.pagenation * {
margin: 0 10px; }
@media (min-width: 768px) {
.pagenation a:hover {
color: #148560; } }
.pagenation span {
font-weight: bold;
color: #148560; } @media (max-width: 767px) {
.single-post br {
display: none; } }
.single-post .news-content-wrapper {
margin-bottom: 100px; }
@media (max-width: 767px) {
.single-post .news-content-wrapper {
margin-bottom: 80px; } }
.single-post .date {
position: relative;
display: inline-block;
margin: 140px 0 20px; }
@media (max-width: 767px) {
.single-post .date {
margin: 140px 0 10px; } }
.single-post .date.new::after {
content: "New";
color: #f7f7f7;
background: #148560;
position: absolute;
font-size: 1.4rem;
font-weight: bold;
line-height: 190%;
padding: 0 8px;
right: -60px;
top: 3px;
border-radius: 5px; }
@media (max-width: 767px) {
.single-post .date.new::after {
top: 0; } }
.single-post h1.float-text.trigger-on {
font-size: 3.0rem;
line-height: 1.5;
max-width: 750px; }
@media (max-width: 767px) {
.single-post h1.float-text.trigger-on {
font-size: 2.0rem; } }
.single-post .news-content {
margin: 30px 0 70px; }
@media (max-width: 767px) {
.single-post .news-content {
margin: 20px 0 50px; } }
.single-post .news-content p {
margin-bottom: 10px; }
@media (max-width: 767px) {
.single-post .news-content p {
font-size: 1.5rem; } }
.single-post .news-content a:not(.op-link) {
font-size: 1.6rem; }
@media (min-width: 768px) {
.single-post .news-content a:not(.op-link):hover {
color: #148560;
text-decoration: underline; } }
.single-post .post-link {
font-size: 1.6rem;
margin-bottom: 20px; }
@media (min-width: 768px) {
.single-post .post-link a:hover {
color: #148560;
text-decoration: underline; } }
.single-post .more-link {
justify-content: center; } .single-post .news-content .shadow img {
box-shadow: 2px 2px 4px rgba(0, 0, 0, 0.3); }
.single-post .news-content .indent {
padding-left: 1em; }
.single-post .news-content .attention {
color: red; }
.single-post .news-content .ex a {
position: relative; }
@media (min-width: 768px) {
.single-post .news-content .ex a:hover::after {
color: #148560; } }
.single-post .news-content .ex a::after {
content: "\ea7e";
font-family: "icomoon";
color: #333333;
margin-left: 3px;
position: absolute;
bottom: 0;
font-size: 1.6rem;
transition: .3s;
line-height: 1; }
.single-post .news-content .link a {
color: blue;
text-decoration: underline; }
@media (min-width: 768px) {
.single-post .news-content .link a:hover {
color: #148560; } }
@media (max-width: 767px) {
.single-post .news-content .two-img {
display: block; }
.single-post .news-content .two-img .wp-block-spacer {
height: 10px !important; } }   #system .main-copy {
margin-bottom: 150px; }
@media (max-width: 767px) {
#system .main-copy {
margin-bottom: 80px; } }
#system .system-performance {
background-image: url(//www.holon.ne.jp/wp-content/themes/holon_original/img/system_backimg.jpg);
background-color: rgba(0, 0, 0, 0.5);
background-blend-mode: darken;
text-align: center;
background-size: cover; }
#system .system-performance .performance-wrapper {
padding: 70px 20px;
max-width: 1000px; }
@media (max-width: 767px) {
#system .system-performance .performance-wrapper {
padding: 40px 20px;
max-width: 500px; } }
#system .system-performance h3 {
font-size: 3.8rem;
line-height: 160%;
color: #f7f7f7;
text-shadow: 2px 2px 7px #333333; }
@media (max-width: 767px) {
#system .system-performance h3 {
font-size: 2.0rem; } }
#system .system-performance h3 span {
display: inline-block; }
#system .system-performance .performance-container {
margin-top: 40px;
justify-content: center; }
@media (max-width: 767px) {
#system .system-performance .performance-container {
gap: 0 5%;
margin-top: 20px; } }
#system .system-performance .performance-box {
width: 200px;
height: 200px;
opacity: 0; }
@media (max-width: 767px) {
#system .system-performance .performance-box {
width: 45%;
height: auto;
aspect-ratio: 1 / 1; } }
#system .system-performance .performance-box .performance-inner {
width: 100%;
height: 100%;
border-radius: 50%;
background-image: radial-gradient(white 50%, #fffb00);
filter: drop-shadow(0 0 20px #fff);
align-items: center;
justify-content: center;
transform: translateZ(0px); }
#system .system-performance .performance-box p {
text-align: center;
line-height: 160%;
color: #148560;
font-size: 1.7rem; }
@media (max-width: 767px) {
#system .system-performance .performance-box p {
font-size: 1.4rem; } }
#system .system-performance .performance-box:nth-of-type(2) {
margin: 0 50px; }
@media (max-width: 767px) {
#system .system-performance .performance-box:nth-of-type(2) {
margin: 0; } }
#system .skill td {
border: 3px solid #f7f7f7; }
#system .skill table {
width: 100%;
font-size: 1.6rem;
color: #f7f7f7;
background-image: url(//www.holon.ne.jp/wp-content/themes/holon_original/img/system_backimg.jpg); }
@media (max-width: 767px) {
#system .skill table {
font-size: 1.2rem;
line-height: 1.5;
background-image: url(//www.holon.ne.jp/wp-content/themes/holon_original/img/skill_img.jpg); } }
#system .skill table td {
vertical-align: top;
padding: 10px 5px 10px 15px;
background-color: rgba(255, 255, 255, 0.8);
color: #333333; }
@media (max-width: 767px) {
#system .skill table td {
padding: 5px; }
#system .skill table td span {
display: inline-block; } }
#system .skill table thead {
background-color: rgba(20, 133, 96, 0.7);
color: #f7f7f7; }
#system .skill table thead th:nth-child(2) {
border-left: 3px solid #f7f7f7;
border-right: 3px solid #f7f7f7; }
@media (max-width: 767px) {
#system .skill table thead {
font-size: 1.5rem; }
#system .skill table thead th {
padding: 5px 0; } }
#system .skill table .major-class {
background-color: rgba(20, 133, 96, 0.5);
color: #f7f7f7;
border-left: none; }
@media (max-width: 767px) {
#system .skill table .major-class {
background-color: rgba(20, 133, 96, 0.8); } }
#system .skill table .middle-class {
background-color: rgba(255, 255, 255, 0.7); }
#system .skill table tr:last-child td {
border-bottom: none; }
#system .skill table tr td:last-child {
border-right: none; } .solution-wrapper {
max-width: 1000px;
margin: 0 auto;
position: relative; }
.solution-wrapper img {
width: 100%;
height: auto;
vertical-align: top; }
@media (max-width: 767px) {
.solution-wrapper img {
display: none; } }
.solution-wrapper .solution-container {
position: absolute;
top: 0;
height: 100%; }
@media (max-width: 767px) {
.solution-wrapper .solution-container {
position: relative; } }
.solution-wrapper .solution-flow-wrapper {
height: 100%;
padding: 0 40px;
box-sizing: border-box;
flex: 1;
min-width: 246px; }
@media (max-width: 960px) {
.solution-wrapper .solution-flow-wrapper {
padding: 0 20px; } }
@media (max-width: 767px) {
.solution-wrapper .solution-flow-wrapper {
padding: 0;
margin-bottom: 80px; } }
.solution-wrapper .solution-flow-wrapper .solution-flow-box {
display: grid;
place-items: center; }
@media (max-width: 767px) {
.solution-wrapper .solution-flow-wrapper .solution-flow-box {
padding: 50px 20px;
clip-path: polygon(50% 20%, 100% 0%, 100% 80%, 50% 100%, 0% 80%, 0% 0%);
margin-bottom: -43px;
position: relative; }
.solution-wrapper .solution-flow-wrapper .solution-flow-box::after {
position: absolute;
color: rgba(255, 255, 255, 0.4);
top: 50px;
right: -10px;
font-size: 60px;
font-weight: bold;
z-index: -1; }
.solution-wrapper .solution-flow-wrapper .solution-flow-box:first-child {
padding: 25px 20px 50px;
clip-path: polygon(0% 0%, 100% 0%, 100% 80%, 50% 100%, 0% 80%);
background: #86bcaa;
border-radius: 10px 10px 0 0; }
.solution-wrapper .solution-flow-wrapper .solution-flow-box:first-child::after {
content: "Phase1";
top: 23px; }
.solution-wrapper .solution-flow-wrapper .solution-flow-box:nth-child(2) {
background: #9ec9ba; }
.solution-wrapper .solution-flow-wrapper .solution-flow-box:nth-child(2)::after {
content: "Phase2"; }
.solution-wrapper .solution-flow-wrapper .solution-flow-box:nth-child(3) {
background: #b6d6cb; }
.solution-wrapper .solution-flow-wrapper .solution-flow-box:nth-child(3)::after {
content: "Phase3";
color: rgba(255, 255, 255, 0.5); }
.solution-wrapper .solution-flow-wrapper .solution-flow-box:last-child {
padding: 50px 20px 25px;
clip-path: polygon(50% 20%, 100% 0%, 100% 100%, 0% 100%, 0% 0%);
background: #cee4dc;
margin: 0;
border-radius: 0 0 10px 10px; }
.solution-wrapper .solution-flow-wrapper .solution-flow-box:last-child::after {
content: "Phase4";
color: rgba(255, 255, 255, 0.6); } }
.solution-wrapper .solution-flow-wrapper h3 {
font-size: 3rem;
margin-bottom: 10px; }
@media (max-width: 960px) {
.solution-wrapper .solution-flow-wrapper h3 {
margin-bottom: 0; } }
@media (max-width: 767px) {
.solution-wrapper .solution-flow-wrapper h3 {
font-size: 2.2rem;
margin-bottom: 5px; } }
.solution-wrapper .solution-flow-wrapper p {
height: 120px;
font-size: min(2.2vw, 1.8rem); }
@media (max-width: 767px) {
.solution-wrapper .solution-flow-wrapper p {
height: auto;
font-size: 1.4rem; } }
.solution-wrapper .solution-service-wrapper {
padding: 30px 30px 0;
box-sizing: border-box;
width: 50%; }
@media (max-width: 960px) {
.solution-wrapper .solution-service-wrapper {
padding: 30px 20px 0;
width: 60%; } }
@media (max-width: 767px) {
.solution-wrapper .solution-service-wrapper {
width: 100%;
padding: 0; } }
.solution-wrapper .solution-service-wrapper h3 {
font-size: min(2.7vw, 2.3rem);
margin-bottom: 5px;
color: #148560; }
@media (max-width: 767px) {
.solution-wrapper .solution-service-wrapper h3 {
font-size: 2.0rem; }
.solution-wrapper .solution-service-wrapper h3 span {
display: inline-block; } }
.solution-wrapper .solution-service-wrapper li {
font-size: 1.6rem;
line-height: 1.5;
padding-left: 1.4rem;
text-indent: -1.4rem;
margin-bottom: 10px; }
@media (max-width: 960px) {
.solution-wrapper .solution-service-wrapper li {
font-size: min(1.7vw, 1.6rem);
margin-bottom: 5px; } }
@media (max-width: 767px) {
.solution-wrapper .solution-service-wrapper li {
font-size: 1.4rem; } }
.solution-wrapper .solution-service-wrapper li:last-child {
margin: 0; }
@media (max-width: 767px) {
.solution-wrapper .solution-service-box {
margin: 10px 0; }
.solution-wrapper .solution-service-box:first-child {
margin-top: 5px; }
.solution-wrapper .solution-service-box:last-child {
margin-bottom: 0; } }
.solution-wrapper .solution-service-inner {
background: #FFFEEE;
padding: 20px 25px;
border-radius: 20px; }
@media (max-width: 960px) {
.solution-wrapper .solution-service-inner {
padding: 15px 20px; } } #consulting .main-copy {
margin-bottom: 150px; }
@media (max-width: 767px) {
#consulting .main-copy {
margin-bottom: 80px; } }
#consulting .consulting-region {
background-image: url(//www.holon.ne.jp/wp-content/themes/holon_original/img/consulting_backimg.jpg);
background-color: rgba(0, 0, 0, 0.5);
background-blend-mode: darken;
background-size: cover;
text-align: center; }
@media (max-width: 767px) {
#consulting .consulting-region {
background-image: url(//www.holon.ne.jp/wp-content/themes/holon_original/img/consulting_area_backimg_sp.jpg); } }
#consulting .consulting-region .region-wrapper {
padding: 70px 20px;
max-width: 1000px; }
@media (max-width: 767px) {
#consulting .consulting-region .region-wrapper {
padding: 40px 20px;
max-width: 500px; } }
#consulting .consulting-region .contents-catch {
text-align: center; }
#consulting .consulting-region .region-box {
align-items: center;
justify-content: center;
background: rgba(255, 255, 255, 0.85);
padding: 15px;
width: 32%;
box-sizing: border-box;
border-radius: 20px;
max-width: 300px;
opacity: 0; }
@media (max-width: 767px) {
#consulting .consulting-region .region-box {
width: 100%;
max-width: none; }
#consulting .consulting-region .region-box:nth-child(2) {
margin: 20px 0; } }
#consulting .consulting-region .region-box .region-box-inner {
border: 3px solid #148560;
padding: 15px 0;
border-radius: 10px; }
@media (max-width: 767px) {
#consulting .consulting-region .region-box .region-box-inner {
display: flex;
padding: 0;
border: none;
align-items: center;
gap: 15px;
justify-content: center; } }
#consulting .consulting-region .region-box h3 {
font-size: 2.3rem; }
@media (max-width: 767px) {
#consulting .consulting-region .region-box h3 {
font-size: 2.0rem; } }
#consulting .consulting-region .region-box img {
height: 80px;
width: auto;
margin: 15px 0 5px; }
@media (max-width: 767px) {
#consulting .consulting-region .region-box img {
height: 50px;
margin: 10px 0 0;
vertical-align: top; } }
#consulting .consulting-region .region-box p {
text-align: center;
font-size: min(1.7vw, 1.6rem); }
@media (max-width: 767px) {
#consulting .consulting-region .region-box p {
font-size: 1.4rem;
text-align: left; } }
#consulting .support-ex h2 {
margin-bottom: 40px; }
@media (max-width: 767px) {
#consulting .support-ex h2 {
margin-bottom: 20px; } }
#consulting .support-ex h3 {
font-size: 2.5rem;
margin-bottom: 10px;
line-height: 130%;
text-shadow: 1px 1px 3px #f7f7f7, -1px 1px 3px #f7f7f7, 1px -1px 3px #f7f7f7, -1px -1px 3px #f7f7f7;
color: #148560; }
@media (max-width: 767px) {
#consulting .support-ex h3 {
font-size: 2.0rem;
width: 100%; } }
#consulting .support-ex h3 .small-text {
font-size: 2rem; }
@media (max-width: 960px) {
#consulting .support-ex h3 .small-text {
display: inline-block; } }
@media (max-width: 767px) {
#consulting .support-ex h3 .small-text {
font-size: 1.5rem; } }
#consulting .support-ex h3 .break {
display: inline-block; }
#consulting .support-ex-box {
width: 48%;
box-sizing: border-box;
margin-bottom: 30px;
justify-content: flex-end;
position: relative; }
@media (max-width: 960px) {
#consulting .support-ex-box {
width: 100%;
justify-content: flex-start;
align-items: center; } }
@media (max-width: 767px) {
#consulting .support-ex-box {
width: 100%;
margin-bottom: 20px; }
#consulting .support-ex-box:last-child {
margin-bottom: 0; } }
#consulting .support-ex-box .support-ex-img {
width: 40%;
aspect-ratio: 1 / 1;
border-radius: 50%;
position: absolute;
left: 0;
top: 0;
z-index: -1; }
@media (max-width: 960px) {
#consulting .support-ex-box .support-ex-img {
width: 150px;
height: 150px;
position: relative;
margin-right: 20px; } }
@media (max-width: 767px) {
#consulting .support-ex-box .support-ex-img {
position: absolute; } }
#consulting .support-ex-box .support-ex-img::before {
position: absolute;
content: "";
background-color: rgba(255, 255, 255, 0.3);
width: 100%;
height: 100%;
z-index: 20;
border-radius: 200px; }
@media (max-width: 960px) {
#consulting .support-ex-box .support-ex-img::before {
content: none; } }
@media (max-width: 767px) {
#consulting .support-ex-box .support-ex-img::before {
content: "";
background-color: rgba(255, 255, 255, 0.5); } }
#consulting .support-ex-box .support-ex-img img {
width: 100%;
height: 100%;
object-fit: cover;
border-radius: 50%;
vertical-align: top; }
#consulting .support-ex-box .support-ex-text {
width: 67%; }
@media (max-width: 960px) {
#consulting .support-ex-box .support-ex-text {
width: auto;
flex: 1; } }
@media (max-width: 767px) {
#consulting .support-ex-box .support-ex-text {
display: flex;
flex-wrap: wrap; } }
#consulting .support-ex-box .support-ex-text p {
font-size: 1.6rem;
text-shadow: 1px 1px 3px #f7f7f7, -1px 1px 3px #f7f7f7, 1px -1px 3px #f7f7f7, -1px -1px 3px #f7f7f7; }
@media (max-width: 767px) {
#consulting .support-ex-box .support-ex-text p {
font-size: 1.4rem;
width: 70%;
margin: 0 0 0 auto;
min-height: 115px; } } #callcenter .main-copy {
margin-bottom: 150px; }
@media (max-width: 767px) {
#callcenter .main-copy {
margin-bottom: 80px; } }
#callcenter .center-feature {
background-image: url(//www.holon.ne.jp/wp-content/themes/holon_original/img/callcenter_backimg01.jpg);
background-color: rgba(0, 0, 0, 0.5);
background-color: rgba(20, 133, 95, 0.5);
background-color: rgba(255, 255, 255, 0.5);
background-blend-mode: lighten;
text-align: center;
background-size: cover; }
@media (max-width: 767px) {
#callcenter .center-feature {
background-image: url(//www.holon.ne.jp/wp-content/themes/holon_original/img/callcenter_feature_backimg_sp.jpg);
background-size: cover; } }
#callcenter .center-feature .center-feature-wrapper {
padding: 70px 20px; }
@media (max-width: 767px) {
#callcenter .center-feature .center-feature-wrapper {
padding: 40px 20px; } }
#callcenter .center-feature .center-feature-container {
margin-top: 40px; }
@media (max-width: 960px) {
#callcenter .center-feature .center-feature-container {
gap: 20px; } }
#callcenter .center-feature .center-feature-box {
align-items: center;
justify-content: center;
width: 23%;
opacity: 0; }
@media (max-width: 960px) {
#callcenter .center-feature .center-feature-box {
width: 48%; } }
@media (max-width: 767px) {
#callcenter .center-feature .center-feature-box {
width: 100%; } }
#callcenter .center-feature .center-feature-box .region-box-inner {
border: 3px solid #148560;
padding: 15px 10px;
border-radius: 10px; }
#callcenter .center-feature .center-feature-box h3 {
font-size: 1.8rem;
background-color: rgba(20, 133, 95, 0.85);
height: 168px;
color: #f7f7f7;
display: grid;
place-items: center;
padding: 20px 5px;
box-sizing: border-box;
border-radius: 20px 20px 0 0; }
@media (max-width: 960px) {
#callcenter .center-feature .center-feature-box h3 {
padding: 10px 5px;
height: 100px; } }
@media (max-width: 767px) {
#callcenter .center-feature .center-feature-box h3 {
font-size: min(4.7vw, 1.8rem);
height: auto;
padding: 15px 5px; } }
#callcenter .center-feature .center-feature-box h3 span {
display: block;
font-size: 1.4rem;
line-height: 1.5;
margin-top: 5px; }
@media (max-width: 767px) {
#callcenter .center-feature .center-feature-box h3 span {
font-size: min(3.6vw, 1.4rem); } }
#callcenter .center-feature .center-feature-box p {
text-align: center;
font-size: min(1.3vw, 1.5rem);
display: grid;
place-items: center;
padding: 20px 5px;
box-sizing: border-box;
background: rgba(255, 254, 238, 0.85);
border-radius: 0 0 20px 20px; }
@media (max-width: 960px) {
#callcenter .center-feature .center-feature-box p {
font-size: 1.5rem; } }
@media (max-width: 767px) {
#callcenter .center-feature .center-feature-box p {
font-size: 1.4rem;
padding: 15px 5px; } }
#callcenter .support-system {
margin-bottom: 150px; }
@media (max-width: 767px) {
#callcenter .support-system {
margin-bottom: 80px; } }
#callcenter .support-system h2 {
margin-bottom: 20px; }
#callcenter .support-system .support-system-wrapper {
background: rgba(20, 133, 95, 0.4);
padding: 30px;
border-radius: 20px; }
@media (max-width: 767px) {
#callcenter .support-system .support-system-wrapper {
padding: 10px;
border-radius: 10px; } }
#callcenter .support-system .support-system-wrapper img {
width: 100%;
height: auto; }
#callcenter .center-menu {
background-image: url(//www.holon.ne.jp/wp-content/themes/holon_original/img/callcenter_backimg02.jpg);
background-color: rgba(0, 0, 0, 0.5);
background-blend-mode: darken;
background-size: cover;
text-align: center; }
#callcenter .center-menu .center-menu-wrapper {
padding: 80px 20px; }
@media (max-width: 767px) {
#callcenter .center-menu .center-menu-wrapper {
padding: 40px 20px; } }
#callcenter .center-menu .center-menu-container {
margin-top: 40px; }
@media (max-width: 767px) {
#callcenter .center-menu .center-menu-container {
margin-top: 20px; } }
#callcenter .center-menu .center-menu-container p {
font-size: 1.5rem;
text-align: end;
color: #f7f7f7; }
@media (max-width: 767px) {
#callcenter .center-menu .center-menu-container p {
font-size: 1.3rem; } }
#callcenter .center-menu table {
width: 100%;
font-size: 2.0rem; }
@media (max-width: 767px) {
#callcenter .center-menu table {
font-size: 1.3rem; } }
#callcenter .center-menu table th, #callcenter .center-menu table td {
padding: 10px; }
@media (max-width: 767px) {
#callcenter .center-menu table th, #callcenter .center-menu table td {
padding: 5px;
line-height: 1.5;
height: 46px; } }
#callcenter .center-menu table .contract-pattern {
background-color: #14855f;
color: #f7f7f7;
width: 30%; }
@media (max-width: 767px) {
#callcenter .center-menu table .contract-pattern {
width: 25%; }
#callcenter .center-menu table .contract-pattern span {
display: inline-block; } }
#callcenter .center-menu table .time-pattern {
background-color: rgba(20, 133, 95, 0.8);
color: #f7f7f7; }
#callcenter .center-menu table .no-bottom-padding {
padding-bottom: 0; }
#callcenter .center-menu table .no-top-padding {
padding-top: 0; }
#callcenter .center-menu table .normal-weight {
font-weight: normal; }
@media (max-width: 767px) {
#callcenter .center-menu table .normal-weight {
font-size: 1.2rem; } }
#callcenter .center-menu table.table-parent {
border-collapse: separate;
border-spacing: 3px; }
#callcenter .center-menu table .inner-table {
padding: 0; }
#callcenter .center-menu table .inner-table.yes-no td {
background-color: rgba(255, 255, 255, 0.9);
width: 17.5%; }
@media (max-width: 767px) {
#callcenter .center-menu table .inner-table.yes-no td {
font-size: 1.6rem; } }   #philosophy .main-copy.greeting-copy {
margin-bottom: 150px; }
@media (max-width: 767px) {
#philosophy .main-copy.greeting-copy {
margin-bottom: 100px; } }
#philosophy .main-copy.greeting-copy .main-copy-box {
width: 100%; }
#philosophy .main-copy.greeting-copy h2 {
margin-bottom: 20px; }
@media (max-width: 767px) {
#philosophy .main-copy.greeting-copy h2 {
font-size: min(6vw, 2.5rem);
margin-bottom: -20px; } }
#philosophy .main-copy.greeting-copy .main-read {
margin: 0; }
#philosophy .main-copy.greeting-copy .main-read:last-child {
width: 75%; }
@media (max-width: 960px) {
#philosophy .main-copy.greeting-copy .main-read:last-child {
width: calc(100% - 230px); } }
@media (max-width: 767px) {
#philosophy .main-copy.greeting-copy .main-read:last-child {
width: 100%; } }
#philosophy .main-copy.greeting-copy .mainimg-box {
bottom: 50px; }
#philosophy .main-copy.greeting-copy ul {
text-shadow: 1px 1px 7px rgba(255, 255, 255, 0.7), -1px 1px 7px rgba(255, 255, 255, 0.7), 1px -1px 7px rgba(255, 255, 255, 0.7), -1px -1px 7px rgba(255, 255, 255, 0.7);
margin: 10px 0;
font-weight: bold;
max-width: 800px;
width: 78%; }
@media (max-width: 960px) {
#philosophy .main-copy.greeting-copy ul {
width: 75%; } }
@media (max-width: 767px) {
#philosophy .main-copy.greeting-copy ul {
width: 100%; } }
#philosophy .main-copy.greeting-copy ul li {
text-indent: -1.4em;
padding-left: 1.6em;
margin: 5px 0; }
@media (max-width: 767px) {
#philosophy .main-copy.greeting-copy ul li {
font-size: 1.5rem; } }
#philosophy .main-copy.philosophy-copy {
margin: 0 auto 200px; }
@media (max-width: 767px) {
#philosophy .main-copy.philosophy-copy {
margin: 0 auto 120px; } }
#philosophy .president-box {
position: absolute;
width: 230px;
bottom: 30px;
right: 25px; }
#philosophy .president-box.only-sp {
position: relative;
width: 110px;
bottom: inherit;
right: 5px;
margin: 0 0 0 auto; }
#philosophy .president-box img {
width: 100%;
height: auto;
display: block;
filter: drop-shadow(4px 4px 4px rgba(0, 0, 0, 0.5));
transform: translateZ(0px); }
#philosophy .president-box p {
text-align: center;
font-weight: bold; }
#philosophy .president-box p span {
font-weight: normal;
font-size: 1.5rem; }
#philosophy .president-name {
background: #148560;
width: 100%;
font-weight: bold;
text-align: right;
padding: 0 15px;
margin-top: 20px;
color: #f7f7f7;
z-index: 20; }
@media (max-width: 767px) {
#philosophy .president-name {
position: relative;
box-sizing: border-box;
margin: -10px 0 10px;
font-size: 1.5rem; } }
#philosophy .president-name span {
font-weight: normal;
font-size: 1.4rem; }
@media (max-width: 767px) {
#philosophy .president-name span {
font-size: 1.3rem; } }
#philosophy .philosophy-read {
font-size: 2.0rem;
font-weight: bold; } .company-outline {
margin-top: 350px; }
@media (max-width: 767px) {
.company-outline {
margin-top: 230px; } }
.company-outline table {
width: 100%;
max-width: 550px;
margin: 0 auto; }
.company-outline table td {
padding-bottom: 30px;
line-height: 180%;
vertical-align: top;
padding-top: 5px; }
@media (max-width: 767px) {
.company-outline table td {
line-height: 1.5;
padding-top: 4px;
font-size: 1.5rem;
vertical-align: middle; } }
.company-outline table td:has(h2) {
width: 30%;
padding-top: 0; }
@media (max-width: 767px) {
.company-outline table td:has(h2) {
width: 25%;
vertical-align: top; } }
@media (max-width: 767px) {
.company-outline table td:has(h3) {
padding-top: 0; } }
.company-outline table td:last-child {
width: 20%; }
@media (max-width: 767px) {
.company-outline table td:last-child {
width: 25%; } }
.company-outline table td.middle-align {
vertical-align: middle; }
@media (max-width: 767px) {
.company-outline table td.vinx-td a {
line-height: 1;
margin-bottom: 10px;
display: inline-block; } }
@media (max-width: 767px) {
.company-outline table td.soken-td {
line-height: 1;
padding-top: 0;
vertical-align: top; } }
.company-outline table td span:not(.little-text) {
display: inline-block; }
.company-outline table td span.little-text {
font-size: 1.4rem;
display: inline-block;
line-height: 1.5; }
.company-outline table td span.little-text.break-text {
display: block; }
@media (max-width: 767px) {
.company-outline table td span.little-text {
font-size: 1.2rem; } }
.company-outline table td .m15 {
margin: 15px 0; }
.company-outline table tr.table-gap::after {
content: '';
display: block;
height: 10px; }
@media (max-width: 767px) {
.company-outline table tr.last-tr td {
padding-bottom: 0; } }
.company-outline table h2 {
font-size: 2.3rem;
line-height: 180%; }
@media (max-width: 767px) {
.company-outline table h2 {
font-size: 1.8rem;
line-height: 1.5; } }
.company-outline table h3 {
font-size: 2.0rem; }
@media (max-width: 767px) {
.company-outline table h3 {
font-size: 1.8rem; } }
.company-outline table .group-link {
text-decoration: underline; }
.company-outline table .group-link::after {
content: "\ea7e";
font-family: "icomoon";
color: #333333;
margin-left: 5px;
position: relative;
top: 2px;
font-size: 2.0rem;
transition: .3s; }
@media (min-width: 768px) {
.company-outline table .group-link:hover {
color: #148560; }
.company-outline table .group-link:hover::after {
color: #148560; } }
.company-outline .open-box .addr-box {
font-size: 1.6rem; }
.company-outline .open-box .addr-box p {
text-align: left;
line-height: 1.6; }
.company-outline .open-box .addr-box .addr span {
display: inline-block; }
.company-outline .open-box .addr-box li {
text-indent: -0.8em;
padding-left: 0.8em;
line-height: 1.6;
margin-top: 5px; }
.company-outline .open-box .map-box {
height: 300px;
padding-top: 35px;
position: relative; }
.company-outline .open-box .map-box .map-expansion {
position: absolute;
right: 0;
top: 0;
font-size: 1.4rem;
text-decoration: underline;
color: #148560; }
.company-outline .open-box .map-box iframe {
width: 100%; } #policy .info-mainimg-box img {
object-position: 80% 50%; }
.company-policy, .privacy-policy {
margin-top: 350px;
max-width: 840px; }
@media (max-width: 767px) {
.company-policy, .privacy-policy {
margin-top: 230px;
max-width: 500px; } }
.company-policy .policy-wrapper, .privacy-policy .policy-wrapper {
margin-top: 40px;
background: #f7f7f7; }
.company-policy .policy-wrapper:has(.close), .privacy-policy .policy-wrapper:has(.close) {
box-shadow: 3px 3px 4px rgba(0, 0, 0, 0.3); }
.company-policy .policy-wrapper h2.open, .privacy-policy .policy-wrapper h2.open {
font-size: 2.5rem;
padding: 10px 20px;
border-left: 15px solid #148560;
box-shadow: 3px 3px 4px rgba(0, 0, 0, 0.3); }
@media (max-width: 767px) {
.company-policy .policy-wrapper h2.open, .privacy-policy .policy-wrapper h2.open {
font-size: 2.0rem; } }
.company-policy .policy-wrapper h2.open.close, .privacy-policy .policy-wrapper h2.open.close {
box-shadow: none; }
.company-policy .policy-wrapper h2.open::before, .company-policy .policy-wrapper h2.open::after, .privacy-policy .policy-wrapper h2.open::before, .privacy-policy .policy-wrapper h2.open::after {
top: 50%;
right: 15px; }
.company-policy .policy-wrapper .open-box, .privacy-policy .policy-wrapper .open-box {
padding: 30px 30px 60px;
border-top: 1px solid rgba(20, 133, 96, 0.3); }
@media (max-width: 767px) {
.company-policy .policy-wrapper .open-box, .privacy-policy .policy-wrapper .open-box {
padding: 20px 20px 30px; } }
.company-policy .policy-wrapper .policy-text, .privacy-policy .policy-wrapper .policy-text {
text-indent: 1em; }
.company-policy .policy-wrapper p, .privacy-policy .policy-wrapper p {
font-size: 1.4rem;
line-height: 200%; }
@media (max-width: 767px) {
.company-policy .policy-wrapper p, .privacy-policy .policy-wrapper p {
line-height: 1.8; } }
.company-policy .policy-wrapper .isms-mark, .company-policy .policy-wrapper .privasy-mark, .privacy-policy .policy-wrapper .isms-mark, .privacy-policy .policy-wrapper .privasy-mark {
height: 144px;
width: auto;
float: right;
margin-left: 30px; }
@media (max-width: 767px) {
.company-policy .policy-wrapper .isms-mark, .company-policy .policy-wrapper .privasy-mark, .privacy-policy .policy-wrapper .isms-mark, .privacy-policy .policy-wrapper .privasy-mark {
height: 70px;
margin-left: 20px; } }
.company-policy .policy-wrapper .policy-list, .privacy-policy .policy-wrapper .policy-list {
padding-left: 1em; }
.company-policy .policy-wrapper .policy-list.policy-number-list li, .privacy-policy .policy-wrapper .policy-list.policy-number-list li {
padding-left: 1em; }
.company-policy .policy-wrapper .policy-list.policy-number-list p, .privacy-policy .policy-wrapper .policy-list.policy-number-list p {
padding-left: 0; }
.company-policy .policy-wrapper .policy-list.policy-number-list h3, .privacy-policy .policy-wrapper .policy-list.policy-number-list h3 {
text-indent: -1.4em; }
@media (max-width: 767px) {
.company-policy .policy-wrapper .policy-list.policy-number-list .policy-number-list .policy-number-list, .privacy-policy .policy-wrapper .policy-list.policy-number-list .policy-number-list .policy-number-list {
padding-left: 0; }
.company-policy .policy-wrapper .policy-list.policy-number-list .policy-number-list .policy-number-list li, .privacy-policy .policy-wrapper .policy-list.policy-number-list .policy-number-list .policy-number-list li {
text-indent: 0; } }
.company-policy .policy-wrapper .policy-list.inner-policy-list li, .privacy-policy .policy-wrapper .policy-list.inner-policy-list li {
font-size: 1.4rem;
margin-top: 5px;
line-height: 1.8;
padding-left: 0;
text-indent: -1em; }
.company-policy .policy-wrapper .policy-list.outer-policy-list, .privacy-policy .policy-wrapper .policy-list.outer-policy-list {
padding-left: 0; }
.company-policy .policy-wrapper .policy-list.outer-policy-list .no-number, .privacy-policy .policy-wrapper .policy-list.outer-policy-list .no-number {
text-indent: 0; }
.company-policy .policy-wrapper .policy-list.outer-policy-list .outer-text, .privacy-policy .policy-wrapper .policy-list.outer-policy-list .outer-text {
padding-left: 0; }
.company-policy .policy-wrapper .policy-list.outer-policy-list .outer-text .policy-inner-text, .privacy-policy .policy-wrapper .policy-list.outer-policy-list .outer-text .policy-inner-text {
text-indent: 1em; }
.company-policy .policy-wrapper .policy-list.outer-policy-list li:first-child, .privacy-policy .policy-wrapper .policy-list.outer-policy-list li:first-child {
margin-top: 0; }
.company-policy .policy-wrapper .policy-list li, .privacy-policy .policy-wrapper .policy-list li {
margin-top: 20px; }
.company-policy .policy-wrapper .policy-list li h3, .privacy-policy .policy-wrapper .policy-list li h3 {
font-size: 1.6rem;
margin-bottom: 5px;
display: inline-block; }
.company-policy .policy-wrapper .policy-list li p, .privacy-policy .policy-wrapper .policy-list li p {
padding-left: 1em; }
.company-policy .policy-wrapper .enactment-wrapper, .privacy-policy .policy-wrapper .enactment-wrapper {
text-align: end; }
.company-policy .policy-wrapper .enactment-box, .privacy-policy .policy-wrapper .enactment-box {
margin-top: 40px;
display: inline-block; }
.company-policy .policy-wrapper .enactment-box .enactment-day::before, .privacy-policy .policy-wrapper .enactment-box .enactment-day::before {
content: "制　定　日 ： ";
font-weight: bold; }
.company-policy .policy-wrapper .enactment-box .revision-day::before, .privacy-policy .policy-wrapper .enactment-box .revision-day::before {
content: "改　訂　日 ： ";
font-weight: bold; }
.company-policy .policy-wrapper .privasy-contact, .privacy-policy .policy-wrapper .privasy-contact {
margin-top: 30px;
text-align: left; }
.company-policy .policy-wrapper .privasy-contact span, .privacy-policy .policy-wrapper .privasy-contact span {
font-weight: bold; }
.company-policy .policy-wrapper h2.privasy-purpose, .privacy-policy .policy-wrapper h2.privasy-purpose {
margin-top: 60px;
font-size: 2.3rem; }
@media (max-width: 767px) {
.company-policy .policy-wrapper h2.privasy-purpose, .privacy-policy .policy-wrapper h2.privasy-purpose {
font-size: 2.0rem; } }
.company-policy .policy-wrapper table, .privacy-policy .policy-wrapper table {
width: calc(100% - 2em);
font-size: 1.4rem;
margin-top: 10px; }
@media (max-width: 767px) {
.company-policy .policy-wrapper table, .privacy-policy .policy-wrapper table {
width: calc(100% + 2.2em);
position: relative;
right: 2.2em; } }
.company-policy .policy-wrapper table td, .company-policy .policy-wrapper table th, .privacy-policy .policy-wrapper table td, .privacy-policy .policy-wrapper table th {
vertical-align: top;
padding: 10px;
border: 1px solid rgba(0, 0, 0, 0.3); }
@media (max-width: 767px) {
.company-policy .policy-wrapper table td, .company-policy .policy-wrapper table th, .privacy-policy .policy-wrapper table td, .privacy-policy .policy-wrapper table th {
padding: 5px;
font-size: 1.3rem; } }
.company-policy .policy-wrapper table th, .privacy-policy .policy-wrapper table th {
font-size: 1.6rem;
background-color: rgba(20, 133, 96, 0.6);
color: #f7f7f7; }
@media (max-width: 767px) {
.company-policy .policy-wrapper table th, .privacy-policy .policy-wrapper table th {
text-align: center;
font-size: 1.5rem; } }
.company-policy .policy-wrapper table td, .privacy-policy .policy-wrapper table td {
line-height: 1.8; }
@media (max-width: 767px) {
.company-policy .policy-wrapper table td, .privacy-policy .policy-wrapper table td {
line-height: 1.5; } }
.company-policy .policy-wrapper table td.middle-class, .privacy-policy .policy-wrapper table td.middle-class {
padding-left: 1.6em;
text-indent: -1em; }
.company-policy .policy-wrapper .sdgs-img, .privacy-policy .policy-wrapper .sdgs-img {
width: 100%;
height: auto;
float: inherit;
margin: auto;
margin-top: 10px; }
.company-policy .policy-wrapper .sdgs-link a, .privacy-policy .policy-wrapper .sdgs-link a {
text-decoration: underline; }
.company-policy .policy-wrapper .sdgs-link a::after, .privacy-policy .policy-wrapper .sdgs-link a::after {
content: "\ea7e";
font-family: "icomoon";
color: #333333;
margin-left: 5px;
position: relative;
top: 2px;
font-size: 1.7rem;
transition: .3s; }
@media (min-width: 768px) {
.company-policy .policy-wrapper .sdgs-link a:hover, .privacy-policy .policy-wrapper .sdgs-link a:hover {
color: #148560; }
.company-policy .policy-wrapper .sdgs-link a:hover::after, .privacy-policy .policy-wrapper .sdgs-link a:hover::after {
color: #148560; } }
.company-policy .policy-wrapper .sdgs-wrapper, .privacy-policy .policy-wrapper .sdgs-wrapper {
margin-top: 5px; }
.company-policy .policy-wrapper .sdgs-box, .privacy-policy .policy-wrapper .sdgs-box {
width: 48%; }
@media (max-width: 767px) {
.company-policy .policy-wrapper .sdgs-box, .privacy-policy .policy-wrapper .sdgs-box {
width: 47%;
display: block; } }
.company-policy .policy-wrapper .sdgs-box img, .privacy-policy .policy-wrapper .sdgs-box img {
width: 40%;
height: auto;
margin: 0;
object-fit: contain; }
@media (max-width: 767px) {
.company-policy .policy-wrapper .sdgs-box img, .privacy-policy .policy-wrapper .sdgs-box img {
width: 100%; } }
.company-policy .policy-wrapper .sdgs-box .sdgs-text-box, .privacy-policy .policy-wrapper .sdgs-box .sdgs-text-box {
width: 57%; }
@media (max-width: 767px) {
.company-policy .policy-wrapper .sdgs-box .sdgs-text-box, .privacy-policy .policy-wrapper .sdgs-box .sdgs-text-box {
width: 100%; } }
.company-policy .policy-wrapper .sdgs-box .sdgs-text-box p, .privacy-policy .policy-wrapper .sdgs-box .sdgs-text-box p {
line-height: 1.8;
font-size: 1.3rem; }
.company-policy .policy-wrapper .sdgs-box .sdgs-text-box .sdgs-target, .privacy-policy .policy-wrapper .sdgs-box .sdgs-text-box .sdgs-target {
text-align: end; }
.company-policy .policy-wrapper .sdgs-attention, .privacy-policy .policy-wrapper .sdgs-attention {
font-size: 1.2rem;
text-align: end;
line-height: 1; }
.company-policy .policy-wrapper .co2-img, .privacy-policy .policy-wrapper .co2-img {
margin-top: 10px;
width: 100%;
height: auto; } #privacy-policy .first-view h1 {
margin-top: 150px; }
#privacy-policy .open-box {
display: block;
padding: 20px 30px; }
@media (max-width: 767px) {
#privacy-policy .open-box {
padding: 20px; } }
#privacy-policy .privacy-policy {
margin-top: 50px; }
@media (max-width: 767px) {
#privacy-policy .privacy-policy {
margin-top: 20px; } }
#privacy-policy .privacy-policy .fadein.trigger-on {
animation: none; }
#privacy-policy .privacy-policy .policy-wrapper {
margin-top: 0;
background: rgba(247, 247, 247, 0.7);
border-radius: 20px; }
@media (max-width: 767px) {
#privacy-policy .privacy-policy .policy-wrapper:first-child {
border-radius: 20px 20px 0 0; }
#privacy-policy .privacy-policy .policy-wrapper:last-child {
border-radius: 0 0 20px 20px; } }
#privacy-policy .privacy-policy .policy-wrapper:last-child .open-box {
padding-bottom: 60px; }
@media (max-width: 767px) {
#privacy-policy .privacy-policy .policy-wrapper:last-child .open-box {
padding-bottom: 30px; } }
#privacy-policy .privacy-policy .policy-wrapper h2 {
border: none;
box-shadow: none;
pointer-events: none;
padding: 40px 30px 0;
margin-top: 0; }
@media (max-width: 767px) {
#privacy-policy .privacy-policy .policy-wrapper h2 {
padding: 30px 20px 0 2.1em;
text-indent: -1.2em; } }
#privacy-policy .privacy-policy .policy-wrapper h2::after {
content: none; }
#privacy-policy .privacy-policy .policy-wrapper h2::before {
content: "■";
width: 0;
color: #148560;
top: inherit;
right: inherit;
position: relative;
background: none;
margin-right: 5px; }
#privacy-policy .privacy-policy .policy-wrapper h2.privasy-purpose {
padding: 60px 0 0; }
@media (max-width: 767px) {
#privacy-policy .privacy-policy .policy-wrapper h2.privasy-purpose {
padding-left: 20px;
white-space: nowrap; } }
#privacy-policy .privacy-policy .policy-wrapper .open-box {
border: none; }   #recruit {      }
#recruit .main-copy .mainimg-box .mainimg {
object-position: 70%; }
#recruit .creed-catch {
justify-content: flex-start;
margin-bottom: 20px;
align-items: center; }
@media (max-width: 767px) {
#recruit .creed-catch {
display: block;
text-align: center;
margin-bottom: 15px; }
#recruit .creed-catch img {
width: 150px;
vertical-align: top; } }
#recruit .creed-catch h2 {
line-height: 1.5;
margin-bottom: 0;
margin-left: 40px;
flex: 1;
font-size: min(3.8vw, 3.8rem); }
@media (max-width: 960px) {
#recruit .creed-catch h2 {
font-size: min(3.4vw, 3.8rem); } }
@media (max-width: 767px) {
#recruit .creed-catch h2 {
margin-left: 0;
font-size: min(4.9vw, 2rem); } }
@media (max-width: 960px) {
#recruit .main-copy h2.main-catch {
font-size: min(5.4vw, 4.5rem); } }
@media (max-width: 767px) {
#recruit .main-copy h2.main-catch {
font-size: 2.0rem; } }
#recruit .creed p {
margin: 10px 0; }
@media (max-width: 767px) {
#recruit .creed p {
font-size: 1.5rem; } }
#recruit .creed ul {
padding-left: 2em;
text-indent: -1em; }
@media (max-width: 767px) {
#recruit .creed ul {
padding-left: 1em; } }
#recruit .creed li {
font-size: 2.0rem;
font-weight: bold;
line-height: 1.5;
margin-bottom: 10px;
color: #148560; }
@media (max-width: 767px) {
#recruit .creed li {
font-size: 1.8rem; } }
#recruit section.footer-link.recruit-footer-link {
margin-bottom: 100px; }
#recruit section:not(.main-copy, .before-footer-link) {
margin-bottom: 150px; }
@media (max-width: 767px) {
#recruit section:not(.main-copy, .before-footer-link) {
margin-bottom: 80px; } }
#recruit .business-content {
padding: 70px 0;
background-image: url(//www.holon.ne.jp/wp-content/themes/holon_original/img/business_backimg.jpg);
background-color: rgba(0, 0, 0, 0.5);
background-blend-mode: darken;
background-size: cover;
display: block; }
@media (max-width: 767px) {
#recruit .business-content {
background-image: url(//www.holon.ne.jp/wp-content/themes/holon_original/img/recruit_business_backimg_sp.jpg);
padding: 40px 0; } }
#recruit .business-content h2 {
color: #f7f7f7;
margin-bottom: 20px; }
#recruit .business-content h3 {
margin-bottom: 5px;
font-size: min(3.1vw, 2.5rem); }
@media (max-width: 767px) {
#recruit .business-content h3 {
font-size: 1.8rem; } }
#recruit .business-content p {
font-size: 1.6rem; }
@media (max-width: 767px) {
#recruit .business-content p {
font-size: 1.5rem; } }
#recruit .business-content-box {
padding: 25px 30px;
background: rgba(255, 255, 255, 0.8);
border-radius: 20px;
width: 48%;
box-sizing: border-box; }
@media (max-width: 767px) {
#recruit .business-content-box {
width: 100%;
padding: 20px;
margin-bottom: 20px; }
#recruit .business-content-box:last-child {
margin-bottom: 0; } }
#recruit .business-content-box h3 {
color: #148560; }
@media (max-width: 767px) {
#recruit .business-content-box h3 {
font-size: 2.0rem; } }
#recruit .job-content-wrapper {
margin-top: 70px; }
#recruit .job-content-box {
width: 48%;
background: rgba(20, 133, 95, 0.85);
padding: 20px;
box-sizing: border-box;
color: #f7f7f7;
border-radius: 20px;
margin-bottom: 30px; }
@media (max-width: 767px) {
#recruit .job-content-box {
width: 100%;
padding: 15px;
margin-bottom: 20px; }
#recruit .job-content-box p {
font-size: 1.4rem; } }
#recruit .more-link {
font-size: 2.0rem;
justify-content: center;
margin-top: 30px; }
#recruit .more-link span {
display: contents; }
@media (max-width: 767px) {
#recruit .more-link span {
display: none; } }
#recruit .more-link a {
padding: 0;
overflow: inherit;
width: 350px;
z-index: 10;
border-radius: 100px;
background: #f7f7f7;
padding: 10px 25px;
filter: drop-shadow(3px 3px 4px rgba(0, 0, 0, 0.5));
transform: translateZ(0px); }
@media (min-width: 768px) {
#recruit .more-link a:hover {
background: #62B8A4;
color: #f7f7f7; }
#recruit .more-link a:hover .link-arrow::before, #recruit .more-link a:hover .link-arrow::after {
background: #f7f7f7; } }
@media (max-width: 767px) {
#recruit .more-link a {
width: 80%;
box-sizing: border-box;
font-size: min(4.2vw, 1.8rem);
padding-left: 11%;
max-width: 380px; } }
#recruit .more-link .link-arrow {
position: absolute;
right: 0;
bottom: 23px;
width: 340px; }
@media (max-width: 767px) {
#recruit .more-link .link-arrow {
width: 85%; } }
@media (max-width: 767px) {
#recruit .recruit-feature-wrapper {
gap: 20px 0; } }
#recruit .recruit-feature-box {
width: 23%; }
@media (max-width: 767px) {
#recruit .recruit-feature-box {
width: 48%; } }
#recruit .recruit-feature-box .recruit-feature-fact {
background: #62B8A4;
text-align: center;
border-radius: 20px;
justify-content: center;
align-items: center;
color: #f7f7f7;
font-size: min(1.8vw, 1.6rem);
height: 145px; }
@media (max-width: 767px) {
#recruit .recruit-feature-box .recruit-feature-fact {
font-size: min(3.7vw, 1.6rem); } }
#recruit .recruit-feature-box .recruit-arrow-box {
text-align: center;
position: relative;
margin: 10px 0; }
#recruit .recruit-feature-box .recruit-arrow-box img {
vertical-align: top; }
#recruit .recruit-feature-box .recruit-arrow-box .arrow-copy {
position: absolute;
line-height: 44px;
text-align: inherit;
font-weight: bold;
bottom: 5px;
right: 0;
left: 100px; }
#recruit .recruit-feature-box .recruit-feature-reason {
text-align: center;
color: #148560;
font-weight: bold;
font-size: min(1.8vw, 2rem);
line-height: 1.5; }
@media (max-width: 767px) {
#recruit .recruit-feature-box .recruit-feature-reason {
font-size: min(3.6vw, 1.6rem); } }
#recruit .human-resources {
padding: 70px 0;
background-image: url(//www.holon.ne.jp/wp-content/themes/holon_original/img/human_resources_backimg.jpg);
background-color: rgba(255, 255, 255, 0.5);
background-blend-mode: lighten;
background-size: cover;
display: block; }
@media (max-width: 767px) {
#recruit .human-resources {
background-image: url(//www.holon.ne.jp/wp-content/themes/holon_original/img/recruit_human_resaurce_backimg_sp.jpg);
padding: 40px 0;
background-color: rgba(255, 255, 255, 0.7); } }
#recruit .human-resources h2, #recruit .human-resources .contents-catch {
color: #333333;
text-shadow: 2px 2px 7px #f7f7f7; }
#recruit .human-resources .contents-catch {
width: 700px; }
@media (max-width: 767px) {
#recruit .human-resources .contents-catch {
width: 100%; } }
@media (max-width: 767px) {
#recruit .human-resources .human-resources-container {
justify-content: center;
gap: 0 2%; } }
#recruit .human-resources .human-resources-box {
width: 18%;
height: auto;
aspect-ratio: 1/1;
opacity: 0; }
@media (max-width: 767px) {
#recruit .human-resources .human-resources-box {
width: 32%; } }
#recruit .human-resources .human-resources-box .human-resources-inner {
width: 100%;
height: 100%;
align-items: center;
justify-content: center;
background-image: radial-gradient(white, #FF9F8D);
border-radius: 50%;
filter: drop-shadow(0 0 20px #fff);
transform: translateZ(0px); }
#recruit .human-resources .human-resources-box p {
text-align: center;
font-weight: bold;
font-size: min(1.8vw, 1.8rem); }
@media (max-width: 767px) {
#recruit .human-resources .human-resources-box p {
font-size: min(3.1vw, 1.5rem); } }
@media (max-width: 960px) {
#recruit .recruit-education .recruit-education-wrapper {
gap: 20px; } }
#recruit .recruit-education .recruit-education-box {
width: 23%;
opacity: 0; }
@media (max-width: 960px) {
#recruit .recruit-education .recruit-education-box {
width: 48%; } }
@media (max-width: 767px) {
#recruit .recruit-education .recruit-education-box {
width: 100%; } }
#recruit .recruit-education .recruit-education-box h3 {
color: #f7f7f7;
text-align: center;
padding: 10px 5px;
background: #148560;
border-radius: 20px 20px 0 0;
font-size: 2.0rem; }
@media (max-width: 767px) {
#recruit .recruit-education .recruit-education-box h3 {
font-size: 1.8rem; } }
#recruit .recruit-education .recruit-education-box p {
background: #FFFEEE;
text-align: center;
padding: 10px 0 15px;
border-radius: 0 0 20px 20px;
font-size: min(1.4vw, 1.6rem); }
@media (max-width: 960px) {
#recruit .recruit-education .recruit-education-box p {
font-size: 1.6rem; } }
@media (max-width: 767px) {
#recruit .recruit-education .recruit-education-box p {
font-size: 1.4rem;
padding: 5px 0 10px; } }
#recruit .recruit-education .recruit-education-ex {
margin-top: 20px;
background: #D5ECEA;
padding: 25px 30px;
border-radius: 20px; }
@media (max-width: 767px) {
#recruit .recruit-education .recruit-education-ex {
padding: 15px; } }
#recruit .recruit-education .recruit-education-ex h3 {
font-size: 2.0rem; }
@media (max-width: 767px) {
#recruit .recruit-education .recruit-education-ex h3 {
font-size: 1.8rem; } }
#recruit .recruit-education .recruit-education-ex ul {
margin-top: 5px; }
#recruit .recruit-education .recruit-education-ex ul li {
margin-top: 5px;
display: inline-block;
margin-right: 20px; }
@media (max-width: 767px) {
#recruit .recruit-education .recruit-education-ex ul li {
font-size: 1.4rem;
margin: 0;
display: block; } } .recruit-voice {
margin-top: 350px; }
@media (max-width: 767px) {
.recruit-voice {
margin-top: 230px; } }
.recruit-voice .voice-wrapper {
margin-top: 40px; }
@media (max-width: 767px) {
.recruit-voice .voice-wrapper {
margin-top: 30px; } }
.recruit-voice .voice-wrapper .voice-box {
width: 48%;
box-sizing: border-box;
margin-bottom: 40px;
opacity: 0; }
@media (max-width: 767px) {
.recruit-voice .voice-wrapper .voice-box {
width: 100%;
margin-bottom: 30px; }
.recruit-voice .voice-wrapper .voice-box.voice-box-last {
margin-bottom: 0; } }
.recruit-voice .voice-wrapper .voice-box a {
padding: 20px;
border-left: 10px solid #148560;
align-items: center;
filter: drop-shadow(4px 4px 4px rgba(0, 0, 0, 0.5));
background: #f7f7f7;
border-radius: 0 20px 20px 0;
transform: translateZ(0px); }
@media (min-width: 768px) {
.recruit-voice .voice-wrapper .voice-box a:hover {
transform: translate(-10px, -10px);
filter: drop-shadow(14px 14px 8px rgba(0, 0, 0, 0.3));
background: #FFFEEE; } }
@media (max-width: 767px) {
.recruit-voice .voice-wrapper .voice-box a {
padding: 10px 15px; } }
.recruit-voice .voice-wrapper .voice-ttl {
font-size: min(1.7vw, 2rem);
font-weight: bold;
color: #148560;
line-height: 1.6; }
@media (max-width: 960px) {
.recruit-voice .voice-wrapper .voice-ttl {
font-size: min(2vw, 2rem); } }
@media (max-width: 767px) {
.recruit-voice .voice-wrapper .voice-ttl {
font-size: min(4vw, 1.8rem); } }
.recruit-voice .voice-wrapper .voice-prof {
font-size: 1.5rem;
line-height: 1.6;
margin-top: 5px; }
@media (max-width: 767px) {
.recruit-voice .voice-wrapper .voice-prof {
font-size: 1.3rem; } }
.recruit-voice .voice-wrapper .voice-text-box {
flex: 1; }
.recruit-voice .voice-wrapper .voice-img-box {
height: 130px;
margin-right: 10px;
width: 30%; }
@media (max-width: 960px) {
.recruit-voice .voice-wrapper .voice-img-box {
width: 25%;
margin-right: 0;
height: inherit;
position: absolute;
right: 15px;
bottom: 15px; } }
.recruit-voice .voice-wrapper .voice-img-box img {
width: auto;
height: 100%;
vertical-align: top; } .modal-block-voice .voice-crown {
position: absolute;
top: 0;
left: 0;
padding: 3px 15px 3px 10px;
font-size: 1.4rem;
border-left: 5px solid #148560;
background: #f7f7f7;
top: 15px;
left: 25px; }
.modal-block-voice .modaal-close.modaal-close-voice:not(.close-btn) {
position: absolute;
top: 0;
right: 0; }
.modal-block-voice .modaal-close.modaal-close-voice:not(.close-btn)::before, .modal-block-voice .modaal-close.modaal-close-voice:not(.close-btn)::after {
background: gray; }
.modal-block-voice .modal-voice-ttl {
font-size: min(3vw, 2.5rem);
font-weight: bold;
color: #148560;
line-height: 1.6; }
@media (max-width: 767px) {
.modal-block-voice .modal-voice-ttl {
font-size: min(4.7vw, 2rem);
margin-bottom: 10px; } }
.modal-block-voice .modal-img-box {
background: #f7f7f7;
align-items: center;
padding: 0 15px;
border-right: 2px solid #148560;
border-bottom: 2px solid #148560;
box-sizing: border-box; }
@media (max-width: 767px) {
.modal-block-voice .modal-img-box {
width: 100%;
gap: 20px;
justify-content: center;
padding: 5px 0;
max-width: 280px;
margin: 0 auto; } }
.modal-block-voice .modal-img-box img {
height: 80px;
margin-right: 10px; }
@media (max-width: 767px) {
.modal-block-voice .modal-img-box img {
height: 70px;
margin-right: 0; } }
.modal-block-voice .modal-img-box .modal-voice-prof {
font-size: 1.6rem;
font-weight: bold;
line-height: 1.6; }
@media (max-width: 767px) {
.modal-block-voice .modal-img-box .modal-voice-prof {
font-size: 1.3rem; } }
.modal-block-voice .modal-voice-text {
margin: 15px 0; }
#voice .modaal-inner-wrapper {
padding-top: 40px;
padding-bottom: 40px; }
#voice .modaal-container {
background: #FFF5E0;
border-radius: 15px; }
#voice .modaal-content-container {
padding: 55px 25px 25px; }
@media (max-width: 767px) {
#voice .modaal-content-container {
padding: 55px 20px 25px; } }
#voice .modaal-close:hover {
background: rgba(0, 0, 0, 0); }
#voice .modaal-close:hover::before, #voice .modaal-close:hover::after {
background: #148560; }
#voice .modaal-close:not(.modaal-close-voice) {
display: none; } #requirements h2 {
margin-bottom: 20px; }
#requirements h3 {
font-size: 1.8rem;
line-height: 1.8; }
@media (max-width: 767px) {
#requirements h3 {
font-size: 1.5rem;
line-height: 1.5; } }
#requirements .treatment {
margin-top: 350px;
margin-bottom: 150px; }
@media (max-width: 767px) {
#requirements .treatment {
margin-top: 230px;
margin-bottom: 80px; } }
#requirements .treatment table {
background-image: url(//www.holon.ne.jp/wp-content/themes/holon_original/img/treatment_backimg.jpg); }
@media (max-width: 767px) {
#requirements .treatment table {
background-position: center;
background-image: url(//www.holon.ne.jp/wp-content/themes/holon_original/img/recruit_treatment_backimg_sp.jpg); } }
#requirements .recruit-requirements {
margin-bottom: 150px; }
@media (max-width: 767px) {
#requirements .recruit-requirements {
margin-bottom: 80px; } }
#requirements .recruit-requirements table {
background-image: url(//www.holon.ne.jp/wp-content/themes/holon_original/img/requirements_backimg.jpg); }
@media (max-width: 767px) {
#requirements .recruit-requirements table {
background-position: center; } }
#requirements .recruit-requirements table .major-class {
width: 24%;
min-width: 130px; }
@media (max-width: 767px) {
#requirements .recruit-requirements table .major-class {
width: 110px;
min-width: inherit; } }
#requirements table:not(.recruit-exam-table) {
width: 100%;
font-size: 1.6rem;
color: #f7f7f7;
background-repeat: no-repeat;
background-size: cover;
border: 3px solid #f7f7f7; }
@media (max-width: 767px) {
#requirements table:not(.recruit-exam-table) {
font-size: 1.2rem;
line-height: 1.5; }
#requirements table:not(.recruit-exam-table) p {
line-height: 1.5; } }
#requirements table:not(.recruit-exam-table) h4 {
line-height: 1.8; }
@media (max-width: 767px) {
#requirements table:not(.recruit-exam-table) h4 {
font-size: 1.3rem; } }
#requirements table:not(.recruit-exam-table) span {
display: inline-block; }
@media (max-width: 767px) {
#requirements table:not(.recruit-exam-table) span.exsp-break {
display: inline; } }
#requirements table:not(.recruit-exam-table) td {
vertical-align: top;
padding: 10px 15px;
background-color: rgba(255, 255, 255, 0.7);
color: #333333;
border: 3px solid #f7f7f7; }
@media (max-width: 767px) {
#requirements table:not(.recruit-exam-table) td {
padding: 5px; } }
#requirements table:not(.recruit-exam-table) .rowspan-class {
min-width: 40px;
width: 12%; }
@media (max-width: 767px) {
#requirements table:not(.recruit-exam-table) .rowspan-class {
width: 45px; } }
#requirements table:not(.recruit-exam-table) .salary-class {
min-width: 110px;
width: 12%; }
@media (max-width: 767px) {
#requirements table:not(.recruit-exam-table) .salary-class {
min-width: inherit;
width: 80px; } }
#requirements table:not(.recruit-exam-table) .major-class {
background-color: rgba(20, 133, 96, 0.9);
color: #f7f7f7;
border-left: none;
box-sizing: border-box; }
#requirements table:not(.recruit-exam-table) tr:first-child td {
border-top: none; }
#requirements table:not(.recruit-exam-table) tr:last-child td {
border-bottom: none; }
#requirements table:not(.recruit-exam-table) tr td:last-child {
border-right: none; }
#requirements table:not(.recruit-exam-table) .recruit-office:not(:last-child) {
margin-bottom: 10px; }
#requirements .recruit-exam {
padding: 70px 0;
background-image: url(//www.holon.ne.jp/wp-content/themes/holon_original/img/human_resources_backimg.jpg);
background-color: rgba(0, 0, 0, 0.5);
background-blend-mode: darken;
background-size: cover;
display: block; }
@media (max-width: 767px) {
#requirements .recruit-exam {
background-image: url(//www.holon.ne.jp/wp-content/themes/holon_original/img/recruit_human_resaurce_backimg_sp.jpg);
padding: 40px 0; } }
@media (max-width: 767px) {
#requirements .recruit-exam h2 {
text-align: center;
line-height: 1.5; } }
#requirements .recruit-exam table {
width: 60%;
min-width: 585px;
font-size: 1.6rem;
background: rgba(255, 255, 255, 0.8);
padding: 20px; }
@media (max-width: 767px) {
#requirements .recruit-exam table {
width: 100%;
min-width: inherit;
font-size: 1.5rem; } }
#requirements .recruit-exam table td {
padding: 15px 15px 15px 20px; }
@media (max-width: 767px) {
#requirements .recruit-exam table td {
padding: 10px; } }
#requirements .recruit-exam table tr:not(:last-child) {
border-bottom: 2px solid rgba(0, 0, 0, 0.5); }
#requirements .recruit-exam table .major-class {
font-size: 1.8rem;
font-weight: bold; }
@media (max-width: 767px) {
#requirements .recruit-exam table .major-class {
width: 70px;
padding-right: 0; } }
#requirements .recruit-exam a {
text-decoration: underline;
color: #148560; }
#requirements .recruit-exam .recruit-manager {
background: #FFF5E0;
text-align: center;
width: 100%;
padding: 20px;
margin: 40px 0 10px; }
#requirements .recruit-exam .recruit-manager p {
text-align: center;
font-weight: bold;
margin-top: 5px; } #faq .info-mainimg-box img {
object-position: 30% 50%; }
#faq .contents-catch {
margin-bottom: 30px; }
@media (max-width: 767px) {
#faq .contents-catch {
text-align: center; } }
#faq .open::before, #faq .open::after {
top: 50%;
width: 20px;
right: 20px; }
@media (max-width: 767px) {
#faq .open::before, #faq .open::after {
width: 15px;
right: 15px; } }
#faq .recruit-faq {
margin-top: 350px; }
@media (max-width: 767px) {
#faq .recruit-faq {
margin-top: 230px; } }
#faq .recruit-faq .q-text, #faq .recruit-faq .a-text {
font-size: 2.0rem;
font-weight: bold;
display: inline-block; }
@media (max-width: 767px) {
#faq .recruit-faq .q-text, #faq .recruit-faq .a-text {
font-size: 1.5rem;
line-height: 1.5; } }
#faq .recruit-faq-box {
margin-bottom: 35px; }
#faq .recruit-faq-box:has(.close) {
filter: drop-shadow(4px 4px 4px rgba(0, 0, 0, 0.3));
transform: translateZ(0px); }
#faq .open-box {
padding: 0; }
#faq .q-container {
filter: drop-shadow(4px 4px 4px rgba(0, 0, 0, 0.3));
transform: translateZ(0px); }
#faq .q-container.close {
filter: none; }
#faq .q-box, #faq .a-box {
justify-content: flex-start;
transition: .3s;
flex-wrap: nowrap; }
#faq .q-box img, #faq .a-box img {
margin-right: 20px; }
@media (max-width: 767px) {
#faq .q-box img, #faq .a-box img {
margin-right: 10px;
width: 35px; } }
#faq .q-box {
background: #D5ECEA;
align-items: center;
border-radius: 20px;
padding: 15px 20px; }
@media (max-width: 767px) {
#faq .q-box {
padding: 10px 40px 10px 15px;
border-radius: 15px; } }
#faq .q-container.close .q-box {
border-radius: 20px 20px 0 0; }
@media (max-width: 767px) {
#faq .q-container.close .q-box {
border-radius: 15px 15px 0 0; } }
#faq .a-box {
background: #f7f7f7;
padding: 20px 40px 25px 20px;
border-radius: 0 0 20px 20px; }
@media (max-width: 767px) {
#faq .a-box {
padding: 10px 40px 10px 15px;
border-radius: 0 0 15px 15px; } }
#faq .recruit-manager-box {
background: #FFF5E0;
padding: 25px 0;
margin-top: 60px; }
@media (max-width: 767px) {
#faq .recruit-manager-box {
margin-top: 50px; } }
#faq .recruit-manager-box .recruit-manager-text {
font-size: 1.7rem;
text-align: center; }
@media (max-width: 767px) {
#faq .recruit-manager-box .recruit-manager-text {
font-size: 1.6rem; } }
#faq .recruit-manager-box .recruit-manager {
font-size: 2.0rem;
font-weight: bold;
text-align: center;
margin-top: 5px; }
@media (max-width: 767px) {
#faq .recruit-manager-box .recruit-manager {
font-size: 1.8rem; } }
@media (min-width: 768px) {
#faq .recruit-manager-box a:hover {
color: #148560;
text-decoration: underline; } }  #movie .info-mainimg-box img {
object-position: 60% 50%; }
#movie .movie-wrapper {
margin: 400px auto 150px; }
@media (max-width: 767px) {
#movie .movie-wrapper {
margin: 230px auto 80px; } }
@media (max-width: 767px) {
#movie .contents-catch {
margin-bottom: 0; } }
#movie .movie-container {
padding: 60px 0;
border-bottom: 1px solid #ccc; }
@media (max-width: 767px) {
#movie .movie-container {
padding: 30px 0; } }
#movie .movie-container:last-child {
border-bottom: none;
padding-bottom: 0; }
#movie .single-container .movie-box {
max-width: 800px;
margin: 0 auto; }
#movie .single-container .movie-img-box {
width: 40%;
min-width: 300px;
margin-right: 25px; }
@media (max-width: 767px) {
#movie .single-container .movie-img-box {
width: 100%;
min-width: inherit;
margin-right: 0; } }
#movie .single-container .movie-text-box {
flex: 1; }
#movie .series-container .series-copy {
margin-top: 10px; }
@media (max-width: 767px) {
#movie .series-container .series-copy {
font-size: 1.5rem; } }
#movie .series-container .series-attention {
font-size: 1.4rem;
color: red;
margin-top: 10px; }
#movie .series-container .series-lineup {
margin-top: 25px; }
#movie .series-container .movie-box {
width: 31%;
opacity: 0; }
@media (max-width: 960px) {
#movie .series-container .movie-box {
width: 100%;
display: flex;
justify-content: flex-start;
margin-bottom: 30px; }
#movie .series-container .movie-box:last-child {
margin-bottom: 0; }
#movie .series-container .movie-box img {
width: 300px;
margin-right: 25px; } }
@media (max-width: 767px) {
#movie .series-container .movie-box {
flex-wrap: wrap; }
#movie .series-container .movie-box img {
width: 100%;
margin-right: 0; } }
#movie .series-container .movie-link {
margin-top: 10px; }
#movie .series-container .movie-text-crown {
font-size: 1.6rem; }
#movie .movie-thumbnail {
width: 100%;
height: auto;
box-shadow: 4px 4px 4px rgba(0, 0, 0, 0.3); }
#movie h2, #movie h3 {
font-size: 2.3rem;
color: #148560;
line-height: 1.3;
padding-left: 1.5em;
text-indent: -1.5em;
margin-bottom: 0;
display: inline-block; }
@media (max-width: 767px) {
#movie h2, #movie h3 {
font-size: 2.0rem; } }
#movie h2::before, #movie h3::before {
content: "■";
margin-right: 10px; }
#movie h3 {
font-size: 2.0rem; }
#movie .movie-date {
font-size: 1.4rem;
font-weight: bold;
text-align: end;
margin: 5px 0;
line-height: 1; }
@media (max-width: 767px) {
#movie .movie-date {
font-size: 1.3rem; } }
#movie .movie-copy {
font-size: 1.5rem; }
#movie .movie-link-box {
text-align: end; }
#movie .movie-link {
font-size: min(1.5vw, 1.5rem);
text-decoration: underline;
color: #148560;
line-height: 1;
margin-top: 15px;
display: inline-block; }
@media (max-width: 960px) {
#movie .movie-link {
font-size: 1.5rem; } }
#movie .movie-attention {
font-size: min(1.1vw, 1.2rem);
color: red;
text-align: end;
margin-top: 5px; }
@media (max-width: 960px) {
#movie .movie-attention {
font-size: 1.2rem; } } .seminar-archive-form {
padding-top: 170px;
margin-bottom: 100px; }
@media (max-width: 767px) {
.seminar-archive-form {
padding-top: 150px;
margin-bottom: 80px; } }
.seminar-archive-form h1 {
font-size: 2.7rem;
margin-bottom: 20px;
text-align: center; }
@media (max-width: 767px) {
.seminar-archive-form h1 {
font-size: 2.0rem;
text-align: left; } }
@media (max-width: 767px) {
.seminar-archive-form .seminar-ttl-text {
font-size: 1.5rem; } }
.seminar-archive-form .seminar-ttl-text span {
display: block;
color: red; }
.seminar-archive-form .seminar-ttl-attention {
font-size: 1.4rem; }
.seminar-archive-form .seminar-ttl-attention a {
color: #148560;
text-decoration: underline; }
@media (min-width: 768px) {
.seminar-archive-form .seminar-ttl-attention a:hover {
color: gray; } }
.seminar-archive-form .seminar-form-block {
max-width: 1000px;
margin: 40px auto 10px;
align-items: center; }
@media (max-width: 767px) {
.seminar-archive-form .seminar-form-block {
margin: 20px auto 10px; } }
.seminar-archive-form .seminar-form-block .seminar-form-text-wrapper {
width: 48%; }
@media (max-width: 960px) {
.seminar-archive-form .seminar-form-block .seminar-form-text-wrapper {
width: 100%;
display: flex;
justify-content: space-between;
flex-wrap: wrap;
align-items: center; } }
.seminar-archive-form .seminar-form-block .seminar-form-text {
font-size: 1.5rem; }
@media (max-width: 960px) {
.seminar-archive-form .seminar-form-block .seminar-form-text {
order: 2;
flex: 1; } }
.seminar-archive-form .seminar-form-block .seminar-form-img-box {
text-align: center;
margin: 30px auto; }
@media (max-width: 960px) {
.seminar-archive-form .seminar-form-block .seminar-form-img-box {
order: 1;
width: 290px;
margin: 0 20px 0 0; } }
@media (max-width: 767px) {
.seminar-archive-form .seminar-form-block .seminar-form-img-box {
width: 100%;
margin: 0; } }
.seminar-archive-form .seminar-form-block .seminar-form-img-box img {
width: 336px;
height: auto;
vertical-align: top; }
@media (max-width: 960px) {
.seminar-archive-form .seminar-form-block .seminar-form-img-box img {
width: 100%; } }
@media (max-width: 767px) {
.seminar-archive-form .seminar-form-block .seminar-form-img-box img {
margin-bottom: 10px; } }
.seminar-archive-form .seminar-form-block .seminar-form-info {
text-align: center;
font-weight: bold;
color: #148560;
font-size: 2.0rem; }
@media (max-width: 960px) {
.seminar-archive-form .seminar-form-block .seminar-form-info {
width: 100%;
order: 3;
margin: 20px 0; } }
@media (max-width: 767px) {
.seminar-archive-form .seminar-form-block .seminar-form-info {
font-size: 1.6rem; } }
.seminar-archive-form .seminar-form-wrapper {
width: 48%;
min-width: 430px;
background: #D5ECEA;
padding: 20px;
box-sizing: border-box;
border-radius: 20px; }
@media (max-width: 960px) {
.seminar-archive-form .seminar-form-wrapper {
width: 550px;
margin: auto; } }
@media (max-width: 767px) {
.seminar-archive-form .seminar-form-wrapper {
width: 100%;
min-width: inherit;
padding: 15px 10px;
border-radius: 15px; } }
.seminar-archive-form .seminar-form-wrapper .seminar-form-copy {
font-size: 1.6rem;
text-align: center;
margin-bottom: 15px;
line-height: 1; }
@media (max-width: 767px) {
.seminar-archive-form .seminar-form-wrapper .seminar-form-copy {
font-size: 1.4rem; } }
.seminar-archive-form .seminar-form-wrapper .form-wrapper {
background: #f7f7f7;
padding: 30px 20px 35px; }
@media (max-width: 767px) {
.seminar-archive-form .seminar-form-wrapper .form-wrapper {
padding: 20px 10px 25px; } }
.seminar-archive-form .seminar-form-wrapper .form-wrapper label {
width: 90px;
font-size: 1.6rem;
display: inline-block;
text-align: end;
margin-right: 2%;
font-weight: bold; }
@media (max-width: 767px) {
.seminar-archive-form .seminar-form-wrapper .form-wrapper label {
width: 60px;
font-size: 1.5rem;
line-height: 1.3;
margin-right: 10px; } }
.seminar-archive-form .seminar-form-wrapper .form-wrapper label span {
font-size: 1.4rem; }
@media (max-width: 767px) {
.seminar-archive-form .seminar-form-wrapper .form-wrapper label span {
font-size: 1.2rem;
display: block; } }
.seminar-archive-form .seminar-form-wrapper .form-wrapper .wpcf7-form-control-wrap {
width: 73%;
display: inline-block; }
@media (max-width: 767px) {
.seminar-archive-form .seminar-form-wrapper .form-wrapper .wpcf7-form-control-wrap {
width: auto;
flex: 1; } }
.seminar-archive-form .seminar-form-wrapper .form-wrapper .wpcf7-form-control-wrap[data-name="your-accept"] {
width: 100%; }
.seminar-archive-form .seminar-form-wrapper .form-wrapper input {
font-size: 1.6rem;
padding: 5px 10px;
width: 100%;
box-sizing: border-box; }
.seminar-archive-form .seminar-form-wrapper .form-wrapper p {
margin-bottom: 20px;
display: flex;
align-items: center; }
.seminar-archive-form .seminar-form-wrapper .form-wrapper p:has(.wpcf7-submit) {
justify-content: center; }
.seminar-archive-form .seminar-form-wrapper .form-wrapper .privacy-agree-wrapper {
margin: 20px 0; }
.seminar-archive-form .seminar-form-wrapper .form-wrapper .privacy-agree-wrapper p {
width: 100%;
text-align: center;
margin: 0; }
.seminar-archive-form .seminar-form-wrapper .form-wrapper .privacy-agree-wrapper p .wpcf7-list-item-label {
font-size: 1.6rem;
margin: 0; }
@media (max-width: 767px) {
.seminar-archive-form .seminar-form-wrapper .form-wrapper .privacy-agree-wrapper p .wpcf7-list-item-label {
display: inline; } }
.seminar-archive-form .seminar-form-wrapper .form-wrapper .privacy-agree-wrapper p label {
width: 100%;
margin: 5px 0 0 0; }
.seminar-archive-form .seminar-form-wrapper .form-wrapper .privacy-agree-wrapper input[type=checkbox] {
width: auto;
-ms-transform: scale(1.6, 1.6);
-webkit-transform: scale(1.6, 1.6);
transform: scale(1.6, 1.6);
position: relative;
margin-right: 5px;
cursor: pointer; }
.seminar-archive-form .seminar-form-wrapper .form-wrapper .privacy-info {
font-size: min(1.3vw, 1.4rem);
justify-content: center; }
@media (max-width: 767px) {
.seminar-archive-form .seminar-form-wrapper .form-wrapper .privacy-info {
display: block;
font-size: 1.5rem; } }
.seminar-archive-form .seminar-form-wrapper .form-wrapper .privacy-info a {
text-decoration: underline;
color: #148560; }
@media (min-width: 768px) {
.seminar-archive-form .seminar-form-wrapper .form-wrapper .privacy-info a:hover {
opacity: .7; } }
.seminar-archive-form .seminar-form-wrapper .form-wrapper p:has(.wpcf7-submit) {
text-align: center;
margin: 0; }
.seminar-archive-form .seminar-form-wrapper .form-wrapper p:has(.wpcf7-submit) .wpcf7-spinner {
display: none; }
@media (max-width: 767px) {
.seminar-archive-form .seminar-form-wrapper .form-wrapper p:has(.wpcf7-submit) {
display: block; } }
.seminar-archive-form .seminar-form-wrapper .form-wrapper .wpcf7-submit {
background: #148560;
border-radius: 10px;
filter: drop-shadow(4px 4px 4px rgba(0, 0, 0, 0.5));
font-size: 2.0rem;
width: 80%;
line-height: 50px;
color: #fff;
border: none;
font-weight: bold;
transition: .3s;
cursor: pointer;
padding: 0; }
@media (min-width: 768px) {
.seminar-archive-form .seminar-form-wrapper .form-wrapper .wpcf7-submit:hover {
background: #62B8A4; } }
.seminar-archive-form span.wpcf7-not-valid-tip {
font-size: 1.3rem;
position: absolute;
bottom: -17px;
line-height: 1; }
.privacy-agree-wrapper .seminar-archive-form span.wpcf7-not-valid-tip {
bottom: -10px;
left: 0;
right: 0; }
@media (max-width: 767px) {
.privacy-agree-wrapper .seminar-archive-form span.wpcf7-not-valid-tip {
bottom: -13px; } }
.seminar-archive-form [data-name="your-accept"] span.wpcf7-not-valid-tip {
right: 0;
left: 0;
bottom: -10px; }
.seminar-archive-form .form-wrapper .wpcf7 form.invalid .wpcf7-response-output {
font-size: 1.3rem;
position: absolute;
border-color: #dc3232;
color: #dc3232;
right: 0;
left: 0;
padding: 5px;
line-height: 1;
margin: 10px;
text-align: center; }
@media (max-width: 767px) {
.seminar-archive-form .form-wrapper .wpcf7 form.invalid .wpcf7-response-output {
line-height: 1.3; } }
.seminar-archive-form form {
position: relative; }   #contact, #entry {  }
#contact .contact-wrapper, #entry .contact-wrapper {
padding: 0 20px;
margin: 100px auto; }
@media (max-width: 767px) {
#contact .contact-wrapper, #entry .contact-wrapper {
margin: 20px auto 80px; } }
#contact .contents-catch, #entry .contents-catch {
text-align: center; }
#contact .contact-container, #entry .contact-container {
padding: 10px 20px 30px;
margin: 0 auto 10px;
max-width: 630px;
background: rgba(247, 247, 247, 0.7);
border-radius: 20px; }
@media (max-width: 767px) {
#contact .contact-container, #entry .contact-container {
max-width: 500px;
margin: 0 auto 10px; } }
#contact .contact-banner-icon, #entry .contact-banner-icon {
display: none; }
#contact .first-view h1, #entry .first-view h1 {
margin-top: 120px; }
#contact .form-wrapper, #entry .form-wrapper {
max-width: 595px;
margin: 0 auto;
position: relative; }
#contact .form-wrapper p, #entry .form-wrapper p {
text-align: left;
display: flex;
line-height: 230%;
font-weight: normal;
margin-bottom: 25px;
font-size: 1.6rem; }
@media (max-width: 767px) {
#contact .form-wrapper p, #entry .form-wrapper p {
display: block;
margin-bottom: 15px; } }
#contact .form-wrapper p > label, #entry .form-wrapper p > label {
min-width: 140px;
font-weight: bold;
position: relative;
text-align: right;
margin-right: -10px; }
@media (max-width: 767px) {
#contact .form-wrapper p > label, #entry .form-wrapper p > label {
display: block;
text-align: left; } }
#contact .form-wrapper p > label .label-attention, #entry .form-wrapper p > label .label-attention {
font-size: 1.2rem;
font-weight: normal;
position: absolute;
right: 0;
top: 25px; }
@media (max-width: 767px) {
#contact .form-wrapper p > label .label-attention, #entry .form-wrapper p > label .label-attention {
position: static;
margin-left: 10px; } }
#contact .form-wrapper p > label::before, #entry .form-wrapper p > label::before {
font-size: 1.5rem;
padding: 5px 10px;
position: absolute;
left: 0;
line-height: 1;
top: 5px; }
@media (max-width: 767px) {
#contact .form-wrapper p > label::before, #entry .form-wrapper p > label::before {
position: static;
margin-right: 10px; } }
#contact .form-wrapper p:has([data-name="your-accept"]), #entry .form-wrapper p:has([data-name="your-accept"]) {
background: #FFF5E0;
padding: 5px; }
#contact .form-wrapper p:nth-of-type(n+2) > label, #entry .form-wrapper p:nth-of-type(n+2) > label {
margin-right: 15px; }
#contact .form-wrapper p span[data-name="your-message"], #contact .form-wrapper p span[data-name="your-qualification"], #contact .form-wrapper p span[data-name="your-appeal"], #entry .form-wrapper p span[data-name="your-message"], #entry .form-wrapper p span[data-name="your-qualification"], #entry .form-wrapper p span[data-name="your-appeal"] {
flex: 1; }
#contact .form-wrapper p span[data-name="your-message"] textarea, #contact .form-wrapper p span[data-name="your-qualification"] textarea, #contact .form-wrapper p span[data-name="your-appeal"] textarea, #entry .form-wrapper p span[data-name="your-message"] textarea, #entry .form-wrapper p span[data-name="your-qualification"] textarea, #entry .form-wrapper p span[data-name="your-appeal"] textarea {
width: 100%;
box-sizing: border-box;
height: 175px;
padding: 10px; }
@media (max-width: 767px) {
#contact .form-wrapper p span[data-name="your-message"] textarea, #contact .form-wrapper p span[data-name="your-qualification"] textarea, #contact .form-wrapper p span[data-name="your-appeal"] textarea, #entry .form-wrapper p span[data-name="your-message"] textarea, #entry .form-wrapper p span[data-name="your-qualification"] textarea, #entry .form-wrapper p span[data-name="your-appeal"] textarea {
height: 125px; } }
#contact .form-wrapper p span[data-name="your-qualification"] textarea, #entry .form-wrapper p span[data-name="your-qualification"] textarea {
height: 110px; }
#contact .form-wrapper p.submit-attention, #entry .form-wrapper p.submit-attention {
display: block;
text-align: center;
font-weight: bold;
line-height: 175%;
margin: 0; }
#contact .form-wrapper p .wpcf7-list-item > label, #entry .form-wrapper p .wpcf7-list-item > label {
cursor: pointer; }
@media (max-width: 767px) {
#contact .form-wrapper p .wpcf7-list-item > label, #entry .form-wrapper p .wpcf7-list-item > label {
font-size: 1.4rem; } }
#contact .form-wrapper p .form-sex .first, #entry .form-wrapper p .form-sex .first {
display: none; }
#contact .form-wrapper .contact-required::before, #entry .form-wrapper .contact-required::before {
content: '必須';
background: #148560;
color: #fff; }
#contact .form-wrapper .contact-any::before, #entry .form-wrapper .contact-any::before {
content: '任意';
background: #D5ECEA;
font-weight: normal; }
#contact .form-wrapper input[type=checkbox], #contact .form-wrapper input[type=radio], #entry .form-wrapper input[type=checkbox], #entry .form-wrapper input[type=radio] {
-ms-transform: scale(1.6, 1.6);
-webkit-transform: scale(1.6, 1.6);
transform: scale(1.6, 1.6);
position: relative;
margin-right: 5px;
cursor: pointer; }
#contact .form-wrapper input[type=text], #contact .form-wrapper input[type=email], #contact .form-wrapper input[type=tel], #contact .form-wrapper textarea, #contact .form-wrapper select, #entry .form-wrapper input[type=text], #entry .form-wrapper input[type=email], #entry .form-wrapper input[type=tel], #entry .form-wrapper textarea, #entry .form-wrapper select {
padding: 5px 10px;
font-size: 1.6rem;
width: 300px; }
@media (max-width: 767px) {
#contact .form-wrapper input[type=text], #contact .form-wrapper input[type=email], #contact .form-wrapper input[type=tel], #contact .form-wrapper textarea, #contact .form-wrapper select, #entry .form-wrapper input[type=text], #entry .form-wrapper input[type=email], #entry .form-wrapper input[type=tel], #entry .form-wrapper textarea, #entry .form-wrapper select {
width: 260px; } }
#contact .form-wrapper .wpcf7-list-item, #entry .form-wrapper .wpcf7-list-item {
margin: 0 30px 0 5px; }
@media (max-width: 767px) {
#contact .form-wrapper .wpcf7-list-item, #entry .form-wrapper .wpcf7-list-item {
margin: 0 25px 0 5px; } }
#contact .form-wrapper [data-name="your-accept"], #entry .form-wrapper [data-name="your-accept"] {
right: -40px; }
@media (max-width: 767px) {
#contact .form-wrapper [data-name="your-accept"], #entry .form-wrapper [data-name="your-accept"] {
right: 0; } }
#contact .form-wrapper [data-name="your-accept"] .wpcf7-list-item, #entry .form-wrapper [data-name="your-accept"] .wpcf7-list-item {
margin: 0; }
#contact .form-wrapper .privacy-agree-wrapper, #entry .form-wrapper .privacy-agree-wrapper {
margin: 10px 0 35px; }
#contact .form-wrapper .privacy-agree-wrapper p, #entry .form-wrapper .privacy-agree-wrapper p {
justify-content: center; }
@media (max-width: 767px) {
#contact .form-wrapper .privacy-agree-wrapper p, #entry .form-wrapper .privacy-agree-wrapper p {
text-align: center; } }
#contact .form-wrapper .privacy-agree-wrapper p .contact-required::before, #entry .form-wrapper .privacy-agree-wrapper p .contact-required::before {
font-size: 1.5rem;
padding: 5px 10px;
position: absolute;
left: -65px;
line-height: 1;
top: 5px; }
@media (max-width: 767px) {
#contact .form-wrapper .privacy-agree-wrapper p .contact-required::before, #entry .form-wrapper .privacy-agree-wrapper p .contact-required::before {
position: static;
margin-right: 10px; } }
#contact .form-wrapper .privacy-agree-wrapper p:has(.form-submit), #entry .form-wrapper .privacy-agree-wrapper p:has(.form-submit) {
display: block;
text-align: center;
position: relative; }
#contact .form-wrapper .privacy-agree-wrapper p:has(.form-submit) .wpcf7-spinner, #entry .form-wrapper .privacy-agree-wrapper p:has(.form-submit) .wpcf7-spinner {
position: absolute;
top: 15px; }
#contact .form-wrapper .privacy-agree-wrapper p:has(.form-submit) input, #entry .form-wrapper .privacy-agree-wrapper p:has(.form-submit) input {
background: #148560;
border-radius: 10px;
filter: drop-shadow(4px 4px 4px rgba(0, 0, 0, 0.5));
font-size: 2.0rem;
width: 500px;
line-height: 60px;
color: #fff;
border: none;
font-weight: bold;
transition: .3s;
cursor: pointer; }
@media (min-width: 768px) {
#contact .form-wrapper .privacy-agree-wrapper p:has(.form-submit) input:hover, #entry .form-wrapper .privacy-agree-wrapper p:has(.form-submit) input:hover {
opacity: 0.7; } }
@media (max-width: 767px) {
#contact .form-wrapper .privacy-agree-wrapper p:has(.form-submit) input, #entry .form-wrapper .privacy-agree-wrapper p:has(.form-submit) input {
width: 100%; } }
@media (max-width: 767px) {
#contact .form-wrapper .privacy-agree-wrapper p .wpcf7-list-item, #entry .form-wrapper .privacy-agree-wrapper p .wpcf7-list-item {
margin: 0; } }
#contact .form-wrapper p:has(.wpcf7-submit), #entry .form-wrapper p:has(.wpcf7-submit) {
text-align: center;
margin: 0;
display: block;
position: relative; }
#contact .form-wrapper p:has(.wpcf7-submit) .wpcf7-spinner, #entry .form-wrapper p:has(.wpcf7-submit) .wpcf7-spinner {
position: absolute;
top: 15px; }
#contact .form-wrapper .privacy-info, #entry .form-wrapper .privacy-info {
font-size: 1.3rem;
margin-bottom: 15px; }
@media (max-width: 767px) {
#contact .form-wrapper .privacy-info, #entry .form-wrapper .privacy-info {
text-align: center; } }
#contact .form-wrapper .privacy-info a, #entry .form-wrapper .privacy-info a {
color: #148560;
text-decoration: underline; }
@media (min-width: 768px) {
#contact .form-wrapper .privacy-info a:hover, #entry .form-wrapper .privacy-info a:hover {
opacity: 0.7; } }
#contact .form-wrapper .wpcf7-submit, #entry .form-wrapper .wpcf7-submit {
background: #148560;
border-radius: 10px;
filter: drop-shadow(4px 4px 4px rgba(0, 0, 0, 0.5));
font-size: 2.0rem;
width: 80%;
line-height: 50px;
color: #fff;
border: none;
font-weight: bold;
transition: .3s;
cursor: pointer;
padding: 0;
margin-bottom: 25px; }
@media (min-width: 768px) {
#contact .form-wrapper .wpcf7-submit:hover, #entry .form-wrapper .wpcf7-submit:hover {
background: #62B8A4; } }
#contact .form-wrapper .wpcf7 form div.wpcf7-response-output, #entry .form-wrapper .wpcf7 form div.wpcf7-response-output {
position: absolute;
border-color: red;
font-size: 1.4rem;
width: 100%;
text-align: center;
box-sizing: border-box;
margin: -10px 0;
color: red;
padding: 0.2em 1em;
line-height: 200%; }
@media (max-width: 767px) {
#contact .form-wrapper .wpcf7 form div.wpcf7-response-output, #entry .form-wrapper .wpcf7 form div.wpcf7-response-output {
line-height: 1.5; } }
#contact .form-wrapper select, #entry .form-wrapper select {
width: 110px; }
#contact .form-wrapper select.form-bday, #entry .form-wrapper select.form-bday {
width: 80px;
margin-right: 5px; }
@media (max-width: 767px) {
#contact .form-wrapper select.form-bday, #entry .form-wrapper select.form-bday {
width: 78px;
margin-right: 3px; }
#contact .form-wrapper select.form-bday.form-bday-month, #contact .form-wrapper select.form-bday.form-bday-day, #entry .form-wrapper select.form-bday.form-bday-month, #entry .form-wrapper select.form-bday.form-bday-day {
width: 60px; } }
#contact .form-wrapper select.form-graduate, #entry .form-wrapper select.form-graduate {
width: 105px;
margin-left: 10px; }
@media (max-width: 767px) {
#contact .form-wrapper select.form-graduate, #entry .form-wrapper select.form-graduate {
margin-left: 0; } }
#contact .form-wrapper input.form-zip, #entry .form-wrapper input.form-zip {
width: 110px; }
#contact .form-wrapper input.form-age, #entry .form-wrapper input.form-age {
width: 80px;
box-sizing: border-box;
margin-right: 5px; }
#contact .wpcf7-not-valid-tip, #entry .wpcf7-not-valid-tip {
position: absolute;
font-size: 1.3rem;
bottom: -30px;
min-width: 110px; }
@media (max-width: 767px) {
#contact .wpcf7-not-valid-tip, #entry .wpcf7-not-valid-tip {
bottom: -40px; } }
#contact .contact-banner, #contact .entry-banner, #entry .contact-banner, #entry .entry-banner {
display: none; }
#contact .wpcf7 form.submitting input[type="submit"],
#contact .wpcf7 form.submitting button, #entry .wpcf7 form.submitting input[type="submit"],
#entry .wpcf7 form.submitting button {
pointer-events: none;
opacity: 0.7;
cursor: not-allowed; } #contact .form-wrapper p:nth-of-type(7), #contact .form-wrapper p:nth-of-type(8) {
margin-bottom: 5px; }
@media (max-width: 767px) {
#contact .form-wrapper input.form-city, #contact .form-wrapper input.form-addr {
width: 100%;
box-sizing: border-box; } } #entry p:nth-of-type(8), #entry p:nth-of-type(9) {
margin-bottom: 5px; } @supports (-webkit-touch-callout: none) { input {
border: 1px solid #767676; } } #contact-thanks header, #contact-thanks .contact-banner, #entry-thanks header, #entry-thanks .contact-banner, #movie-thanks header, #movie-thanks .contact-banner {
display: none; }
#contact-thanks .link-wrapper, #entry-thanks .link-wrapper, #movie-thanks .link-wrapper {
margin: 40px 0 0;
text-align: center; }
#contact-thanks .link-wrapper a, #entry-thanks .link-wrapper a, #movie-thanks .link-wrapper a {
position: relative; }
@media (min-width: 768px) {
#contact-thanks .link-wrapper a:hover, #entry-thanks .link-wrapper a:hover, #movie-thanks .link-wrapper a:hover {
color: #148560; }
#contact-thanks .link-wrapper a:hover .link-arrow::before, #contact-thanks .link-wrapper a:hover .link-arrow::after, #entry-thanks .link-wrapper a:hover .link-arrow::before, #entry-thanks .link-wrapper a:hover .link-arrow::after, #movie-thanks .link-wrapper a:hover .link-arrow::before, #movie-thanks .link-wrapper a:hover .link-arrow::after {
background: #148560; } }
#contact-thanks .link-arrow, #entry-thanks .link-arrow, #movie-thanks .link-arrow {
width: 195px;
bottom: 5px;
position: absolute; }
#contact-thanks .contact-banner-icon, #contact-thanks #page_top, #entry-thanks .contact-banner-icon, #entry-thanks #page_top, #movie-thanks .contact-banner-icon, #movie-thanks #page_top {
display: none; }
@media (max-width: 767px) {
#contact-thanks #wrapper, #entry-thanks #wrapper, #movie-thanks #wrapper {
height: calc(100vh - 103px);
display: flex;
justify-content: center;
align-items: center; } }
.thanks-wrapper {
padding: 0 20px;
justify-content: center;
margin: 100px 0; }
@media (max-width: 767px) {
.thanks-wrapper {
margin: 0; } }
.thanks-wrapper p {
text-align: center; }
.thanks-text {
font-size: 2.0rem; }
@media (max-width: 767px) {
.thanks-text {
font-size: 1.5rem; } }
.thanks-read {
font-size: 1.5rem;
margin: 20px 0; }
@media (max-width: 767px) {
.thanks-read {
font-size: 1.3rem; } }   .before-footer-link {
margin-bottom: 200px; }
@media (max-width: 767px) {
.before-footer-link {
margin-bottom: 120px; } }
.footer-link {
margin: 0 auto 150px; }
@media (max-width: 767px) {
.footer-link {
margin-bottom: 60px; } }
.footer-link-wrapper .contents-ttl.footer-link-ttl {
margin-bottom: 20px; }
@media (max-width: 767px) {
.footer-link-container {
gap: 15px 0; } }
.footer-link-box {
width: min(23%, 250px); }
@media (max-width: 767px) {
.footer-link-box {
width: 48%; } }
.footer-link-box a {
width: 100%;
aspect-ratio: 16 / 9;
display: block;
position: relative;
filter: drop-shadow(4px 4px 4px rgba(0, 0, 0, 0.5));
transform: translateZ(0px); }
.footer-link-box a::after {
content: "";
background-image: linear-gradient(180deg, rgba(255, 255, 255, 0) 70%, rgba(0, 0, 0, 0.4) 80%, rgba(0, 0, 0, 0.4) 100%);
opacity: .7;
z-index: 200;
width: 100%;
height: 100%;
position: absolute;
top: 0;
z-index: -1;
border-radius: 20px; }
@media (max-width: 960px) {
.footer-link-box a::after {
border-radius: 15px; } }
@media (max-width: 767px) {
.footer-link-box a::after {
border-radius: 10px; } }
.footer-link-box img {
width: 100%;
height: 100%;
object-fit: cover;
border-radius: 20px; }
@media (max-width: 960px) {
.footer-link-box img {
border-radius: 15px; } }
@media (max-width: 767px) {
.footer-link-box img {
border-radius: 10px; } }
.footer-link-box img.faq-img {
width: 115%;
object-position: bottom; }
.footer-link-box p {
position: absolute;
bottom: 3px;
right: 20px;
color: #f7f7f7;
font-size: 1.6rem; }
@media (max-width: 960px) {
.footer-link-box p {
right: 10px;
font-size: 1.5rem; } }
@media (max-width: 767px) {
.footer-link-box p {
line-height: 1.3;
right: 5px;
font-size: min(4vw, 1.5rem); } }
.footer-link-box .shining-mask {
position: relative; display: block;
line-height: 0; overflow: hidden; height: 100%; }
.footer-link-box .shining-mask::before {
position: absolute;
content: "";
width: 50%; height: 100%; top: 0; left: -75%; background: -webkit-linear-gradient(left, rgba(255, 255, 255, 0) 0%, rgba(255, 255, 255, 0.3) 100%);
background: -o-linear-gradient(left, rgba(255, 255, 255, 0) 0%, rgba(255, 255, 255, 0.3) 100%);
background: linear-gradient(to right, rgba(255, 255, 255, 0) 0%, rgba(255, 255, 255, 0.3) 100%);
transform: skewX(-25deg); }
@media (min-width: 768px) {
.footer-link-box .shining-mask:hover::before {
animation: shine 0.8s; } }
.footer-link-box .footer-link-img-inner {
position: absolute;
top: 0;
z-index: -1;
width: 100%;
height: 100%;
border-radius: 20px;
overflow: hidden; }
@media (max-width: 960px) {
.footer-link-box .footer-link-img-inner {
border-radius: 15px; } }
@media (max-width: 767px) {
.footer-link-box .footer-link-img-inner {
border-radius: 10px; } }
@media (min-width: 768px) {
.footer-link-box a:hover img {
transform: scale(1.2); } }
.company-footer-link .footer-link-container {
max-width: 816px;
margin: auto; }
.company-footer-link .footer-link-container .footer-link-box {
width: min(31%, 250px); }
@media (max-width: 767px) {
.company-footer-link .footer-link-container p {
font-size: min(3.2vw, 1.5rem); }
.company-footer-link .footer-link-container a::after {
background-image: linear-gradient(180deg, rgba(255, 255, 255, 0) 50%, rgba(0, 0, 0, 0.4) 80%, rgba(0, 0, 0, 0.4) 100%); } } .contact-banner {
width: 100%;
position: relative;
z-index: 0; }
.contact-banner::before {
background-color: rgba(20, 133, 96, 0.4);
content: "";
width: 100%;
height: 100%;
display: block;
position: absolute;
top: 0;
z-index: -1; }
.contact-banner::after {
position: absolute;
content: "";
top: 0;
left: 0;
width: 100%;
height: 100%;
background-image: radial-gradient(rgba(255, 255, 255, 0.2) 40%, transparent 20%), radial-gradient(rgba(255, 255, 255, 0.2) 40%, transparent 20%);
background-size: 4px 4px;
background-position: 0 0, 2px 2px;
z-index: -2; }
.contact-banner .contact-banner-wrapper {
max-width: 1040px;
padding: 30px 20px;
align-items: center; }
@media (max-width: 767px) {
.contact-banner .contact-banner-wrapper {
max-width: 500px; } }
.contact-banner .contact-banner-back {
position: absolute;
width: 100%;
height: 100%;
object-fit: cover;
z-index: -3; }
.contact-banner .contact-banner-ttl {
text-align: center;
font-size: 3.5rem;
width: 100%;
color: #f7f7f7;
letter-spacing: .03em;
font-weight: bold;
text-shadow: 2px 2px 3px rgba(0, 0, 0, 0.5);
line-height: 1.5;
margin-bottom: 15px; }
@media (max-width: 767px) {
.contact-banner .contact-banner-ttl {
font-size: min(9vw, 3.5rem); } }
.contact-banner .contact-banner-ttl span:not(.break) {
font-size: 2.5rem;
font-weight: normal; }
@media (max-width: 767px) {
.contact-banner .contact-banner-ttl span:not(.break) {
font-size: min(6.2vw, 2.5rem); } }
.contact-banner .contact-banner-ttl .break {
display: inline-block; }
.contact-banner .contact-banner-left-box {
width: 65%;
max-width: 660px;
margin-right: 20px; }
@media (max-width: 767px) {
.contact-banner .contact-banner-left-box {
width: 100%;
margin: 0 0 15px;
max-width: none; } }
.contact-banner .contact-banner-left-box .contact-banner-link {
width: 31%;
text-align: center; }
@media (min-width: 768px) {
.contact-banner .contact-banner-left-box .contact-banner-link a:hover .contact-banner-img-box-apv::before {
background-color: rgba(0, 104, 183, 0.6); }
.contact-banner .contact-banner-left-box .contact-banner-link a:hover .contact-banner-img-box-ece::before {
background-color: rgba(230, 0, 18, 0.6); }
.contact-banner .contact-banner-left-box .contact-banner-link a:hover .contact-banner-img-box-system::before {
background-color: rgba(20, 133, 96, 0.6); }
.contact-banner .contact-banner-left-box .contact-banner-link a:hover .product-name {
opacity: .7; }
.contact-banner .contact-banner-left-box .contact-banner-link a:hover .contact-banner-img {
transform: scale(1.3); } }
.contact-banner .contact-banner-left-box .contact-banner-link .product-name {
font-size: 1.3rem;
line-height: 1.3;
margin-top: 10px;
text-align: center;
color: #f7f7f7;
text-shadow: 2px 2px 3px rgba(0, 0, 0, 0.5);
position: relative; }
.contact-banner .contact-banner-left-box .contact-banner-link .product-name span {
display: inline-block; }
.contact-banner .contact-banner-left-box .contact-banner-link .product-name.product-name-external::after {
content: "\ea7e"; font-family: "icomoon";
color: #f7f7f7;
margin-left: 3px;
position: absolute;
bottom: 0;
font-size: 1.5rem;
transition: .3s; }
.contact-banner .contact-banner-left-box .contact-banner-img-box {
width: 90%;
margin: auto;
min-width: 144px;
aspect-ratio: 1 / 1;
border-radius: 200px;
position: relative;
opacity: 0;
filter: drop-shadow(3px 3px 5px rgba(0, 0, 0, 0.5));
transform: translateZ(0px); }
@media (max-width: 767px) {
.contact-banner .contact-banner-left-box .contact-banner-img-box {
width: 100%;
min-width: inherit; }
.contact-banner .contact-banner-left-box .contact-banner-img-box:last-child {
display: flex;
align-items: center; } }
.contact-banner .contact-banner-left-box .contact-banner-img-box .contact-banner-img-inner {
border-radius: 200px;
overflow: hidden; }
.contact-banner .contact-banner-left-box .contact-banner-img-box .contact-banner-img {
object-fit: cover;
width: 100%;
height: 100%;
border-radius: 300px;
vertical-align: bottom; }
.contact-banner .contact-banner-left-box .contact-banner-img-box .contact-banner-logo, .contact-banner .contact-banner-left-box .contact-banner-img-box .contact-banner-img-text {
position: absolute;
top: 0;
bottom: 0;
right: 0;
left: 0;
margin: auto;
width: 50%;
height: auto;
z-index: 2; }
@media (max-width: 767px) {
.contact-banner .contact-banner-left-box .contact-banner-img-box .contact-banner-logo, .contact-banner .contact-banner-left-box .contact-banner-img-box .contact-banner-img-text {
width: 60%; } }
.contact-banner .contact-banner-left-box .contact-banner-img-box .contact-banner-img-text {
text-align: center;
height: 100px;
line-height: 100px;
color: #f7f7f7;
font-size: 2.3rem;
width: 100%; }
@media (max-width: 767px) {
.contact-banner .contact-banner-left-box .contact-banner-img-box .contact-banner-img-text {
font-size: min(5.6vw, 3rem); } }
.contact-banner .contact-banner-left-box .contact-banner-img-box::before {
content: "";
width: 100%;
height: 100%;
position: absolute;
border-radius: 200px;
transition: .3s;
z-index: 1;
left: 0; }
.contact-banner .contact-banner-left-box .contact-banner-img-box.contact-banner-img-box-apv::before {
background-color: rgba(0, 104, 183, 0.4); }
.contact-banner .contact-banner-left-box .contact-banner-img-box.contact-banner-img-box-ece::before {
background-color: rgba(230, 0, 18, 0.4); }
.contact-banner .contact-banner-left-box .contact-banner-img-box.contact-banner-img-box-system::before {
background-color: rgba(20, 133, 96, 0.4); }
.contact-banner .contact-banner-right-box {
flex: 1; }
.contact-banner .contact-banner-right-box .contact-banner-text {
color: #f7f7f7;
text-align: center;
margin-bottom: 10px; }
@media (max-width: 767px) {
.contact-banner .contact-banner-right-box .contact-banner-text {
margin-bottom: 0;
font-size: 1.8rem; } }
.contact-banner .contact-banner-right-box a {
width: 100%;
position: relative;
color: #f7f7f7;
display: block;
text-align: center;
padding: 10px;
box-sizing: border-box;
line-height: 1.5;
font-size: min(2.1vw, 2.2rem);
font-weight: bold;
text-shadow: 2px 2px 3px rgba(0, 0, 0, 0.5);
transition: 1s; }
.contact-banner .contact-banner-right-box a::after {
content: '';
position: absolute;
z-index: -1;
bottom: 0;
left: 0;
width: 0;
height: 2px;
background: #148560;
opacity: 0;
border-radius: 100px; }
@media (min-width: 768px) {
.contact-banner .contact-banner-right-box a:hover {
z-index: 1;
text-shadow: none;
color: #148560; }
.contact-banner .contact-banner-right-box a:hover::after {
width: 100%;
opacity: 1;
animation: bgappear .7s forwards; }
.contact-banner .contact-banner-right-box a:hover .link-arrow::before, .contact-banner .contact-banner-right-box a:hover .link-arrow::after {
background: #148560; } }
@media (max-width: 960px) {
.contact-banner .contact-banner-right-box a {
font-size: min(2.1vw, 2rem);
color: #148560;
text-shadow: none;
padding: 15px 0;
transition: .3s; }
.contact-banner .contact-banner-right-box a::after {
background: #FFF5E0;
filter: drop-shadow(4px 4px 4px rgba(0, 0, 0, 0.5));
transform: translateZ(0px); opacity: 1;
width: 100%;
height: 100%;
transition: .3s; }
.contact-banner .contact-banner-right-box a:hover {
color: #62B8A4; }
.contact-banner .contact-banner-right-box a:hover::after {
animation: none; } }
@media (max-width: 960px) and (max-width: 767px) {
.contact-banner .contact-banner-right-box a:hover {
color: #148560; } }
@media (max-width: 960px) {
.contact-banner .contact-banner-right-box a:hover .link-arrow::before, .contact-banner .contact-banner-right-box a:hover .link-arrow::after {
background: #62B8A4; } }
@media (max-width: 767px) {
.contact-banner .contact-banner-right-box a {
font-size: 1.8rem; } }
.contact-banner .contact-banner-right-box a .link-arrow {
position: absolute;
width: min(85%, 265px);
bottom: 25%; }
@media (max-width: 767px) {
.contact-banner .contact-banner-right-box a .link-arrow {
display: none; } }
.contact-banner .contact-banner-right-box a .link-arrow::before, .contact-banner .contact-banner-right-box a .link-arrow::after {
background: #f7f7f7;
height: 2px;
transition: 1s; }
@media (max-width: 960px) {
.contact-banner .contact-banner-right-box a .link-arrow::before, .contact-banner .contact-banner-right-box a .link-arrow::after {
background: #148560; } }
#recruit .contact-banner, #voice .contact-banner, #requirements .contact-banner, #faq .contact-banner, #contact .contact-banner, #entry .contact-banner {
display: none; } .entry-banner {
height: 250px;
position: relative; }
@media (max-width: 767px) {
.entry-banner {
height: auto; } }
.entry-banner .entry-banner-img {
width: 55%;
height: 100%;
object-fit: cover;
object-position: 50% 55%; }
@media (max-width: 767px) {
.entry-banner .entry-banner-img {
width: 100%;
height: 100px; } }
.entry-banner .entry-wrapper {
width: 53%;
background-image: linear-gradient(40deg, #88b188, #148560 70%);
clip-path: polygon(15% 0, 100% 0, 100% 100%, 0% 100%);
position: absolute;
top: 0;
right: 0;
height: 250px;
box-sizing: border-box;
align-items: center; }
@media (max-width: 767px) {
.entry-banner .entry-wrapper {
width: 100%;
position: relative;
clip-path: none;
padding: 10px 0;
height: auto; } }
.entry-banner .entry-wrapper .entry-container {
margin-left: 20%;
padding-right: 20px; }
.entry-banner .entry-wrapper .entry-banner-ttl {
font-size: min(3vw, 3.5rem);
width: 100%;
color: #f7f7f7;
letter-spacing: .03em;
font-weight: bold;
text-shadow: 2px 2px 3px rgba(0, 0, 0, 0.5);
line-height: 1.5;
margin-bottom: 15px;
text-align: left; }
@media (max-width: 960px) {
.entry-banner .entry-wrapper .entry-banner-ttl {
font-size: min(4.1vw, 3.5rem); } }
@media (max-width: 767px) {
.entry-banner .entry-wrapper .entry-banner-ttl {
font-size: min(6.6vw, 2.8rem);
padding: 0 20px;
box-sizing: border-box;
margin-bottom: 10px; } }
.entry-banner .entry-wrapper .entry-banner-ttl .entry-banner-ttl-little {
font-size: min(2vw, 2.5rem);
font-weight: normal; }
@media (max-width: 960px) {
.entry-banner .entry-wrapper .entry-banner-ttl .entry-banner-ttl-little {
font-size: min(2.5vw, 2.5rem); } }
@media (max-width: 767px) {
.entry-banner .entry-wrapper .entry-banner-ttl .entry-banner-ttl-little {
font-size: min(5.3vw, 2.1rem); } }
.entry-banner .entry-wrapper .entry-btn {
margin-bottom: 5px;
padding: 10px 0;
background: #fbb03b;
font-size: 2.0rem;
font-weight: bold;
width: 100%;
max-width: 460px;
display: block;
text-align: center;
box-sizing: border-box;
border-radius: 10px;
filter: drop-shadow(3px 3px 5px rgba(0, 0, 0, 0.5));
transform: translateZ(0px); position: relative;
overflow: hidden; }
@media (max-width: 767px) {
.entry-banner .entry-wrapper .entry-btn {
width: 90%;
margin: 10px auto; } }
.entry-banner .entry-wrapper .entry-btn span {
position: relative;
z-index: 3; }
.entry-banner .entry-wrapper .entry-btn:hover span {
color: #148560; }
.entry-banner .entry-wrapper .entry-btn::before {
content: '';
position: absolute;
top: 0;
left: -130%;
background: #ECE1D3;
width: 120%;
height: 100%;
transform: skewX(-25deg); }
.entry-banner .entry-wrapper .entry-btn:hover::before {
animation: skewanime .5s forwards; }
body:not(#recruit, #voice, #requirements, #faq, #entry) .entry-banner {
display: none; } .footer-menu-wrapper {
background: #f7f7f7;
padding: 40px 0 20px; }
@media (max-width: 767px) {
.footer-menu-wrapper {
padding: 15px 0; } }
.footer-menu-wrapper .footer-menu {
line-height: 100%; }
@media (max-width: 960px) {
.footer-menu-wrapper .footer-menu {
justify-content: center; } }
@media (max-width: 960px) {
.footer-menu-wrapper .footer-menu .footer-menu-container {
width: 33%;
display: flex;
justify-content: center; } }
.footer-menu-wrapper .footer-menu .footer-menu-ttl {
font-weight: bold;
font-size: 1.6rem;
margin-top: 20px;
color: #148560; }
.footer-menu-wrapper .footer-menu .footer-menu-ttl span {
font-weight: normal;
font-size: 1.4rem;
color: #333333;
transition: .3s; }
.footer-menu-wrapper .footer-menu .footer-menu-ttl a {
color: #148560; }
.footer-menu-wrapper .footer-menu .footer-menu-item-container {
font-weight: normal;
font-size: 1.4rem; }
.footer-menu-wrapper .footer-menu .footer-menu-item {
line-height: 250%;
margin-left: 1em; }
.footer-menu-wrapper .footer-menu .footer-menu-item:first-of-type {
margin-top: 10px; }
.footer-menu-wrapper .footer-menu .footer-menu-item::before {
content: "- "; }
.footer-menu-wrapper .footer-menu .footer-menu-item a {
color: #333333; }
.footer-menu-wrapper .footer-menu .footer-menu-item.footer-menu-item-external a::after {
content: "\ea7e"; font-family: "icomoon";
color: #333333;
margin-left: 5px;
position: relative;
top: 2px;
font-size: 1.7rem;
transition: .3s; }
@media (min-width: 768px) {
.footer-menu-wrapper .footer-menu .footer-menu-item.footer-menu-item-external a:hover::after {
color: #148560; } }
@media (min-width: 768px) {
.footer-menu-wrapper .footer-menu a:hover {
color: #148560;
text-decoration: underline; }
.footer-menu-wrapper .footer-menu a:hover::after {
color: #148560; }
.footer-menu-wrapper .footer-menu a:hover span {
color: #148560;
text-decoration: underline;
color: #148560; } }
.footer-menu-wrapper .footer-menu a.no-underline:hover {
text-decoration: none; }
.footer-menu-wrapper .footer-menu a.no-underline:hover span {
color: #333333;
text-decoration: none; } .footer-logo-box {
text-align: center;
margin-top: 15px; }
@media (max-width: 767px) {
.footer-logo-box {
margin-top: 0; } }
.footer-logo-box .footer-logo img {
width: 200px;
height: auto; }
@media (max-width: 767px) {
.footer-logo-box .footer-logo img {
width: 120px;
vertical-align: top; } } .copyright {
background: #148560;
text-align: center; }
.copyright p {
text-align: center;
font-size: 1.1rem;
color: #f7f7f7;
line-height: 200%; }