@charset "utf-8";
/* CSS Document */

@import url('https://fonts.googleapis.com/css2?family=Noto+Sans+JP:wght@100;300;400;500;700;900&display=swap');
@import url('https://fonts.googleapis.com/css2?family=Noto+Serif+JP:wght@200;300;400;500;700;900&display=swap');
@import url('https://fonts.googleapis.com/css2?family=Roboto:wght@100;300;400;500;700;900&display=swap');


/* ==============================================
setting
============================================== */

html {
font-size: calc(100vw * 1 / 375);
line-height: calc(100vw * 1 / 375);
}
@media screen and (min-width:1000px) {
html {
font-size: 1.2px;
line-height: 1.2px;
}
}
* {
font-family:"Roboto","Noto Sans JP";
font-size: 13rem;
line-height: 24rem;
letter-spacing: 0.5rem;
font-weight:400;
color:#222222;
margin:0;
padding:0;
box-sizing: border-box;
}
img {
border:none;
vertical-align:middle;
width: 100%;
height: auto;
}
ul {
list-style:none;
}
ul:after {
content:".";
clear:both;
height:0;
display:block;
visibility:hidden;
}
a {
text-decoration:none;
transition: 0.2s ease-out;
}
a:hover{
opacity: 0.7;
}



/* ==============================================
body
============================================== */

body{
overflow-x: hidden;
}



/* ==============================================
header
============================================== */

header{
}
@media screen and (min-width:1000px) {
header{
position: fixed;
top:0;
left: 0;
width: calc(100% - 750px);
height: 100%;
background: #fff;
border-right: 1px solid rgba(0,0,0,0.1);
}
}
@media screen and (min-width:1400px) {
header{
width: calc(50% - 375px);
}
}
header .logo{
position: absolute;
top:16rem;
left: 15rem;
z-index: 100;
}
header .logo a{
display: block;
background: url("../images/cmn_hdr_lg_s.png") no-repeat;
background-size: 238rem 25rem;
width: 238rem;
height: 25rem;
}
@media screen and (min-width:1000px) {
header .logo{
position: absolute;
top:28rem;
left: 24rem;
z-index: 1000;
}
header .logo a{
display: block;
background: url("../images/cmn_hdr_lg_l.png") no-repeat;
background-size: 190rem 151rem;
width: 190rem;
height: 151rem;
}
}




header nav{
position: fixed;
bottom: 0;
left: 0;
width: 100%;
height: 60rem;
border-radius: 12rem 12rem 0 0;
background: linear-gradient(90deg, #1eb496 0%, #1eb45a 100%);
filter: drop-shadow(0 -2rem 2rem rgba(0,0,0,0.2));
z-index: 10000;
}
@media screen and (min-width:1000px) {
header nav{
display: none;
}
}
header nav ul{
}
header nav ul li{
float: left;
width: 20%;
}
header nav ul li a{
font-size: 12rem;
line-height: 20rem;
color: #fff;
display: block;
height: 60rem;
text-align: center;
padding: 9rem 0 0 0;
}
header nav ul li a img{
width: auto;
height: 22rem;
display: block;
margin: 0 auto 2rem auto;
}



header #site-map{
position: fixed;
bottom:-100%;
left: 0;
width: 100%;
height: 100%;
background: rgba(255,255,255,0.95);
backdrop-filter: blur(12rem);
z-index: 1000;
}
header #site-map.on{
bottom:0;
}
@media screen and (min-width:1000px) {
header #site-map{
position: absolute;
bottom:0;
height: auto;
z-index: 100;
}
}
header #site-map div{
height: 100%;
overflow-x: auto;
padding: 0 0 0 30rem;
}
@media screen and (min-width:1000px) {
header #site-map div{
overflow-x: inherit;
padding: 0 30rem 30rem 30rem;
}
}
header #site-map h2{
padding: 30rem 0 0 0;
}
@media screen and (min-width:1000px) {
header #site-map h2{
display: none;
}
}
header #site-map h2 a{
display: block;
width: 238rem;
height: 25rem;
}
header #site-map .sns{
border: none;
margin: 25rem 0 0 -2rem;
}
@media screen and (min-width:1400px) {
header #site-map .sns{
display: none;
}
}
header #site-map .sns li{
display: inline-block;
margin: 0 4rem 0 0;
}
header #site-map .sns li a{
height: 32rem;
border: none;
padding: 0;
}
header #site-map .sns li a img{
width: 32rem;
border-radius: 16rem;
}
header #site-map ul{
margin: 30rem 0 0 0;
border-bottom: 1px solid rgba(0,0,0,0.1);
}
@media screen and (min-width:1000px) {
header #site-map ul{
border-bottom: none;
margin: 20rem 0 0 0;
}
}
header #site-map ul li{
}
header #site-map ul li a{
font-size: 14rem;
height: 44rem;
display: block;
border-top: 1px solid rgba(0,0,0,0.1);
padding: 10rem 0 0 0;
}
@media screen and (min-width:1000px) {
header #site-map ul li a{
font-size: 12rem;
height: auto;
border-top: none;
padding: 0;
}
}
header #site-map ul li ul{
padding: 0 0 18rem 0;
margin: 0;
border-bottom: none;
}
@media screen and (min-width:1000px) {
header #site-map ul li ul{
padding: 0 0 4rem 0;
}
}
header #site-map ul li ul li{
}
@media screen and (min-width:1000px) {
header #site-map ul li ul li{
float: left;
margin: 0 8rem 0 0;
}
}
header #site-map ul li ul li a{
font-size: 13rem;
height: 30rem;
display: block;
border-top: none;
padding: 4rem 0 0 14rem;
position: relative;
}
@media screen and (min-width:1000px) {
header #site-map ul li ul li a{
font-size: 11rem;
line-height: 20rem;
height: auto;
padding: 0 0 0 12rem;
}
}
header #site-map ul li ul li a::before{
content: "";
width: 3rem;
height: 3rem;
border-radius: 2rem;
background: #222;
position: absolute;
top:13rem;
left: 5rem;
}
@media screen and (min-width:1000px) {
header #site-map ul li ul li a::before{
top:8rem;
}
}
header #site-map .button{
padding: 30rem 160rem 92rem 0;
}
@media screen and (min-width:1000px) {
header #site-map .button{
display: none;
}
}



header #site-map .badge{
position: fixed;
bottom: 76rem;
right: 16rem;
display: none;
}
header #site-map.on .badge{
display: block;
}
header #site-map .badge a{
font-size: 20rem;
line-height: 24rem;
font-weight: 300;
display: block;
width: 120rem;
height: 120rem;
border-radius: 60rem;
text-align: center;
color: #fff;
padding: 47rem 0 0 0;
background: linear-gradient(90deg, #f05064 0%, #f05aa0 100%);
filter: drop-shadow(0 2rem 2rem rgba(0,0,0,0.2));
}
header #site-map .badge a span{
font-size: 30rem;
line-height: 30rem;
font-weight: 300;
color: #fff;
display: block;
}
header #site-map .badge a img{
position: absolute;
top:0;
left: 0;
-webkit-transform: rotate(0deg);
animation: badge 20.0s linear 0s infinite normal forwards;
}
@keyframes badge {
0% {-webkit-transform: rotate(0deg);}
25% {-webkit-transform: rotate(90deg);}
50% {-webkit-transform: rotate(180deg);}
75% {-webkit-transform: rotate(270deg);}
100% {-webkit-transform: rotate(360deg);}
}



header #site-map .close{
position: fixed;
top:19rem;
right: 19rem;
width: 44rem;
height: 44rem;
opacity: 0.4;
cursor: pointer;
display: none;
}
header #site-map.on .close{
display: block;
}
header #site-map .close::before{
content: "";
width: 30rem;
height: 1rem;
background: #222;
transform: rotate(-45deg);
position: absolute;
top:0;
bottom: 0;
left: 0;
right: 0;
margin: auto;
}
header #site-map .close::after{
content: "";
width: 30rem;
height: 1rem;
background: #222;
transform: rotate(45deg);
position: absolute;
top:0;
bottom: 0;
left: 0;
right: 0;
margin: auto;
}



/* ==============================================
footer
============================================== */

footer{
position: relative;
padding: 0 0 50rem 0;
margin: 0 0 48rem 0;
z-index: 100;
}
@media screen and (min-width:1000px) {
footer{
width: 750px;
padding: 0 0 80rem 0;
margin: 0;
margin-left: calc(100% - 750px);
}
}
@media screen and (min-width:1400px) {
footer{
position: fixed;
top:0;
right: 0;
width: calc(50% - 375px);
height: 100%;
display: table;
}
}
footer div{
}
@media screen and (min-width:1400px) {
footer div{
display: table-cell;
vertical-align: middle;
}
}
footer h2{
font-size: 18rem;
text-align: center;
padding: 80rem 0 0 0;
}
@media screen and (min-width:1400px) {
footer h2{
display: none;
}
}
footer h2 img{
width: auto;
height: 40rem;
}
footer h2 span{
font-size: 12rem;
line-height: 20rem;
font-weight: 500;
display: block;
padding: 15rem 0 0 0;
}
footer figure{
position: absolute;
top:0;
left: 0;
width: 100%;
height: 100%;
z-index: -1;
}
footer figure img{
width: 100%;
height: 100%;
object-fit: cover;
}
footer h3{
font-size: 14rem;
line-height: 20rem;
font-weight: 700;
text-align: center;
padding: 50rem 0 0 0;
}
@media screen and (min-width:1400px) {
footer h3{
padding: 0;
}
}
footer .contact{
font-size: 16rem;
line-height: 16rem;
text-align: center;
padding: 5rem 0 0 0;
}
footer .contact a{
font-weight: 500;
letter-spacing: 1rem;
}
footer .contact span a{
font-size: 30rem;
line-height: 30rem;
letter-spacing: 0.5rem;
font-weight: 300;
display: none;
}
footer .button{
width: 190rem;
margin: auto;
padding: 15rem 0 0 0;
}
footer .button + .button{
padding: 10rem 0 0 0;
}
footer .button a{
}
footer ul{
text-align: center;
margin: 24rem 0 0 0;
}
footer ul li{
display: inline-block;
margin: 0 4rem;
}
footer ul li a{
display: block;
}
footer ul li a img{
width: 44rem;
border-radius: 22rem;
}
footer .badge{
position: fixed;
bottom: 30rem;
right: 26rem;
display: none;
}
@media screen and (min-width:1400px) {
footer .badge{
display: block;
}
}
footer .badge a{
font-size: 20rem;
line-height: 24rem;
font-weight: 300;
display: block;
width: 120rem;
height: 120rem;
border-radius: 60rem;
text-align: center;
color: #fff;
padding: 47rem 0 0 0;
background: linear-gradient(90deg, #f05064 0%, #f05aa0 100%);
filter: drop-shadow(0 2rem 2rem rgba(0,0,0,0.2));
}
footer .badge a span{
font-size: 30rem;
line-height: 30rem;
font-weight: 300;
color: #fff;
display: block;
}
footer .badge a img{
position: absolute;
top:0;
left: 0;
animation: badge 20.0s linear 0s infinite normal forwards;
}
footer .copy{
font-size: 10rem;
line-height: 15rem;
text-align: center;
padding: 22rem 0 0 0;
}
@media screen and (min-width:1400px) {
footer .copy{
font-size: 8rem;
letter-spacing: 0;
}
}



/* ==============================================
main
============================================== */

main{
}
@media screen and (min-width:1000px) {
main{
margin-left: calc(100% - 750px);
width: 750px;
}
}
@media screen and (min-width:1400px) {
main{
margin-left: calc(50% - 375px);
width: 750px;
}
}
article{
background: #fff;
}



#visual{
position: fixed;
top:0;
right: 0;
width: 100%;
height: 100%;
z-index: -1;
}
@media screen and (min-width:1000px) {
#visual{
width: 750px;
}
}
@media screen and (min-width:1400px) {
#visual{
left: 0;
margin: auto;
}
}
#visual img{
width: 100%;
}
@media screen and (min-width:1000px) {
#visual img{
width: 100%;
height: 100%;
object-fit: cover;
object-position: bottom;
}
}



