@charset "UTF-8";


/* -- font
-------------------------------------------------------------------------------- */
@font-face {
    font-family: 'NotoSansJapanese';
    src: url('./font/NotoSansCJKjp-Regular.woff') format('woff');
    font-weight: normal;
    font-style: normal;
}
@font-face {
    font-family: 'NotoSansJapanese';
    src: url('./font/NotoSansCJKjp-Medium.woff') format('woff');
    font-weight: bold;
    font-style: normal;
}
@font-face {
    font-family: 'Lausanne';
    src: url('./font/Lausanne-300.woff2') format('woff');
    font-weight: normal;
    font-style: normal;
}
@font-face {
    font-family: 'Lausanne';
    src: url('./font/Lausanne-500.woff2') format('woff');
    font-weight: bold;
    font-style: normal;
}


/* -- Base and Reset
-------------------------------------------------------------------------------- */
html {
    font-size: 62.5%;
	width: 100%;
}
@media (max-width: 1600px){
    html {
        font-size: 56.25%;
    }
}
@media (max-width: 1200px){
    html {
        font-size: 50%;
    }
}
@media (max-width: 1024px){
    html {
        font-size: 8px;
    }
}
@media (max-width: 768px){
    html {
        font-size: 50%;
    }
}
@media (max-width: 390px){
    html {
        font-size: 2.05128208vw;
    }
}
body {
	font: 1rem/1.6 'Lausanne', 'NotoSansJapanese', '游ゴシック Medium', 'Yu Gothic Medium', '游ゴシック体', YuGothic, 'ヒラギノ角ゴ Pro W3', 'Hiragino Kaku Gothic Pro', Meiryo, メイリオ, sans-serif;
	text-align: left;
    color: #161a14;
	width: 100%;
}
body,div,dl,dt,dd,ul,ol,li,h1,h2,h3,h4,h5,h6,pre,code,form,fieldset,legend,input,textarea,p,blockquote,th,td {
	margin: 0;
	padding: 0;
}
caption,th,td {
	font-weight: normal;
	text-align: left;
}
input,textarea,select {
	font-family: 'Lausanne', 'NotoSansJapanese', '游ゴシック Medium', 'Yu Gothic Medium', '游ゴシック体', YuGothic, 'ヒラギノ角ゴ Pro W3', 'Hiragino Kaku Gothic Pro', Meiryo, メイリオ, sans-serif;
	vertical-align: middle;
}
textarea {
	resize: vertical;
}
h1,h2,h3,h4,h5,h6 { font-size: 100%; }
ul,ol { list-style: none; }
fieldset,img { border: 0; vertical-align: top; }
iframe {
    margin: 0;
    padding: 0;
    border: 0;
    outline: 0;
    font-size: 100%;
    vertical-align: baseline;
    background: transparent;
}
input{
    color:#161a14;
    -webkit-tap-highlight-color:rgba(0,0,0,0);
}
label{
    -webkit-tap-highlight-color:rgba(0,0,0,0);
}
a{
    text-decoration:none;
    color:inherit;
    -webkit-tap-highlight-color:rgba(0,0,0,0);
}
a:focus{
    outline:none;
}
select::-ms-expand {
    display: none;
}
body {
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale;
    -webkit-text-size-adjust: 100%;
    -webkit-touch-callout;
}
body::before {
    content: "";
    display: block;
    width: 100%;
    height: 100%;
    background: rgba(0,0,0,0.4);
    position: fixed;
    top: 0;
    left: 0;
    z-index: 50;
    opacity: 0;
    visibility: hidden;
    transition: 1s ease;
}
body.search-active::before {
    opacity: 1;
    visibility: visible;
}
@media (max-width: 1024px){
    body.nav-active::before {
        opacity: 1;
        visibility: visible;
    }
}
@media (max-width: 767px){
    .sp-hide {
        display: none;
    }
}
:root {
    --header-height: calc(100px + 8vw);
}
small {
    font-size: 0.75em;
}


/* -- barba
-------------------------------------------------------------------------------- */
.barba-container + .barba-container{
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
}
.barba .barba-container{
    opacity: 0;
    transition: 0.3s ease;
}


/* -- scroll-fade
-------------------------------------------------------------------------------- */
.scroll-fade {
    opacity: 0;
    transition: opacity 1s ease;
}
.scroll-fade.show {
    opacity: 1;
}


/* -- link-btn
-------------------------------------------------------------------------------- */
.link-btn {
    display: flex;
    margin-top: 6rem;
}
.link-btn a,
.link-btn p {
    display: block;
    font-size: 2rem;
    letter-spacing: 0.02em;
    line-height: 1.6;
    padding-right: 4rem;
    position: relative;
}
.link-btn a .txt,
.link-btn p .txt {
    display: block;
    transform: translateY(-1px);
    position: relative;
}
.link-btn a .txt::after,
.link-btn p .txt::after {
    content: "";
    display: block;
    width: 0;
    border-bottom: solid 1px;
    position: absolute;
    bottom: 0;
    right: 0;
    transition: 0.4s ease;
}
.link-btn a .mark,
.link-btn p .mark {
    display: block;
    width: 0.8rem;
    height: 0.8rem;
    background: #801a20;
    border-radius: 100%;
    position: absolute;
    top: 50%;
    right: 0;
    transform: translate(50%,-50%);
    overflow: hidden;
    transition: 0.4s ease;
}
.link-btn a .mark svg,
.link-btn p .mark svg {
    display: block;
    width: 1.2rem;
    fill: #fff;
    position: absolute;
    top: 50%;
    left: 50%;
    margin-left: -3.2rem;
    transform: translate(-50%,-50%);
}
.link-btn.wh a {
    color: #fff;
}
.link-btn.wh a .txt::after {
    background: #fff;
}
.link-btn.wh a .mark {
    background: #fff;
}
.link-btn.wh a .mark svg {
    fill: #6B161B;
}
@media (min-width: 1025px){
    .link-btn a:hover .txt::after,
    a:hover .link-btn .txt::after {
        width: 100%;
        left: 0;
    }
    .link-btn a:hover .mark,
    a:hover .link-btn .mark {
        width: 4.8rem;
        height: 4.8rem;
    }
    .link-btn a:hover .mark svg,
    a:hover .link-btn .mark svg {
        margin-left: 0;
        transition: 0.4s ease;
    }
}
@media (max-width: 1024px){
    .link-btn a,
    .link-btn p {
        padding-right: 4rem;
    }
    .link-btn a .txt::after,
    .link-btn p .txt::after {
        width: 100%;
        left: 0;
    }
    .link-btn a .mark,
    .link-btn p .mark {
        width: 4.8rem;
        height: 4.8rem;
    }
    .link-btn a .mark svg,
    .link-btn p .mark svg {
        margin-left: 0;
        transition: 0.4s ease;
    }
    
}
@media (max-width: 767px){
    .link-btn {
        margin-top: 4rem;
    }
    .link-btn a {
        padding-right: 3.2rem;
    }
    .link-btn a .mark {
        width: 4rem;
        height: 4rem;
    }
}


/* -- txt-links
-------------------------------------------------------------------------------- */
.txt-links a {
    display: inline-block;
    color: #6B161B;
    position: relative;
    text-decoration: none!important;
}
.txt-links a::before {
    content: "";
    display: block;
    width: 0;
    height: 1px;
    background: #6B161B;
    position: absolute;
    bottom: -1px;
    right: 0;
    transition: 0.4s ease;
}
.txt-links.bl a {
    color: #161a14;
}
.txt-links.bl a::before {
    background: #161a14;
}
.txt-links.wh a,
.wh .txt-links a{
    color: #fff;
}
header .txt-links a::before,
.search-active header .txt-links a::before {
    background: #161a14;
}
.txt-links.wh a::before,
.wh .txt-links a::before {
    background: #fff;
}
.pdf::after {
    content: "";
    display: inline-block;
    vertical-align: middle;
    width: 1em;
    height: 1em;
    background: url(../img/ico_pdf.svg);
    background-size: contain;
    transform: translateY(-1px);
    margin: 0 0.4em;
}
.txt-links .pdf::after {
    margin: 0 0 0 0.4em;
}
@media (min-width: 1025px){
    .txt-links a:hover::before {
        width: 100%;
        left: 0;
    }
}
@media (max-width: 767px){
}


/* -- ex-link
-------------------------------------------------------------------------------- */
.ex-link::after {
    content: "";
    display: inline-block;
    vertical-align: middle;
    width: 1.6rem;
    height: 1.6rem;
    background: url(../img/ico_exlink.svg) no-repeat center;
    background-size: cover;
    transform: translateY(-1px);
    margin: 0 0.2em;
}
.ex-link.wh::after,
.wh .ex-link::after {
    background-image: url(../img/ico_exlink_wh.svg);
}
@media (max-width: 767px){
}


/* -- note
-------------------------------------------------------------------------------- */
.note {
    font-size: 1.6rem;
    color: #7e807f;
}


/* -- header
-------------------------------------------------------------------------------- */
header {
    width: 100%;
    position: fixed;
    top: 0;
    right: 0;
    z-index: 100;
    transition: transform 0.6s ease, background 0.6s ease;
}
header.hide {
    transform: translateY(-100%);
}
header .header-inner{
    height: 140px;
    padding: 0 calc(4vw - 1rem) 0 calc(4vw + 80px);
    display: flex;
    justify-content: space-between;
    align-items: center;
    transition: height 0.6s ease;
    position: relative;
    z-index: 1;
}
header .ttl-logo {
    color: #161a14;
    padding-top: 0;
    opacity: 0;
    transform: translateY(-140px);
    transition: opacity 1s ease, transform 1s ease, visibility 1s ease;
    height: 6rem;
    width: calc(6rem * 5.31481481);
    background: url(../img/logo_dsai.svg) no-repeat;
    background-position: center;
    background-size: contain;
}
header.wh .ttl-logo {
    background-image: url(../img/logo_dsai_wh.svg);
}
header.show .ttl-logo {
    opacity: 1;
    transform: translateY(0);
}
header .ttl-logo .ttl-logo-main{
    font-size: 3.6rem;
    letter-spacing: 0.01em;
    line-height: 1;
    text-indent: -0.05em;
    overflow: visible;
}
header .ttl-logo .ttl-logo-main .and{
    transition: none;
}
header .ttl-logo .ttl-logo-sub{
    font-size: 1.2rem;
    line-height: 1.4;
    margin-top: 0.2rem;
    overflow: visible;
    white-space: nowrap;
}
header.min {
    background: #fff;
    color: #161a14;
}
header.min .ttl-logo{
    background-image: url(../img/logo_dsai.svg);
}
body.barba header .ttl-logo{
    color: #161a14!important;
}
header.min .header-inner{
    height: 100px;
}
header .header-nav-wrap{
    display: flex;
    justify-content: center;
    align-items: center;
}
header nav ul.txt-links li a {
    color: #161a14;
}
header.min nav ul.txt-links li a {
    color: #161a14;
}
header.wh nav ul.txt-links li a {
    color: #fff;
}
body.barba header nav ul.txt-links li a{
    color: #161a14!important;
}
body.barba header nav ul.txt-links li a::before{
    background: #161a14!important;
}
header nav ul.txt-links li a.active::before {
    width: 100%;
    left: 0;
}
body.search-active header.wh {
    color: #161a14;
}
body.search-active header.wh nav ul.txt-links li a {
    color: #161a14;
}
body.search-active header.wh .ttl-logo {
    background-image: url(../img/logo_dsai.svg);
}
header .language {
    display: flex;
    opacity: 0;
    transform: translateY(-140px);
    margin-left: calc(4.8rem - 1rem);
    transition: 1s ease;
}
header.show .language {
    opacity: 1;
    transform: translateY(0);
}
header .language div {
    font-size: 1.6rem;
    letter-spacing: 0.02em;
    color: #161a14;
}
header.wh .language div {
    color: #fff;
}
body.search-active header.wh .language div {
    color: #161a14;
}
header .language p,
header .language a {
    display: block;
    position: relative;
}
header .language p::before,
header .language a::before {
    content: "";
    display: block;
    width: 0;
    height: 1px;
    background: #6B161B;
    position: absolute;
    bottom: -1px;
    right: 0;
    transition: 0.4s ease;
}
header .language p::before {
    width: 100%;
    left: 0;
}
header .language p::before,
header .language a::before,
.search-active header.wh .language p::before,
.search-active header.wh .language a::before {
    background: #161a14;
}
header.wh .language p::before,
header.wh .language a::before{
    background: #fff;
}
@media (min-width: 1025px){
    header .language a:hover::before {
        width: 100%;
        left: 0;
    }
}
header .language span {
    display: block;
    margin: 0 0.8rem;
}
@media (max-width: 1024px){
    .nav-active header.min{
        background: transparent;
        transition-delay: 0.5s;
    }
    .nav-active header .nav-btn span,
    .nav-active header.min .nav-btn span {
        border-top-color: #fff;
        transition-delay: 0.5s;
    }
    body.nav-active header .ttl-logo {
        opacity: 0;
        visibility: hidden;
    }
    header .header-inner {
        padding: 0 calc(6% - 27px) 0 6%;
    }
    header .language {
        margin-left: 1.2rem;
        margin-right: 1.6rem;
        transform: translateY(-100px);
    }
    body.nav-active header .language {
        opacity: 0;
        visibility: hidden;
    }
}
@media (max-width: 767px){
    header .ttl-logo {
        transform: translateY(-100px);
        height: 4.4rem;
        width: calc(4.4rem * 5.31481481);
    }
    header.show .ttl-logo {
        transform: translateY(0);
    }
    header .ttl-logo .ttl-logo-sub {
        font-size: 1rem;
    }
    header .header-inner {
        padding: 0 calc(6% - 22px) 0 5%;
        height: 9rem;
    }
    header.min .header-inner {
        height: 8rem;
    }
    header.min .nav-btn {
        height: 8rem;
        transition: opacity 1s ease, transform 1s ease, height 0.6s ease;
    }
    header .language {
        margin-left: 1.6rem;
        margin-right: 0;
    }
}


