@charset "UTF-8";

#contentsend{ display: none;}

@media screen and (min-width: 768px),print {

header{}
#interview .onecol-contents{max-width: 100%;padding: 0;}
#interview .seo_bread_list{max-width: 1920px;}

#contents-interview-main{position: relative;margin: 0 0 0 5rem;padding: 11.2rem 5vw 8rem 5vw;}
#contents-interview-main .img{padding-top: 0px;margin-right: -6.4rem;}
#contents-interview-main .img img{ width: 100%; height: auto; }
#contents-interview-main h1{ font-size: 3.13vw; letter-spacing: -0.4vw; color: #fff; text-shadow: 0px 0px 0.52vw #00000080; position: absolute; top: 25.2vw; width: 100vw; z-index: 3; font-family: "ta-oonishi", sans-serif; font-weight: 300; font-style: normal; text-align: center; }
#contents-interview-main span.entt{font-size: 1.6rem;letter-spacing: 0.16rem;font-weight: bold;position: absolute;bottom: 170px;left: 17px;transform: rotate(90deg);transform-origin: center;color: #fff;}
#contents-interview-main span.entt::before{content: "";display: block;height: 1px;width: 114px;background: #fff;position: absolute;bottom: 15px;left: 125px;}
#contents-interview-main .inner-Box{display:grid;grid-template-columns:61.33% 38.67%;margin:0 auto;max-width:120rem;padding: 0 0 0;}
#contents-interview-main .photo-Box{}
#contents-interview-main .text-Box{ z-index: 3; padding-top: 14.8rem; }

#contents-interview-main .content-box { margin-left: -64px; z-index: 2; display: flex; flex-direction: column; }
#contents-interview-main .line { position: relative; width: fit-content; overflow: hidden; }
#contents-interview-main .text-wrapper .line { margin-bottom: 8px; }
#contents-interview-main .profile-line { margin-top: 1.5rem; }
#contents-interview-main .sub-text { position: relative; font-size: 14px; font-weight: normal; color: white; margin: 0; padding: 0.8rem 1.6rem; opacity: 0; animation: revealText 0.1s forwards; }


#contents-interview-main .main-text,
#contents-interview-main .sub-text {
    position: relative;
    color: #fff;
    margin: 0;
    padding: 1.6rem 1.6rem;
    opacity: 0;
    z-index: 2;
    
    /* 🛠️ 実行時間を0.5秒にして、イージングを座布団の伸びに合わせる */
    animation: revealText 0.5s cubic-bezier(0.65, 0, 0.35, 1) forwards;
}

#contents-interview-main .main-text {
    font-size: 3.0rem;
    line-height: 1.0;
    letter-spacing: 0.05em;
    font-weight: 700;
    text-align: left;
}

#contents-interview-main .bg {
    position: absolute;
    top: 0;
    left: 0;
    width: 0;
    height: 100%;
    background-color: var(--main-blue);
    animation: extendBg 0.7s cubic-bezier(0.65, 0, 0.35, 1) forwards;
}

@keyframes extendBg {
    0% { width: 0; }
    100% { width: 100%; }
}

@keyframes revealText {
    0% { opacity: 0; }
    100% { opacity: 1; }
}

/* 🛠️ 文字の出現ディレイ（animation-delay）だけ、座布団が伸びきる時間（+0.5秒〜0.6秒）をプラスする */
#contents-interview-main .line.delay-1 .bg { animation-delay: 0s; }
#contents-interview-main .line.delay-1 .main-text { animation-delay: 0.3s; } /* 0s + 0.5s */

#contents-interview-main .line.delay-2 .bg { animation-delay: 0.5s; }
#contents-interview-main .line.delay-2 .main-text { animation-delay: 0.8s; } /* 1.4s + 0.5s */

#contents-interview-main .line.delay-3 .bg { animation-delay: 0.6s; }
#contents-interview-main .line.delay-3 .main-text { animation-delay: 1.2s; } /* 2.6s + 0.5s */

#contents-interview-main .line.delay-4 .bg { animation-delay: 1.0s; background-color: #fff;}
#contents-interview-main .line.delay-4 .sub-text { animation-delay: 1.4s; color: var(--main-blue);} /* 3.1s + 0.5s */

#contents-interview-01{position: relative;margin: 0 0 0 5rem;padding: 0rem 5vw 0;border-bottom: 1px solid #ccc;}
#contents-interview-01 .inner-Box{margin:0 auto;max-width: 100rem;padding: 0 0 0;}