.cover{
min-height: 640rem;
}



#title{
}
#title .inner{
padding: 0 30rem 60rem 30rem;
}
#title .inner h1{
font-size: 30rem;
line-height: 40rem;
letter-spacing: 4rem;
font-weight: 300;
text-align: center;
padding: 100rem 0 0 0;
}
@media screen and (min-width:1000px) {
#title .inner h1{
padding: 70rem 0 0 0;
}
}
#title .inner h1 span{
display: block;
font-size: 12rem;
line-height: 20rem;
font-weight: 700;
text-align: center;
}
#title .inner p{
text-align: justify;
padding: 30rem 0 0 0;
}
#title .inner .note{
font-size: 11rem;
line-height: 16rem;
padding: 5rem 0 0 0;
}
#title .inner .note a{
font-size: 11rem;
line-height: 16rem;
color: #1eb478;
}
#title .inner .center{
text-align: center;
}



#menu{
backdrop-filter: blur(12rem);
margin: -90rem 0 0 0;
}
#menu .inner{
}
#menu .inner ul{
}
#menu .inner ul li{
padding: 1px 0 0 0;
}
#menu .inner ul li:first-child{
padding: 0;
}
#menu .inner ul li a{
display: block;
font-size: 14rem;
line-height: 20rem;
height: 60rem;
position: relative;
background: rgba(255,255,255,0.8);
padding: 20rem 56rem 0 30rem;
}
#menu .inner ul li:last-child a{
height: 100rem;
}
#menu .inner ul li a span{
font-size: 12rem;
line-height: 20rem;
}
#menu .inner ul li a::after{
content: "";
background: url("../images/cmn_arw_black.png") no-repeat;
background-size: 6rem 12rem;
width: 6rem;
height: 12rem;
position: absolute;
top:23rem;
right: 30rem;
margin: auto;
transform: rotate(90deg);
}



.button a{
font-size: 14rem;
line-height: 20rem;
text-align: center;
display: block;
height: 44rem;
border-radius: 4rem;
padding: 11rem 0 0 0;
background: #fff;
border: solid 1px #50b478;
filter: drop-shadow(0 2rem 2rem rgba(0,0,0,0.2));
}
.button a::after{
content: "";
display: inline-block;
background: url("../images/cmn_arw_black.png") no-repeat;
background-size: 6rem 12rem;
width: 6rem;
height: 12rem;
vertical-align: middle;
margin: -3rem 0 0 8rem;
}
.button.green a{
background: linear-gradient(90deg, #1eb496 0%, #1eb45a 100%);
border: none;
color: #fff;
}
.button.green a::after{
background: url("../images/cmn_arw_white.png") no-repeat;
background-size: 6rem 12rem;
}



.slider{
padding: 0 0 40rem 0;
overflow: hidden;
}
.slider div {
cursor: pointer;
}
.slick-slider {
position: relative;
display: block;
box-sizing: border-box;
-webkit-user-select: none;
-moz-user-select: none;
-ms-user-select: none;
user-select: none;
-webkit-touch-callout: none;
-khtml-user-select: none;
-ms-touch-action: pan-y;
touch-action: pan-y;
-webkit-tap-highlight-color: transparent;
border: none!important;
border-radius: 0!important;
}
.slick-slide {
float: left;
height: 232rem;
margin: 0 10rem;
}
@media screen and (min-width:1000px) {
.slick-slide {
height: 400rem;
}
}
.slick-slide img {
width: 100%;
height: 100%;
object-fit: cover;
border-radius: 4rem;
filter: drop-shadow(0 2rem 2rem rgba(0,0,0,0.2));
}
.slick-prev,
.slick-next {
display: none!important;
}
.slick-dots {
position: absolute;
bottom: 0;
display: block;
width: 100%;
padding: 0;
text-align: center;
}
.slick-dots li {
position: relative;
display: inline-block;
width: 16rem;
height: 16rem;
}
.slick-dots li button {
display: block;
width: 6rem;
height: 6rem;
cursor: pointer;
color: transparent;
border: 0;
outline: none;
background: transparent;
}
.slick-dots li button:before {
position: absolute;
top: 0;
left: 0;
right: 0;
margin: auto;
width: 6rem;
height: 6rem;
background: #1eb478;
border-radius: 3rem;
content: ' ';
}
.slick-dots li.slick-active button:before {
background-color: #222222;
}



/* ==============================================
#page-top
============================================== */

#page-top header .logo{
position: absolute;
top:20rem;
left: 14rem;
}
@media screen and (min-width:1000px) {
#page-top header .logo{
top:28rem;
left: 24rem;
}
}
#page-top header .logo a{
display: block;
background: url("../images/cmn_hdr_lg_l.png") no-repeat;
background-size: 190rem 151rem;
width: 190rem;
height: 151rem;
}



@media screen and (min-width:1000px) {
#page-top #visual img{
object-position: top;
}
}



#page-top #hero{
position: relative;
}
#page-top #hero .inner{
}
#page-top #hero .inner h2{
font-size: 24rem;
line-height: 32rem;
font-weight: 300;
letter-spacing: 4rem;
position: absolute;
bottom: 320rem;
left: 20rem;
}
@media screen and (min-width:1000px) {
#page-top #hero .inner h2{
font-size: 40rem;
line-height: 55rem;
bottom: 300rem;
left: 30rem;
}
}
#page-top #hero .inner h2 span{
font-size: 12rem;
line-height: 20rem;
letter-spacing: 2rem;
font-weight: 700;
color: #1eb478;
display: block;
padding: 0 0 2rem 0;
}
@media screen and (min-width:1000px) {
#page-top #hero .inner h2 span{
font-size: 16rem;
padding: 0 0 5rem 0;
}
}
#page-top #hero .inner ul{
position: absolute;
bottom: 120rem;
left: 20rem;
}
@media screen and (min-width:1000px) {
#page-top #hero .inner ul{
bottom: 82rem;
left: 30rem;
}
}
#page-top #hero .inner ul li{
margin: 10rem 0 0 0;
}
#page-top #hero .inner ul li a{
font-size: 14rem;
line-height: 18rem;
font-weight: 500;
position: relative;
padding: 0 0 0 24rem;
display:block; 
}
#page-top #hero .inner ul li a span{
font-size: 12rem;
line-height: 16rem;
font-weight: 500;
color: #1eb478;
display: block;
}
#page-top #hero .inner ul li a span::after{
content: "";
width: 11rem;
height: 11rem;
border-radius: 6rem;
background: #1eb478 url("../../images/tp_hr_arw.png") top 3rem left 4rem no-repeat;
background-size: 4rem 5rem;
display: inline-block;
vertical-align: middle;
margin: -3rem 0 0 2rem;
}
#page-top #hero .inner ul li a img{
width: auto;
height: 14rem;
position: absolute;
top:2rem;
left: 0;
}
#page-top #hero .inner .scroll{
position: absolute;
bottom: 78rem;
left: 24rem;
}
@media screen and (min-width:1000px) {
#page-top #hero .inner .scroll{
bottom: 30rem;
left: 34rem;
}
}
#page-top #hero .inner .scroll a{
font-size: 12rem;
line-height: 20rem;
display: block;
height: 27rem;
padding: 2rem 0 0 12rem;
}
#page-top #hero .inner .scroll a::before{
content: "";
width: 1px;
height: 27rem;
background: #222;
position: absolute;
top:0;
left: 0;
opacity: 0.2;
}
#page-top #hero .inner .scroll a span{
display: block;
width: 7rem;
height: 7rem;
border-radius: 3.5rem;
background: #1eb45a;
position: absolute;
left: -3rem;
animation: scroll 1.0s ease 0s infinite normal both;
}
@keyframes scroll {
0% {top:0; opacity: 1;}
100% {top:20rem; opacity: 0;}
}
#page-top #hero .inner .badge{
position: absolute;
bottom: 76rem;
right: 16rem;
}
@media screen and (min-width:1000px) {
#page-top #hero .inner .badge{
display: none;
}
}
#page-top #hero .inner .badge a{
font-size: 20rem;
line-height: 24rem;
font-weight: 300;
display: block;
width: 120rem;
height: 120rem;
border-radius: 60rem;
text-align: center;
color: #fff;
padding: 47rem 0 0 0;
background: linear-gradient(90deg, #f05064 0%, #f05aa0 100%);
filter: drop-shadow(0 2rem 2rem rgba(0,0,0,0.2));
}
#page-top #hero .inner .badge a span{
font-size: 30rem;
line-height: 30rem;
font-weight: 300;
color: #fff;
display: block;
}
#page-top #hero .inner .badge a img{
position: absolute;
top:0;
left: 0;
-webkit-transform: rotate(0deg);
animation: badge 20.0s linear 0s infinite normal forwards;
}