/* -- search-box
-------------------------------------------------------------------------------- */
header .search-btn {
    width: 4rem;
    height: 4rem;
    display: flex;
    justify-content: center;
    align-items: center;
    margin-left: calc(4.8rem - 1rem);
    cursor: pointer;
    -webkit-tap-highlight-color: rgba(0,0,0,0);
    opacity: 0;
    transform: translateY(-140px);
    transition: opacity 1s ease, visibility 1s ease, transform 1s ease;
}
header.show .search-btn {
    opacity: 1;
    transform: translateY(0);
}
header .search-btn svg {
    width: 2rem;
    height: 2rem;
    fill: #161a14;
}
header.wh .search-btn svg {
    fill: #fff;
}
@media (min-width: 1025px){
    header .search-btn svg {
        transition: 0.2s ease;
    }
}
header .search-btn.active svg {
    fill: #801a20;
}
body.barba header .search-btn svg{
    fill: #161a14;
}
header .search-box {
    width: 100%;
    height: calc(100px + 140px);
    box-sizing: border-box;
    padding: 140px 0 0 80px;
    background: #fff;
    overflow: hidden;
    position: absolute;
    top: 0;
    left: 0;
    transform: translateY(-100%);
    transition: height 0.6s ease, padding 0.6s ease, background 0.6s ease, transform 0.4s ease;
}
header.wh .search-box {
    background: #fff;
}
header.min .search-box {
    height: calc(100px + 100px);
    padding-top: 100px;
}
header .search-box.active {
    transform: translateY(0);
}
.search-box form{
    width: 100%;
}
.search-box .search-box-inner{
    height: 100px;
    padding: 0 4vw;
    box-sizing: border-box;
    display: flex;
    align-items: center;
    border-top: solid 1px #f0f0f0;
    transform: translateY(calc(240px + 4rem));
    opacity: 0;
    transition: border 0s ease, transform 0.4s ease, opacity 0.4s ease;
}
header.min .search-box .search-box-inner {
    transform: translateY(calc(100px + 4rem));
    transition: border 0s ease 0.6s, transform 0.4s ease, opacity 0.4s ease;
}
header .search-box.active .search-box-inner{
    transform: translateY(0);
    opacity: 1;
}
.search-box input{
    -webkit-appearance: none;
    width: 100%;
    height: 6rem;
    font-size: 1.8rem;
    letter-spacing: 0.02em;
    padding: 0 2rem;
    box-sizing: border-box;
    border: none;
    outline: none;
    background-color: #fafafa;
    border-left: solid 1px #e0e0e0;
    border-top: solid 1px #e0e0e0;
    border-bottom: solid 1px #e0e0e0;
    border-radius: 4px 0 0 4px;
    transition: 0.6s ease;
    color: #161a14;
}
::-webkit-search-cancel-button {
   -webkit-appearance: none;
}
.search-box input::placeholder {
    color: #161a14;
    opacity: 0.2;
    letter-spacing: 0.08em;
}
.search-box input.submit-btn{
    -webkit-appearance: none;
    width: auto;
    height: 6rem;
    font-size: 2rem;
    font-weight: bold;
    padding: 0 3.2rem;
    box-sizing: border-box;
    background-color: var(--main-color);
    border: none;
    background: #801a20;
    color: #f0f0f0;
    cursor: pointer;
    -webkit-tap-highlight-color:rgba(0,0,0,0);
    border-radius: 0 4px 4px 0;
    transition: opacity 0.2s ease, background 0.2s ease;
}
@media (min-width: 1025px){
    .search-box input.submit-btn:hover{
        background: #99474c;
    }
}
@media (max-width: 1024px){
    header .search-btn {
        width: 70px;
        height: 70px;
        margin-left: 0;
        transform: translateY(-100px);
    }
    body.nav-active header .search-btn {
        opacity: 0;
        visibility: hidden;
    }
    header .search-btn svg {
        width: 2.4rem;
        height: 2.4rem;
    }
    header .search-box,
    header.min .search-box {
        padding-left: 0;
    }
}
@media (max-width: 767px){
    header .search-btn {
        width: 4rem;
        height: 9rem;
    }
    header .search-btn svg {
        width: 2rem;
        height: 2rem;
    }
    header .search-box,
    header.min .search-box {
        height: calc(9rem + 10rem);
        padding: 9rem 0 0 0;
    }
    .search-box .search-box-inner {
        height: 10rem;
        padding-left: 5%;
        padding-right: 5%;
        transform: translateY(calc(19rem + 4rem));
    }
    .search-box input.submit-btn {
        padding-left: 2.4rem;
        padding-right: 2.4rem;
    }
}


/* -- nav
-------------------------------------------------------------------------------- */
header nav {
    opacity: 0;
    transform: translateY(-140px);
    transition: 1s ease;
}
header.show nav {
    opacity: 1;
    transform: translateY(0);
}
nav ul{
    display: flex;
}
nav ul li + li{
    margin-left: 4rem;
}
nav ul li a{
    font-size: 1.6rem;
    letter-spacing: 0.02em;
    color: #fff;
}
header .nav-btn {
    display: none;
}
@media (max-width: 1024px){
    header nav {
        display: none;
    }
    header .nav-btn {
        display: block;
        width: 70px;
        height: 9rem;
        position: relative;
        transform: none;
        top: 0;
        right: 0;
        left: auto;
        transform: translateY(-100px);
        opacity: 0;
        transition: opacity 1s ease, transform 1s ease;
    }
    header.show .nav-btn {
        transform: translateY(0);
        opacity: 1;
    }
    header .nav-btn span {
        right: 22px;
    }
    .nav-active header .nav-btn span {
        right: 26px;
    }
    header.min .nav-btn span {
        border-top-color: #161a14;
    }
    header .nav-btn span{
        border-top-color: #161a14;
    }
    header.wh .nav-btn span{
        border-top-color: #fff;
    }
    body.search-active header.wh .nav-btn span{
        border-top-color: #161a14;
    }
}


/* -- side-nav
-------------------------------------------------------------------------------- */
.side-nav{
    width: 80px;
    height: 100vh;
    min-height: 800px;
    background: #15335b;
    position: fixed;
    top: 0;
    left: -80px;
    z-index: 1000;
    transition: left 1s ease, width 1s cubic-bezier(0.87, 0, 0.13, 1);
    overflow: hidden;
}
.side-nav.show{
    left: 0;
}
.side-nav.active{
    width: 100%;
}
.nav-btn{
    width: 80px;
    height: 80px;
    position: absolute;
    top: 50%;
    left: 0;
    transform: translateY(-50%);
    cursor: pointer;
    -webkit-tap-highlight-color:rgba(0,0,0,0);
}
.nav-btn span{
    display: block;
    width: 26px;
    border-top: solid 1px #fff;
    position: absolute;
    top: 50%;
    right: 27px;
    transition: transform 0s 0.5s, transform-origin 0s 0.5s, opacity 0s 0.5s, margin-top 0s 0.5s, right 0s 0.5s, border 0.3s;
}
.nav-btn span.bar-1{
    margin-top: -7px;
}
.nav-btn span.bar-3{
    margin-top: 7px;
}
.nav-btn.hide span{
    animation: nav-disp 1s linear;
}
.nav-btn span.bar-2{
    animation-delay: 0.1s;
}
.nav-btn span.bar-3{
    animation-delay: 0.2s;
}
@keyframes nav-disp {
    0% {
        width: 26px;
    }
    20% {
        width: 0;
    }
    50% {
        width: 0;
    }
    70% {
        width: 26px;
    }
    100% {
        width: 26px;
    }
}
.nav-active .nav-btn span{
    right: 31px;
}
.nav-active .nav-btn span.bar-1{
    transform-origin: top right;
    transform: rotate(-45deg);
    margin-top: -9px;
}
.nav-active .nav-btn span.bar-2{
    opacity: 0;
}
.nav-active .nav-btn span.bar-3{
    transform-origin: bottom right;
    transform: rotate(45deg);
    margin-top: 9px;
}
.side-nav .side-nav-inner{
    width: 100vw;
    height: 100%;
    position: absolute;
    top: 0;
    left: 0;
    display: flex;
    justify-content: flex-end;
    align-items: center;
    box-sizing: border-box;
    padding-left: 80px;
}
.side-nav .side-nav-inner .body{
    width: 50%;
    box-sizing: border-box;
    padding-right: 8vw;
}
.side-nav .side-nav-inner nav ul{
    display: block;
}
.side-nav .side-nav-inner nav li{
    line-height: 1.2;
}
.side-nav .side-nav-inner nav li + li{
    margin-left: 0;
    margin-top: 2.4rem;
}
.side-nav .side-nav-inner nav a{
    display: inline-block;
}
.side-nav .side-nav-inner nav a span{
    display: block;
    transform: translateY(100%) rotate(10deg);
    transform-origin: top left;
    opacity: 0;
    transition: opacity 1s ease, transform 0s ease 1s;
}
.side-nav.active .side-nav-inner nav a span{
    transform: translateY(0) rotate(0deg);
    opacity: 1;
    transition: 1s ease;
}
.side-nav.active .side-nav-inner nav li:nth-child(2) a span{
    transition-delay: 0.1s;
}
.side-nav.active .side-nav-inner nav li:nth-child(3) a span{
    transition-delay: 0.2s;
}
.side-nav.active .side-nav-inner nav li:nth-child(4) a span{
    transition-delay: 0.3s;
}
.side-nav.active .side-nav-inner nav li:nth-child(5) a span{
    transition-delay: 0.4s;
}
.side-nav.active .side-nav-inner nav li:nth-child(6) a span{
    transition-delay: 0.5s;
}
.side-nav .txt-links a.active::before {
    opacity: 0;
    transition: opacity 1s ease, width 0.4s ease;
}
.side-nav.active .txt-links a.active::before {
    width: 100%;
    left: 0;
    opacity: 1;
    transition: width 0.4s ease 1s;
}
.side-nav .side-nav-inner nav a .jp{
    font-size: 1.4rem;
    letter-spacing: 0.1em;
    margin-bottom: 0.8rem;
    overflow: hidden;
}
.side-nav .side-nav-inner nav a .en{
    font-size: 4rem;
    letter-spacing: 0.01em;
    overflow: hidden;
}
.side-nav .side-nav-inner .footer-nav{
    margin-top: 8rem;
    display: flex;
}
.side-nav .side-nav-inner .footer-nav a{
    display: inline-block;
    font-size: 1.8rem;
    letter-spacing: 0.02em;
    line-height: 1.2;
    overflow: hidden;
}
.side-nav .side-nav-inner .footer-nav a + a{
    margin-left: 4rem;
}
.side-nav .side-nav-inner .footer-nav a span{
    display: block;
    transform: translateY(100%) rotate(10deg);
    transform-origin: top left;
    opacity: 0;
    transition: opacity 1s ease, transform 0s ease 1s;
}
.side-nav.active .side-nav-inner .footer-nav a span{
    transition: 1s ease;
    transition-delay: 0.6s;
    transform: translateY(0) rotate(0deg);
    opacity: 1;
}
@media (max-width: 1024px){
    .side-nav {
        width: 0;
        min-height: auto;
    }
    .side-nav.active{
        width: calc(88% - 16px);
    }
    .side-nav .nav-btn {
        display: none;
    }
    .side-nav .side-nav-inner {
        padding-left: 0;
        width: calc(88vw - 26px);
    }
    .side-nav .side-nav-inner .body {
        width: 100%;
        padding: 0 0 0 16vw;
        box-sizing: border-box;
    }
}
@media (max-width: 767px){
    .side-nav.active {
        width: calc(84% - 24px);
    }
    .side-nav .side-nav-inner {
        position: relative;
        display: block;
        overflow: auto;
        -webkit-overflow-scrolling: touch;
    }
    .side-nav .side-nav-inner {
        padding-left: 0;
        width: calc(84vw - 26px);
    }
    .side-nav .side-nav-inner .body {
        padding: 12rem 12%;
    }
    .nav-btn span.bar-1{
        margin-top: -6px;
    }
    .nav-btn span.bar-3{
        margin-top: 6px;
    }
    .side-nav .side-nav-inner .footer-nav {
        margin-top: 6rem;
    }
    .side-nav .side-nav-inner nav a .en {
        font-size: 3.6rem;
    }
    .side-nav .side-nav-inner .footer-nav a + a{
        margin-left: 3.2rem;
    }
}


/* -- main-inner
-------------------------------------------------------------------------------- */
main{
    display: block;
    position: relative;
    z-index: 1;
}
main .main-inner{
    padding: 0 12vw;
}
@media (max-width: 767px){
    main{
        margin-bottom: 0!important;
    }
}