#contents-interview-01 .interview-block__content h3 {margin-bottom: 2.4rem;color: var(--main-blue);font-size: 2.2rem;line-height: 1.5;letter-spacing: 0.05em;font-weight: 700;text-align: left;}
#contents-interview-01 .interview-block__content .text { font-size: 1.6rem; line-height: 1.8; }
#contents-interview-01 .interview-block__content p{ margin-bottom: 20px;}
#contents-interview-01 .interview-block__image img { width: 100%; height: auto; }
#contents-interview-01 .noneimages .interview-block__content{ padding: 0; }
#contents-interview-01 .noneimages .interview-block__inner{ display: block; }

#contents-interview-01 .interview-block {padding: 0;margin-bottom: 9.4rem;}
#contents-interview-01 .type-a .interview-block__inner {display: flex;flex-wrap: wrap;align-items: center;justify-content: space-between;max-width: 100%;margin: 0 auto;gap: 6.3%;}
#contents-interview-01 .type-a .interview-block__image {flex: 1 1 45%;max-width: 44.9%;}
#contents-interview-01 .type-a .interview-block__content {flex: 1 1 45%;max-width: 690px;margin-right: auto;}

#contents-interview-01 .type-b .interview-block__inner {display: flex;flex-wrap: wrap;align-items: center;justify-content: space-between;max-width: 100%;margin: 0 auto;gap: 6.3%;}
#contents-interview-01 .type-b .interview-block__image {flex: 1 1 45%;max-width: 45%;}
#contents-interview-01 .type-b .interview-block__content {flex: 1 1 45%;/* max-width: 690px; */margin-left: auto;margin-right: 0;}

#contents-interview-01 .type-c .interview-block__inner { max-width: 880px; margin: 0 auto; padding: 0 40px; }
#contents-interview-01 .type-c .interview-block__image { margin-bottom: 61px; }
#contents-interview-01 .type-c .interview-block__content {flex: 1 1 45%;margin-left: auto;margin-right: 0;}

/* 交互にする（type-bやtype-dなど） */
#contents-interview-01 .type-b .interview-block__inner { flex-direction: row-reverse; }
#contents-interview-01 .type-a .interview-block__image img{}
#contents-interview-01 .type-b .interview-block__image img{}
#contents-interview-01 .type-c .interview-block__image img{ border-radius: 20px; }



#contents-interview-02{padding: 8.1rem 0 10rem;margin: 0 0 0 5rem;border-bottom: 1px solid #ccc;}
#contents-interview-02 .inner-Box{max-width: 108.3rem;margin: 0 auto;padding: 0 3.2rem 0 5rem;}
#contents-interview-02 .inner-Box h2{margin-left: 0px;margin-bottom: 6.4rem;}
#contents-interview-02 .inner-Box h2 .f-en{}
#contents-interview-02 .inner-Box h2 .f-en img{display: inline-block;margin: 0 15px 0 0;position: relative;top: -4px;left: 5px;}
#contents-interview-02 ul{border-left: var(--main-blue) 1px solid;position: relative;margin-left: 9.6rem;}
#contents-interview-02 ul li{position: relative;top: -10px;padding: 0px 35rem 0 3.7rem;margin-bottom: 5.2rem;}
#contents-interview-02 ul li.imgac{ min-height: 220px; }
#contents-interview-02 ul li .time{position: absolute;top: 0.8rem;left: -9.7rem;font-size: 1.8rem;line-height: 1.0;letter-spacing: 0.05em;font-weight: 600;text-align: left;}
#contents-interview-02 ul li .time::before{content: "";display: block;width: 1.4rem;height: 1.4rem;border-radius: 50%;background: var(--main-blue);position: absolute;top: -0.2rem;left: 8.5rem;border: 4px solid #F0F1F3;}
#contents-interview-02 ul li h3{font-size: 2rem;font-weight: bold;color: var(--main-blue);margin-bottom: 12px;}
#contents-interview-02 ul li .sctext{font-size: 1.6rem;letter-spacing: 0.08rem;line-height: 2;}
#contents-interview-02 ul li figure{position: absolute;top: 0;right: 0rem;width: 22rem;height: 22rem;overflow: hidden;border-radius: 50%;}
#contents-interview-02 ul li figure img{width: 100%;height: 100%;object-fit: cover;display: block;}