#page-top #information{
backdrop-filter: blur(12rem);
}
#page-top #information .inner{
}
#page-top #information .inner h2{
font-size: 20rem;
line-height: 20rem;
font-weight: 400;
padding: 16rem 0 16rem 10rem;
background: rgba(255,255,255,0.8);
}
#page-top #information .inner h2 img{
width: auto;
height: 16rem;
display: inline-block;
vertical-align: middle;
margin: -3rem 4rem 0 0;
}
#page-top #information .inner h2 + ul{
}
#page-top #information .inner h2 + ul li{
font-size: 13rem;
line-height: 17rem;
background: rgba(255,255,255,0.8);
margin: 1px 0 0 0;
padding: 8rem 30rem 10rem 30rem;
}
#page-top #information .inner h2 + ul li span{
font-size: 12rem;
line-height: 20rem;
font-weight: 700;
display: block;
}
#page-top #information .inner h2 + ul li strong{
font-size: 13rem;
line-height: 17rem;
color: #f02850;
}
#page-top #information .inner h2 + ul li a{
font-size: 13rem;
line-height: 17rem;
text-decoration: underline;
}
#page-top #information .inner h2 + ul li a:first-child{
position: relative;
text-decoration: none;
display: block;
margin: -8rem -30rem -10rem -30rem;
padding: 8rem 30rem 10rem 30rem;
}
#page-top #information .inner h2 + ul li a:first-child::after{
content: "";
background: url("../images/cmn_arw_black.png") no-repeat;
background-size: 6rem 12rem;
width: 6rem;
height: 12rem;
position: absolute;
top:0;
bottom: 2rem;
right: 20rem;
margin: auto;
}
#page-top #information .inner .link{
background: rgba(255,255,255,0.8);
text-align: right;
margin: 1px 0 0 0;
}
#page-top #information .inner .link a{
position: relative;
display: inline-block;
height: 44rem;
padding: 8rem 40rem 0 20rem;
}
#page-top #information .inner .link a::before{
content: "";
width: 87rem;
height: 1px;
background: #222;
position: absolute;
bottom:18rem;
right: 20rem;
}
#page-top #information .inner .link a::after{
content: "";
width: 8rem;
height: 1px;
background: #222;
position: absolute;
bottom:21rem;
right: 20rem;
transform: rotate(45deg);
}
#page-top #information .inner .banner{
background: rgba(255,255,255,0.8);
padding: 2rem 30rem 32rem 30rem;
}
#page-top #information .inner .banner li{
margin: 8rem 0 0 0;
}
#page-top #information .inner .banner li a{
display: block;
}
#page-top #information .inner .banner li a img{
border-radius: 4rem;
filter: drop-shadow(0 2rem 2rem rgba(0,0,0,0.2));
}



#page-top #feature{
position: relative;
z-index: 100;
}
#page-top #feature .inner{
padding: 0 30rem 140rem 30rem;
}
@media screen and (min-width:1000px) {
#page-top #feature .inner{
padding: 0 30rem 280rem 30rem;
}
}
#page-top #feature .inner h2{
font-size: 30rem;
line-height: 40rem;
font-weight: 300;
padding: 55rem 0 0 0;
color: #fff;
}
#page-top #feature .inner p{
text-align: justify;
padding: 20rem 0 0 0;
color: #fff;
}
#page-top #feature .inner figure{
position: absolute;
top:0;
left: 0;
width: 100%;
height: 100%;
z-index: -1;
}
#page-top #feature .inner figure img{
width: 100%;
height: 100%;
object-fit: cover;
}
@media screen and (min-width:1000px) {
#page-top #feature .inner figure img{
object-position: bottom;
}
}
#page-top #feature .inner .button{
padding: 30rem 0 0 0;
}



#page-top #about{
position: relative;
z-index: 100;
}
#page-top #about .inner{
padding: 0 30rem 280rem 30rem;
}
@media screen and (min-width:1000px) {
#page-top #about .inner{
padding: 0 30rem 320rem 30rem;
}
}
#page-top #about .inner h2{
font-size: 28rem;
line-height: 40rem;
font-weight: 300;
padding: 55rem 0 0 0;
}
#page-top #about .inner p{
text-align: justify;
padding: 20rem 0 0 0;
}
#page-top #about .inner figure{
position: absolute;
top:0;
left: 0;
width: 100%;
height: 100%;
z-index: -1;
}
#page-top #about .inner figure img{
width: 100%;
height: 100%;
object-fit: cover;
}
@media screen and (min-width:1000px) {
#page-top #about .inner figure img{
object-position: bottom;
}
}
#page-top #about .inner .button{
padding: 30rem 0 0 0;
}



#page-top #work{
background: linear-gradient(90deg, #1eb496 0%, #1eb45a 100%);
}
#page-top #work .inner{
}
#page-top #work .inner:after {
content:".";
clear:both;
height:0;
display:block;
visibility:hidden;
}
#page-top #work .inner div{
float: left;
width: 50%;
position: relative;
z-index: 1;
padding: 0 20rem 24rem 20rem;
}
#page-top #work .inner div + div{
border-left: 1px solid rgba(255,255,255,0.2);
}
#page-top #work .inner div h2{
font-size: 20rem;
line-height: 30rem;
letter-spacing: 4rem;
font-weight: 300;
color: #fff;
text-align: center;
padding: 25rem 0 0 0;
}
#page-top #work .inner div h2 span{
font-size: 11rem;
line-height: 15rem;
letter-spacing: 1.6rem;
color: #fff;
font-weight: 300;
display: block;
}
#page-top #work .inner div .button{
margin: 25rem 0 0 0;
}



#page-top #access{
position: relative;
background: #f5f5f5;
}
#page-top #access .inner{
padding: 0 30rem 60rem 30rem;
}
#page-top #access .inner h2{
font-size: 30rem;
line-height: 40rem;
font-weight: 300;
padding: 55rem 0 0 0;
}
#page-top #access .inner p{
text-align: justify;
padding: 15rem 0 0 0;
}
#page-top #access .inner p strong{
font-weight: 700;
}
#page-top #access .inner .map{
margin: 35rem 0 0 0;
border: solid 1px #ddd;
border-radius: 4rem;
overflow: hidden;
}
#page-top #access .inner .map iframe{
width: 100%;
height: 360rem;
vertical-align: top;
}
#page-top #access .inner .button{
padding: 30rem 0 0 0;
}



/* ==============================================
#page-education
============================================== */

#page-education #hero{
}
#page-education #hero .inner{
}
#page-education #hero .inner h1{
font-size: 30rem;
line-height: 45rem;
letter-spacing: 4rem;
font-weight: 300;
text-align: center;
padding: 90rem 0 0 0;
}
#page-education #hero .inner h1 img{
width: auto;
height: 41rem;
display: block;
margin: 0 auto 15rem auto;
}
#page-education #hero .inner h1 span{
font-size: 16rem;
line-height: 20rem;
letter-spacing: 4rem;
margin: 15rem auto 0 auto;
padding: 9rem 0 0 0;
font-weight: 500;
display: block;
width: 200rem;
height: 40rem;
border-radius: 4rem;
border: solid 1px #222;
}



#page-education #concept{
position: relative;
z-index: 100;
background: linear-gradient(90deg, #1eb496 0%, #1eb45a 100%);
border-radius: 40rem 40rem 0 0;
margin: -40rem 0 0 0;
padding: 0 0 95rem 0;
}
#page-education #concept .inner{
}
#page-education #concept .inner h2{
font-size: 18rem;
font-weight: 500;
color: #fff;
text-align: center;
padding: 55rem 0 0 0;
}
#page-education #concept .inner p{
color: #fff;
text-align: center;
padding: 15rem 0 0 0;
}



#page-education #ycu-n{
position: relative;
z-index: 100;
background: #fff;
border-radius: 40rem 40rem 0 0;
margin: -40rem 0 0 0;
}
#page-education #ycu-n .inner{
padding: 0 30rem 100rem 30rem;
}
#page-education #ycu-n .inner h2{
text-align: center;
padding: 60rem 0 0 0;
}
#page-education #ycu-n .inner h2 img{
width: auto;
height: 30rem;
}
#page-education #ycu-n .inner p{
text-align: center;
padding: 30rem 0 0 0;
margin: 0 -30rem;
}
#page-education #ycu-n .inner figure{
padding: 30rem 0 0 0;
margin: 0 -30rem;
}
#page-education #ycu-n .inner figure img{
}
#page-education #ycu-n .inner h3{
font-size: 18rem;
font-weight: 500;
letter-spacing: 1rem;
text-align: center;
border-top: 1px solid #1eb478;
border-bottom: 1px solid #1eb478;
margin: 40rem 0 0 0;
padding: 12rem 0 12rem 0;
}
#page-education #ycu-n .inner h4{
font-size: 14rem;
line-height: 20rem;
font-weight: 500;
position: relative;
margin: 35rem 0 0 0;
padding: 0 0 0 28rem;
}
#page-education #ycu-n .inner h4 img{
position: absolute;
top:1rem;
left: -2rem;
width: auto;
height: 36rem;
}
#page-education #ycu-n .inner ul{
padding: 5rem 0 0 0;
}
#page-education #ycu-n .inner ul li{
font-size: 12rem;
line-height: 16rem;
position: relative;
padding: 1rem 0 0 28rem;
margin: 8rem 0 0 0;
}
#page-education #ycu-n .inner ul li span{
font-size: 12rem;
line-height: 20rem;
letter-spacing: 0;
text-align: center;
color: #fff;
position: absolute;
top:0;
left: 0;
width: 20rem;
height: 20rem;
border-radius: 10rem;
background: linear-gradient(90deg, #1eb496 0%, #1eb45a 100%);
}



#page-education #pns{
position: relative;
z-index: 100;
background: linear-gradient(90deg, #e6e6ee 0%, #ded9df 50%, #e1dfe4 100%);
border-radius: 40rem 40rem 0 0;
margin: -40rem 0 0 0;
}
#page-education #pns .inner{
padding: 0 30rem 100rem 30rem;
}
#page-education #pns .inner h2{
font-size: 30rem;
line-height: 40rem;
letter-spacing: 4rem;
font-weight: 300;
text-align: center;
padding: 50rem 0 0 0;
}
#page-education #pns .inner p{
text-align: justify;
padding: 25rem 0 0 0;
}
#page-education #pns .inner .note{
font-size: 10rem;
line-height: 15rem;
text-align: right;
padding: 10rem 0 0 0;
}
#page-education #pns .inner figure{
margin: 0 -30rem;
padding: 35rem 0 0 0;
}
#page-education #pns .inner figure img{
}
#page-education #pns .inner .slider{
margin: 0 -30rem;
}
#page-education #pns .inner h3{
font-size: 18rem;
font-weight: 500;
padding: 30rem 0 0 0;
}
#page-education #pns .inner h3 + p{
padding: 10rem 0 0 0;
}