/* -- main-visual
-------------------------------------------------------------------------------- */
.wrapper{
    position: relative;
}
.wrapper::before{
    content: "";
    display: block;
    position: fixed;
    left: 0;
    bottom: 0;
    background: #f1f2ed;
    width: 100%;
    height: 100%;
}
.mv-wrap{
    width: 100%;
    height: 100vh;
    min-height: 800px;
    position: relative;
    display: flex;
    align-items: center;
    box-sizing: border-box;
    padding: 0 0 0 calc(16% + 80px);
    background: #1f2933;
    overflow: hidden;
}
.scene {
    min-height: 800px;
    transform: scale(0);
}
.b-an .scene {
    display: none;
}
.scene.active {
    position: fixed;
    top: 0;
    left: 80px;
    width: calc(100% - 80px);
    height: 100%;
    transform: scale(1);
    transition: transform 1s ease;
}
.scene.active.comp {
    transition: none;
}
.scene.blur {
    filter: blur(8px);
    top: 50%;
    transform: translateY(-50%);
}
.scene.hide {
    opacity: 0;
    visibility: hidden;
}
.ttl-logo{
    color: #fff;
    position: relative;
    z-index: 1;
}
.ttl-logo .shoulder{
    font-size: 3.2rem;
    font-weight: normal;
    letter-spacing: 0.02em;
    line-height: 1.2;
    overflow: hidden;
    text-indent: -0.03em;
    margin-bottom: 3.2rem;
}
.ttl-logo .shoulder span {
    display: block;
    transform: translateY(100%) rotate(10deg);
    opacity: 0;
    transform-origin: top left;
    transition: 1s ease;
}
.show .ttl-logo .shoulder span {
    transform: translateY(0) rotate(0deg);
    opacity: 1;
}
.ttl-logo .ttl-logo-main{
    font-size: 20.6rem;
    font-weight: normal;
    letter-spacing: -0.01em;
    line-height: 0.76em;
    text-indent: -0.07em;
    overflow: hidden;
}
.ttl-logo .ttl-logo-main > span{
    display: block;
    transform: translateY(100%) rotate(10deg);
    opacity: 0;
    transform-origin: top left;
    transition: transform 1s ease, opacity 1s ease;
}
.show .ttl-logo .ttl-logo-main > span{
    transform: translateY(0) rotate(0deg);
    opacity: 1;
}
.ttl-logo .ttl-logo-main .and{
    display: inline-block;
    font-size: 0.75em;
    text-indent: 0;
    line-height: 0.76em;
    margin: 0 0.08em 0 0.06em;
    transform: none;
    opacity: 1;
    transition: none;
}
.ttl-logo .ttl-logo-sub{
    font-size: 2.4rem;
    font-weight: normal;
    letter-spacing: 0.02em;
    line-height: 1.2;
    margin-top: 2rem;
    overflow: hidden;
}
.ttl-logo .ttl-logo-sub span{
    display: block;
    transform: translateY(100%) rotate(10deg);
    opacity: 0;
    transform-origin: top left;
    transition: 1s ease;
}
.show .ttl-logo .ttl-logo-sub span{
    transform: translateY(0) rotate(0deg);
    opacity: 1;
}
.ttl-logo .ttl-jp{
    font-size: 2.4rem;
    line-height: 1.6;
    letter-spacing: 0.05em;
    margin-top: 6rem;
}
.ttl-logo .ttl-jp .txt{
    display: block;
    overflow: hidden;
}
.ttl-logo .ttl-jp .txt span{
    display: block;
    transform: translateY(100%) rotate(10deg);
    opacity: 0;
    transform-origin: top left;
    transition: 1s ease;
}
.show .ttl-logo .ttl-jp .txt span{
    transform: translateY(0) rotate(0deg);
    opacity: 1;
}
.show .ttl-logo .ttl-jp .txt span{
    transition-delay: 0.1s;
}
.show .ttl-logo .ttl-jp .txt + .txt span{
    transition-delay: 0.2s;
}
.ttl-catch{
    position: absolute;
    top: calc(33.333333% + 4rem);
    right: 8%;
    transform: translate(100%, -50%);
    transition: 1s ease;
    opacity: 0;
}
.show .ttl-catch{
    opacity: 1;
    transform: translate(0, -50%);
}
.ttl-catch p{
    font-size: 2rem;
    font-weight: bold;
    color: #fff;
	writing-mode: vertical-rl;
    letter-spacing: 0.2em;
    width: calc(4rem * 1.6);
}
.ttl-catch p span{
    font-family: '游ゴシック Medium', 'Yu Gothic Medium', '游ゴシック体', YuGothic, 'ヒラギノ角ゴ Pro W3', 'Hiragino Kaku Gothic Pro', Meiryo, メイリオ, sans-serif;
}
.logo-wrap{
    width: 100%;
    height: 14.4rem;
    box-sizing: border-box;
    padding-left: calc(4% + 80px);
    padding-right: calc(4vw - 1rem);
    display: flex;
    justify-content: flex-end;
    align-items: center;
    position: absolute;
    left: 0;
    bottom: 0;
}
.logo-mark{
    background: #6B161B;
    padding: 4rem;
    transform: translateX(100%);
    transition: 1s ease;
}
.show .logo-mark{
    transform: translateX(0);
}
.logo-mark a{
    display: block;
    width: 7.2rem;
}
.logo-mark img{
    display: block;
    width: 100%;
    fill: #fff;
}
.scroll{
    display: flex;
    align-items: center;
    cursor: pointer;
    -webkit-tap-highlight-color:rgba(0,0,0,0);
    transition: 1s ease;
    transform: translateY(100%);
    opacity: 0;
}
.show .scroll{
    transform: translateY(0);
    opacity: 1;
}
.scroll p{
    font-size: 1.4rem;
    letter-spacing: 0.02em;
    color: #fff;
}
.scroll .circle{
    display: block;
    width: 3.2rem;
    height: 3.2rem;
    border: solid 1px rgba(255,255,255,0.1);
    border-radius: 100%;
    box-sizing: border-box;
    position: relative;
    margin-right: 2rem;
}
.scroll .circle::after{
    content: "";
    display: block;
    width: 100%;
    height: 100%;
    border: solid 1px;
    border-color: #5cb4c0 transparent #5cb4c0 transparent;
    border-radius: 100%;
    position: absolute;
    top: -1px;
    left: -1px;
    animation: rotate_circle 5s infinite linear;
}
@keyframes rotate_circle {
    0% {
        transform: rotate(0)
    }
    100% {
        transform: rotate(360deg)
    }
}
@media (max-width: 1024px){
    .mv-wrap {
        padding-left: 16%;
        min-height: auto;
    }
    .logo-wrap {
        padding-left: 6%;
        padding-right: 6%;
    }
    .scene {
        min-height: auto;
    }
    .scene.active {
        left: 0;
        width: 100%;
    }
}
@media (max-width: 767px){
    .mv-wrap {
        padding-left: 8%;
    }
    .logo-wrap {
        height: 10.4rem;
        padding-left: 8%;
        padding-right: 8%;
    }
    .logo-mark{
        padding: 2.4rem;
    }
    .logo-mark a {
        width: 6rem;
    }
    .ttl-logo .shoulder {
        font-size: 2.4rem;
        margin-bottom: 2rem;
    }
    .ttl-logo .ttl-logo-main {
        font-size: 12rem;
        line-height: 0.8em;
    }
    .ttl-logo .ttl-logo-sub {
        font-size: 1.4rem;
        margin-top: 1.2rem;
    }
    .ttl-logo .ttl-jp {
        font-size: 2rem;
        margin-top: 3.2rem;
    }
    .ttl-catch{
        top: calc(25% + 4rem);
        right: 7%;
    }
    .ttl-catch p {
        font-size: 1.6rem;
        width: calc(3.2rem * 1.6);
    }
    .scene.blur {
        filter: blur(2px);
    }
}


/* -- section
-------------------------------------------------------------------------------- */
section{
    padding: 8vw 0;
    padding-left: 80px;
    background: #f1f2ed;
    position: relative;
}
section.bg{
    background: #1f2933;
    color: #fff;
    position: static;
}
section.bg2{
    background: linear-gradient(#f1f2ed, #eaebe6);
}
section .section-inner{
    padding: 0 12vw;
    position: relative;
}
.section-head-ttl{
    margin-bottom: 8rem;
    position: relative;
    z-index: 2;
}
.section-head-ttl .en{
    display: block;
    font-size: 3.6rem;
    font-weight: normal;
    letter-spacing: 0.01em;
    line-height: 1.2;
    overflow: hidden;
}
.section-head-ttl .en span{
    display: block;
    transform: translateY(100%) rotate(10deg);
    transform-origin: top left;
    transition: 1s ease;
}
.section-head-ttl.show .en span{
    transform: translateY(0%) rotate(0deg);
}
.section-head-ttl .ja{
    display: block;
    font-size: 1.6rem;
    letter-spacing: 0.05em;
    line-height: 1.4;
    font-weight: normal;
    margin-top: 1.2rem;
    overflow: hidden;
}
.section-head-ttl .ja span{
    display: block;
    transform: translateY(100%) rotate(10deg);
    transform-origin: top left;
    transition: 1s ease;
}
.section-head-ttl.show .ja span{
    transform: translateY(0%) rotate(0deg);
}
.txt-box{
    font-size: 1.8rem;
    line-height: 2;
    text-align: justify;
    letter-spacing: 0.01em;
}
.txt-box p + p{
    margin-top: 1.6em;
}
.txt-box strong{
    font-size: 2.2rem;
    letter-spacing: 0.1em;
    font-weight: normal;
}
@media (max-width: 1024px){
    section {
        padding-left: 0;
    }
}
@media (max-width: 767px){
    section{
        padding: 8rem 0;
    }
    section .section-inner{
        padding: 0 8%;
    }
    .section-head-ttl {
        margin-bottom: 4rem;
    }
}


/* -- home-about
-------------------------------------------------------------------------------- */
.home-about{
    position: relative;
    overflow: hidden;
    opacity: 1;
    transform: none;
    padding-bottom: 0;
}
.home-about .home-about-inner{
    position: relative;
    padding-bottom: 8vw;
}
.home-about .bg{
    width: 42vw;
    position: absolute;
    transition: 1s ease;
    border-radius: 0.8rem;
    overflow: hidden;
    z-index: 1;
}
.home-about .bg.bg-1{
    left: calc(-4vw - 80px);
    bottom: 0;
}
.home-about .bg.bg-2{
    top: 0;
    right: -34vw;
}
@media (min-width: 1900px){
    .home-about .bg{
        width: 800px;
    }
    .home-about .bg.bg-1{
        left: calc(-76px - 80px);
        bottom: 0;
    }
    .home-about .bg.bg-2{
        top: 0;
        right: -646px;
    }
}
.home-about .bg span{
    display: block;
    width: 100%;
    padding-top: 75%;
    position: relative;
    transform: scale(1.3) rotate(10deg);
    opacity: 0;
    transition: 1s ease;
}
@media (min-width: 768px){
    .home-about .home-about-inner.show .bg span{
        transform: scale(1) rotate(0deg);
        opacity: 1;
    }
}
@media (max-width: 767px){
    .home-about .home-about-inner .bg span.show{
        transform: scale(1) rotate(0deg);
        opacity: 1;
    }
}
.home-about .bg span::before{
    content: "";
    display: block;
    width: 100%;
    height: 100%;
    position: absolute;
    top: 0;
    left: 0;
    background: url(../img/img_about.jpg) no-repeat center;
    background-size: cover;
}
.home-about .section-inner{
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    padding: 0 8vw 0 12vw;
}
.home-about .txt-box{
    width: 54vw;
    box-sizing: border-box;
    padding: 8vw 12vw 0;
}
@media (max-width: 1024px){
    .home-about .bg {
        width: 46vw;
    }
    .home-about .bg.bg-1 {
        left: 0;
    }
    .home-about .bg.bg-2{
        display: none;
    }
    .home-about .section-inner {
        padding-right: 0;
    }
}
@media (max-width: 1024px){
    .home-about .txt-box {
        padding: 8vw 8vw 0 12vw;
    }
}
@media (max-width: 767px){
    .home-about .section-inner {
        display: block;
        padding: 0 8%;
    }
    .home-about .home-about-inner {
        padding-bottom: 0;
    }
    .home-about .txt-box {
        width: 100%;
        padding: 0;
    }
    .home-about .bg {
        width: 92%;
        position: relative;
        margin-top: 8rem;
        border-radius: 0 0.8rem 0.8rem 0;
    }
    .home-about .bg span{
        padding-top: 66.666666%;
    }
}


/* -- home-news
-------------------------------------------------------------------------------- */
.home-news .section-inner{
    padding: 0 8vw;
}
.home-news .section-head-ttl{
    text-align: center;
}
.home-news .link-btn{
    justify-content: center;
    margin-top: 8rem;
}
.news-list{
    max-width: 1400px;
    margin-left: auto;
    margin-right: auto;
}
.news-list ul{
    display: flex;
    flex-wrap: wrap;
    margin: -6rem -2vw 0;
}
.news-list li{
    width: 33.333333%;
    box-sizing: border-box;
    padding: 6rem 2vw 0;
}
.news-list li a{
    display: block;
}
.news-list .news-list-img{
    border-radius: 0.8rem;
    position: relative;
    overflow: hidden;
    z-index: 1;
}
.news-list .news-list-img span{
    display: block;
    width: 100%;
    padding-top: 66.666667%;
    background: #e5e7de;
    position: relative;
    transition: 1s ease;
}
.news-list .news-list-img span.no-img::before{
    content: "";
    display: block;
    width: 60%;
    height: calc(90% * 0.44162437);
    background: url(../img/logo_blank.svg) no-repeat center;
    background-size: contain;
    margin-top: -0.25em;
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%,-50%);
    opacity: 0.15;
    z-index: 1;
}
@media (min-width: 1025px){
    .news-list a:hover .news-list-img span{
        transform: scale(1.08);
        opacity: 0.7;
    }
}
.news-list .news-list-img img{
    width: 100%;
    height: 100%;
    object-fit: cover;
    position: absolute;
    top: 0;
    left: 0;
    z-index: 1;
}
.news-list .news-list-body{
    padding: 3.2rem 2rem 0;
}
.news-list .news-list-body .ttl{
    font-size: 2rem;
}
.news-list .news-list-body .date{
    font-size: 1.6rem;
    letter-spacing: 0.02em;
    line-height: 1.4;
    color: #7e807f;
    margin-top: 1.6rem;
}
@media (max-width: 1024px){
    .news-list li{
        width: 50%;
    }
}
@media (max-width: 767px){
    .news-list ul {
        margin: 0 0;
    }
    .news-list li{
        width: 100%;
        padding: 0;
    }
    .news-list li + li{
        margin-top: 4rem;
    }
    .news-list .news-list-body {
        padding-top: 2.4rem;
    }
}