#contents-interview-02 ul li .sctext ul{border: none;display: block;margin: 0;}
#contents-interview-02 ul li .sctext ul li{padding: 0;margin: 0;padding-left: 1.2rem;}
#contents-interview-02 ul li .sctext ul li::before{content: "";display: block;background: var(--main-blue);width: 0.7rem;height: 0.7rem;border-radius: 50%;position: absolute;top: 1.4rem;left: 0;}

#contentsdeplist{margin: 0 0 0 5rem;padding: 8.2rem 5vw 14rem;}
#contentsdeplist .inner-Box{max-width: 100rem;margin: 0 auto;}
#contentsdeplist .inner-Box h2.ttl{font-size: 2.8rem;letter-spacing: 0.14rem;font-weight: bold;text-align: center;color: #0057AA;margin-bottom: 54px;}
#contentsdeplist .inner-Box .system-list{display:grid;grid-template-columns:repeat(3,1fr);gap:2.4%;margin-bottom: 2.4rem;}
#contentsdeplist .inner-Box .system-list li{}
#contentsdeplist .inner-Box .system-list li a{width: auto;text-align: left;padding-bottom: 52px;}
#contentsdeplist .inner-Box .system-list li .img {width: 100%;aspect-ratio: 317 / 218;overflow: hidden;text-align: center;overflow: hidden;margin-bottom: 0.8rem;position: relative;}
#contentsdeplist .inner-Box .system-list li .img img { width: 100%; height: 100%; object-fit: cover; display: block; }
#contentsdeplist .inner-Box .system-list li h3{font-size: 1.6rem;line-height: 1.8;letter-spacing: 0.05em;font-weight: 700;text-align: left;color: #333;}
#contentsdeplist .inner-Box .system-list .systext{font-size: 1.2rem;line-height: 1.5;letter-spacing: 0.05em;font-weight: 400;text-align: left;margin-bottom: 0.8rem;}
#contentsdeplist .inner-Box .system-list a.link-arr .post-arrow{ top: auto; bottom: 2px; right: 0; }
#contentsdeplist .inner-Box .system-list li .img span{width: 100%;display: block;font-size: 1.8rem;z-index: 3;position: absolute;bottom: 0;left: 0px;text-align: left;padding: 20px;color: #fff;font-weight: bold;}
#contentsdeplist .inner-Box .gl-btn{ }
#contentsdeplist .inner-Box .gl-btn a{ text-align: center; padding-left: 0; }


}

@media screen and (min-width:768px) and ( max-width:1023px) {
#contents-interview-main,#contents-interview-01,#contents-interview-02,#contentsdeplist{ margin-left: 0;}

}