#page-education #program{
position: relative;
z-index: 100;
background: linear-gradient(90deg, #1eb496 0%, #1eb45a 100%);
border-radius: 40rem 40rem 0 0;
margin: -40rem 0 0 0;
}
#page-education #program .inner{
padding: 0 0 11rem 0;
}
#page-education #program .inner h2{
font-size: 30rem;
line-height: 40rem;
letter-spacing: 4rem;
font-weight: 300;
color: #fff;
text-align: center;
padding: 55rem 0 0 0;
}
#page-education #program .inner h3{
font-size: 16rem;
font-weight: 500;
letter-spacing: 1rem;
text-align: center;
color: #fff;
padding: 30rem 0 0 0;
}
#page-education #program .inner .list{
padding: 15rem 0 0 10rem;
}
#page-education #program .inner .list div{
background: #fff;
border-radius: 20rem 0 0 20rem;
margin: 10rem 0 0 0;
position: relative;
}
#page-education #program .inner .list div::after{
content: "";
width: 1px;
height: 10rem;
position: absolute;
top:-10rem;
left: 64rem;
background: #fff;
}
#page-education #program .inner .list div:first-child::after{
display: none;
}
#page-education #program .inner .list div h4{
font-size: 12rem;
line-height: 20rem;
color: #1eb478;
position: absolute;
top:24rem;
left: 0;
text-align: right;
width: 54rem;
}
#page-education #program .inner .list div h4 span{
font-size: 30rem;
font-weight: 300;
letter-spacing: -3rem;
color: #1eb478;
display: inline-block;
vertical-align: middle;
margin: -2rem 6rem 0 0;
}
#page-education #program .inner .list div ul{
padding: 20rem 20rem 25rem 60rem;
}
#page-education #program .inner .list div ul li{
font-size: 14rem;
line-height: 18rem;
position: relative;
padding: 0 0 0 12rem;
margin: 5rem 0 0 0;
}
#page-education #program .inner .list div ul li::before{
content: "";
width: 8rem;
height: 8rem;
border-radius: 4rem;
background: #1eb478;
position: absolute;
top:4rem;
left: 0;
}
#page-education #program .inner .list .note{
font-size: 10rem;
line-height: 15rem;
color: #fff;
text-align: right;
padding: 10rem 5rem 0 0;
}
#page-education #program .inner .slider{
margin: 40rem 0 0 0;
}
#page-education #program .inner .slider .slick-dots li button:before {
background: #fff;
}
#page-education #program .inner .slider .slick-dots li.slick-active button:before {
background-color: #222;
}
#page-education #program .inner .program{
background: #fff;
margin: 12rem 10rem 0 10rem;
padding: 0 20rem 20rem 20rem;
}
#page-education #program .inner .program h3{
font-size: 18rem;
font-weight: 500;
color: #222;
padding: 25rem 0 0 0;
}
#page-education #program .inner .program h3 span{
font-size: 12rem;
font-weight: 700;
display: block;
color: #1eb478;
}
#page-education #program .inner .program p{
text-align: justify;
padding: 10rem 0 0 0;
}
#page-education #program .inner .program ul{
border: solid 1px #1eb478;
border-top: none;
margin: 15rem 0 0 0;
}
#page-education #program .inner .program ul li{
line-height: 17rem;
border-top: solid 1px #1eb478;
padding: 6rem 10rem 10rem 10rem;
}
#page-education #program .inner .program ul li strong{
font-weight: 700;
display: block;
}
#page-education #program .inner .program .note{
text-align: right;
padding: 5rem 0 0 0;
}
#page-education #program .inner .program figure{
margin: 20rem -20rem -20rem -20rem;
}
#page-education #program .inner .program figure img{
}



/* ==============================================
#page-career
============================================== */

#page-career #hero{
}
#page-career #hero .inner{
}
#page-career #hero .inner h1{
font-size: 30rem;
line-height: 45rem;
letter-spacing: 4rem;
font-weight: 300;
text-align: center;
color: #fff;
padding: 90rem 0 0 0;
}
#page-career #hero .inner h1 img{
width: auto;
height: 41rem;
display: block;
margin: 0 auto 15rem auto;
}
#page-career #hero .inner h1 span{
font-size: 16rem;
line-height: 20rem;
letter-spacing: 4rem;
margin: 15rem auto 0 auto;
padding: 9rem 0 0 0;
color: #fff;
display: block;
width: 200rem;
height: 40rem;
border-radius: 4rem;
border: solid 1px #fff;
}



#page-career #support{
position: relative;
z-index: 100;
border-radius: 40rem 40rem 0 0;
margin: -40rem 0 0 0;
}
#page-career #support .inner{
padding: 0 30rem;
}
#page-career #support .inner h2{
font-size: 30rem;
line-height: 40rem;
letter-spacing: 2rem;
font-weight: 300;
padding: 55rem 0 0 0;
}
@media screen and (min-width:1000px) {
#page-career #support .inner h2{
padding: 95rem 0 0 0;
}
}
#page-career #support .inner p{
padding: 30rem 0 0 0;
}
#page-career #support .inner .button{
padding: 210rem 0 0 0;
}
@media screen and (min-width:1000px) {
#page-career #support .inner .button{
padding: 80rem 0 0 0;
width: 300rem;
}
}
#page-career #support .inner figure{
position: absolute;
top:0;
left: 0;
z-index: -1;
width: 100%;
}
#page-career #support .inner figure img{
border-radius: 40rem 40rem 0 0;
}



#page-career #interview{
background: #fff url("../../career/images/crr_itv_img_01.jpg") no-repeat;
background-size: 100% auto;
margin: -205rem 0 0 0;
}
@media screen and (min-width:1000px) {
#page-career #interview{
margin: 0;
}
}
#page-career #interview .inner{
padding: 0 0 95rem 0;
}
#page-career #interview .inner h2{
font-size: 28rem;
line-height: 40rem;
letter-spacing: 4rem;
font-weight: 300;
padding: 240rem 0 320rem 30rem;
color: #fff;
}
@media screen and (min-width:1000px) {
#page-career #interview .inner h2{
padding: 520rem 0 480rem 30rem;
}
}
#page-career #interview .inner h2 span{
font-size: 28rem;
line-height: 40rem;
letter-spacing: 4rem;
font-weight: 300;
color: #fff;
}
#page-career #interview .inner .interview{
background: #fff;
padding: 0 30rem 0 30rem;
}
#page-career #interview .inner .interview figure{
margin: 0 -30rem;
padding: 55rem 0 0 0;
}
#page-career #interview .inner .interview figure img{
}
#page-career #interview .inner .interview h3{
font-size: 20rem;
line-height: 30rem;
letter-spacing: 2rem;
font-weight: 300;
color: #fff;
text-align: center;
margin: 0 -30rem 10rem -30rem;
padding: 25rem 0 25rem 0;
background: linear-gradient(90deg, #1eb496 0%, #1eb45a 100%);
}
#page-career #interview .inner .interview h3 span{
font-size: 14rem;
letter-spacing: 2rem;
font-weight: 300;
color: #fff;
display: block;
padding: 5rem 0 0 0;
}
#page-career #interview .inner .interview p{
text-align: justify;
padding: 20rem 0 0 0;
}



#page-career #specialist{
position: relative;
z-index: 100;
background: linear-gradient(90deg, #1eb496 0%, #1eb45a 100%);
border-radius: 40rem 40rem 0 0;
margin: -40rem 0 0 0;
}
#page-career #specialist .inner{
padding: 0 30rem 60rem 30rem;
}
#page-career #specialist .inner h2{
font-size: 30rem;
line-height: 40rem;
letter-spacing: 4rem;
font-weight: 300;
text-align: center;
color: #fff;
padding: 55rem 0 0 0;
}
#page-career #specialist .inner .total{
font-size: 20rem;
line-height: 30rem;
width: 200rem;
height: 200rem;
border-radius: 100rem;
border: solid 8rem #3cfff0;
text-align: center;
color: #fff;
margin: 30rem auto 0 auto;
padding: 52rem 0 0 0;
}
#page-career #specialist .inner .total span{
font-size: 80rem;
line-height: 80rem;
font-weight: 300;
color: #fff;
display: inline-block;
vertical-align: middle;
margin: -2rem -4rem 0 4rem;
}
#page-career #specialist .inner p{
text-align: justify;
color: #fff;
padding: 25rem 0 0 0;
}
#page-career #specialist .inner .note{
font-size: 10rem;
line-height: 15rem;
text-align: right;
padding: 10rem 0 0 0;
}
#page-career #specialist .inner .specialist{
}
#page-career #specialist .inner .specialist h3{
font-size: 20rem;
line-height: 30rem;
letter-spacing: 4rem;
color: #fff;
text-align: center;
padding: 50rem 0 0 0;
}
#page-career #specialist .inner .specialist h3 img{
width: auto;
height: 12rem;
display: block;
margin: 5rem auto 0 auto;
}
#page-career #specialist .inner .specialist p{
color: #fff;
text-align: center;
padding: 15rem 0 0 0;
}
#page-career #specialist .inner .specialist p span{
font-size: 80rem;
line-height: 80rem;
font-weight: 300;
color: #fff;
margin: 0 2rem 0 4rem;
}
#page-career #specialist .inner .specialist ul{
padding: 15rem 0 0 0;
}
#page-career #specialist .inner .specialist ul li{
font-size: 14rem;
line-height: 20rem;
background: #fff;
border-radius: 8rem;
margin: 10rem 0 0 0;
position: relative;
padding: 10rem 60rem 9rem 10rem;
}
#page-career #specialist .inner .specialist ul li span{
font-size: 14rem;
line-height: 20rem;
color: #1eb478;
display: block;
height: 22rem;
position: absolute;
top:0;
bottom: 0;
right: 10rem;
margin: auto;
text-align: right;
}
#page-career #specialist .inner .specialist .note{
text-align: right;
}