/* -- home-figure
-------------------------------------------------------------------------------- */
.home-figure{
    width: 100%;
    height: 90vh;
    margin: 0;
    background: #f1f2ed;
    position: relative;
    overflow: hidden;
    opacity: 1;
}
.home-figure .bg{
    display: block;
    width: 100%;
    height: 95vh;
    background: url(../img/img_home_figure.jpg) no-repeat center;
    background-size: cover;
    position: relative;
    opacity: 0;
    transition: opacity 1s ease;
}
.home-figure.show .bg{
    opacity: 1;
}
.home-figure .bg::before{
    content: "";
    display: block;
    width: 100%;
    height: 100%;
    background: rgba(0,0,0,0.15);
}
.home-figure .figure-txt{
    font-size: 2.6rem;
    white-space: nowrap;
    position: absolute;
    top: 25%;
    left: calc(12vw + 80px);
    transform: translate(0%,-50%);
    color: #fff;
    overflow: hidden;
}
.home-figure .figure-txt span{
    display: block;
    transform: translateY(100%) rotate(10deg);
    transform-origin: top left;
    transition: transform 1s ease;
}
.home-figure.show .figure-txt span{
    transform: translateY(0) rotate(0deg);
}
@media (max-width: 1024px){
    .home-figure {
        height: 80vw;
    }
    .home-figure .bg{
        height: 100%;
    }
    .home-figure .figure-txt {
        left: 12vw;
    }
}
@media (max-width: 767px){
    .home-figure .figure-txt {
        font-size: 2rem;
        left: 12%;
        white-space: normal;
        width: 76%;
    }
}


/* -- home-course
-------------------------------------------------------------------------------- */
.home-course{
}
.home-course .section-inner,
.home-program .section-inner{
    padding: 0 12vw 0 8vw;
    display: flex;
    align-items: center;
}
.home-course .img-area,
.home-program .img-area{
    width: 50%;
    border-radius: 0.8rem;
    position: relative;
    overflow: hidden;
    z-index: 1;
}
.home-course .img-area .bg-img,
.home-program .img-area .bg-img{
    width: 100%;
    padding-top: 66.666667%;
    position: relative;
}
.home-course .img-area .bg-img span,
.home-program .img-area .bg-img span{
    width: 100%;
    height: 100%;
    background: url(../img/img_course.jpg) no-repeat center;
    background-size: cover;
    position: absolute;
    top: 0;
    left: 0;
    transform: scale(1.3) rotate(8deg);
    transition: 1s ease;
}
.home-course .img-area .bg-img.show span,
.home-program .img-area .bg-img.show span{
    transform: scale(1) rotate(0deg);
}
.home-course .txt-area,
.home-program .txt-area{
    width: 50%;
    box-sizing: border-box;
    padding-left: 8vw;
}
@media (max-width: 1024px){
    .home-course .section-inner, .home-program .section-inner {
        padding: 0 8%;
    }
    .home-course .img-area, .home-program .img-area {
        width: 47%;
    }
    .home-course .txt-area, .home-program .txt-area {
        width: 53%;
    }
}
@media (max-width: 767px){
    .home-course .section-inner, .home-program .section-inner {
        padding: 0 8%;
        display: block;
    }
    .home-course .img-area, .home-program .img-area {
        width: 100%;
    }
    .home-course .txt-area, .home-program .txt-area {
        width: 100%;
        padding-left: 0;
        margin-top: 6rem;
    }
}


/* -- home-program
-------------------------------------------------------------------------------- */
.home-program {
    padding-top: 0;
}
.home-program .section-inner{
    padding: 0 8vw 0 12vw;
    flex-direction: row-reverse;
}
.home-program .img-area .bg-img span{
    background-image: url(../img/img_program.jpg);
}
.home-program .txt-area{
    padding-left: 0;
    padding-right: 8vw;
}
@media (max-width: 1024px){
    .home-program .section-inner {
        padding: 0 8vw;
    }
}
@media (max-width: 767px){
    .home-program .txt-area {
        padding-right: 0;
    }
}


/* -- home-collaboration
-------------------------------------------------------------------------------- */
.home-collaboration {
    padding: 0;
    display: flex;
    background: #7e807f;
    color: #fff;
}
.home-collaboration .section-inner{
    padding: 8vw 8vw;
    flex: 1;
}
.home-collaboration .txt-box{
}
.home-collaboration .link-btn{
}
.home-collaboration .bg-img{
    width: calc(50% + 40px);
    overflow: hidden;
}
.home-collaboration .bg-img span{
    display: block;
    width: 100%;
    height: 100%;
    background: url(../img/img_collaboration.jpg) no-repeat center;
    background-size: cover;
    transform: scale(1.2) rotate(4deg);
    transition: 1s ease;
}
.home-collaboration .bg-img.show span{
    transform: scale(1) rotate(0);
}
@media (max-width: 1024px){
    .home-collaboration {
        display: block;
    }
    .home-collaboration .bg-img {
        width: 100%;
        height: 66.666666vw;
    }
}
@media (max-width: 767px){
    .home-collaboration .section-inner{
        padding: 6rem 8% 8rem;
    }
    .home-collaboration .bg-img {
        width: 100%;
        height: 75vw;
    }
}


/* -- home-related-links
-------------------------------------------------------------------------------- */
.home-related-links .section-inner {
    display: flex;
    padding: 0;
}
.home-related-links .section-head-ttl {
    flex: 1;
    padding-left: 8vw;
    margin-bottom: 0;
}
.link-list {
    margin: 0 0 -4rem;
}
.home-related-links .link-list {
    width: 60%;
    padding-right: 8vw;
    box-sizing: border-box;
}
.link-list li {
    font-size: 1.8rem;
    padding: 4rem 0;
    border-top: solid 1px rgba(0,0,0,0.07);
}
.link-list li a {
    display: block;
    position: relative;
    padding-right: calc(4.8rem + 2rem);
}
.link-list li a span,
.accordion-content-head .mark{
    display: block;
    width: 0.8rem;
    height: 0.8rem;
    background: #801a20;
    border-radius: 100%;
    overflow: hidden;
    position: absolute;
    top: 50%;
    right: 2.4rem;
    transform: translate(50%, -50%);
    transition: 0.4s ease;
}
.link-list li a span svg,
.accordion-content-head .mark svg{
    display: block;
    width: 1.2rem;
    fill: #fff;
    position: absolute;
    top: 50%;
    left: 50%;
    margin-left: -3.2rem;
    transform: translate(-50%,-50%);
}
.link-list li a[target="_blank"] span svg{
    margin-top: 3.2rem;
    transform: translate(-50%,-50%) rotate(-45deg);
}
.link-list li a.pdf span svg,
.accordion-content-head .mark svg{
    width: 1.6rem;
    margin-left: 0;
    margin-top: 0;
    transform: translate(-50%,-50%) scale(0);
}
.link-list li a.pdf::after{
    display: none;
}
.link-list li a.pdf span svg,
.accordion-content-head .mark svg{
    transform: translate(-50%,-50%);
    margin-top: 3.2rem;
    opacity: 0;
}
@media (min-width: 1025px){
    .link-list li a:hover span,
    .accordion-content-head:hover .mark{
        width: 4.8rem;
        height: 4.8rem;
    }
    .link-list li a:hover span svg,
    .accordion-content-head:hover .mark svg {
        margin-left: 0;
        margin-top: 0;
        transition: 0.4s ease;
    }
    .link-list li a.pdf:hover span svg,
    .accordion-content-head:hover .mark svg{
        margin-top: 0;
        opacity: 1;
    }
}
@media (max-width: 1024px){
    .link-list li a span,
    .accordion-content-head .mark{
        width: 4.8rem;
        height: 4.8rem;
    }
    .link-list li a span svg,
    .accordion-content-head .mark svg {
        margin-left: 0;
        margin-top: 0;
        transition: 0.4s ease;
    }
    .link-list li a.pdf span svg,
    .accordion-content-head .mark svg{
        margin-top: 0;
        opacity: 1;
    }
    .link-list li a[target="_blank"] span svg {
        margin-top: 0;
    }
}
@media (max-width: 767px){
    .link-list li {
        padding: 2.4rem 0;
    }
    .link-list li a {
        padding-right: calc(4rem + 2rem);
    }
    .home-related-links .section-inner {
        display: block;
    }
    .link-list li a span,
    .accordion-content-head .mark{
        width: 4rem;
        height: 4rem;
        right: 2rem;
    }
    .home-related-links .section-head-ttl {
        padding-left: 8%;
        padding-right: 8%;
    }
    .home-related-links .link-list {
        width: 100%;
        padding-left: 8%;
        padding-right: 8%;
        margin-top: 4rem;
    }
}


/* -- breadcrumb
-------------------------------------------------------------------------------- */
.breadcrumb {
    display: flex;
    position: absolute;
    top: 140px;
    left: calc(80px + 4vw);
    z-index: 1;
}
.breadcrumb li {
    font-size: 1.4rem;
    letter-spacing: 0.02em;
    color: rgba(255,255,255,0.5);
    position: relative;
}
.breadcrumb li + li {
    margin-left: 4rem;
}
.breadcrumb li + li::before {
    content: "";
    display: block;
    width: 4px;
    height: 4px;
    border-top: solid 1px #fff;
    border-right: solid 1px #fff;
    transform: rotate(45deg) translate(-50%,-50%);
    position: absolute;
    top: calc(50% + 1px);
    left: -2.4rem;
}
.breadcrumb li a {
    display: block;
    color: #fff;
}
.breadcrumb li a::before {
    background: #fff;
}
.breadcrumb li span {
    display: block;
    max-width: 24em;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}
.bg-wh .breadcrumb li {
    color: #7e807f;;
}
.bg-wh .breadcrumb li + li::before {
    border-top-color: #161a14;
    border-right-color: #161a14;
}
.bg-wh .breadcrumb li a {
    color: #161a14;
}
.bg-wh .breadcrumb li a::before {
    background: #161a14;
}
.bg-wh .breadcrumb li a::after {
    background: #161a14;
}
.breadcrumb small {
    font-size: 1em;
}
@media (max-width: 1024px){
    .breadcrumb {
        top: 140px;
        left: 6vw;
    }
}
@media (max-width: 767px){
    .breadcrumb {
        display: none;
    }
}


/* -- anchor-link
-------------------------------------------------------------------------------- */
.anchor-link {
    padding-left: 80px;
    background: #f1f2ed;
    border-bottom: solid 1px rgba(0,0,0,0.07);
}
.anchor-link ul {
    display: flex;
    justify-content: center;
    padding: 0 8vw;
}
.anchor-link li {
    padding: 0 4rem;
}
.anchor-link li a {
    display: block;
    font-size: 1.6rem;
    letter-spacing: 0.05em;
    padding: 4rem 0;
    position: relative;
}
.anchor-link li a::after {
    content: "";
    display: block;
    width: 0;
    height: 4px;
    background: #6B161B;
    position: absolute;
    left: 50%;
    bottom: -1px;
    transform: translateX(-50%);
    transition: 0.4s ease;
}
@media (min-width: 1025px){
    .anchor-link li a:hover::after {
        width: 100%;
    }
}
@media (max-width: 767px){
    .anchor-link {
        padding-left: 0;
    }
    .anchor-link ul {
        padding: 0;
    }
    .anchor-link li {
        padding: 0 1.6rem;
    }
}


/* -- page-head
-------------------------------------------------------------------------------- */
.page-head {
    padding-top: calc(16vw + 8rem);
    padding-bottom: 8vw;
    border-bottom: solid 1px rgba(0,0,0,0.07);
    z-index: 1;
}
.page-head:not(.bg-wrap) + section {
    padding-top: 6vw;
}
.page-head .page-head-inner {
    padding: 0 8vw;
}
.news-details .page-head .page-head-inner {
    padding: 0 12vw;
}
.page-head .section-head-ttl {
    margin-bottom: 0;
}
.page-head.bg-wrap {
    position: relative;
    overflow: hidden;
    padding-bottom: 16vw;
    border-bottom: none;
}
@media (min-width: 1600px){
    .page-head {
        padding-top: calc(256px + 8rem);
        padding-bottom: 128px;
    }
    .page-head.bg-wrap {
        padding-bottom: 256px;
    }
}
.page-head .bg {
    width: 100%;
    height: 100%;
    position: absolute;
    top: 0;
    left: 0;
    transform: scale(1.2) rotate(6deg);
    opacity: 0;
    transition: 1s ease;
}
.page-head .bg.show {
    transform: scale(1) rotate(0deg);
    opacity: 1;
}
.page-head .bg span {
    display: block;
    width: 100%;
    height: 100%;
    background: url(../img/img_about.jpg) no-repeat center;
    background-size: cover;
}
.page-head .bg span::before {
    content: "";
    display: block;
    width: 100%;
    height: 100%;
    position: absolute;
    top: 0;
    left: 0;
    background: rgba(0,0,0,0.4);
}
.page-head .section-head-ttl .en {
    font-size: 4.2rem;
}
.page-head.bg-wrap .section-head-ttl {
    color: #fff;
}
@media (max-width: 767px){
    .news-details .page-head .page-head-inner {
        padding: 0 8%;
    }
    .page-head {
        padding-top: calc(16vw + 8rem);
        padding-bottom: 6rem;
    }
    .page-head:not(.bg-wrap) + section {
        padding-top: 6rem;
    }

}


