@charset "UTF-8";


h2.sub_title {position: relative;font-weight:bold;margin: 170px auto 100px;text-align: center;}
h2.sub_title span {font-size: 2.333em;font-weight: 700;align-items: center;text-transform: uppercase;}
h2.sub_title span::before {content: '';display: inline-block;width: 1px;height: 53px;background-color:var(--base_navy);position: absolute;top:-85px;left: 50%;transform: translateX(-50%);-webkit- transform:translateX(-50%);}
#wrap.contents #page_title .contents_visual .contents_en{ top: -170px!important;}
@media screen and (max-width:999px){
#wrap.contents #page_title .contents_visual .contents_en{ top: -100px!important;}
h2.sub_title { margin: 140px auto 50px;}
h2.sub_title span {font-size: 1.9em;}
}
@media screen and (max-width: 767px) {
h2.sub_title { margin: 25vw auto 8vw;}
h2.sub_title span {font-size: 1.6em;}
h2.sub_title span::before { height: 8vw; top:-12vw;}
}

ul.sc_navi { display: flex;justify-content: center;align-items: center;}
ul.sc_navi li {margin-right: 40px;display:flex;flex-wrap:wrap;}
ul.sc_navi li:last-child {margin-right: 0;}
ul.sc_navi li a.sc_navi_btn {display: flex;justify-content: center;align-items: center;position: relative;width: 80px;height: 80px;margin:0 auto;overflow: hidden;border: 1px solid var(--main_blue);background-color: #fff;color: var(--main_blue);font-size: 1.75em;}
ul.sc_navi li a.sc_navi_btn:hover {background-color: transparent;color: #fff;}
ul.sc_navi li a.sc_navi_btn::before {position: absolute;top: 0;left: 0;z-index: -1;width: 0;height: 100%;background-color: var(--main_blue);content: '';transition: width .3s ease;}
ul.sc_navi li a.sc_navi_btn:hover::before {width: 100%;}
@media screen and (max-width:999px){

}
@media screen and (max-width: 767px) {
ul.sc_navi{ width: 100%; justify-content: space-between;}
ul.sc_navi li{ width: calc((100% / 4) - 10px); margin-right: 0;}
ul.sc_navi li:last-child{ margin-right: 0;}
ul.sc_navi li a{ width: 100%;}
ul.sc_navi li a.sc_navi_btn {width: 18.5vw;height: 18.5vw;}
}

.staff {max-width: 1000px;margin: auto;padding: 100px 0 0;}
.staff .movie {width: 100%; margin: 0 0 40px;}
.staff .movie .youtube { max-width: 925px; width: 100%; aspect-ratio: 16 / 9; margin: 0 auto;}
.staff .movie .youtube iframe{ width: 100%; height: 100%; border: none;}
.staff .header_title {position: relative;margin: 0 0 60px;}
.staff .header_title h3.staff_title {font-size: 3.8em;line-height: 2; font-weight: 700; padding-left: 90px;position: relative;font-feature-settings: "palt";}
.staff .header_title h3.staff_title span {background: linear-gradient(transparent 65%, #bad8f2 50%);display: inline;padding: 0 2px 8px;}
.staff .header_title p.number{color: var(--main_blue); font-size: 3em; position: absolute;left: 0;top: 20px;}
.staff p.staff_text {font-size: 1.6em;line-height: 2.18;font-weight: 700;font-feature-settings: "palt";margin: 0 0 60px;}
.staff .profile{width: 660px;margin: auto;display: flex;align-items: center;justify-content: center;border-top: 1px solid var(--base_navy);padding: 60px 0 0;}
.staff .profile p.staff_name {font-size: 3em;font-weight: 700;}
.staff .profile p.staff_name span {font-size: .66em;color: #b4bebe;margin: 0 0 0 30px;}
.staff .profile dl{ width: 200px; display:flex;flex-wrap:wrap;margin-left: 60px;}
.staff .profile dl dt {font-size: 1.5em;font-weight: 700;width: 6em;margin: 20px 0 0;}
.staff .profile dl dd {font-size: 1.5em;font-weight: 700;width:calc(100% - 6em);margin: 20px 0 0;white-space: nowrap;}

.staff .profile dl dt:first-child,
.staff .profile dl dt:first-child + dd{margin: 0;}
@media screen and (max-width:999px){
.staff .header_title {margin: 0 0 40px;}
.staff .header_title h3.staff_title {font-size: 3em;}
.staff .header_title p.number{font-size: 2.6em;}
.staff p.staff_text {font-size: 1.4em;margin: 0 0 40px;}
.staff .profile{padding: 40px 0 0;}
.staff .profile p.staff_name {font-size: 2.6em;}
.staff .profile p.staff_name span {font-size: .7em;}
.staff .profile dl dt {font-size: 1.4em;}
.staff .profile dl dd {font-size: 1.4em;}
}

@media screen and (max-width: 767px) {
.staff {padding: 20% 0 0;}
.staff .movie { margin: 0 0 5%;}
.staff .header_title {position: relative;margin: 0 0 5%;}
.staff .header_title h3.staff_title {font-size: 2em; line-height: 1.8; padding-left: 0;}
.staff .header_title h3.staff_title span {background: linear-gradient(transparent 65%, #bad8f2 50%);padding: 0 2px 4px;}
.staff .header_title p.number{color: var(--main_blue); font-size: 1.6em; top:0;position: inherit;margin: 0 0 2.5%;}
.staff p.staff_text { font-size: 1.3em;  line-height: 1.8; margin: 0 0 10%;}
.staff .profile{width:100%;display: block;padding: 10% 0 0;}
.staff .profile p.staff_name {font-size: 2em;margin: 0 0 5vw;}
.staff .profile p.staff_name span {font-size: .7em;margin: 0 0 0 1em;}
.staff .profile dl{ width: 100%;margin-left: 0; }
.staff .profile dl dt {font-size: 1.3em;margin: 2.5vw 0 0;}
.staff .profile dl dd {font-size: 1.3em;margin: 2.5vw 0 0;}
}

.underlink{ max-width: 1000px; margin: auto;}
.underlink .underlink_img{ width: 100%; height: 340px; overflow: hidden; margin-bottom: 10px; position: relative;}
.underlink .underlink_img a{ width: 100%; height: 100%;}
.underlink .underlink_img a > img{ width: 100%; height: 340px; object-fit: cover;}
.underlink  p.underlink_text {font-size: 1.6em;line-height: 1.6;}
.underlink .underlink_img span.watchmovie{ display: block; position: absolute; bottom: 25px; right: 25px; width: 164px; height: 34px;}
.underlink .underlink_img span.watchmovie img{ width: 100%; height: auto;}
@media screen and (max-width:999px){
.underlink{ margin: 0;}
.underlink .underlink_img{ height: 250px;}
.underlink .underlink_img a img{ height: 250px;}
.underlink p.underlink_text { font-size: 1.4em;}
.underlink .underlink_img span.watchmovie{ bottom: 15px; right: 15px; width: 130px; height: auto;}
}
@media screen and (min-width: 768px) {
.underlink .underlink_img a{ display: block; transition: all .3s ease-in-out;}
.underlink .underlink_img a > img{ width: 100%; vertical-align: middle; transition: .2s;}
.underlink .underlink_img a:hover > img{ transform: scale(1.07);}
.underlink .underlink_img a:hover > img{ opacity: 0.8;}
}
@media screen and (max-width: 767px) {
.underlink{}
.underlink .underlink_img{ width: calc(100% + 60px); margin-left: -30px; height: 150px;}
.underlink .underlink_img a > img{ height: 150px;}
.underlink p.underlink_text { font-size: 1.3em;}
.underlink .underlink_img span.watchmovie{ bottom: 15px; right: 15px; width: 120px;}
}