/* ==============================================
#page-team
============================================== */

@media screen and (min-width:1000px) {
#page-team #visual img{
object-position: center;
}
}
#page-team #hero{
}
#page-team #hero .inner{
}
#page-team #hero .inner h1{
font-size: 30rem;
line-height: 45rem;
letter-spacing: 4rem;
font-weight: 300;
text-align: center;
color: #fff;
padding: 90rem 0 0 0;
}
#page-team #hero .inner h1 img{
width: auto;
height: 41rem;
display: block;
margin: 0 auto 15rem auto;
}
#page-team #hero .inner h1 span{
font-size: 16rem;
line-height: 20rem;
letter-spacing: 4rem;
margin: 15rem auto 0 auto;
padding: 9rem 0 0 0;
color: #fff;
display: block;
width: 200rem;
height: 40rem;
border-radius: 4rem;
border: solid 1px #fff;
}



#page-team article section{
margin: -40rem 0 0 0;
}
#page-team article section .inner{
padding: 0 0 80rem 0;
background: #fff;
}
#page-team article section:last-child .inner{
padding: 0 0 40rem 0;
}
#page-team article section .inner h2{
position: relative;
background: linear-gradient(90deg, #1eb496 0%, #1eb45a 100%);
border-radius: 40rem 40rem 0 0;
overflow: hidden;
text-align: center;
margin: 0 0 10rem 0;
}
#page-team article section .inner h2 span{
font-size: 30rem;
line-height: 40rem;
letter-spacing: 4rem;
font-weight: 300;
color: #fff;
position: relative;
z-index: 100;
display: block;
padding: 50rem 0 55rem 0;
}
#page-team article section .inner h2 small{
font-size: 14rem;
line-height: 20rem;
letter-spacing: 2rem;
display: block;
color: #fff;
padding: 5rem 0 5rem 0;
}
#page-team article section .inner h2 img{
position: absolute;
top:0;
left: 0;
width: 100%;
height: 100%;
opacity: 0.2;
object-fit: cover;
}
#page-team article section .inner p{
text-align: justify;
padding: 25rem 30rem 0 30rem;
}
#page-team article section .inner .slider{
margin: 35rem 0 0 0;
}



/* ==============================================
#page-feature
============================================== */

#page-feature #hero{
}
#page-feature #hero .inner{
}
#page-feature #hero .inner h1{
font-size: 30rem;
line-height: 45rem;
letter-spacing: 4rem;
font-weight: 300;
text-align: center;
color: #fff;
padding: 90rem 0 0 0;
}
#page-feature #hero .inner h1 img{
width: auto;
height: 42rem;
display: block;
margin: 0 auto 15rem auto;
}
#page-feature #hero .inner h1 span{
font-size: 16rem;
line-height: 20rem;
letter-spacing: 4rem;
margin: 15rem auto 0 auto;
padding: 9rem 0 0 0;
color: #fff;
display: block;
width: 290rem;
height: 40rem;
border-radius: 4rem;
border: solid 1px #fff;
}
#page-feature #hero .inner p{
color: #fff;
text-align: center;
padding: 25rem 0 0 0;
}



#page-feature article{
position: relative;
z-index: 100;
background: #fff;
border-radius: 40rem 40rem 0 0;
margin: -40rem 0 0 0;
padding: 0 0 55rem 0;
}
#page-feature .feature{
}
#page-feature .feature .inner{
}
#page-feature .feature .inner h2{
font-size: 30rem;
line-height: 40rem;
letter-spacing: 4rem;
font-weight: 300;
text-align: center;
padding: 70rem 0 0 0;
}
#page-feature #feature-01 .inner h2{
padding: 50rem 0 0 0;
}
#page-feature .feature .inner h2 span{
font-size: 14rem;
line-height: 20rem;
font-weight: 700;
letter-spacing: 2rem;
color: #1eb478;
display: block;
padding: 0 0 10rem 0;
}
#page-feature .feature .inner .slider{
margin: 30rem 0 0 0;
}
#page-feature .feature .inner p{
padding: 25rem 30rem 0 30rem;
text-align: justify;
}



/* ==============================================
#page-about
============================================== */

@media screen and (min-width:1000px) {
#page-about #visual img{
object-position: center;
}
}
#page-about #hero{
}
#page-about #hero .inner{
}
#page-about #hero .inner h1{
font-size: 30rem;
line-height: 45rem;
letter-spacing: 4rem;
font-weight: 300;
text-align: center;
padding: 90rem 0 0 0;
}
#page-about #hero .inner h1 img{
width: auto;
height: 42rem;
display: block;
margin: 0 auto 15rem auto;
}
#page-about #hero .inner h1 span{
font-size: 16rem;
line-height: 20rem;
letter-spacing: 4rem;
margin: 15rem auto 0 auto;
padding: 9rem 0 0 0;
display: block;
width: 260rem;
height: 40rem;
border-radius: 4rem;
border: solid 1px #222222;
}
#page-about #hero .inner p{
color: #fff;
text-align: center;
padding: 25rem 0 0 0;
}



#page-about #greeting{
position: relative;
z-index: 100;
margin: -40rem 0 0 0;
border-radius: 40rem 40rem 0 0;
background: #fff;
}
#page-about #greeting .inner{
padding: 0 30rem 0 30rem;
}
#page-about #greeting .inner h2{
font-size: 30rem;
line-height: 40rem;
font-weight: 300;
letter-spacing: 4rem;
text-align: center;
padding: 55rem 0 0 0;
}
#page-about #greeting .inner p{
text-align: justify;
padding: 30rem 0 0 0;
}
#page-about #greeting .inner p strong{
display: block;
font-weight: 500;
text-align: center;
padding: 20rem 0 0 0;
}
#page-about #greeting .inner figure{
padding: 30rem 0 0 0;
margin: 0 -30rem;
}
#page-about #greeting .inner figure img{
}



#page-about #graph{
position: relative;
z-index: 100;
margin: -40rem 0 0 0;
border-radius: 40rem 40rem 0 0;
background: url("../../about/images/abt_grp_bg.png");
background-size: 20rem 20rem;
}
@media screen and (min-width:1000px) {
#page-about #graph{
margin: -68rem 0 0 0;
}
}
#page-about #graph .inner{
padding: 0 30rem 100rem 30rem;
}
#page-about #graph .inner h2{
font-size: 24rem;
line-height: 36rem;
font-weight: 400;
letter-spacing: 4rem;
color: #1eb478;
text-align: center;
padding: 60rem 0 0 0;
}
#page-about #graph .inner h2 strong{
display: block;
font-size: 80rem;
line-height: 80rem;
font-weight: 100;
letter-spacing: 8rem;
padding: 0 0 4rem 6rem;
color: #1eb478;
}
#page-about #graph .inner p{
color: #1eb478;
text-align: center;
padding: 25rem 0 0 0;
}
#page-about #graph .inner figure{
padding: 35rem 0 0 0;
margin: 0 -30rem;
}
#page-about #graph .inner figure img{
}
#page-about #graph .inner .button{
padding: 35rem 0 0 0;
}



#page-about #specialist{
position: relative;
z-index: 100;
margin: -40rem 0 0 0;
border-radius: 40rem 40rem 0 0;
background: #fff;
}
#page-about #specialist .inner{
padding: 0 30rem 100rem 30rem;
}
#page-about #specialist .inner h2{
font-size: 30rem;
line-height: 40rem;
font-weight: 300;
letter-spacing: 4rem;
text-align: center;
padding: 55rem 0 0 0;
}
#page-about #specialist .inner p{
text-align: justify;
padding: 25rem 0 0 0;
}
#page-about #specialist .inner .image{
width: calc(100% + 60rem);
height: 246rem;
margin: 20rem -30rem 0 -30rem;
background: url("../../about/images/abt_spc_img.jpg") repeat-x 0 0;
background-size: auto 100%;
animation: specialist 60s linear infinite;
}
@keyframes specialist {
from { background-position: 1999rem 0; }
to { background-position: 0 0; }
}
#page-about #specialist .inner .button{
}
#page-about #specialist .inner .button a{
}



#page-about #specialist .inner #achievement{
}
#page-about #specialist .inner #achievement h3{
font-size: 20rem;
line-height: 30rem;
text-align: center;
padding: 35rem 0 0 0;
}
#page-about #specialist .inner #achievement p{
padding: 10rem 0 10rem 0;
}



#page-about #interview{
position: relative;
z-index: 100;
margin: -40rem 0 0 0;
border-radius: 40rem 40rem 0 0;
background: linear-gradient(90deg, #1eb496 0%, #1eb45a 100%);
}
#page-about #interview .inner{
}
#page-about #interview .inner h2{
font-size: 30rem;
line-height: 40rem;
font-weight: 300;
letter-spacing: 4rem;
text-align: center;
color: #fff;
padding: 55rem 0 55rem 0;
}
#page-about #interview .inner p{
color: #fff;
text-align: justify;
padding: 25rem 30rem 55rem 30rem;
}
#page-about #interview .inner .interview{
background: #fff;
padding: 0 30rem 60rem 30rem;
}
#page-about #interview .inner .interview h3{
font-size: 24rem;
line-height: 36rem;
font-weight: 300;
letter-spacing: 4rem;
background: linear-gradient(90deg, #1eb496 0%, #1eb45a 100%);
text-align: center;
color: #fff;
margin: 0 -30rem;
padding: 0 0 20rem 0;
}
#page-about #interview .inner .interview h3 span{
font-size: 14rem;
letter-spacing: 2rem;
font-weight: 300;
color: #fff;
display: block;
}
#page-about #interview .inner .interview h3 img{
margin: 0 0 20rem 0;
}
#page-about #interview .inner .interview h4{
font-size: 24rem;
line-height: 36rem;
font-weight: 300;
letter-spacing: 4rem;
padding: 35rem 0 0 0;
}
#page-about #interview .inner .interview p{
text-align: justify;
color: #222;
padding: 25rem 0 0 0;
}
#page-about #interview .inner .interview figure{
padding: 30rem 0 0 0;
}
#page-about #interview .inner .interview figure img{
}
#page-about #interview .inner .interview .slider{
margin: 30rem -30rem 0 -30rem;
}



/* ==============================================
#page-graph
============================================== */

#page-graph{
background: url("../../about/images/abt_grp_bg.png");
background-size: 20rem 20rem;
}