/* -- page-body
-------------------------------------------------------------------------------- */
.page-body.bg{
    background: #1f2933;
    color: #fff;
}
.page-body.bg2{
    background: #e5e7de;
}
.page-body .page-body-inner{
    display: flex;
}
.page-body .page-body-inner + .page-body-inner{
    margin-top: 6vw;
}
.page-body + .page-body{
    border-top: solid 1px rgba(0,0,0,0.07);
}
.page-body.bg + .page-body,
.page-body + .page-body.bg,
.page-body.bg2 + .page-body,
.page-body + .page-body.bg2{
    border-top: none;
}
.page-body .ttl-area{
    flex: 1;
    padding: 0 4rem 0 8vw;
}
.page-body .page-body-ttl{
    font-size: 3rem;
    letter-spacing: 0.05em;
    line-height: 1.6;
    position: sticky;
    top: 8vw;
    transition: opacity 1s ease, top 0.6s ease;
    padding-top: 4rem;
}
header:not(.hide) + .barba-wrapper .page-body .page-body-ttl {
    top: var(--header-height);
}
.page-body .page-body-ttl::before,
.page-body .page-body-ttl::after,
.article-head-ttl::before,
.article-head-ttl::after{
    content: "";
    display: block;
    width: 0.8rem;
    height: 0.8rem;
    background: #801a20;
    border-radius: 100%;
    position: absolute;
    top: 0;
    left: 0.2rem;
}
.page-body .page-body-ttl::after,
.article-head-ttl::after{
    background: #7e807f;
    left: 1.8rem;
}
.page-body.bg .page-body-ttl::after{
    background: rgba(255,255,255,0.5);
}
header:not(.hide) + main .page-body .page-body-ttl {
    top: var(--header-height);
}
.page-body .page-body-ttl + .txt-box{
    margin-top: 4rem;
}
.page-body .content-area{
    width: 100%;
    max-width: 100rem;
    margin-left: auto;
    margin-right: auto;
    padding: 0 8vw;
}
.page-body .ttl-area + .content-area{
    width: 60%;
    max-width: none;
    padding: 0 8vw 0 0;
    box-sizing: border-box;
}
.page-body .ttl-area + .content-area .article{
    max-width: none;
}
.page-body .content-area .content-inner + .content-inner{
    margin-top: 6rem;
    padding-top: 6rem;
    border-top: solid 1px rgba(0,0,0,0.07);
}
.page-body.bg .content-area .content-inner + .content-inner{
    border-top-color: rgba(255,255,255,0.07);
}
.page-body .content-area .content-inner.flex a{
    width: 100%;
    display: flex;
    align-items: center;
}
.page-body .content-ttl{
    font-size: 2.6rem;
    letter-spacing: 0.05em;
    line-height: 1.4;
    margin-bottom: 4rem;
}
.page-body .content-area .name-box{
    margin-top: 4rem;
}
.page-body .content-area .name-box span{
    display: block;
    line-height: 1.6;
}
.page-body .content-area .name-box .name{
    font-size: 2.4rem;
    letter-spacing: 0.1em;
    line-height: 1.6;
}
.page-body .content-area .img-box{
    margin-top: 8rem;
    overflow: hidden;
    position: relative;
    border-radius: 0.8rem;
}
.page-body .content-area .img-box + .txt-box{
    margin-top: 8rem;
}
.page-body .content-area .img-box:first-child{
    margin-top: 0;
}
.page-body .content-area .img-box img{
    width: 100%;
}
.page-body .content-area .img-box.video{
    width: 100%;
    padding-top: 56.25%;
    position: relative;
}
.page-body .content-area .img-box.video:last-child{
    margin-bottom: 0;
}
.page-body .content-area .img-box iframe{
    width: 100%;
    height: 100%;
    position: absolute;
    top: 0;
    left: 0;
}
.page-body .content-area .links{
    margin-top: 4rem;
}
.page-body .content-area .links li{
    font-size: 1.8rem;
}
.page-body .content-area .links li + li{
    margin-top: 0.6rem;
}
.page-body .member{
    display: flex;
    flex-flow: wrap;
    margin: -6rem -2.4rem 0;
}
.page-body .member + .member{
    margin-top: 0;
}
.page-body .member li{
    width: 50%;
    padding: 6rem 2.4rem 0;
    box-sizing: border-box;
}
@media (min-width: 1800px){
    .page-body .member li{
        width: 33.333333%;
    }
}
.page-body .member li .member-inner{
}
.page-body .member .img{
    width: 100%;
    padding-top: 75%;
    overflow: hidden;
    position: relative;
}
.page-body .member .img img{
    width: 100%;
    height: 100%;
    object-fit: cover;
    border-radius: 0.8rem;
    position: absolute;
    top: 0;
    left: 0;
}
.page-body .member .img + .body{
    margin-top: 3.2rem;
}
.page-body .member .name{
    font-size: 2.2rem;
    letter-spacing: 0.05em;
}
.page-body .member .affiliation{
    font-size: 1.6rem;
    color: #7e807f;
    margin-top: 1.2rem;
}
.page-body .member .field{
    font-size: 1.6rem;
    color: #7e807f;
    margin-top: 0.4rem;
}
.page-body .member .message{
    margin-top: 2.4rem;
    display: none;
}
.page-body .member .message p{
    font-size: 1.6rem;
    line-height: 1.8;
    text-align: justify;
}
.page-body .member .message-btn{
    display: flex;
    margin-top: 2.4rem;
}
.page-body .member .message-btn span{
    display: block;
    font-size: 1.6rem;
    letter-spacing: 0.02em;
    font-weight: bold;
    border: solid 1px #7e807f;
    color: #7e807f;
    padding: 1.1rem 1.9rem;
    padding-right: calc(1.9rem + 1rem + 1.2rem);
    border-radius: 0.4rem;
    cursor: pointer;
    -webkit-tap-highlight-color:rgba(0,0,0,0);
    position: relative;
    transition: 0.4s ease;
}
.page-body .member .message-btn span i{
    display: block;
    width: 1rem;
    height: 1rem;
    position: absolute;
    right: 1.9rem;
    top: 50%;
    transform: translateY(-50%);
    transition: transform 0.4s ease;
}
@media (min-width: 1025px){
    .page-body .member .message-btn span:hover{
        border-color: #6B161B;
        color: #6B161B;
    }
    .page-body .member .message-btn span:hover i{
        transform: translateY(-50%) rotate(90deg);
    }
}
.page-body .member .message-btn span i::before,
.page-body .member .message-btn span i::after{
    content: "";
    display: block;
    width: 100%;
    border-top: solid 1px;
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%,-50%);
    transition: transform 0.4s ease;
}
.page-body .member .message-btn span i::after{
    transform: translate(-50%,-50%) rotate(90deg);
}
.page-body .member .message-btn span.active{
    border-color: #6B161B;
    color: #fff;
    background: #6B161B;
}
.page-body .member .message-btn span.active i{
    transform: translateY(-50%) rotate(90deg);
}
.page-body .member .message-btn span.active i::before{
    transform: translate(-50%,-50%) rotate(90deg);
}
@media (max-width: 1024px){
    .page-body .content-area{
        max-width: none;
        box-sizing: border-box;
    }
}
@media (max-width: 767px){
    .page-body .page-body-inner {
        display: block;
    }
    .page-body .page-body-inner + .page-body-inner {
        margin-top: 6rem;
    }
    .page-body .ttl-area {
        padding: 0 8%;
    }
    .page-body .ttl-area + .content-area {
        width: 100%;
        padding: 0 8%;
        margin-top: 4rem;
    }
    .page-body .content-area .content-inner + .content-inner {
        margin-top: 4rem;
        padding-top: 4rem;
    }
    .page-body .content-ttl {
        margin-bottom: 2.4rem;
    }
    .page-body .content-area .img-box,
    .page-body .content-area .img-box + .txt-box {
        margin-top: 4rem;
    }
    .page-body .content-area .links {
        margin-top: 3.2rem;
    }
    .page-body .page-body-ttl,
    .article-head-ttl{
        padding-top: 3.2rem;
    }
    .page-body .page-body-ttl::before,
    .page-body .page-body-ttl::after,
    .article-head-ttl::before,
    .article-head-ttl::after {
        top: 0;
    }
    .page-body .member {
        margin: -0;
    }
    .page-body .member + .member {
        margin-top: 4rem;
    }
    .page-body .member li {
        width: 100%;
        padding: 0;
    }
    .page-body .member li + li {
        margin-top: 4rem;
    }
    .page-body .member .img {
        padding-top: 66.666666%;
    }
    .page-body .member .img + .body {
        margin-top: 2.4rem;
    }
}


/* -- page-body(flex)
-------------------------------------------------------------------------------- */
.page-body .content-inner.flex{
    display: flex;
    align-items: center;
}
.page-body .content-inner.flex .img-area{
    width: 50%;
    border-radius: 0.8rem;
    position: relative;
    overflow: hidden;
    z-index: 1;
}
.page-body .content-inner.flex .img-area .bg-img {
    width: 100%;
    padding-top: 75%;
    position: relative;
}
.page-body .content-inner.flex .img-area .bg-img span {
    width: 100%;
    height: 100%;    
    background-repeat: no-repeat;
    background-position: center;
    background-size: cover;
    position: absolute;
    top: 0;
    left: 0;
    transform: scale(1.3) rotate(8deg);
    transition: 1s ease;
}
.page-body .content-inner.flex .img-area .bg-img.show span {
    transform: scale(1) rotate(0deg);
}
@media (min-width: 1025px){
    .page-body .content-inner.flex:hover .img-area .bg-img.show span {
        transform: scale(1.08) rotate(0deg);
        opacity: 0.7;
    }
}
.page-body .content-inner.flex .txt-area{
    width: 50%;
    box-sizing: border-box;
    padding-left: 8rem;
}


/* -- pager
-------------------------------------------------------------------------------- */
.pager {
    display: flex;
    align-items: center;
    justify-content: center;
    margin-top: 6vw;
    padding-top: 6vw;
    border-top: solid 1px rgba(0,0,0,0.07);
}
.pager ul{
    display: flex;
    align-items: center;
    margin: 0 -0.4rem;
}
.pager ul li{
    margin: 0 0.4rem;
}
.pager ul li a,
.pager ul li p{
    display: flex;
    justify-content: center;
    align-items: center;
    width: 4rem;
    height: 4rem;
    font-size: 1.4rem;
    border-radius: 100%;
    border: solid 1px rgba(0,0,0,0.12);
    transition: background 0.3s ease;
}
.pager ul li p{
    background: #6B161B;
    border-color: #6B161B;
    color: #fff;
}
@media (min-width: 1025px){
    .pager ul li a:hover{
        background: #e5e7de;
    }
}
.pager .prev,
.pager .next{
    font-size: 1.6rem;
    letter-spacing: 0.02em;
}
.pager p span{
    color: #7e807f;
}
.pager .prev{
    margin-right: 4rem;
}
.pager .next{
    margin-left: 4rem;
}
@media (max-width: 767px){
    .page-body .content-inner.flex{
        display: block;
    }
    .page-body .content-area .content-inner.flex a{
        display: block;
    }
    .page-body .content-inner.flex .img-area {
        width: 100%;
    }
    .page-body .content-inner.flex .txt-area {
        width: 100%;
        padding-left: 0;
        margin-top: 3.2rem;
    }
    .pager ul li a, .pager ul li p {
        width: 3.2rem;
        height: 3.2rem;
    }
    .pager .prev{
        margin-right: 2rem;
    }
    .pager .next{
        margin-left: 2rem;
    }
}


/* -- article
-------------------------------------------------------------------------------- */
.news-details{
}
.return-btn {
    margin-top: 6vw;
    padding-top: 6vw;
    border-top:solid 1px rgba(0,0,0,0.07);
    display: flex;
    justify-content: center;
}
.return-btn .link-btn {
    margin-top: 0;
}
.article-head {
    max-width: 100rem;
    margin-left: auto;
    margin-right: auto;
    padding: 0 12vw;
}
.article-head-ttl {
    font-size: 3.6rem;
    letter-spacing: 0.05em;
    line-height: 1.4;
    position: relative;
    padding-top: 4rem;
}
.article-head-ttl + .txt-box {
    margin-top: 4rem;
}
.article-date {
    font-size: 1.8rem;
    letter-spacing: 0.02em;
    line-height: 1.4;
    color: #7e807f;
    margin-top: 2rem;
}
.article {
    max-width: 100rem;
    margin-left: auto;
    margin-right: auto;
}
.article .img-box {
    width: 100%;
    margin: 8rem 0;
    overflow: hidden;
    border-radius: 0.8rem;
    position: relative;
}
.article .img-box.min {
    width: 60%;
    margin-left: auto;
    margin-right: auto;
}
.page-body .ttl-area + .content-area.article .img-box.min{
    width: 80%;
}
.article .img-box:first-child {
    margin-top: 0;
}
.article .img-box img {
    width: 100%;
}
.article .article-ttl {
    font-size: 2.6rem;
    letter-spacing: 0.05em;
    margin-top: 8rem;
    margin-bottom: 4rem;
}
.article .article-ttl:first-child {
    margin-top: 0;
}
.article .article-sub-ttl {
    font-size: 2rem;
    letter-spacing: 0.05em;
    margin-top: 4.8rem;
    margin-bottom: 2rem;
}
.article .article-sub-ttl:first-child {
    margin-top: 0;
}
.article .data-list {
    margin-top: 8rem;
}
.article .article-ttl + .data-list {
    margin-top: 0;
}
.article .data-list dl {
    display: flex;
    font-size: 1.8rem;
    border-top: solid 1px rgba(0,0,0,0.07);
}
.article .data-list dt {
    width: 30%;
    padding: 3.2rem 4rem 3.2rem 0;
    box-sizing: border-box;
}
.article .data-list dd {
    flex: 1;
}
.article .data-list .data-list-ttl {
    font-size: 1.8rem;
    letter-spacing: 0.05em;
}
.article .data-list .data-list-box {
    padding: 3.2rem 0;
}
.article .data-list .data-list-box + .data-list-box {
    border-top: solid 1px rgba(0,0,0,0.07);
}
.article .data-list ul,
.article .data-list p + p,
.article .data-list .data-list-ttl + p,
.article .data-list ul + p{
    margin-top: 1.2rem;
}
.article .data-list ul:first-child {
    margin-top: 0;
}
.article .data-list li,
.article .list li{
    padding-left: calc(1em + 0.7rem);
    position: relative;
}
.article .data-list li::before,
.article .list li::before{
    content: "";
    display: block;
    width: 0.6rem;
    height: 0.6rem;
    background: #801a20;
    border-radius: 100%;
    position: absolute;
    top: 1.1rem;
    left: 0.1rem;
}
.article .data-list li span {
    color: #161a14;
}
.article .data-list li + li,
.article .list li + li{
    margin-top: 0.8rem;
}
.article .txt-box + .list {
    margin-top: 4rem;
}
.article .list li {
    font-size: 1.8rem;
}
.article a {
    text-decoration: underline; 
    color: #6B161B;
}
.article .link-list a {
    text-decoration: none; 
    color: #161a14;
}
@media (max-width: 767px){
    .article-head-ttl {
        font-size: 3.4rem;
    }
    .article .article-ttl {
        margin-top: 4rem;
        margin-bottom: 2.4rem;
    }
    .article .img-box {
        margin: 4rem 0;
    }
    .article .data-list .data-list-box {
        padding: 2.4rem 0;
    }
    .article .data-list dt {
        padding: 2.4rem 3.2rem 2.4rem 0;
    }
    .article .data-list li::before,
    .article .list li::before{
        top: 1rem;
    }
    .article .txt-box + .list {
        margin-top: 2.4rem;
    }
    .article .img-box.min {
        width: 100%;
    }
    .return-btn {
        margin-top: 6rem;
        padding-top: 6rem;
    }
}


