@charset "utf-8";
/*--------------------------------------------------- */
body { line-height: 1.6; color: #000; font-size: 16px; font-family: "Noto Serif JP", serif; background:#F7F7F7; box-sizing: border-box; overflow-x: hidden;}
p a{text-decoration: none; color:#000;}
p a:hover{text-decoration: underline; color:#000;}
/*------------------base.css-------------------*/
.container { width: 100%; margin: 0 auto; overflow-x: hidden;}
.footer { text-align: center; padding: 20px;}
/*------------------style.css-------------------*/
h1, h2, h3 { text-align: center; }
h1 { margin: 50px auto 20px; }
section { margin-bottom: 120px; }
.footer p { text-align: center; text-decoration: none;}
.footer p a{text-decoration: none; color:#000;}
/*COMMON*/
br.sponly_br{
display:none;
}
br.pconly_br{
display:block;
}
#link{
display:block;
margin:150px auto 30px;
}
.link_table{
    display:flex;
    width:250px;
    margin:auto;
}
.link_table .link_td{
    display:block;
    margin:auto;
    text-align:center;
}
.link_table .link_td img{
    width:65%;
}
a:hover{
    opacity: 0.5;
    transition : 0.5s;
}
.wrapper {
width: 100%;
overflow: hidden;
}

/*====================================================================
PC-MOVIE
====================================================================*/
.video-background {
  position: relative;
  overflow: hidden;
  width: 100%;
  height: 100vh;
  max-height: 1080px;
  aspect-ratio: 9 / 16;
  /*border:1px solid;*/
}
.video-background video {
  position: absolute;
  top: 55px;
  left: 0;
  width: 100%;
  height: calc(100% - 55px);
  object-fit: cover;
  z-index: 0; 
  object-position: center center;
}
.controls {
  position: absolute;
  left: 50%;
  bottom: 30px;
  transform: translate(-50%, 0);
  display: flex;
  gap: 10px;
  z-index: 2;
  height:auto;
  align-items: center;
  /*border:1px solid #c00;*/
}
.controls button {
  padding: 5px;
  background: rgba(0,0,0,0.5);
  border: none;
  cursor: pointer;
  align-self: center;
  /*border:1px solid #ccc;*/
}
.controls img{
display:block;
  /*border:1px solid #ff9;*/
}
.controls2 {
  position: absolute;
  left: 50%;
  bottom: 35px;
  transform: translate(-50%, 0);
  display: flex;
  align-items: center;
  gap: 10px;
  z-index: 2;
  height: 32px;
  /*border: 1px solid #c00;*/
}
.controls2 button {
  padding: 5px;
  background: rgba(0,0,0,0.5);
  border: none;
  cursor: pointer;
  align-self: center;
  width: 32px;
  height: 32px;
  display: flex;
  align-items: center;
  /*border:1px solid #ccc;*/
}
.controls2 img{
display:block;
heght:16px;
width:16px;
/*border:1px solid #ff9;*/
}
.video-overlay_thum{
position: absolute;
top: 55px;
left:-2px;
width:101%;
height: 100%;
z-index: 3;
/*border:1px solid #ccc;*/
}
.video-overlay_thum img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  display: block;
  object-position: center center;
}
.video-overlay {
  position: absolute;
  top: 55%;
  left: 50%;
  transform: translate(-50%, -50%);
  color: #fff;
  cursor: pointer;
  background: rgba(0,0,0,0.4);
  border-radius: 50%;
  width: 30px;
  height: 30px;
  display: flex;
  justify-content: center;
  align-items: center;
  z-index: 5;
  flex-direction: column;
}
#seekBar {
  position: absolute;
  bottom: 10px;
  left: 10%;
  width: 80%;
  z-index: 5;
}
/*====================================================================
PC-TEXT
====================================================================*/
.maintitle_text{
display:block;
width:600px;
margin:0 auto;
}
h1{
font-size:24px;
font-weight:200;
line-height: 1.6;
}
h1 span{
font-size:24px;
font-weight:200;
letter-spacing: 0.02em;
font-family: "Great Vibes", serif;
}
.maintitle_text img{
display:block;
margin:0 auto 20px;
}
.maintitle_text img.pinorelogo{
width:150px;
margin:0 auto;
}
.title_text{
display:block;
width:600px;
margin:50px auto;
}
.title_text p.subtitle_text{
display:block;
margin:50px auto 0;
text-align:center;
}
.title_text p.profile{
display:block;
width:80%;
margin:30px auto;
font-size:14px;
}
.title_text p.interview_title{
font-size:18px;
font-weight:200;
text-align:center;
display:block;
margin:80px auto 0;
}
.title_text p.interview_title span{
font-size:20px;
display:block;
margin:10px auto 10px;
color:rgba(39,80,135,1.00);
}
.title_text img{
display:block;
margin:40px auto;
width:80%;
}
.relatedcontents_text{
display:flex;
align-items:flex-start;
gap:5px;
margin:50px auto;
width:600px;
}
.relatedcontents_text p.relatedcontents_left{
font-size:12px;
font-weight:400;
display:block;
margin:0;
white-space: nowrap;
}
.relatedcontents_text p.relatedcontents_link{
font-size:16px;
margin:0;
}
.relatedcontents_text p.relatedcontents_link a{
text-decoration: underline;
}
.relatedcontents_text p.relatedcontents_link a:hover{
text-decoration: none;
}
/*====================================================================
PC-INTERVIE
====================================================================*/
.interview{
display:block;
width:600px;
margin:80px auto;
}
.interview .Question{
display:block;
margin:50px auto 10px;
font-size:18px;
color:rgba(39,80,135,1.00)
}
.interview .Answer_visible{
display:block;
margin:10px auto 0;
font-size:16px;
/*border:1px solid #000;*/
}
.Answer-inner {
max-height: 0;
overflow: hidden;
transition: max-height 0.3s ease;
margin-top: 0;
/*border:1px solid #c00;*/
}
.Answer-inner.open {
  max-height: 1000px;
}
.toggle {
cursor: pointer;
margin-top: 10px;
text-align: center;
font-size:14px;
}
.Answer_visible p{
  margin: 10px auto 0;
  padding: 10px auto 0;
}
.Answer-inner p {
  margin: 0 auto 10px;
  padding: 0 auto 10px;
}
.interview-divider{
width:200px;
border-top:1px solid #333;
margin:30px auto 30px;
}
.next_interview{
display:block;
margin:80px auto 60px;
text-align: center;
}
.next_interview p{
font-size:16px;
font-weight:200;
  margin: 10px auto 0;
  padding: 10px auto 0;
}
/*====================================================================
CORDINATE
====================================================================*/
.cordinate_item p{
display:block;
width:600px;
margin:60px auto;
font-size:14px;
text-align:center;
}
/*====================================================================
slick
====================================================================*/
.lt_slideshow {
  max-width: 100%;
  margin: 0 auto;
  padding: 0 25px;
}
.slick-slide {
  margin: 0 5px;
}
.slick-slide img {
  width: 100%;
  height: auto;
}
.slick-prev, .slick-next {
  z-index: 1;
}
.slick-prev:before, .slick-next:before {
  color: #000;
}
.slick-slide {
  transition: all ease-in-out .3s;
  opacity: .2;
}
.slick-active {
  opacity: 1;
}
.slick-current {
  opacity: 1;
}
.thumb {
  margin: 20px 0 0;
}
.thumb .slick-slide {
  cursor: pointer;
}
.thumb .slick-slide:hover {
  opacity: .7;
}
.lt_slideshow_full .slick-list {
  overflow: visible;
}
.lt_slideshow_full.slider {
  max-width: 50%;
  margin: 0 auto;
}
.slick-dots li button:before{
    font-size: 20px;
}
/*LINK*/
.catalogue_link {
    display:block;
    width:100%;
    margin:60px auto 120px;
    text-align: center;
}
a.link_button {
    color: #333;
    display: inline-block;
    font-weight: 600;
    padding: 0.8rem 4rem;
    text-decoration: none;
    transition: .3s;
    border: 1px solid #333;
    font-size:12px;
    background-color: #fff;
}
a.link_button:hover {
    background-color: #333;
    color:#fff;
}
/*========================================================================================================================================SP============================================================================================================================================================================================================*/
@media screen and (max-width: 798px) {
html{
font-size: calc(100vw / 40);
}
br.sponly_br{
display:block;
}
br.pconly_br{
display:none;
}
#link{
display:block;
margin:80px auto 30px;
}
.link_table{
    display:flex;
    width:60%;
    margin:auto;
}
.link_table .link_td{
    display:block;
    margin:auto;
    text-align:center;
}
.link_table .link_td img{
    width:65%;
}
.wrapper {
  width: 100%;
  overflow: hidden;
}

/*====================================================================
SP-MOVIE
====================================================================*/
.video-background {
  position: relative;
  overflow: hidden;
  width: 100%;
  height: 100vh;
  max-height: 1080px;
  aspect-ratio: 9 / 16;
  /*border:1px solid;*/
}
.video-background video {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  object-fit: cover;
  z-index: 0;
  aspect-ratio: 9 / 16;
}
.controls {
  position: absolute;
  left: 50%;
  bottom: 30px;
  transform: translate(-50%, 0);
  display: flex;
  gap: 10px;
  z-index: 2;
  height:auto;
  align-items: center;
  /*border:1px solid #c00;*/
}
.controls button {
  padding: 5px;
  background: rgba(0,0,0,0.5);
  border: none;
  cursor: pointer;
  align-self: center;
  /*border:1px solid #ccc;*/
}
.controls img{
display:block;
  /*border:1px solid #ff9;*/
}
.controls2 {
  position: absolute;
  left: 50%;
  bottom: 35px;
  transform: translate(-50%, 0);
  display: flex;
  align-items: center;
  gap: 10px;
  z-index: 2;
  height: 32px;
  /*border: 1px solid #c00;*/
}
.controls2 button {
  padding: 5px;
  background: rgba(0,0,0,0.5);
  border: none;
  cursor: pointer;
  align-self: center;
  width: 32px;
  height: 32px;
  display: flex;
  align-items: center;
  /*border:1px solid #ccc;*/
}
.controls2 img{
display:block;
heght:16px;
width:16px;
/*border:1px solid #ff9;*/
}
.video-overlay_thum{
position: absolute;
top:-40px;
left:0;
width:auto;
height: 100%;
z-index: 3;
}
.video-overlay {
  position: absolute;
  top: 45%;
  left: 50%;
  transform: translate(-50%, -50%);
  font-size: 60px;
  color: #fff;
  cursor: pointer;
  background: rgba(0,0,0,0.4);
  border-radius: 50%;
  width: 50px;
  height: 50px;
  display: flex;
  justify-content: center;
  align-items: center;
}
/*====================================================================
SP-TEXT
====================================================================*/
.maintitle_text{
display:block;
width:100%;
margin:0 auto;
}
.title_text{
display:block;
width:95%;
margin:30px auto;
}
h1{
font-size:2.6rem;
font-weight:200;
line-height: 1.3;
}
h1 span{
font-size:2.2rem;
font-weight:200;
letter-spacing: 0.02em;
font-family: "Great Vibes", serif;
}
.title_text p.subtitle_text{
display:block;
margin:30px auto 0;
text-align:left;
}
.title_text img{
display:block;
margin:40px auto;
width:100%;
}
.title_text p.profile{
display:block;
width:90%;
margin:30px auto;
font-size:1.4rem;
}
.title_text p.interview_title{
font-size:1.8rem;
font-weight:200;
text-align:center;
display:block;
margin:40px auto 0;
}
.title_text p.interview_title span {
font-size:2rem;
display:block;
margin:10px auto 10px;
color:rgba(39,80,135,1.00)
}
.relatedcontents_text{
display:flex;
align-items:flex-start;
gap:5px;
margin:30px auto;
width:85%;
}
.relatedcontents_text p.relatedcontents_left{
font-size:1.2rem;
font-weight:400;
display:block;
margin:0;
white-space: nowrap;
}
.relatedcontents_text p.relatedcontents_link{
font-size:1.4rem;
margin:0;
}
.relatedcontents_text p.relatedcontents_link a{
text-decoration: underline;
}
.relatedcontents_text p.relatedcontents_link a:hover{
text-decoration: none;
}
/*====================================================================
SP-INTERVIE
====================================================================*/
.interview{
display:block;
width:95%;
margin:60px auto;
}
.interview .Question{
display:block;
margin:40px auto 10px;
font-size:1.8rem;
color:rgba(39,80,135,1.00)
}
.interview .Answer_visible{
display:block;
margin:10px auto 0;
font-size:1.6rem;
/*border:1px solid #000;*/
}
.Answer-inner {
max-height: 0;
overflow: hidden;
transition: max-height 0.3s ease;
margin-top: 0;
/*border:1px solid #c00;*/
}
.Answer-inner.open {
  max-height: 1000px;
}
.toggle {
cursor: pointer;
margin-top: 10px;
text-align: center;
font-size:1.2rem;
}
.Answer_visible p{
  margin: 10px auto 0;
  padding: 10px auto 0;
}
.Answer-inner p {
  margin: 0 auto 10px;
  padding: 0 auto 10px;
}
.interview-divider{
width:200px;
border-top:1px solid #333;
margin:30px auto 30px;
}
.next_interview{
display:block;
margin:40px auto 30px;
text-align: center;
}
.next_interview p{
font-size:1.4rem;
font-weight:200;
  margin: 10px auto 0;
  padding: 10px auto 0;
}
/*====================================================================
SP-CORDINATE
====================================================================*/
.cordinate_item p{
display:block;
width:95%;
margin:40px auto;
font-size:1.2rem;
text-align:center;
}
/*====================================================================
slick
====================================================================*/
section { 
margin-bottom: 80px;
}
.lt_slideshow_full.slider {
  max-width: 100%;
  margin: 0 auto;
  padding: 0 0;
}
a.link_button {
    color: #333;
    display: inline-block;
    font-weight: 600;
    padding: 1.25rem 4rem;
    text-decoration: none;
    transition: .3s;
    border: 1px solid #333;
    font-size:calc(100vw / 26);
}
a.link_button:hover {
    background-color: #fff;
    color:#333;
}
.lt_slideshow_full .slick-list {
  overflow: hidden;
}
}