#page-graph #hero{
}
#page-graph #hero .inner{
}
#page-graph #hero .inner h1{
font-size: 24rem;
line-height: 36rem;
font-weight: 400;
letter-spacing: 4rem;
color: #1eb478;
text-align: center;
padding: 100rem 0 0 0;
}
#page-graph #hero .inner h1 strong{
display: block;
font-size: 80rem;
line-height: 80rem;
font-weight: 100;
letter-spacing: 8rem;
padding: 0 0 4rem 6rem;
color: #1eb478;
}
#page-graph #hero .inner p{
padding: 25rem 0 0 0;
color: #1eb478;
text-align: center;
}
#page-graph #hero .inner figure{
padding: 35rem 0 60rem 0;
}
#page-graph #hero .inner figure img{
}



#page-graph .graph{
}
#page-graph .graph .inner{
padding: 0 30rem 60rem 30rem;
}
#page-graph .graph .inner h2{
font-size: 24rem;
line-height: 36rem;
letter-spacing: 4rem;
font-weight: 300;
text-align: center;
color: #fff;
padding: 30rem 0 30rem 0;
border-radius: 20rem;
background: linear-gradient(90deg, #1eb496 0%, #1eb45a 100%);
}
#page-graph .graph .inner h2 span{
font-size: 16rem;
line-height: 20rem;
font-weight: 500;
display: block;
color: #fff;
padding: 0 0 8rem 0;
}
#page-graph .graph .inner h2 span img{
width: auto;
height: 28rem;
display: block;
margin: 0 auto 15rem auto;
}
#page-graph .graph .inner p{
padding: 25rem 0 0 0;
color: #1eb478;
}
#page-graph .graph .inner .note{
font-size: 11rem;
line-height: 16rem;
padding: 15rem 0 0 0;
}
#page-graph .graph .inner .note a{
font-size: 11rem;
line-height: 16rem;
text-decoration: underline;
}
#page-graph .graph .inner .character{
text-align:center;
padding: 10rem 0 0 0;
margin: 0 0 -20rem 0;
}
#page-graph .graph .inner .character img{
width: auto;
height: 70rem;
}



#page-graph .graph .inner div{
background: #fff;
border-radius: 20rem;
margin: 20rem 0 0 0;
padding: 0 20rem;
border: 1px solid #1eb478;
}
#page-graph .graph .inner div h3{
padding: 20rem 0 0 28rem;
font-weight: 700;
font-size: 15rem;
position: relative;
}
#page-graph .graph .inner div h3 img{
width: auto;
height: 20rem;
position: absolute;
top:21rem;
left: 0;
}
#page-graph .graph .inner div h4{
font-weight: 700;
font-size: 14rem;
}
#page-graph .graph .inner div p{
color: #222222;
font-size: 13rem;
line-height: 18rem;
font-weight: 500;
padding: 15rem 0 0 0;
}
#page-graph .graph .inner div ul{
padding: 10rem 0 20rem 0;
}
#page-graph .graph .inner div ul li{
line-height: 18rem;
text-indent: -18rem;
margin: 5rem 0 0 18rem;
}
#page-graph .graph .inner div figure{
padding: 20rem 0 0 0;
}



#page-graph .graph .inner div table{
border-collapse:collapse;
border-spacing:0;
border-bottom: 1px solid #1eb478;
width: calc(100% + 40rem);
margin: 20rem -20rem 0 -20rem;
}
#page-graph .graph .inner div table th{
border-top: 1px solid #1eb478;
color: #1eb478;
background: #e8f7f1;
font-weight: 500;
font-size: 13rem;
line-height: 18rem;
vertical-align: middle;
text-align: center;
padding: 10rem 0 8rem 0;
}
#page-graph .graph .inner div table td{
border-top: 1px solid #1eb478;
color: #1eb478;
font-size: 13rem;
line-height: 18rem;
font-weight: 500;
vertical-align: middle;
text-align: center;
padding: 10rem 0 8rem 0;
}
#page-graph .graph .inner div table th.left,
#page-graph .graph .inner div table td.left{
padding: 10rem 0 8rem 20rem;
}
#page-graph .graph .inner div table th.right,
#page-graph .graph .inner div table td.right{
padding: 10rem 20rem 8rem 0;
}
#page-graph .graph .inner div table th + th,
#page-graph .graph .inner div table td + td{
border-left: 1px solid #c0ead9;
}
#page-graph .graph .inner div table td span{
color: #1eb478;
font-size: 13rem;
line-height: 18rem;
font-weight: 500;
}
#page-graph .graph .inner div span.fs-s{
font-size: 16rem;
line-height: 16rem;
letter-spacing: -0.5rem;
font-weight: 400;
display: inline-block;
vertical-align: middle;
margin: -2rem 2rem 0 0;
}
#page-graph .graph .inner div span.fs-m{
font-size: 20rem;
line-height: 20rem;
letter-spacing: -0.5rem;
font-weight: 400;
display: inline-block;
vertical-align: middle;
margin: -4rem 2rem 0 0;
}
#page-graph .graph .inner div span.fs-l{
font-size: 30rem;
line-height: 30rem;
letter-spacing: -0.5rem;
font-weight: 400;
display: inline-block;
vertical-align: middle;
margin: -2rem 2rem 0 0;
}
#page-graph .graph .inner div span.fs-x{
font-size: 80rem;
line-height: 80rem;
letter-spacing: -0.5rem;
font-weight: 300;
display: inline-block;
vertical-align: middle;
margin: -2rem 2rem 0 0;
}
#page-graph .graph .inner div .center{
text-align: center;
}
#page-graph .graph .inner div .left{
text-align: left;
}
#page-graph .graph .inner div .right{
text-align: right;
}
#page-graph .graph .inner div .note{
text-align: right;
color: #1eb478;
font-size: 11rem;
line-height: 16rem;
padding: 8rem 0;
}



#page-graph .graph .inner #graph-01-01 p{
color: #1eb478;
}
#page-graph .graph .inner #graph-01-01 p span{
color: #1eb478;
}



/* ==============================================
#page-nurse
============================================== */

#page-nurse #list{
padding: 0 30rem 60rem 30rem;
}
#page-nurse #list h2{
font-size: 18rem;
line-height: 18rem;
font-weight: 500;
color: #fa96b4;
}
#page-nurse #list h2:nth-child(3){
color: #7ed9ed;
padding: 40rem 0 0 0;
}
#page-nurse #list ul{
margin: 20rem 0 0 0;
}
#page-nurse #list ul li{
}
#page-nurse #list #list-01{
border-top: solid 1px #fa96b4;
border-left: solid 1px #fa96b4;
}
#page-nurse #list #list-01 li{
border-right: solid 1px #fa96b4;
border-bottom: solid 1px #fa96b4;
}
#page-nurse #list #list-02{
border-top: solid 1px #7ed9ed;
border-left: solid 1px #7ed9ed;
}
#page-nurse #list #list-02 li{
border-right: solid 1px #7ed9ed;
border-bottom: solid 1px #7ed9ed;
}
#page-nurse #list ul li a{
line-height: 20rem;
letter-spacing: 0;
display: block;
text-decoration: none;
padding: 10rem 50rem 9rem 12rem;
position: relative;
}
#page-nurse #list ul li a span{
position: absolute;
top:10rem;
right: 10rem;
line-height: 20rem;
}
#page-nurse #list p{
padding: 40rem 0 0 0;
}



/* ==============================================
#page-achievement
============================================== */

#page-achievement #list{
padding: 0 30rem 60rem 30rem;
}
#page-achievement #list .inner{
border-top: 1px solid #ebebeb;
}
#page-achievement #list .inner div{
border-bottom: 1px solid #ebebeb;
padding: 0 0 25rem 0;
}
#page-achievement #list .inner div h2{
font-size: 14rem;
line-height: 20rem;
font-weight: 500;
color: #1eb478;
padding: 20rem 0 0 0;
}
#page-achievement #list .inner div h2 span{
font-size: 12rem;
line-height: 24rem;
font-weight: 500;
display: block;
}
#page-achievement #list .inner div p{
padding: 5rem 0 0 0;
line-height: 20rem;
}
#page-achievement #list .inner .button{
padding: 40rem 0 0 0;
}



/* ==============================================
#page-interview
============================================== */

@media screen and (min-width:1000px) {
#page-interview #visual img{
object-position: top;
}
}



#page-interview #hero{
position: relative;
}
#page-interview #hero .inner{
position: absolute;
bottom: 0;
left: 0;
width: 100%;
padding: 0 0 165rem 0;
}
#page-interview #hero .inner h1{
font-size: 30rem;
line-height: 45rem;
letter-spacing: 4rem;
font-weight: 300;
text-align: center;
}
@media screen and (min-width:1000px) {
#page-interview #hero .inner h1{
}
}
#page-interview #hero .inner h1 img{
width: auto;
height: 30rem;
display: block;
margin: 0 auto 5rem auto;
}
#page-interview #hero .inner h1 span{
font-size: 12rem;
line-height: 16rem;
color: #1eb478;
font-weight: 500;
display: block;
padding: 0 0 20rem 0;
}
#page-interview #hero .inner p{
text-align: center;
padding: 15rem 0 0 0;
}



#page-interview #menu{
}
#page-interview #menu .inner{
}
#page-interview #menu .inner ul{
}
#page-interview #menu .inner ul::after{
display: none;
}
#page-interview #menu .inner ul li{
display: table;
width: 100%;
}
#page-interview #menu .inner ul li a{
height: 80rem;
padding: 0 0 0 100rem;
display: table-cell;
vertical-align: middle;
}
#page-interview #menu .inner ul li a strong{
display: block;
font-size: 12rem;
line-height: 16rem;
font-weight: 700;
color: #1eb478;
padding: 2rem 0 0 0;
}
#page-interview #menu .inner ul li a span{
position: absolute;
top:0;
left: 0;
width: 80rem;
height: 80rem;
}
#page-interview #menu .inner ul li a span img{
width: 100%;
height: 100%;
object-fit: cover;
}
#page-interview #menu .inner ul li a::after{
top:32rem;
transform: rotate(0deg);
}



#page-interview #photo{
position: relative;
}
#page-interview #photo .inner{
}
#page-interview #photo .inner figure{
}
#page-interview #photo .inner figure img{
}
#page-interview #photo .inner p{
position: absolute;
bottom: -20rem;
left: 0;
}
#page-interview #photo .inner p strong{
font-family:"Noto Serif JP";
font-size: 20rem;
line-height: 30rem;
letter-spacing: 2rem;
font-weight: 200;
color: #fff;
display: inline-block;
background: linear-gradient(90deg, #1eb496 0%, #1eb45a 100%);
margin: 1px 0 0 0;
padding: 4rem 10rem 7rem 12rem;
}