/* -- about
-------------------------------------------------------------------------------- */
.about .page-head .page-head-inner {
    height: 100%;
    position: relative;
    display: flex;
    justify-content: flex-end;
    align-items: center;
    padding-right: 20vw;
}
.about .page-head .section-head-ttl{
    text-align: center;
    transform: translateX(50%);
}
@media (max-width: 767px){
    .about .page-head .page-head-inner {
        padding: 0;
        justify-content: center;
    }
    .about .page-head .section-head-ttl {
        transform: none;
    }
}


/* -- course
-------------------------------------------------------------------------------- */
.course .page-head {
    background: #1f2933;
}
.course .page-head .page-head-inner {
    height: 100%;
    position: relative;
    display: flex;
    justify-content: flex-end;
    align-items: center;
    padding-right: 20vw;
}
.course .page-head .section-head-ttl{
    text-align: center;
    transform: translateX(50%);
}
.course .page-head .bg{
    width: calc((100% + 80px) * 0.57);
}
.course .page-head .bg span{
    background-image: url(../img/img_course.jpg);
}
@media (max-width: 767px){
    .course .page-head .page-head-inner {
        justify-content: center;
        padding: 0;
    }
    .course .page-head .section-head-ttl {
        transform: none;
    }
    .course .page-head .bg {
        width: calc(84vw - 26px);
    }
}


/* -- program
-------------------------------------------------------------------------------- */
.program .page-head {
    background: #1f2933;
}
.program .page-head .page-head-inner {
    height: 100%;
    position: relative;
    display: flex;
    align-items: center;
    padding-left: 20vw;
}
.program .page-head .section-head-ttl{
    text-align: center;
    transform: translateX(-50%);
}
.program .page-head .bg{
    width: calc((100% - 80px) * 0.57);
    left: auto;
    right: 0;
}
.program .page-head .bg span{
    background-image: url(../img/img_program.jpg);
}
.program .page-body .content-ttl span{
    display: block;
    font-size: 1.8rem;
    margin-bottom: 1.2rem;
    font-weight: normal;
    color: #7e807f;
}
@media (max-width: 767px){
    .program .page-head .page-head-inner {
        padding-left: 0;
        padding-right: 0;
        justify-content: center;
    }
    .program .page-head .section-head-ttl {
        transform: none;
    }
    .program .page-head .bg {
        width: calc(84vw - 26px);
        right: auto;
    }
    .page-body .content-area .content-inner + .content-inner {
        margin-top: 6rem;
        padding-top: 6rem
    }
}


/* -- program-details
-------------------------------------------------------------------------------- */
.program-details .article .article-ttl {
    border-top: solid 1px rgba(0,0,0,0.07);
    padding-top: 8rem;
}
.program-details .article .article-ttl:first-child {
    border-top: none;
    padding-top: 0;
}
.program-details .article .data-list dt {
    width: 4em;
}
.program-details .article-head .txt-area{
    width: 66%;
    box-sizing: border-box;
    padding-right: 12rem;
}
.program-details .bg-img{
    width: calc((100% - 80px) * 0.4);
    height: 100%;
    position: absolute;
    right: 0;
    top: 0;
    overflow: hidden;
}
.program-details .bg-img .bg-img-inner {
    width: 100%;
    height: 100%;
    position: absolute;
    top: 0;
    left: 0;
    transform: scale(1.2) rotate(8deg);
    transition: 1s ease;
}
.program-details .bg-img.show .bg-img-inner {
    transform: scale(1) rotate(0deg);
}
.program-details .bg-img .bg-img-inner span {
    display: block;
    width: 100%;
    height: 100%;    
    background-repeat: no-repeat;
    background-position: center;
    background-size: cover;
}
.program-details .article-head-ttl span {
    display: block;
    font-size: 1.8rem;
    margin-bottom: 1.2rem;
    font-weight: normal;
    color: #7e807f;
}
.program-details .page-body {
    overflow: hidden;
}
.program-list-wrap{
    padding-top: 8vw;
    padding-bottom: 8vw;
}
.program-list{
}
.program-list ul{
    display: flex;
    flex-wrap: wrap;
    margin: -6rem -1.5vw 0;
}
.program-list li{
    width: 50%;
    box-sizing: border-box;
    padding: 6rem 1.5vw 0;
}
.program-list ul.flex-3 li{
    width: 33.333333%;
}
.program-list li a{
    display: block;
}
.program-list .program-list-img{
    border-radius: 0.8rem;
    position: relative;
    overflow: hidden;
}
.program-list .program-list-img span{
    display: block;
    width: 100%;
    padding-top: 66.666667%;
    transform: scale(1.1);
    transition: 1s ease;
}
@media (min-width: 1025px){
    .program-list a:hover .program-list-img span{
        transform: scale(1.188);
        opacity: 0.7;
    }
}
.program-list .program-list-img img{
    width: 100%;
    height: 100%;
    object-fit: cover;
    position: absolute;
    top: 0;
    left: 0;
    z-index: 1;
}
.program-list .program-list-body{
    padding: 3.2rem 1.6rem 0;
}
.program-list .program-list-body .ttl{
    font-size: 2.2rem;
    letter-spacing: 0.05em;
    line-height: 1.4;
}
.program-details .ondemand-link{
    padding-top: 8vw;
    padding-bottom: 8vw;
    position: relative;
}
.program-details .ondemand-link .ondemand-link-inner{
    display: block;
    width: 100%;
    height: 100%;
    box-sizing: border-box;
    padding: 12rem;
    border-radius: 0.8rem;
    overflow: hidden;
    position: relative;
    background-color: #d5d7d6;
}
.program-details .ondemand-link .ondemand-link-inner::before{
    content: "";
    display: block;
    width: 100%;
    height: 100%;
    background: url(../img/img_ondemand.jpg) no-repeat center;
    background-size: cover;
    position: absolute;
    top: 0;
    left: 0;
    transition: 1s ease;
}
@media (min-width: 1025px){
    .program-details .ondemand-link .ondemand-link-inner:hover::before{
        transform: scale(1.03);
        opacity: 0.7;
    }
}
.program-details .ondemand-link .ondemand-link-inner-box{
    position: relative;
    z-index: 1;
    color: #fff;
}
.program-details .ondemand-link .content-ttl{
    font-size: 3.2rem;
    letter-spacing: 0.05em;
}
.program-details .ondemand-link .txt-box{
    padding-right: 12rem;
}
@media (min-width: 1800px){
    .page-body .content-area.level-list{
        max-width: none;
        display: flex;
        align-items: flex-start;
        flex-wrap: wrap;
        margin: -8rem -1.5vw 0;
        box-sizing: border-box;
    }
    .page-body .content-area.level-list .content-inner.flex{
        width: 25%;
        padding: 8rem 1.5vw 0;
        box-sizing: border-box;
    }
    .page-body .content-area.level-list .content-inner.flex a{
        display: block;
    }
    .page-body .content-area.level-list .content-inner.flex .img-area {
        width: 100%;
    }
    .page-body .content-area.level-list .content-inner.flex .txt-area {
        width: 100%;
        padding: 3.2rem 1.6rem 0;
    }
    .page-body .content-area.level-list .content-inner + .content-inner {
        margin-top: 0;
        border-top: none;
    }
}
@media (max-width: 767px){
    .program-details .ondemand-link .ondemand-link-inner::before{
        background-position: center right 15%;
    }
    .program-details .ondemand-link .ondemand-link-inner::after {
        content: "";
        display: block;
        width: 100%;
        height: 100%;
        position: absolute;
        top: 0;
        left: 0;
        background: rgba(0,0,0,0.2);
    }
    .program-details .ondemand-link {
        padding-top: 8rem;
        padding-bottom: 8rem;
    }
    .program-details .ondemand-link .ondemand-link-inner {
        padding: 4rem;
    }
    .program-details .ondemand-link .content-ttl {
        font-size: 2.6rem;
    }
    .program-details .ondemand-link .txt-box{
        padding-right: 8rem;
    }
    .program-list-wrap {
        padding-top: 6rem;
        padding-bottom: 6rem;
    }
    .program-list ul{
        display: block;
        margin: 0;
    }
    .program-list li,
    .program-list ul.flex-3 li{
        width: 100%;
        padding: 0 0;
    }
    .program-list li + li{
        margin-top: 4rem;
    }
    .program-list .program-list-body {
        padding-top: 2.4rem;
    }
    .program-details .article .article-ttl {
        padding-top: 4rem;
    }
    .article .txt-box + .data-list {
        margin-top: 4rem;
    }
    .program-details .article .data-list dt {
        width: 2em;
    }
    .program-details .article-head .txt-area {
        width: 100%;
        padding-right: 0;
    }
    .program-details .page-head {
        padding-top: calc(40vw + 12rem);
        padding-bottom: 6rem;
    }
    .program-details .bg-img {
        width: 65%;
        height: calc(40vw + 16rem);
    }
    .program-details .ondemand-link .txt-box{
        font-size: 1.6rem;
        line-height: 1.8;
    }
}


/* -- collaboration
-------------------------------------------------------------------------------- */
.collaboration .page-head {
    background: #a3bcc1;
}
.collaboration .page-head .page-head-inner {
    height: 100%;
    position: relative;
    display: flex;
    justify-content: flex-end;
    align-items: center;
    padding-right: 20vw;
}
.collaboration .page-head .section-head-ttl{
    text-align: center;
    transform: translateX(50%);
}
.collaboration .page-head .bg{
    width: calc((100% + 80px) * 0.57);
}
.collaboration .page-head .bg span{
    background-image: url(../img/img_collaboration.jpg);
}
.collaboration .page-head .bg span::before {
    background: rgba(0,0,0,0.1);
}
.collaboration .page-body{
    overflow: hidden;
}
.collaboration .page-body .page-body-inner{
    display: block;
}
.collaboration .page-body .ttl-area {
    max-width: 100rem;
    padding: 0 8vw;
    margin-left: auto;
    margin-right: auto;
}
.collaboration .page-body .page-body-ttl {
    position: relative;
    top: 0!important;
}
.collaboration .page-body .ttl-area + .content-area {
    width: 100%;
    max-width: 100rem;
    padding: 0 8vw;
    box-sizing: content-box;
    margin-top: 8rem;
}
@media (max-width: 1024px){
    .collaboration .page-body .ttl-area + .content-area {
        max-width: none;
        box-sizing: border-box;
    }
}
@media (max-width: 767px){
    .collaboration .page-head .page-head-inner {
        justify-content: center;
        padding-right: 0;
        padding-left: 0;
    }
    .collaboration .page-head .section-head-ttl {
        transform: none;
    }
    .collaboration .page-head .bg {
        width: calc(84vw - 26px);
    }
}


/* -- program-ondemand 
-------------------------------------------------------------------------------- */
.program-ondemand {
    position: relative;
}
.program-ondemand .page-head{
    overflow: hidden;
    border-bottom: none;
}
.program-ondemand .page-head .bg span{
    background-image: url(../img/img_ondemand.jpg);
}
.program-ondemand .page-head .bg span::before {
    background: rgba(0,0,0,0.2);
}
.program-ondemand .article-head-ttl {
    color: #fff;
}
.program-ondemand .article-head-ttl::after {
    background: rgba(255,255,255,0.5);
}
.program-ondemand .page-body .content-inner.flex .img-area {
    width: 35%;
}
.program-ondemand .page-body .content-inner.flex .img-area .bg-img {
    padding-top: 100%;
    background: #e5e7de;
}
.program-ondemand .page-body .content-inner.flex .img-area .bg-img span.no-img::before {
    content: "";
    display: block;
    width: 66.666667%;
    height: calc(66.666667% * 0.27551020);
    background: url(../img/logo_blank.svg) no-repeat center;
    background-size: contain;
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%,-50%);
    opacity: 0.15;
    z-index: 1;
}
.program-ondemand .page-body .content-inner.flex .img-area .bg-img span {
    z-index: 2;
}
@media (min-width: 1025px){
    .program-ondemand .page-body .content-inner.flex a:hover .img-area .bg-img span {
        transform: scale(1.08);
        opacity: 0.7;
    }
}
.program-ondemand .page-body .content-inner.flex .txt-area {
    width: 65%;
}
@media (max-width: 767px){
    .program-ondemand .page-body .content-inner.flex .img-area {
        width: 100%;
    }
    .program-ondemand .page-body .content-inner.flex .img-area .bg-img {
        padding-top: 66.666666%;
    }
    .program-ondemand .page-body .content-inner.flex .img-area .bg-img span.no-img::before {
        width: 60%;
        height: calc(60% * 0.41326527);
    }
    .program-ondemand .page-body .content-inner.flex .txt-area {
        width: 100%;
    }
}