@media screen and (max-width: 767px) {

     #interview .onecol-contents{max-width: 100%;padding: 0;}
#interview .seo_bread_list{}

#contents-interview-main{position: relative;margin-bottom: 11.2vw;padding-top: 15.9vw;}
#contents-interview-main .img{padding-top: 0.0vw;margin-right: 0;}
#contents-interview-main .img img{ width: 100%; height: auto; }
#contents-interview-main h1{ font-size: 3.13vw; letter-spacing: -0.4vw; color: #fff; text-shadow: 0.0vw 0.0vw 0.52vw #00000080; position: absolute; top: 25.2vw; width: 100vw; z-index: 3; font-family: "ta-oonishi", sans-serif; font-weight: 300; font-style: normal; text-align: center; }
#contents-interview-main span.entt{font-size: 4.27vw;letter-spacing: 0.43vw;font-weight: bold;position: absolute;bottom: 45.33vw;left: 4.53vw;transform: rotate(90deg);transform-origin: center;color: #fff;}
#contents-interview-main span.entt::before{content: "";display: block;height: 0.27vw;width: 30.4vw;background: #fff;position: absolute;bottom: 4.0vw;left: 33.33vw;}
#contents-interview-main .inner-Box{}
#contents-interview-main .photo-Box{ margin-bottom: -6vw; }
#contents-interview-main .text-Box{ margin: 0 0 0 4.4vw; }

#contents-interview-main .content-box { margin-left: 0vw; z-index: 2; display: flex; flex-direction: column; }
#contents-interview-main .line { position: relative; width: fit-content; overflow: hidden; }
#contents-interview-main .text-wrapper .line {margin-bottom: 1.23vw;}
#contents-interview-main .main-text {position: relative;color: white;margin: 0;padding: 2.57vw 2.47vw;opacity: 0;animation: revealText 0.1s forwards;font-size: 5.33vw;line-height: 1.0;letter-spacing: 0.05em;font-weight: 700;text-align: left;}
#contents-interview-main .bg {position: absolute;top: 0;left: 0;width: 0;height: 100%;background-color: var(--main-blue);animation: extendBg 0.7s cubic-bezier(0.65, 0, 0.35, 1) forwards;}
#contents-interview-main .delay-4 .bg{ background: #fff; }
#contents-interview-main .profile-line { margin-top: 4.00vw; }
#contents-interview-main .sub-text { position: relative; font-size: 3.73vw; font-weight: normal; color: white; margin: 0; padding: 2.13vw 4.27vw; opacity: 0; animation: revealText 0.1s forwards; }
#contents-interview-main .delay-4 .sub-text{color: var(--main-blue);padding: 1.1vw 2.7vw;}

@keyframes extendBg { 0% { width: 0; } 100% { width: 100%; } }
@keyframes revealText { to { opacity: 1; } }

#contents-interview-main .line.delay-1 .bg { animation-delay: 0s; }
#contents-interview-main .line.delay-1 .main-text { animation-delay: 0.3s; } /* 0s + 0.5s */

#contents-interview-main .line.delay-2 .bg { animation-delay: 0.5s; }
#contents-interview-main .line.delay-2 .main-text { animation-delay: 0.8s; } /* 1.4s + 0.5s */

#contents-interview-main .line.delay-3 .bg { animation-delay: 0.6s; }
#contents-interview-main .line.delay-3 .main-text { animation-delay: 1.2s; } /* 2.6s + 0.5s */

#contents-interview-main .line.delay-4 .bg { animation-delay: 1.0s; background-color: #fff;}
#contents-interview-main .line.delay-4 .sub-text { animation-delay: 1.4s; color: var(--main-blue);} /* 3.1s + 0.5s */


#contents-interview-01{position: relative;padding: 0vw;border-bottom: 0.27vw solid #ccc;}
#contents-interview-01 .inner-Box{margin:0 auto;max-width: 100rem;padding: 0 0 0;}
#contents-interview-01 h2,#contents-interview-02 h2{margin-left: 5vw;}
#contents-interview-01 .interview-block__content h3 {margin-bottom: 3.4vw;color: var(--main-blue);font-size: 4.8vw;line-height: 1.5;letter-spacing: 0.05em;font-weight: 700;text-align: left;}
#contents-interview-01 .interview-block__content .text {font-size: 3.73vw;line-height: 1.7;letter-spacing: 0.05em;font-weight: 400;text-align: left;}
#contents-interview-01 .interview-block__content p{margin-bottom: 3.33vw;}
#contents-interview-01 .interview-block__image img { width: 100%; height: auto; }
#contents-interview-01 .noneimages .interview-block__content{ padding: 0; }
#contents-interview-01 .noneimages .interview-block__inner{ display: block; }

#contents-interview-01 .interview-block {padding: 0;margin-bottom: 8.27vw;}
#contents-interview-01 .type-a .interview-block__inner {}
#contents-interview-01 .type-a .interview-block__image { margin-right: 6.3vw; margin-bottom: 6.5vw; }
#contents-interview-01 .type-a .interview-block__content { margin: 0 6.5vw; }

#contents-interview-01 .type-b .interview-block__inner {}
#contents-interview-01 .type-b .interview-block__image { margin: 0 0 6.5vw 5.9vw; }
#contents-interview-01 .type-b .interview-block__content {/* */margin: 0 6.5vw;}

#contents-interview-01 .type-c .interview-block__inner {  margin: 0 4vw; padding: 0 10.67vw; }
#contents-interview-01 .type-c .interview-block__image { margin-bottom: 16.27vw; }
#contents-interview-01 .type-c .interview-block__content {flex: 1 1 45%;margin-left: auto;margin-right: 0;}

/* 交互にする（type-bやtype-dなど） */
#contents-interview-01 .type-b .interview-block__inner { flex-direction: row-reverse; }
#contents-interview-01 .type-a .interview-block__image img{}
#contents-interview-01 .type-b .interview-block__image img{}
#contents-interview-01 .type-c .interview-block__image img{ border-radius: 5.33vw; }



#contentsdeplist{padding: 11.57vw 4.3vw 17.33vw;}
#contentsdeplist .inner-Box{}
#contentsdeplist .inner-Box h2.ttl{font-size: 7.47vw;letter-spacing: 0.37vw;font-weight: bold;text-align: center;color: #0057AA;margin-bottom: 14.4vw;}
#contentsdeplist .inner-Box .system-list{display:grid;grid-template-columns: repeat(2,1fr);gap: 4.4vw 2.4%;margin-bottom: 6.40vw;}
#contentsdeplist .inner-Box .system-list li{ margin-bottom: 1vw; }
#contentsdeplist .inner-Box .system-list li a{width: auto;text-align: left;}
#contentsdeplist .inner-Box .system-list li .img {width: 100%;aspect-ratio: 317 / 218;overflow: hidden;text-align: center;overflow: hidden;margin-bottom: 2.13vw;position: relative;}
#contentsdeplist .inner-Box .system-list li .img img { width: 100%; height: 100%; object-fit: cover; display: block; }
#contentsdeplist .inner-Box .system-list li h3{color: #333;font-size: 3.73vw;line-height: 1.5;letter-spacing: 0.05em;font-weight: 700;text-align: left;}
#contentsdeplist .inner-Box .system-list .systext{font-size: 3.2vw;line-height: 1.5;letter-spacing: 0.05em;font-weight: 400;text-align: left;margin-bottom: 2.13vw;color: #333;}
#contentsdeplist .inner-Box .system-list a.link-arr .post-arrow{ top: auto; bottom: 0.53vw; right: 0; }
#contentsdeplist .inner-Box .system-list li .img span{width: 100%;display: block;font-size: 4.8vw;z-index: 3;position: absolute;bottom: 0;left: 0.0vw;text-align: left;padding: 5.33vw;color: #fff;font-weight: bold;}
#contentsdeplist .inner-Box .gl-btn{ }
#contentsdeplist .inner-Box .gl-btn a{text-align: center;padding-left: 0;height: auto;padding: 4vw;}
    
    #contents-interview-02{padding: 11.83vw 0 5.67vw;background: #fff;}
    #contents-interview-02 .inner-Box{margin: 0 0.3vw;}
    #contents-interview-02 .inner-Box h2{margin-bottom: 7.93vw;}
    #contents-interview-02 .inner-Box h2 .f-en{}
    #contents-interview-02 .inner-Box h2 .f-en img{display: inline-block;margin: 0 4.0vw 0 0;position: relative;top: -0.8vw;left: 1.33vw;width: 2.7vw;}
    #contents-interview-02 ul{border-left: var(--main-blue) 0.37vw solid;position: relative;margin-left: 20.3vw;}
    #contents-interview-02 ul li{position: relative;top: -2vw;padding: 0.0vw 0.33vw 0 5.57vw;margin-bottom: 6vw;}
    #contents-interview-02 ul li.imgac{  }
    #contents-interview-02 ul li .time{position: absolute;top: 0.17vw;left: -16.6vw;font-size: 4.03vw;font-weight: bold;}
    #contents-interview-02 ul li .time::before{content: "";display: block;width: 2.73vw;height: 2.73vw;border-radius: 50%;background: var(--main-blue);position: absolute;top: 0.77vw;left: 14.1vw;border: 1.07vw solid #fff;}
    #contents-interview-02 ul li h3{font-size: 4.27vw;font-weight: bold;color: var(--main-blue);margin-bottom: 2.8vw;}
    #contents-interview-02 ul li .sctext{font-size: 3.73vw;letter-spacing: 0.21vw;line-height: 2;margin-bottom: 1.6vw;padding-right: 4vw;}
    #contents-interview-02 ul li figure{position: relative;top: 0;margin: 0 auto;width: 34.5vw;height: 34.5vw;overflow: hidden;border-radius: 50%;left: -1.5vw;}
    #contents-interview-02 ul li figure img{width: 100%;height: 100%;object-fit: cover;display: block;}
    
#contents-interview-02 ul li .sctext ul{border: none;display: block;margin: 0;}
#contents-interview-02 ul li .sctext ul li{padding: 0;margin: 0;padding-left: 3.20vw;}
#contents-interview-02 ul li .sctext ul li::before{content: "";display: block;background: var(--main-blue);width: 1.37vw;height: 1.37vw;border-radius: 50%;position: absolute;top: 3.43vw;left: 0;}
    
}