#page-interview #department{
padding: 0 30rem;
}
#page-interview #department .inner{
padding: 0 0 50rem 0;
border-bottom: 1px solid #1eb478;
}
#page-interview #department .inner h1{
font-size: 30rem;
line-height: 45rem;
letter-spacing: 4rem;
font-weight: 300;
text-align: center;
padding: 65rem 0 0 0;
}
#page-interview #department .inner h1 img{
width: auto;
height: 30rem;
display: block;
margin: 0 auto 5rem auto;
}
#page-interview #department .inner h1 span{
font-size: 12rem;
line-height: 16rem;
color: #1eb478;
font-weight: 500;
display: block;
padding: 0 0 10rem 0;
}
#page-interview #department .inner p{
display: block;
text-align: center;
font-size: 16rem;
line-height: 20rem;
font-weight: 700;
letter-spacing: 2rem;
padding: 10rem 0 0 0;
}



#page-interview #article{
}
#page-interview #article .inner{
padding: 0 30rem;
}
#page-interview #article .inner h2{
font-size: 20rem;
line-height: 30rem;
padding: 35rem 0 0 0;
}
#page-interview #article .inner p{
padding: 25rem 0 0 0;
text-align: justify;
}



#page-interview #message{
background: linear-gradient(90deg, #1eb496 0%, #1eb45a 100%);
margin: 55rem 0 0 0;
}
#page-interview #message .inner{
padding: 0 30rem 95rem 30rem;
}
#page-interview #message .inner h2{
padding: 40rem 0 0 0;
}
#page-interview #message .inner h2 img{
width: auto;
height: 50rem;
}
#page-interview #message .inner p{
padding: 25rem 0 0 0;
text-align: justify;
color: #fff;
}



#page-interview article #menu{
background: #fff;
border-radius: 40rem 40rem 0 0;
margin: -40rem 0 0 0;
}
#page-interview article #menu .inner h2{
font-size: 20rem;
line-height: 30rem;
letter-spacing: 4rem;
text-align: center;
padding: 25rem 0 25rem 0;
}
#page-interview article #menu .inner ul li{
margin: 0;
}
#page-interview article #menu .inner ul li a{
border-top: 1px solid #ebebeb;
}



/* ==============================================
#page-workplace
============================================== */

#page-workplace{
}



#page-workplace #hero{
background: linear-gradient(135deg, #1eb496 0%, #1eb45a 100%);
padding: 0 0 1rem 0;
}
#page-workplace #hero .inner{
}
#page-workplace #hero .inner h1{
font-size: 30rem;
line-height: 45rem;
letter-spacing: 4rem;
font-weight: 300;
text-align: center;
color: #fff;
padding: 90rem 0 0 0;
}
#page-workplace #hero .inner h1 img{
width: auto;
height: 42rem;
display: block;
margin: 0 auto 15rem auto;
}
#page-workplace #hero .inner ul{
margin: -12rem 0 0 0;
margin: 52rem 0 0 0;
}
#page-workplace #hero .inner ul li{
margin: 1px 0 0 0;
display: table;
width: 100%;
}
#page-workplace #hero .inner ul li a{
display: table-cell;
font-size: 12rem;
line-height: 18rem;
height: 44rem;
vertical-align: middle;
position: relative;
background: #fff;
padding: 0 0 2rem 30rem;
}
#page-workplace #hero .inner ul li a span{
display: block;
font-size: 10rem;
line-height: 12rem;
letter-spacing: 0;
}
#page-workplace #hero .inner ul li a::before{
content: "";
background: #1eb478;
position: absolute;
top: 0;
left: 0;
width: 22rem;
height: 100%;
}
#page-workplace #hero .inner ul li:nth-child(1) a::before{opacity: 0.80;}
#page-workplace #hero .inner ul li:nth-child(2) a::before{opacity: 0.78;}
#page-workplace #hero .inner ul li:nth-child(3) a::before{opacity: 0.76;}
#page-workplace #hero .inner ul li:nth-child(4) a::before{opacity: 0.74;}
#page-workplace #hero .inner ul li:nth-child(5) a::before{opacity: 0.72;}
#page-workplace #hero .inner ul li:nth-child(6) a::before{opacity: 0.70;}
#page-workplace #hero .inner ul li:nth-child(7) a::before{opacity: 0.68;}
#page-workplace #hero .inner ul li:nth-child(8) a::before{opacity: 0.66;}
#page-workplace #hero .inner ul li:nth-child(9) a::before{opacity: 0.64;}
#page-workplace #hero .inner ul li:nth-child(10) a::before{opacity: 0.62;}
#page-workplace #hero .inner ul li:nth-child(11) a::before{opacity: 0.60;}
#page-workplace #hero .inner ul li:nth-child(12) a::before{opacity: 0.58;}
#page-workplace #hero .inner ul li:nth-child(13) a::before{opacity: 0.56;}
#page-workplace #hero .inner ul li:nth-child(14) a::before{opacity: 0.54;}
#page-workplace #hero .inner ul li:nth-child(15) a::before{opacity: 0.52;}
#page-workplace #hero .inner ul li:nth-child(16) a::before{opacity: 0.50;}
#page-workplace #hero .inner ul li:nth-child(17) a::before{opacity: 0.48;}
#page-workplace #hero .inner ul li:nth-child(18) a::before{opacity: 0.46;}
#page-workplace #hero .inner ul li:nth-child(19) a::before{opacity: 0.44;}
#page-workplace #hero .inner ul li:nth-child(20) a::before{opacity: 0.42;}
#page-workplace #hero .inner ul li:nth-child(21) a::before{opacity: 0.40;}
#page-workplace #hero .inner ul li:nth-child(22) a::before{opacity: 0.38;}
#page-workplace #hero .inner ul li:nth-child(23) a::before{opacity: 0.36;}
#page-workplace #hero .inner ul li:nth-child(24) a::before{opacity: 0.34;}
#page-workplace #hero .inner ul li:nth-child(25) a::before{opacity: 0.32;}
#page-workplace #hero .inner ul li:nth-child(26) a::before{opacity: 0.30;}
#page-workplace #hero .inner ul li:nth-child(27) a::before{opacity: 0.28;}
#page-workplace #hero .inner ul li:nth-child(28) a::before{opacity: 0.26;}
#page-workplace #hero .inner ul li:nth-child(29) a::before{opacity: 0.24;}
#page-workplace #hero .inner ul li:nth-child(30) a::before{opacity: 0.22;}
#page-workplace #hero .inner ul li a::after{
content: "";
background: url("../images/cmn_arw_black.png") no-repeat;
background-size: 6rem 12rem;
width: 6rem;
height: 12rem;
position: absolute;
top:0rem;
bottom: 0;
right: 20rem;
margin: auto;
transform: rotate(90deg);
}



#page-workplace article{
position: relative;
z-index: 100;
background: #fff;
padding: 0 0 64rem 0;
}
#page-workplace #workplace{
}
#page-workplace #workplace .inner{
}
#page-workplace #workplace .inner .wp{
position: relative;
padding: 0 30rem 28rem 30rem;
}
#page-workplace #workplace .inner .wp h2{
font-size: 25rem;
line-height: 33rem;
letter-spacing: 2rem;
font-weight: 300;
text-align: center;
padding: 52rem 0 0 0;
}
#page-workplace #workplace .inner .wp h2 span{
font-size: 13rem;
line-height: 19rem;
font-weight: 500;
color: #1eb478;
display: block;
margin: 8rem 0 0 0;
}
#page-workplace #workplace .inner .wp .slider{
margin: 28rem -30rem -16rem -30rem;
}



#page-workplace #workplace .inner .wp .accordion-button{
position: absolute;
bottom: 0;
right: 30rem;
}
#page-workplace #workplace .inner .wp .accordion-button.off{
}
#page-workplace #workplace .inner .wp .accordion-button a{
display: block;
width: 88rem;
height: 20rem;
opacity: 1!important;
}
#page-workplace #workplace .inner .wp .accordion-button a span{
font-size: 12rem;
line-height: 21rem;
color: #fff;
width: 88rem;
height: 20rem;
border-radius: 12rem;
position: relative;
text-align: center;
padding: 0 14rem 0 0;
}
#page-workplace #workplace .inner .wp .accordion-button a span::after{
content: "";
background: url("../images/cmn_arw_white.png");
background-size: 4rem 8rem;
position: absolute;
top:0;
bottom: 2rem;
right: 12rem;
margin: auto;
width: 4rem;
height: 8rem;
}
#page-workplace #workplace .inner .wp .accordion-button.off a span.off{
background: linear-gradient(90deg, #1eb496 0%, #1eb45a 100%);
display: block;
}
#page-workplace #workplace .inner .wp .accordion-button.off a span.off::after{
transform: rotate(90deg);
}
#page-workplace #workplace .inner .wp .accordion-button.off a span.on{
display: none;
}
#page-workplace #workplace .inner .wp .accordion-button a span.off{
display: none;
}
#page-workplace #workplace .inner .wp .accordion-button a span.on{
background: #ccc;
display: block;
}
#page-workplace #workplace .inner .wp .accordion-button a span.on::after{
transform: rotate(-90deg);
}



#page-workplace #workplace .inner .wp .accordion{
overflow: hidden;
display: -webkit-box;
-webkit-box-orient: vertical;
-webkit-line-clamp: none;
margin: 16rem 0 0 0;
}
#page-workplace #workplace .inner .wp .accordion.off{
-webkit-line-clamp: 3;
}
#page-workplace #workplace .inner .wp .accordion h3{
font-size: 15rem;
line-height: 23rem;
font-weight: 500;
}
#page-workplace #workplace .inner .wp .accordion p{
margin: 12rem 0 0 0;
}
#page-workplace #workplace .inner .wp .accordion p:first-child{
margin: 0;
}



/* ==============================================
#page-recruit
============================================== */

#page-recruit #title ul{
border-top: 1px solid #ebebeb;
border-bottom: 1px solid #ebebeb;
margin: 35rem -30rem -60rem -30rem;
}
#page-recruit #title ul li{
float: left;
width: 25%;
}
#page-recruit #title ul li a{
display: block;
line-height: 18rem;
height: 60rem;
text-align: center;
padding: 12rem 0 0 0;
border-right: 1px solid #ebebeb;
}
#page-recruit #title ul li a br{
line-height: 0;
}
#page-recruit #title ul li:last-child a{
border-right: none;
}