/* -- accordion-content
-------------------------------------------------------------------------------- */
.accordion-content {
    background: #e5e7de;
    border-radius: 0.8rem;
    position: relative;
}
.accordion-content + .accordion-content{
    margin-top: 4rem;
}
.accordion-content .accordion-content-head{
    padding: 6rem 15.6rem 6rem 6rem;
    position: relative;
    cursor: pointer;
    -webkit-tap-highlight-color:rgba(0,0,0,0);
}
.accordion-content .accordion-content-head.no-cursol{
    cursor: default;
}
.accordion-content .accordion-content-head.no-cursol .mark{
    display: none;
}
.accordion-content .content-ttl {
    margin-bottom: 0;
}
.accordion-content .accordion-content-head .mark{
    right: 7.2rem;
}
.accordion-content .accordion-content-head .mark svg{
    margin-top: 0;
}
.accordion-content .accordion-content-head.active .mark {
    width: 4.8rem;
    height: 4.8rem;
}
.accordion-content .accordion-content-head.active .mark svg{
    transform: translate(-50%,-50%) rotate(135deg);
    opacity: 1;
}
.accordion-content .accordion-content-body{
    padding: 6rem;
    border-top: solid 1px rgba(0,0,0,0.07);
    display: none;
}
.accordion-content .accordion-content-body .txt-box{
    line-height: 1.6;
}
.accordion-content .accordion-content-body .link-list {
    margin-bottom: 0;
}
.accordion-content .accordion-content-body .lead-txt + .link-list {
    margin-top: 8rem;
}
.accordion-content .accordion-content-body .link-list li:last-child {
    border-bottom: solid 1px rgba(0,0,0,0.07);
}
@media (max-width: 767px){
    .accordion-content + .accordion-content {
        margin-top: 2rem;
    }
    .accordion-content .accordion-content-head {
        padding: 3.2rem 9.2rem 3.2rem 3.2rem;
    }
    .accordion-content .content-ttl {
        font-size: 2.4rem;
    }
    .accordion-content .accordion-content-head.active .mark {
        width: 4rem;
        height: 4rem;
    }
    .accordion-content .accordion-content-head .mark {
        right: 5.2rem;
    }
    .accordion-content .accordion-content-body {
        padding: 3.2rem;
    }
    .accordion-content .accordion-content-body .lead-txt + .link-list {
        margin-top: 4rem;
    }
}


/* -- slider
-------------------------------------------------------------------------------- */
.slider-wrap {
    position: relative;
}
.slider ul {
}
.slider .slider-content .head {
    display: flex;
    align-items: center;
}
.slider .slider-content .img {
    width: 12rem;
    height: 12rem;
    border-radius: 100%;
    background: #f1f2ed;
    overflow: hidden;
    position: relative;
}
.slider .slider-content .img::before {
    content: "";
    width: 60%;
    height: 60%;
    background: url(../img/ico_human.svg) no-repeat center;
    background-size: cover;
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%,-50%);
    opacity: 0.15;
}
.slider .slider-content .img img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    position: relative;
    z-index: 2;
}
.slider .slider-content .txt {
    padding-left: 3.2rem;
    flex: 1;
}
.slider .slider-content .name {
    font-size: 2.2rem;
    letter-spacing: 0.05em;
}
.slider .slider-content .affiliation {
    font-size: 1.6rem;
    color: #7e807f;
    margin-top: 0.8rem;
}
.slider .slider-content .message p {
    font-size: 1.6rem;
    line-height: 1.8;
    text-align: justify;
    margin-top: 3.2rem;
}
.slider ul{
    display: flex;
}
.slider li{
    flex-shrink: 0;
    width: 33.333333%;
    box-sizing: border-box;
}
.slider li .slider-content-inner{
    padding: 4.8rem;
    height: 100%;
    box-sizing: border-box;
    background: #e5e7de;
    border-radius: 0.8rem;
}
.slider .slider-nav{
    display: flex;
    margin-top: 4rem;
}
.slider .slider-nav span{
    display: block;
    width: 6rem;
    height: 6rem;
    cursor: pointer;
    -webkit-tap-highlight-color:rgba(0,0,0,0);
}
.slider .slider-nav span + span{
    margin-left: 1rem;
}
.slider .slider-nav span i{
    display: block;
    width: 100%;
    height: 100%;
    border-radius: 100%;
    border: solid 1px #dcdfd3;
    position: relative;
    margin-left: 0;
    box-sizing: border-box;
    transition: 0.3s ease;
}
@media (min-width: 1025px){
    .slider .slider-nav span:not(.swiper-button-disabled):hover i{
        background: #e5e7de;
        border-color: #e5e7de;
        transform: scale(1.15);
    }
}
.slider .slider-nav span.prev{
    transform: scale(-1,1);
}
.slider .slider-nav span i::before {
    content: "";
    display: block;
    border-top: 5px solid transparent;
    border-bottom: 5px solid transparent;
    border-left: 6px solid;
    position: absolute;
    top: 50%;
    left: calc(50% + 1px);
    transform: translate(-50%,-50%);
    transition: 0.3s ease;
}
.slider .slider-nav span.swiper-button-disabled i::before{
    border-left-color: #dcdfd3;
}
@media (max-width: 767px){
    .slider li .slider-content-inner {
        padding: 3.2rem;
    }
    .slider .slider-content .img {
        width: 8rem;
        height: 8rem;
    }
    .slider .slider-content .txt {
        padding-left: 3.2rem;
    }
    .slider .slider-nav {
        justify-content: center;
        margin-top: 2.4rem;
    }
    .slider .slider-nav span {
        width: 4.8rem;
        height: 4.8rem;
    }
    .slider .slider-nav span + span {
        margin-left: 0.8rem;
    }
}


/* -- policy
-------------------------------------------------------------------------------- */
.policy {
    color: #fff;
}
.policy .page-head {
    border-bottom: solid 1px rgba(255,255,255,0.1);
}
.policy .page-head .page-head-inner {
    max-width: 100rem;
    margin-left: auto;
    margin-right: auto;
}
.policy section {
    background: #1f2933;
}
.policy .article .article-ttl{
    border-top: solid 1px rgba(255,255,255,0.1);
    padding-top: 8rem;
}
.policy .article .article-ttl:first-child{
    border-top: none;
    padding-top: 0;
}
.policy .article a {
    color: rgba(255,255,255,0.5);
}
.policy .article .list li::before{
    background: #7e807f;
}
.policy .article a.ex-link.wh::after{
    opacity: 0.5;
}
.policy .article .indent-txt p{
    display: flex;
}
.policy .article .indent-txt p .num{
    width: 2em;
}
.policy .article .indent-txt p .txt{
    flex: 1;
}
@media (max-width: 767px){
    .policy .article .article-ttl {
        padding-top: 4rem;
    }
}


/* -- search
-------------------------------------------------------------------------------- */
.search section .section-inner {
    max-width: 100rem;
    margin-left: auto;
    margin-right: auto;
}
.search .search-page-head .search-ttl {
    font-size: 2.6rem;
    letter-spacing: 0.05em;
    line-height: 1.4;
}
.search .search-page-head .search-ttl span {
    color: #801a20;
}
.search .search-page-body {
    margin-top: 4rem;
}
.search .search-page-body .empty {
    font-size: 1.8rem;
    letter-spacing: 0.01em;
}
.search .search-page-body .link-list{
    margin-bottom: 0;
}
@media (max-width: 767px){
    .search .search-page-head .search-ttl {
        font-size: 2.2rem;
    }
    .search .search-page-body {
    }
    .search .search-page-body .link-list {
        margin-bottom: -2.4rem;
    }
}


/* -- footer
-------------------------------------------------------------------------------- */
footer {
    width: 100%;
    box-sizing: border-box;
    padding: 8vw 0 8vw 80px;
    background: #7e807f;
    color: #fff;
    position: fixed;
    bottom: 0;
    left: 0;
    display: flex;
}
footer::before {
    content: "";
    display: block;
    width: 100%;
    height: 20vh;
    background: #7e807f;
    position: absolute;
    top: -20vh;
    left: 0;
}
footer .footer-head{
    flex: 1;
    padding-left: 8vw;
    padding-right: 4rem;
    opacity: 0;
    transition: opacity 1s ease;
}
footer.show .footer-head{
    opacity: 1;
}
.footer-head .ttl-logo {
    padding-top: 0;
    height: 12rem;
    width: calc(12rem * 2.26436782);
    background: url(../img/logo_footer.svg) no-repeat;
    background-position: center;
    background-size: contain;
}
.footer-head .ttl-logo .ttl-logo-main {
    font-size: 4.8rem;
    letter-spacing: 0.01em;
    line-height: 1;
    text-indent: -0.06em;
    overflow: visible;
}
.footer-head .ttl-logo .ttl-logo-main .and {
    font-size: 0.625em;
    transition: none;
}
.footer-head .ttl-logo .ttl-logo-sub {
    font-size: 1.5rem;
    line-height: 1.4;
    margin-top: 0.4rem;
    overflow: visible;
}
footer .footer-inner{
    width: 60%;
    box-sizing: border-box;
    padding-right: 8vw;
    opacity: 0;
    transition: opacity 1s ease;
}
footer.show .footer-inner{
    opacity: 1;
}
footer .footer-address{
    flex: 1;
}
footer .footer-address p{
    font-size: 1.6rem;
}
footer .footer-address p + p{
    margin-top: 1em;
}
footer .footer-nav{
    margin-top: 8rem;
    padding-top: 4rem;
    border-top: solid 1px rgba(255,255,255,0.15);
    display: flex;
    justify-content: space-between;
    align-items: flex-start;
}
footer .footer-nav .footer-nav-inner{
    display: flex;
}
footer .footer-nav a{
    display: block;
    font-size: 1.8rem;
    letter-spacing: 0.02em;
}
footer .footer-nav a + a{
    margin-left: 4rem;
}
footer .footer-nav .tt-logo{
    display: block;
    width: 4.8rem;
    height: 4.8rem;
}
footer .footer-nav .tt-logo::after{
    display: none;
}
footer .footer-nav .tt-logo img{
    display: block;
    width: 100%;
}
footer .copyright{
    font-size: 1.5rem;
    color: #d0d0d0;
    margin-top: 10rem;
}
@media (max-width: 1200px){
    footer .footer-head{
        opacity: 1;
    }
    footer .footer-inner{
        opacity: 1;
    }
}
@media (max-width: 1024px){
    footer {
        padding: 12rem 0;
        display: block;
    }
    footer .footer-head {
        padding-left: 8%;
        padding-right: 8%;
    }
    footer .footer-inner {
        width: 100%;
        padding-left: 8%;
        margin-top: 8rem;
    }
}
@media (max-width: 767px){
    footer {
        padding: 8rem 0;
        position: relative;
    }
    .footer-head .ttl-logo {
        height: 10rem;
        width: calc(10rem * 2.23863636);
    }
    footer .footer-inner {
        margin-top: 6rem;
    }
    footer .footer-address p + p{
        margin-top: 0;
    }
    footer .footer-address p + p + p{
        margin-top: 1em;
    }
    footer .footer-nav {
        margin-top: 4rem;
        padding-top: 2.4rem;
    }
    footer .footer-nav a + a{
        margin-left: 3.2rem;
    }
    footer .footer-nav .tt-logo {
        width: 4rem;
        height: 4rem;
    }
    footer .copyright {
        margin-top: 6rem;
    }
}