#page-recruit #message{
}
#page-recruit #message .inner{
padding: 0 30rem;
}
#page-recruit #message .inner figure{
margin: 0 -30rem;
}
#page-recruit #message .inner figure img{
}
#page-recruit #message .inner h2{
font-family:"Noto Serif JP";
font-size: 24rem;
line-height: 36rem;
letter-spacing: 2rem;
font-weight: 400;
text-align: center;
padding: 30rem 0 0 0;
}
#page-recruit #message .inner p{
text-align: justify;
padding: 20rem 0 0 0;
}



#page-recruit .article{
}
#page-recruit .article .inner{
padding: 0 30rem;
}
#page-recruit .article .inner h2{
font-size: 24rem;
line-height: 36rem;
text-align: center;
letter-spacing: 2rem;
padding: 55rem 0 0 0;
}
#page-recruit .article .inner h3{
font-size: 20rem;
line-height: 30rem;
font-weight: 500;
text-align: center;
letter-spacing: 2rem;
padding: 30rem 0 0 0;
}
#page-recruit .article .inner h4{
font-size: 16rem;
line-height: 24rem;
font-weight: 700;
text-align: center;
letter-spacing: 2rem;
color: #1eb478;
padding: 20rem 0 0 0;
}
#page-recruit .article .inner p{
padding: 25rem 0 0 0;
text-align: justify;
}
#page-recruit .article .inner ul{
padding: 15rem 0 0 0;
}
#page-recruit .article .inner p + ul{
padding: 0;
}
#page-recruit .article .inner ul li{
text-indent: -13rem;
margin: 10rem 0 0 13rem;
}
#page-recruit .article .inner a{
text-decoration: underline;
}
#page-recruit .article .inner .button a{
text-decoration: none;
}
#page-recruit .article .inner strong{
font-weight: 700;
}
#page-recruit .article .inner .center{
text-align: center;
}
#page-recruit .article .inner .red{
color: #f02850;
}
#page-recruit .article .inner .note{
font-size: 11rem;
line-height: 16rem;
}
#page-recruit .article .inner figure{
padding: 25rem 0 0 0;
}
#page-recruit .article .inner .information{
font-size: 16rem;
line-height: 28rem;
font-weight: 500;
letter-spacing: 1rem;
text-align: center;
color: #1eb478;
padding: 40rem 0 0 0;
}
#page-recruit .article .inner .slider{
margin: 35rem -30rem 0 -30rem;
}



#page-recruit .article .inner .frame{
border: solid 1px #1eb478;
border-radius: 4rem;
margin: 20rem -20rem 0 -20rem;
}
@media screen and (min-width:1000px) {
#page-recruit .article .inner .frame{
margin: 20rem 0 0 0;
}
}
#page-recruit .article .inner .frame p{
padding: 18rem 20rem 20rem 20rem;
}
#page-recruit .article .inner .frame table{
border-collapse:collapse;
border-spacing:0;
}
#page-recruit .article .inner .frame table th{
font-size: 12rem;
line-height: 16rem;
font-weight: 500;
letter-spacing: 0;
vertical-align: top;
text-align: left;
border-top: 1px solid #ebebeb;
padding: 6rem 8rem 6rem 8rem;
background: #e8f7f1;
width: 64rem;
}
#page-recruit .article .inner .frame table td{
font-size: 12rem;
line-height: 16rem;
letter-spacing: 0;
vertical-align: top;
text-align: left;
border-top: 1px solid #ebebeb;
border-right: 1px solid #ebebeb;
padding: 6rem 8rem 6rem 8rem;
}
#page-recruit .article .inner .frame table tr:first-child th{
border-radius: 3rem 0 0 0;
}
#page-recruit .article .inner .frame table tr:last-child th{
border-radius: 0 0 0 3rem;
}
#page-recruit .article .inner .frame table tr:first-child th,
#page-recruit .article .inner .frame table tr:first-child td{
border-top: none;
}
#page-recruit .article .inner .frame table td:last-child{
border-right: none;
}
#page-recruit .article .inner .frame table td strong{
font-size: 12rem;
line-height: 16rem;
font-weight: 500;
}
#page-recruit .article .inner .frame table th br,
#page-recruit .article .inner .frame table td br{
line-height: 0;
}



#page-recruit .event h2{
font-size: 24rem;
line-height: 36rem;
text-align: center;
letter-spacing: 2rem;
padding: 55rem 0 0 0;
}
#page-recruit .event .inner{
}
#page-recruit .event p{
padding: 25rem 30rem 0 30rem;
font-weight: 400;
text-align: justify;
}
#page-recruit .event .image{
height: 280rem;
padding: 0;
margin: 30rem 0 0 0;
}
#page-recruit .event .image img{
width: 100%;
height: 100%;
object-fit: cover;
}
#page-recruit .event table{
border-top: solid 1px #e6e6e6;
border-collapse:collapse;
border-spacing:0;
width: 100%;
margin: 30rem 0 0 0;
}
#page-recruit .event .image + table{
border-top: none;
margin: 0;
}
#page-recruit .event table th{
border-bottom: solid 1px #e6e6e6;
background: #fafafa;
width:80rem;
vertical-align: top;
padding: 15rem 0 18rem 0;
}
#page-recruit .event table td{
border-bottom: solid 1px #e6e6e6;
padding: 15rem 20rem 18rem 20rem;
}
#page-recruit .event .button{
padding: 35rem 30rem 0 30rem;
}



#page-recruit #link{
}
#page-recruit #link .inner{
padding: 40rem 30rem 60rem 30rem;
}
@media screen and (min-width:1000px) {
#page-recruit #link .inner{
padding: 40rem 30rem 40rem 30rem;
}
}
#page-recruit #link .inner .button{
padding: 10rem 0 0 0;
}



/* ==============================================
#page-faq
============================================== */

#page-faq #list{
margin:0 10rem 10rem 10rem;
border-top:1px solid #1eb478;
}
@media screen and (min-width:1000px) {
#page-faq #list{
margin:0 30rem 40rem 30rem;
}
}
#page-faq #list dl{
border:1px solid #1eb478;
border-top:none;
background: url("../../recruit/faq/images/fq_icn_q.png") top 15rem left 14rem no-repeat;
background-size:auto 28rem;
}
#page-faq #list dl dt{
font-size: 14rem;
line-height: 20rem;
background: url(../../recruit/faq/images/fq_icn_open.png) top 7rem right 7rem no-repeat;
background-size:auto 28rem;
margin:0;
padding: 20rem 44rem 20rem 52rem;
cursor: pointer;
}
#page-faq #list dl dt.open{
background: url(../../recruit/faq/images/fq_icn_close.png) top 7rem right 7rem no-repeat;
background-size:auto 28rem;
}
#page-faq #list dl dt a{
font-size:14rem;
line-height:20rem;
color:#1eb478;
font-weight:bold;
text-decoration:none;
}
#page-faq #list dl dd{
background: url(../../recruit/faq/images/fq_icn_a.png) top 3rem left 18rem no-repeat;
background-size:auto 16rem;
font-size:13rem;
padding: 0 20rem 20rem 52rem;
}
#page-faq #list dl dd a{
color:#1eb478;
font-size:13rem;
text-decoration: underline;
}



/* ==============================================
#page-information
============================================== */

#page-information #list{
}
#page-information #list .inner{
}
#page-information #list .inner ul{
}
#page-information #list .inner ul li{
line-height: 20rem;
padding: 15rem 30rem 15rem 30rem;
border-top: 1px solid #ebebeb;
}
#page-information #list .inner ul li span{
font-size: 12rem;
line-height: 20rem;
font-weight: 700;
display: block;
padding: 0 0 2rem 0;
}
#page-information #list .inner ul li strong{
color: #f02850;
}
#page-information #list .inner ul li a{
line-height: 20rem;
text-decoration: underline;
}
#page-information #list .inner ul li a:first-child{
position: relative;
text-decoration: none;
display: block;
margin: -15rem -30rem -15rem -30rem;
padding: 15rem 40rem 15rem 30rem;
}
#page-information #list .inner ul li a:first-child::after{
content: "";
background: url("../images/cmn_arw_black.png") no-repeat;
background-size: 6rem 12rem;
width: 6rem;
height: 12rem;
position: absolute;
top:0;
bottom: 2rem;
right: 20rem;
margin: auto;
}



/* ==============================================
#page-access
============================================== */

#page-access #map{
padding: 0 30rem;
}
#page-access #map div{
width:100%;
border:solid 1px #1eb478;
position:relative;
}
#page-access #map iframe{
width:100%;
height:200rem;
vertical-align: top;
}
#page-access #map p.button{
position: absolute;
bottom:-16rem;
right:6%;
z-index:101;
width:50%;
}
#page-access #map p.button a{
padding: 0;
background: none;
border: none;
height: auto;
}
#page-access #map p.address{
padding:25rem 0 0 0;
}



#page-access #how{
margin:35rem 0 0 0;
padding: 0 30rem 60rem 30rem;
}
@media screen and (min-width:1000px) {
#page-access #how{
padding: 0 30rem 40rem 30rem;
}
}
#page-access #how div{
border:1px solid #dcdcdc;
border-radius: 4rem;
padding: 0 20rem 20rem 20rem;
margin: 10rem 0 0 0;
}
#page-access #how div h2{
padding: 15rem 0 10rem 0;
}
#page-access #how div p{
line-height: 20rem;
padding: 5rem 0 0 0;
}
#page-access #how div p strong{
line-height: 20rem;
font-weight: 700;
}
#page-access #how div p span{
line-height: 20rem;
}
#page-access #how div ul{
padding: 5rem 0 0 0;
}
#page-access #how div ul li{
padding: 10rem 0 0 0;
}
#page-access #how dl{
position: relative;
}
#page-access #how dl dt{
font-weight: 700;
position: absolute;
top:0;
left: 0;
line-height: 20rem;
}
#page-access #how dl dd{
padding: 0 0 0 20rem;
line-height: 20rem;
}
#page-access #how dl dd strong{
line-height: 20rem;
font-weight: bold;
}
#page-access #how dl dd span{
line-height: 20rem;
color: #1eb478;
}