/* -- 2023.10追加分
-------------------------------------------------------------------------------- */
.article .img-box{
    display: block;
}
.article .img-box.flex{
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    overflow: visible;
    border-radius: 0;
}
.article .img-box.flex .img-box-inner{
    width: calc(50% - 1.2rem);
    overflow: hidden;
    border-radius: 0.8rem;
    position: relative;
}
.interview-details .article .img-box:not(.flex){
    max-width: 700px;
    margin-left: auto;
    margin-right: auto;
}
.interview-details .page-head:not(.bg-wrap) + section {
    padding-top: 0;
}
.interview-details .article-head{
    max-width: none;
    display: flex;
    padding: 0;
}
.interview-details .section-head-ttl{
    flex: 1;
    padding: 0 8vw 0 4vw;
}
.interview-details .section-head-ttl .vol{
    display: none;
}
.interview-details .section-head-ttl .en{
    display: block;
    font-size: 3.2rem;
    font-weight: normal;
    letter-spacing: 0.01em;
    line-height: 1.2;
}
.interview-details .section-head-ttl .ja{
    display: block;
    font-size: 1.6rem;
    letter-spacing: 0.05em;
    line-height: 1.4;
    font-weight: normal;
    margin-top: 1.2rem;
    overflow: hidden;
}
.interview-details .article-head-wrap{
    width: 65%;
    padding: 0 8vw 0 0;
    box-sizing: border-box;
}
.interview-details .page-head{
    background: #46535b;
    color: #fff;
    border-bottom: none;
    padding-bottom: 6vw;
}
.interview-details .article-head-ttl{
    max-width: 100rem;
}
.interview-details .interview-wrap{
    display: flex;
    align-items: flex-start;
    padding-top: 12vw;
    position: relative;
}
.interview-details .interview-wrap::before{
    content: "";
    display: block;
    width: calc(100% + 80px);
    height: 12vw;
    background: #46535b;
    position: absolute;
    top: 0;
    left: -80px;
}
.interview-details .vol{
    display: block;
    font-size: 2rem;
    letter-spacing: 0.04em;
    line-height: 1.2;
    color: #fff;
    position: absolute;
    top: calc(12vw - 6vw);
    left: 4vw;
    transform: translateY(-100%);
    border-bottom: solid 1px;
    padding-bottom: 0.4rem;
}
.interview-details .sub-area{
    flex: 1;
    padding: 6vw 8vw 0 4vw;
    position: sticky;
    top: 0;
    left: 0;
    transition: top 0.6s ease;
}
header.show:not(.hide) + .barba-wrapper .interview-details .sub-area{
    top: 100px;
}
.interview-details .profile{
    max-width: 36rem;
}
.interview-details .profile .name .ja{
    display: block;
    font-size: 2.6rem;
    letter-spacing: 0.1em;
}
.interview-details .profile .name .en{
    display: block;
    font-size: 1.6rem;
    letter-spacing: 0.02em;
    font-weight: normal;
}
.interview-details .profile .shoulder{
    font-size: 1.5rem;
    letter-spacing: 0.05em;
    margin-top: 4rem;
}
.interview-details .profile .shoulder p + p{
    margin-top: 0.6rem;
}
.interview-details .profile .message{
    font-size: 1.5rem;
    text-align: justify;
    letter-spacing: 0.01em;
    line-height: 2;
}
.interview-details .profile .message::before{
    content: "";
    display: block;
    width: 2rem;
    border-top: solid 1px;
    margin-top: 2.4rem;
    margin-bottom: 2.4rem;
}
.interview-details .main-area{
    width: 65%;
    position: relative;
}
.interview-details .main-img{
    width: 100%;
    padding-top: 50%;
    margin-top: -12vw;
    overflow: hidden;
    position: relative;
    border-radius: 0.8rem 0 0 0.8rem;
}
.interview-details .main-img img,
.interview-details .main-img .no-img{
    width: 100%;
    height: 100%;
    object-fit: cover;
    position: absolute;
    top: 0;
    left: 0;
}
.interview-details .main-img .no-img{
    background: #e5e7de;
}
.interview-details .article{
    padding: 8vw 8vw 0 0;
    margin-left: 0;
}
.interview-details .article .article-ttl {
    margin-top: 8vw;
    margin-bottom: 8rem;
}
.interview-details .article .article-ttl:first-child {
    margin-top: 0;
}
.interview-details .article .article-ttl::after {
    content: "";
    display: block;
    width: 4.8rem;
    border-top: solid 1px;
    margin-top: 6rem;
}
.interview-details .article .article-sub-ttl{
    color: #801a20;
}
.interview-details .article .column{
    margin-top: 8vw;
    padding: 8rem;
    border-radius: 0.8rem;
    background: rgba(255,255,255,0.6);
}
.interview-details .article .column .column-ttl{
    font-size: 2.4rem;
    letter-spacing: 0.05em;
    margin-bottom: 3.2rem;
    position: relative;
    padding-left: 2.4rem;
}
.interview-details .article .column .column-ttl::before{
    content: "";
    display: block;
    width: 4px;
    background: #801a20;
    position: absolute;
    top: 4px;
    bottom: 4px;
    left: 0;
}
.interview-details .article .column .txt-box{
    font-size: 1.6rem;
}
.link-btn a.prev {
    padding-left: 3.6rem;
    padding-right: 0;
}
.link-btn a.prev .mark {
    left: 0;
    right: auto;
    transform: translate(-50%,-50%);
}
.link-btn a.prev .mark svg {
    transform: scale(-1,1) translate(50%,-50%);
    margin-left: 3.2rem;
}
@media (min-width: 1025px){
    .link-btn a:hover .mark svg {
        margin-left: 0;
    }
}
.interview-details .link-btn.multi {
    justify-content: space-between;
    align-items: center;
    width: 100%;
    box-sizing: border-box;
    padding: 0 8vw;
    position: relative;
}
.interview-details .link-btn.multi::before {
    content: "";
    display: block;
    height: 100%;
    border-left: solid 1px rgba(0,0,0,0.07);
    position: absolute;
    top: 0;
    left: 50%;
}
.interview-details .link-btn.multi p.prev,
.interview-details .link-btn.multi p.next {
    opacity: 0;
    visibility: hidden;
}
.interview-details .link-btn.multi a,
.interview-details .link-btn.multi p{
    padding: 0;
    flex: 1;
}
.interview-details .link-btn.multi .prev {
    padding-left: 4.8rem;
    margin-right: 6rem;
}
.interview-details .link-btn.multi .next {
    padding-right: 4.8rem;
    margin-left: 6rem;
}
.interview-details .link-btn.multi .ttl-wrap {
    max-width: 40rem;
}
.interview-details .link-btn.multi .next .ttl-wrap {
    margin-left: auto;
}
.interview-details .link-btn.multi .ttl-wrap p {
    flex: 1;
}
.interview-details .link-btn.multi a.prev .ttl-wrap p {
    padding-left: 0;
}
.interview-details .link-btn.multi a.next .ttl-wrap p {
    padding-right: 0;
    text-align: right;
}
.interview-details .link-btn.multi .ttl-wrap p span {
    display: block;
}
.interview-details .link-btn.multi .ttl-wrap p .name,
.interview-list .news-list-body .name{
    font-size: 2.4rem;
    font-weight: bold;
    letter-spacing: 0.05em;
}
.interview-details .link-btn.multi .ttl-wrap p .name .vol-num,
.interview-list .news-list-body .name .vol-num{
    display: block;
    font-size: 1.4rem;
    letter-spacing: 0.04em;
    font-weight: normal;
    padding: 0 0.2rem 0 0.1rem;
    margin-bottom: 2rem;
}
.interview-details .link-btn.multi .ttl-wrap p .name .vol-num span,
.interview-list .news-list-body .name .vol-num span{
    display: inline-block;
    border-bottom: solid 1px;
}
.interview-details .link-btn.multi .ttl-wrap p .ttl,
.interview-list .news-list-body .ttl{
    font-size: 1.6rem;
    letter-spacing: 0.05em;
    margin-top: 0.8rem;
}
.interview-details .main-area .profile {
    display: none;
}
.interview .page-head{
    background: #46535b;
    border-bottom: none;
}
.interview .page-head .section-head-ttl {
    color: #fff;
}
.home-interview {
    padding-top: 0;
    padding-bottom: 0;
    display: flex;
}
.home-interview .head-wrap {
    padding: 8vw 8vw;
    background: #46535b;
    color: #fff;
    display: flex;
    flex-direction: column;
    justify-content: space-between;
}
.home-interview .head-wrap .section-head-ttl{
    white-space: nowrap;
}
.home-interview .section-inner {
    padding: 8vw 8vw 8vw 4vw;
    border-top: solid 1px rgba(0,0,0,0.07);
    position: relative;
    flex: 1;
    overflow: hidden;
}
.home-interview .news-list ul {
    margin: 0;
    flex-wrap: nowrap;
}
.home-interview .news-list li {
    width: 50%;
    padding: 0;
    padding-left: 4vw;
}
.home-interview .nav {
    display: flex;
    justify-content: flex-end;
    position: absolute;
    right: 0;
    top: -4vw;
    transform: translateY(-50%);
}
.home-interview .nav span {
    display: block;
    width: 4.8rem;
    height: 4.8rem;
    border: solid 1px #dcdfd3;
    border-radius: 100%;
    cursor: pointer;
    -webkit-tap-highlight-color: rgba(0,0,0,0);
    display: flex;
    justify-content: center;
    align-items: center;
    transition: 0.3s ease;
}
@media (min-width: 1025px){
    .home-interview .nav span:not(.swiper-button-disabled):hover {
        background: #e5e7de;
        border-color: #e5e7de;
        transform: scale(1.15);
    }
}
.home-interview .nav span + span {
    margin-left: 0.8rem;
}
.home-interview .nav span svg {
    width: 1.4rem;
    transition: 0.3s ease;
}
.home-interview .nav span.prev svg {
    transform: scale(-1,1);
}
.home-interview .nav span.swiper-button-disabled {
    cursor: default;
}
.home-interview .nav span.swiper-button-disabled svg {
    fill: #dcdfd3;
}
.home-interview .section-inner .link-btn {
    justify-content: center;
    margin-top: 8rem;
    display: none;
}
@media (max-width: 1024px){
    .interview-details .link-btn.multi .ttl-wrap {
        max-width: none;
    }
    .link-btn a.prev .mark svg {
        transform: scale(-1,1) translate(50%,-50%);
        margin-left: 0;
    }
    .home-interview{
        display: block;
        overflow: hidden;
    }
    .home-interview .head-wrap{
        padding-bottom: 0;
    }
    .home-interview .head-wrap .section-head-ttl{
        margin-bottom: 0;
    }
    .home-interview .head-wrap .link-btn{
        display: none;
    }
    .home-interview .section-inner{
        position: relative;
        border-top: none;
        overflow: visible;
        z-index: 2;
        padding-top: 8rem;
    }
    .home-interview .section-inner::before{
        content: "";
        display: block;
        width: 100%;
        height: calc(8vw + 13.25vw);
        background: #46535b;
        position: absolute;
        top: 0;
        left: 0;
    }
    .home-interview .nav{
        top: -8rem;
        transform: translateY(0);
    }
    .home-interview .section-inner .link-btn {
        display: flex;
    }
    .home-interview .nav span {
        border-color: rgba(255,255,255,0.3);
    }
    .home-interview .nav span svg {
        fill: #fff;
    }
    .home-interview .nav span.swiper-button-disabled svg {
        fill: rgba(255,255,255,0.3);
    }
    .interview-details .section-head-ttl{
        padding-left: 6vw;
    }
    .interview-details .vol {
        left: 6vw;
    }
    .interview-details .sub-area{
        padding-left: 6vw;
    }
}
@media (max-width: 767px){
    .interview-details .profile {
        max-width: none;
    }
    .article .img-box.flex {
        display: block;
    }
    .article .img-box.flex .img-box-inner {
        width: 100%;
        border-radius: 0.8rem;
    }
    .article .img-box.flex .img-box-inner + .img-box-inner {
        margin-top: 1.2rem;
    }
    .link-btn a.prev .mark svg {
        transform: scale(-1,1) translate(50%,-50%);
        margin-left: 0;
    }
    .interview-details .page-head {
        padding-top: 9rem;
        padding-bottom: 6rem;
    }
    .interview-details .article-head{
        display: block;
    }
    .interview-details .section-head-ttl {
        padding: 0 8%;
        display: flex;
        justify-content: space-between;
        align-items: flex-start;
        border-top: solid 1px rgba(255,255,255,0.1);
        padding-top: 4rem;
    }
    .interview-details .section-head-ttl .vol {
        display: block;
        position: static;
        transform: none;
        font-size: 1.6rem;
    }
    .interview-details .article-head-wrap {
        width: 100%;
        padding: 0 8%;
        margin-top: 6rem;
    }
    .interview-details .interview-wrap {
        padding-top: 0;
    }
    .interview-details .interview-wrap .vol {
        display: none;
    }
    .interview-details .sub-area{
        display: none;
    }
    .interview-details .main-area {
        width: 100%;
    }
    .interview-details .main-img {
        width: 92%;
        margin-left: auto;
        margin-top: 0;
    }
    .interview-details .section-head-ttl .en {
        font-size: 2.6rem;
    }
    .interview-details .main-area .profile {
        display: block;
        padding: 4rem 8% 6rem;
        border-bottom: solid 1px rgba(0,0,0,0.07);
    }
    .interview-details .main-area .article {
        padding: 6rem 8% 0;
    }
    .interview-details .interview-wrap::before {
        width: 100%;
        height: calc(50vw / 2);
        left: 0;
    }
    .interview-details .interview-wrap .return-btn{
        display: none;
    }
    .interview-details .article .article-ttl {
        margin-top: 6rem;
        margin-bottom: 4rem;
    }
    .interview-details .article .article-ttl::after {
        width: 4rem;
        margin-top: 3.2rem;
    }
    .interview-details .article .column {
        margin-top: 6rem;
        padding: 4.8rem 3.2rem;
    }
    .interview-details .link-btn.multi {
        align-items: stretch;
    }
    .interview-details .link-btn.multi a {
        padding-bottom: calc(4rem + 2rem);
    }
    .interview-details .link-btn.multi .prev {
        padding-left: 0;
        margin-right: 4rem;
    }
    .interview-details .link-btn.multi .next {
        padding-right: 0;
        margin-left: 4rem;
    }
    .interview-details .link-btn.multi a.next .ttl-wrap p{
        text-align: left;
    }
    .interview-details .link-btn.multi .ttl-wrap p .name{
        font-size: 2rem;
    }
    .interview-details .link-btn.multi .ttl-wrap p .ttl{
        font-size: 1.4rem;
        text-align: justify;
    }
    .interview-details .link-btn.multi a .mark {
        position: absolute;
        transform: none;
        bottom: 0;
        top: auto;
    }
    .home-interview .head-wrap{
        padding: 8rem 8vw 0;
    }
    .home-interview .head-wrap .section-head-ttl{
        text-align: center;
    }
    .home-interview .section-inner{
        padding-top: 6rem;
        padding-bottom: 8rem;
        padding-left: 0;
    }
    .home-interview .section-inner::before {
        height: calc(6rem + 28vw);
    }
    .home-interview .nav{
        display: none;
    }
    .home-interview .news-list li {
        padding-left: 8vw;
    }
    .home-interview .news-list li + li {
        margin-top: 0;
    }
}