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

/*---------scrollアイコン-----------*/
.p-index-kv__scroll {
width: 1px;
height: 40px;
position: absolute;
left: 0;
right: 0;
text-align: center;
margin: auto;
z-index: 100;
background-color: #eee
}

@media only screen and (min-width: 769px) {
.p-index-kv__scroll {
/*bottom: 6.51042%;*/
bottom: 5%;
}
}
/*sp*/
@media only screen and (max-width: 768px) {
.p-index-kv__scroll {
bottom: 5%;
}
}


@media all and (min-width:768px) and (max-width:1024px) {
.p-index-kv__scroll {
bottom: 15.84507%
}
}

@media all and (max-width:767px) {
.p-index-kv__scroll {
bottom: 13.20423%
}
}
.p-index-kv__scroll-pointer {
width: 1px;
height: 10px;
position: absolute;
top: 0;
left: 0;
z-index: 100
}
.p-index-kv__scroll-pointer:before {
content: '';
display: block;
width: 1px;
height: 10px;
border-radius: 50%;
background-color: red
}

@media all and (min-width:768px) {
.p-index-kv__scroll-text {
position: absolute;
bottom: -30px;
font-size: 10px;
font-size: .625rem;
font-weight: 600;
text-transform: uppercase;
letter-spacing: .1em;
-webkit-transform: translateX(-50%);
transform: translateX(-50%);
color: #fff;
}
}

@media all and (max-width:767px) {
.p-index-kv__scroll-text {
position: absolute;
bottom: -30px;
font-size: 10px;
font-size: .625rem;
font-weight: 600;
text-transform: uppercase;
letter-spacing: .1em;
-webkit-transform: translateX(-50%);
transform: translateX(-50%);
color: #fff;
}
}


@-webkit-keyframes moveScrollPointer {
0% {
-webkit-transform:translate3d(0, 0, 0);
transform:translate3d(0, 0, 0)
}
100% {
-webkit-transform:translate3d(0, 35px, 0);
transform:translate3d(0, 35px, 0)
}
}
@keyframes moveScrollPointer {
0% {
-webkit-transform:translate3d(0, 0, 0);
transform:translate3d(0, 0, 0)
}
100% {
-webkit-transform:translate3d(0, 35px, 0);
transform:translate3d(0, 35px, 0)
}
}

.p-index-kv__scroll-pointer {
width: 1px;
height: 10px;
position: absolute;
top: 0;
left: 0;
z-index: 100
}
.p-index-kv__scroll-pointer:before {
content: '';
display: block;
width: 1px;
height: 10px;
border-radius: 50%;
background-color: #d0121b;
}
@-webkit-keyframes scrollPointerInOut {
0% {
-webkit-transform:scale(0);
transform:scale(0)
}
10% {
-webkit-transform:scale(1);
transform:scale(1)
}
60% {
-webkit-transform:scale(1);
transform:scale(1)
}
100% {
-webkit-transform:scale(0);
transform:scale(0)
}
}
@keyframes scrollPointerInOut {
0% {
-webkit-transform:scale(0);
transform:scale(0)
}
10% {
-webkit-transform:scale(1);
transform:scale(1)
}
60% {
-webkit-transform:scale(1);
transform:scale(1)
}
100% {
-webkit-transform:scale(0);
transform:scale(0)
}
}
.p-index-kv__scroll-pointer {
-webkit-animation-name: moveScrollPointer;
animation-name: moveScrollPointer;
-webkit-animation-duration: .8s;
animation-duration: .8s;
-webkit-animation-iteration-count: infinite;
animation-iteration-count: infinite;
-webkit-animation-timing-function: cubic-bezier(.215, .61, .355, 1);
animation-timing-function: cubic-bezier(.215, .61, .355, 1)
}
.p-index-kv__scroll-pointer:before {
-webkit-animation-name: scrollPointerInOut;
animation-name: scrollPointerInOut;
-webkit-animation-duration: .8s;
animation-duration: .8s;
-webkit-animation-iteration-count: infinite;
animation-iteration-count: infinite;
-webkit-animation-timing-function: cubic-bezier(.215, .61, .355, 1);
animation-timing-function: cubic-bezier(.215, .61, .355, 1)
}
/*PC*/
@media print, screen and (min-width: 768px) {

#menu li a { color: #fff!important;}
.subMenu li a { color: #fff!important;}

.logo_com { display: none; }
header.smaller #menu li a { color: #333!important;}

#header {
z-index: 10000;
/*background-color: rgba(255,255,255,0.70)*/
}

/*#header #menu li a { color: #fff; }
#header .subMenu li a { color: #fff; }
#header.smaller .subMenu li a { color: #000!important; }
#header.smaller #menu li a { color: #000!important; }*/

/*--------------------*/

#dot {
position: absolute;
top: 0;
left: 0;
width: 100%;
height: 100%;
min-height: 900px;
background: url(../images/index/dot.png) ,rgba(255,255,255,0.1);
z-index: 100;
}

.hedTitWrap {
width: 100%;
height: 900px;
position: relative;
}

.headerslider {
width: 100%; 
position: relative;
height: 900px;
}

.idxHedTit {
width: 100%;
height: 100%;
display:-webkit-box;
display:-ms-flexbox;
display:flex;
-webkit-box-align: center;
-ms-flex-align: center;
align-items: center;
}

.idxHedTitIn { padding-left: 150px; }

.idxHedTitIn h2 {
color: #fff;
font-size: 3vw;
letter-spacing: 0.02em;
line-height: 1.8;
margin-bottom: 20px;
font-family: 'Open Sans', sans-serif;
font-weight: 800;
}

.idxHedTitIn h3 { font-size: 16px; color: #fff; }

.slider_btn { width: 350px; margin: 50px auto auto 0;}
.slider_btn a { padding: 30px; background: rgba(208,18,27,0.7); color: #fff; width: 100%; box-sizing: border-box; display: block; text-align: center; position: relative; font-weight: bold; font-size: 16px; font-family: 'Open Sans', sans-serif; letter-spacing: 0.1em; }
.slider_btn a::before {position: absolute; display: block; content: "\f0a9"; font-family: "Font Awesome 5 Free"; color: #fff; font-weight: bold; right: 50px;  font-size: 18px; top: 30px;  -webkit-transition: all 0.3s ease-out;
-moz-transition: all 0.3s ease-out;
-ms-transition: all 0.3s ease-out;
transition: all 0.3s ease-out; }
.slider_btn a:hover::before {right: 40px; -webkit-transition: all 0.3s ease-out;
-moz-transition: all 0.3s ease-out;
-ms-transition: all 0.3s ease-out;
transition: all 0.3s ease-out;
}

/*----------------index------------------------------------*/


.idx_txtbox_35l { width: 35%; float: left; }
.idx_imgbox_60r { width: 60%; float: right; }
.idx_txtbox_35r { width: 35%; float: right; }
.idx_imgbox_60l { width: 60%; float: left; }

/*-------idx_main-----------*/

.idx_main { width: 100%; margin: 0 auto 50px; display: flex; flex-wrap: wrap; align-items: center; }
.idx_main_tit { flex-basis: 47%; margin-right: 3%; font-size: 100px;  font-family: 'Open Sans', sans-serif; font-weight: 800; color: rgba(208,18,27,0.1); line-height: 1.2em; }
.idx_main_tit2 { flex-basis: 47%; margin-right: 3%; font-size: 80px;  font-family: 'Open Sans', sans-serif; font-weight: 800; color: rgba(208,18,27,0.1); line-height: 1em; }
.idx_main_txt { flex-basis: 49%; font-size: 20px;  color: #333; line-height: 2.5em; }

.idx_img_r { width: 90%; position: relative; margin: auto 0 auto auto; }
.idx_img_r img { width: 100%; height: auto; }
.idx_img_r::before { content: ""; position: absolute; top: 35px; right: 13px; width: 100%; height: 96%; border: 1px solid #d0121b; z-index: -1; }
.idx_img_l { width: 90%; position: relative; margin: auto auto auto 0; }
.idx_img_l img { width: 100%; height: auto; }
.idx_img_l::before { content: ""; position: absolute; top: 35px; left: 13px; width: 100%; height: 96%; border: 1px solid #d0121b; z-index: -1; }

/*-------idx_box01-------------*/

#idx_box01 { padding: 100px  0px; position: relative; overflow: hidden;}

.idx_tit_sub { font-size: 25px; color: #333; margin-bottom: 30px; text-align: left; }
.idx_tit_sub_white { font-size: 25px; color: #fff; margin-bottom: 30px; text-align: left; font-weight: bold; }

.idx_btn01 { width: 250px; position: relative; background: #d0121b; padding: 30px; box-sizing: border-box;  margin-top: 50px; }
.idx_btn01 a::after { position: absolute; display: block; content: "\f0a9"; font-family: "Font Awesome 5 Free"; color: #fff; font-weight: bold; right: 20px; top: 38%; font-size: 18px;  -webkit-transition: all 0.3s ease-out;
-moz-transition: all 0.3s ease-out;
-ms-transition: all 0.3s ease-out;
transition: all 0.3s ease-out;
}
.idx_btn01 a:hover::after { right: 10px; -webkit-transition: all 0.3s ease-out;
-moz-transition: all 0.3s ease-out;
-ms-transition: all 0.3s ease-out;
transition: all 0.3s ease-out;
}
.idx_btn01 a { display: block; }
.idx_btn_tit { font-family: 'Open Sans', sans-serif; font-weight: normal!important; color: #fff; font-weight: 400; letter-spacing: 0.2em;  }

.b_img { width: 100%; margin: 0 auto; }
.b_img img { width: 100%; height: auto; }

.read_btn { font-size: 16px; color: #d0121b; position: relative; text-align: right; padding-right: 50px; margin-top: 30px; }
.read_btn a { color: #d0121b; font-size: 16px; font-weight: bold; display: block; }
.read_btn a::before {position: absolute; display: block; content: "\f0a9"; font-family: "Font Awesome 5 Free"; color: #d0121b; font-weight: bold; right: 20px;  font-size: 18px; top: 2px;  -webkit-transition: all 0.3s ease-out;
-moz-transition: all 0.3s ease-out;
-ms-transition: all 0.3s ease-out;
transition: all 0.3s ease-out; }
.read_btn a:hover::before {right: 10px; -webkit-transition: all 0.3s ease-out;
-moz-transition: all 0.3s ease-out;
-ms-transition: all 0.3s ease-out;
transition: all 0.3s ease-out;
}



/*-------idx_box02-------------*/

.idx_tit { text-align: center; margin-bottom: 50px; }
.idx_tit span.en {  font-size: 40px; font-weight: bold; font-family: 'Open Sans', sans-serif; color: #d0121b; display: block; }
.idx_tit span.jp { font-size: 20px; font-weight: bold; display: block; }
.idx_txt_c { text-align: center; }
.idx_txt { text-align: left; }

#idx_box02 .read_btn { margin-top: -30px; }
#idx_box02 { margin-bottom: 70px; }
/* =============================================================================
   mixbox
   ========================================================================== */    

.interview_list { width: 100%; margin: 0 auto; display: flex; flex-wrap: wrap; align-items: center; margin-top: 50px; }
.interview_list li { width: 25%; position: relative; }



.mix_box {
width: 100%;
min-width: 1200px;
margin: 0 auto 50px;
height: 45.3125vw;;
}    

.w50_l {
width: 50%;
float: left;
}

.w50_r {
width: 50%;
float: right;
}

.w60_l {
width: 60%;
float: left;
}    

.w60_r {
width: 60%;
float: right;
}

.w40_l {
width: 40%;
float: left;
}

.w40_r {
width: 40%;
float: right;
}



.illust {
width: 66px;
margin: 0 auto;
}

.illust img {
width: 100%;
height: auto;
}



.w25_l {
width: 50%;
float: left;
}

.w25_r {
width: 50%;
float: right;
}

.mix_b {
position: relative;
overflow: hidden;
height: 45.3125vw;
}    

.mix_b a {
position: relative;
width: 100%;
height: 100%;
display: block;
}    

.mix_b a .mix_box {
position: absolute;
margin: auto;
left: 0;
right: 0;
}

.mix_b:hover::before {
-webkit-transition: all .3s ease-out;
-moz-transition: all .3s ease-out;
-ms-transition: all .3s ease-out;
transition: all .3s ease-out;
transform: scale(1.1);
transition: all 1s cubic-bezier(0.23, 1, 0.32, 1) 0s;
}

.mix_s {
position: relative;
overflow: hidden;
height: 22.65625vw;
}

.mix_s a {
position: relative;
width: 100%;
height: 100%;
display: block;
}

.mix_s a .mix_box {
position: absolute;
margin: auto;
left: 0;
right: 0;
}
.mix_s:hover::before {
-webkit-transition: all .3s ease-out;
-moz-transition: all .3s ease-out;
-ms-transition: all .3s ease-out;
transition: all .3s ease-out;
transform: scale(1.1);
transition: all 1s cubic-bezier(0.23, 1, 0.32, 1) 0s
}

.v_01::before {
background: url(../images/index/v_01.jpg) center center;
background-size: cover;
position: absolute;
top: 0;
left: 0;
width: 100%;
height: 100%;
content: "";
-webkit-transition: -webkit-transform 125ms;
transition: -webkit-transform 125ms;
transition: transform 125ms;
transition: transform 125ms, -webkit-transform 125ms
}  

.v_02::before {
background: url(../images/index/v_02.jpg) center center;
background-size: cover;
position: absolute;
top: 0;
left: 0;
width: 100%;
height: 100%;
content: "";
-webkit-transition: -webkit-transform 125ms;
transition: -webkit-transform 125ms;
transition: transform 125ms;
transition: transform 125ms, -webkit-transform 125ms
}    

.v_03::before {
background: url(../images/index/v_03.jpg) center center;
background-size: cover;
position: absolute;
top: 0;
left: 0;
width: 100%;
height: 100%;
content: "";
-webkit-transition: -webkit-transform 125ms;
transition: -webkit-transform 125ms;
transition: transform 125ms;
transition: transform 125ms, -webkit-transform 125ms
}    

.v_04::before {
background: url(../images/index/v_04.jpg) center center;
background-size: cover;
position: absolute;
top: 0;
left: 0;
width: 100%;
height: 100%;
content: "";
-webkit-transition: -webkit-transform 125ms;
transition: -webkit-transform 125ms;
transition: transform 125ms;
transition: transform 125ms, -webkit-transform 125ms
}    

.v_05::before {
background: url(../images/index/v_05.jpg) center center;
background-size: cover;
position: absolute;
top: 0;
left: 0;
width: 100%;
height: 100%;
content: "";
-webkit-transition: -webkit-transform 125ms;
transition: -webkit-transform 125ms;
transition: transform 125ms;
transition: transform 125ms, -webkit-transform 125ms
}    

.v_06::before {
background: url(../images/index/v_06.jpg) center center;
background-size: cover;
position: absolute;
top: 0;
left: 0;
width: 100%;
height: 100%;
content: "";
-webkit-transition: -webkit-transform 125ms;
transition: -webkit-transform 125ms;
transition: transform 125ms;
transition: transform 125ms, -webkit-transform 125ms
}    
.v_07::before {
background: url(../images/index/v_06.jpg) center center;
background-size: cover;
position: absolute;
top: 0;
left: 0;
width: 100%;
height: 100%;
content: "";
-webkit-transition: -webkit-transform 125ms;
transition: -webkit-transform 125ms;
transition: transform 125ms;
transition: transform 125ms, -webkit-transform 125ms
}   
.v_08::before {
background: url(../images/index/v_08.jpg) center center;
background-size: cover;
position: absolute;
top: 0;
left: 0;
width: 100%;
height: 100%;
content: "";
-webkit-transition: -webkit-transform 125ms;
transition: -webkit-transform 125ms;
transition: transform 125ms;
transition: transform 125ms, -webkit-transform 125ms
}   
.mix_ttlbox {
position: absolute; 
left: 30px;
bottom: 30px;
text-align: left; 
}

.mix_ttl {
display: table-cell;
vertical-align: middle;
color: #fff;
font-size: 43px;
text-align: center;
line-height: 1.2em;
font-weight: 500;
font-family: 'Hiragino Sans','Hiragino Kaku Gothic Pro','メイリオ',Meiryo,sans-serif;
}

.mix_ttl span {
line-height: 1.2em;
display: block;
font-size: 16px;
}

.type { }
.type span { background: #d0121b; padding: 2px 10px; color: #fff; }
.name span { font-size: 16px; padding-left: 15px;  }
.name { font-size: 30px; color: #fff; }
.year { color: #fff; font-size: 14px; }



/*--------idx_box03---------*/

#idx_box03 { margin-bottom: 70px; }

.message_list { width: 100%; margin: 50px auto 0px; }
.message_list li { width: 70%; background: #d0121b; }
.message_list li:nth-of-type(1) { margin: auto auto auto 0; }
.message_list li:nth-of-type(2) { margin: auto 0 auto auto; margin-top: 50px; }

.message_box { width: 100%; display: flex; flex-wrap: wrap; align-items: center; }

.message_img { width: 100%; }
.message_img img { width: 100%; height: auto; }
.message_txtbox { flex-basis: 60%; padding: 30px; box-sizing: border-box; color: #fff; }


.message_list li a .read_btn_list { font-size: 16px; color: #fff; position: relative; text-align: right; padding-right: 50px; margin-top: 30px; font-weight: bold; }
.message_list li a .read_btn_list::before {position: absolute; display: block; content: "\f0a9"; font-family: "Font Awesome 5 Free"; color: #fff; font-weight: bold; right: 20px;  font-size: 18px; top: 2px;  -webkit-transition: all 0.3s ease-out;
-moz-transition: all 0.3s ease-out;
-ms-transition: all 0.3s ease-out;
transition: all 0.3s ease-out; }
.message_list li a:hover .read_btn_list::before {right: 10px; -webkit-transition: all 0.3s ease-out;
-moz-transition: all 0.3s ease-out;
-ms-transition: all 0.3s ease-out;
transition: all 0.3s ease-out;
}

.photo_hover_wrap img {
width: 100%;
height: auto;
}

.photo_hover_wrap {
flex-basis: 40%; 
display: block;
height: 300px;
overflow: hidden;
position: relative;
text-decoration: none;
z-index: 0;
}
.photo_hover_wrap .photo {
display: block;
height: auto;
left: 0;
position: absolute;
top: 0;
transition: all 0.2s linear 0s;
width: 100%;
}
.message_list li a:hover .photo_hover_wrap {
text-decoration: none;
cursor: pointer;
}
.message_list li a:hover .photo_hover_wrap .photo {
transform: scale(1.1);
transition: all 2s cubic-bezier(0.23, 1, 0.32, 1) 0s;
}

/*-----------idx_04---------*/

#idx_box04 { margin-bottom: 100px; }
/*-----------idx_05---------*/

.entry_btn { width: 100%; display: table; text-align: center; }
.entry_btn a { display: block; color: #fff; font-family: 'Open Sans', sans-serif; font-size: 50px; text-align: center; background: #d0121b; padding: 150px 0px;  transition: all 2s cubic-bezier(0.23, 1, 0.32, 1) 0s; }
.entry_btn a p.entry_tit { font-family: 'Open Sans', sans-serif; font-size: 50px; font-weight: bold; text-align: center; letter-spacing: 0.1em;  }
.entry_btn a:hover { background: #ff4e56; transition: all 2s cubic-bezier(0.23, 1, 0.32, 1) 0s; }
.entry_btn a p.entry_txt { font-size: 16px; text-align: center; margin-top: 30px; font-family: "游ゴシック",YuGothic,"ヒラギノ角ゴ ProN W3","Hiragino Kaku Gothic ProN","メイリオ",Meiryo,Osaka,"MS Pゴシック","MS PGothic",sans-serif; }








}





/*----------------------------------------------------*/





/*sp*/
@media only screen and (max-width: 767px) {
#header {
background-color: rgba(255,255,255,1.00)
}

#dot {
position: absolute;
top: 0;
left: 0;
width: 100%;
height: 100%;
min-height: 500px;
background: url(../images/index/dot.png) ,rgba(255,255,255,0.1);
z-index: 100;
}

.hedTitWrap {
width: 100%;
height: 500px;
position: relative;
}

.headerslider {
width: 100%; 
position: relative;
height: 500px;
}

.idxHedTit {
width: 100%;
height: 100%;
display:-webkit-box;
display:-ms-flexbox;
display:flex;
-webkit-box-align: center;
-ms-flex-align: center;
align-items: center;
}

.idxHedTitIn { padding-left: 30px; padding-right: 30px; }

.idxHedTitIn h2 {
color: #fff;
font-size: 5vw;
letter-spacing: 0.02em;
line-height: 1.8;
margin-bottom: 20px;
font-family: 'Open Sans', sans-serif;
font-weight: 800;
}

.idxHedTitIn h3 { font-size: 14px; color: #fff; }

.slider_btn { width: 250px; margin: 30px auto auto 0;}
.slider_btn a { padding: 15px; background: rgba(208,18,27,0.7); color: #fff; width: 100%; box-sizing: border-box; display: block; text-align: center; position: relative; font-weight: bold; font-size: 16px; font-family: 'Open Sans', sans-serif; letter-spacing: 0.1em; }
.slider_btn a::before {position: absolute; display: block; content: "\f0a9"; font-family: "Font Awesome 5 Free"; color: #fff; font-weight: bold; right: 50px;  font-size: 18px; top: 18px;  -webkit-transition: all 0.3s ease-out;
-moz-transition: all 0.3s ease-out;
-ms-transition: all 0.3s ease-out;
transition: all 0.3s ease-out; }
.slider_btn a:hover::before {right: 40px; -webkit-transition: all 0.3s ease-out;
-moz-transition: all 0.3s ease-out;
-ms-transition: all 0.3s ease-out;
transition: all 0.3s ease-out;
}

.p-index-kv__scroll { bottom: 9%; }

.idx_txtbox_35l { width: 100%; margin: 0 auto; }
.idx_imgbox_60r { width: 100%; margin: 0 auto; }
.idx_txtbox_35r { width: 100%; margin: 0 auto; }
.idx_imgbox_60l { width: 100%; margin: 0 auto; }


/*-------idx_main-----------*/

.idx_main { width: 100%; margin: 0 auto 50px; }
.idx_main_tit { width: 100%; font-size: 70px;  font-family: 'Open Sans', sans-serif; font-weight: 800; color: rgba(208,18,27,0.1); line-height: 1.2em; margin-bottom: 30px; }
.idx_main_tit2 { width: 100%;  font-size: 50px;  font-family: 'Open Sans', sans-serif; font-weight: 800; color: rgba(208,18,27,0.1); line-height: 1em; margin-bottom: 30px; }
.idx_main_txt { width: 100%; font-size: 16px;  color: #333; line-height: 2.5em; }

.idx_img_r { width: 90%; position: relative; margin: auto 0 auto auto; }
.idx_img_r img { width: 100%; height: auto; }
.idx_img_r::before { content: ""; position: absolute; top: 35px; right: 13px; width: 100%; height: 96%; border: 1px solid #d0121b; z-index: -1; }
.idx_img_l { width: 90%; position: relative; margin: auto auto auto 0; }
.idx_img_l img { width: 100%; height: auto; }
.idx_img_l::before { content: ""; position: absolute; top: 35px; left: 13px; width: 100%; height: 96%; border: 1px solid #d0121b; z-index: -1; }


/*-------idx_box01-------------*/

.idx_tit { font-size: 25px; color: #000; margin-bottom: 30px; }
.idx_tit_c { font-size: 25px; color: #000; margin-bottom: 30px; text-align: center; }
.idx_tit2 { font-size: 25px; color: #fff; margin-bottom: 30px; text-align: center; }
.idx_subtit { font-size: 16px; color: #003772; margin-bottom: 15px; }
.idx_txt { color: #000; font-size: 14px; text-align: left; line-height: 2.5em; margin-bottom: 50px; }


.idx_subtit2 { font-size: 16px; color: #fff; margin-bottom: 15px; text-align: center; }
.idx_txt { color: #000; font-size: 14px; text-align: left; line-height: 2.5em; margin-bottom: 50px; }
.idx_txt_c { color: #000; font-size: 14px; text-align: center; line-height: 2.5em; margin-bottom: 50px; }
.idx_txt2 { color: #fff; font-size: 14px; text-align: center; line-height: 2.5em; margin-bottom: 50px; }



.idx_box01_list { width: 100%; margin: 50px auto 30px;  }
.idx_box01_list li { width: 100%; margin-bottom: 30px; }
.idx_box01_list li:last-child { margin-bottom: 0px; }

.idx_box00_list { width: 100%; margin: 50px auto;  }
.idx_box00_list li { width: 100%; margin-bottom: 30px; }
.idx_box00_list li:last-child { margin-bottom: 0px; }


/*-------idx_box01-------------*/

#idx_box01 { padding: 100px  0px; position: relative; overflow: hidden;}

.idx_tit_sub { font-size: 20px; color: #333; margin-bottom: 30px; text-align: left; }
.idx_tit_sub_white { font-size: 20px; color: #fff; margin-bottom: 30px; text-align: left; font-weight: bold; }

.idx_btn01 { width: 250px; position: relative; background: #d0121b; padding: 30px; box-sizing: border-box;  margin-top: 50px; }
.idx_btn01 a::after { position: absolute; display: block; content: "\f0a9"; font-family: "Font Awesome 5 Free"; color: #fff; font-weight: bold; right: 20px; top: 38%; font-size: 18px;  -webkit-transition: all 0.3s ease-out;
-moz-transition: all 0.3s ease-out;
-ms-transition: all 0.3s ease-out;
transition: all 0.3s ease-out;
}
.idx_btn01 a:hover::after { right: 10px; -webkit-transition: all 0.3s ease-out;
-moz-transition: all 0.3s ease-out;
-ms-transition: all 0.3s ease-out;
transition: all 0.3s ease-out;
}
.idx_btn01 a { display: block; }
.idx_btn_tit { font-family: 'Open Sans', sans-serif; font-weight: normal!important; color: #fff; font-weight: 400; letter-spacing: 0.2em;  }

.b_img { width: 100%; margin: 0 auto; }
.b_img img { width: 100%; height: auto; }

.read_btn { font-size: 16px; color: #d0121b; position: relative; text-align: right; padding-right: 50px; margin-top: 30px; }
.read_btn a { color: #d0121b; font-size: 16px; font-weight: bold; display: block; }
.read_btn a::before {position: absolute; display: block; content: "\f0a9"; font-family: "Font Awesome 5 Free"; color: #d0121b; font-weight: bold; right: 20px;  font-size: 18px; top: 2px;  -webkit-transition: all 0.3s ease-out;
-moz-transition: all 0.3s ease-out;
-ms-transition: all 0.3s ease-out;
transition: all 0.3s ease-out; }
.read_btn a:hover::before {right: 10px; -webkit-transition: all 0.3s ease-out;
-moz-transition: all 0.3s ease-out;
-ms-transition: all 0.3s ease-out;
transition: all 0.3s ease-out;
}



/*-------idx_box02-------------*/

.idx_tit { text-align: center; margin-bottom: 50px; }
.idx_tit span.en {  font-size: 30px; font-weight: bold; font-family: 'Open Sans', sans-serif; color: #d0121b; display: block; }
.idx_tit span.jp { font-size: 16px; font-weight: bold; display: block; }
.idx_txt_c { text-align: center; }
.idx_txt { text-align: left; }

#idx_box02 .read_btn { margin-top: 30px; }
#idx_box02 { margin-bottom: 70px; }
/* =============================================================================
   mixbox
   ========================================================================== */    

.interview_list { width: 100%; margin: 0 auto;margin-top: 50px; }
.interview_list li { width: 100%; position: relative; }



.mix_box {
width: 100%;
margin: 0 auto 50px;
height: 135vw;;
}    


.mix_b {
position: relative;
overflow: hidden;
height: 45vw;
}    

.mix_b a {
position: relative;
width: 100%;
height: 100%;
display: block;
}    

.mix_b a .mix_box {
position: absolute;
margin: auto;
left: 0;
right: 0;
}

.mix_b:hover::before {
-webkit-transition: all .3s ease-out;
-moz-transition: all .3s ease-out;
-ms-transition: all .3s ease-out;
transition: all .3s ease-out;
transform: scale(1.1);
transition: all 1s cubic-bezier(0.23, 1, 0.32, 1) 0s;
}

.mix_s {
position: relative;
overflow: hidden;
height: 50vw;
}

.mix_s a {
position: relative;
width: 100%;
height: 100%;
display: block;
}

.mix_s a .mix_box {
position: absolute;
margin: auto;
left: 0;
right: 0;
}
.mix_s:hover::before {
-webkit-transition: all .3s ease-out;
-moz-transition: all .3s ease-out;
-ms-transition: all .3s ease-out;
transition: all .3s ease-out;
transform: scale(1.1);
transition: all 1s cubic-bezier(0.23, 1, 0.32, 1) 0s
}

.v_01::before {
background: url(../images/index/v_01.jpg) center center;
background-size: cover;
position: absolute;
top: 0;
left: 0;
width: 100%;
height: 100%;
content: "";
-webkit-transition: -webkit-transform 125ms;
transition: -webkit-transform 125ms;
transition: transform 125ms;
transition: transform 125ms, -webkit-transform 125ms
}  

.v_02::before {
background: url(../images/index/v_02.jpg) center center;
background-size: cover;
position: absolute;
top: 0;
left: 0;
width: 100%;
height: 100%;
content: "";
-webkit-transition: -webkit-transform 125ms;
transition: -webkit-transform 125ms;
transition: transform 125ms;
transition: transform 125ms, -webkit-transform 125ms
}    

.v_03::before {
background: url(../images/index/v_03.jpg) center center;
background-size: cover;
position: absolute;
top: 0;
left: 0;
width: 100%;
height: 100%;
content: "";
-webkit-transition: -webkit-transform 125ms;
transition: -webkit-transform 125ms;
transition: transform 125ms;
transition: transform 125ms, -webkit-transform 125ms
}    

.v_04::before {
background: url(../images/index/v_01.jpg) center center;
background-size: cover;
position: absolute;
top: 0;
left: 0;
width: 100%;
height: 100%;
content: "";
-webkit-transition: -webkit-transform 125ms;
transition: -webkit-transform 125ms;
transition: transform 125ms;
transition: transform 125ms, -webkit-transform 125ms
}    

.v_05::before {
background: url(../images/index/v_01.jpg) center center;
background-size: cover;
position: absolute;
top: 0;
left: 0;
width: 100%;
height: 100%;
content: "";
-webkit-transition: -webkit-transform 125ms;
transition: -webkit-transform 125ms;
transition: transform 125ms;
transition: transform 125ms, -webkit-transform 125ms
}    

.v_06::before {
background: url(../images/index/v_01.jpg) center center;
background-size: cover;
position: absolute;
top: 0;
left: 0;
width: 100%;
height: 100%;
content: "";
-webkit-transition: -webkit-transform 125ms;
transition: -webkit-transform 125ms;
transition: transform 125ms;
transition: transform 125ms, -webkit-transform 125ms
}    

.mix_ttlbox {
position: absolute; 
left: 30px;
bottom: 30px;
text-align: left; 
}


.type { }
.type span { background: #d0121b; padding: 2px 10px; color: #fff; font-size: 12px; }
.name span { font-size: 16px; padding-right: 15px; }
.name { font-size: 25px; color: #fff; }
.year { color: #fff; font-size: 12px; }



/*--------idx_box03---------*/

#idx_box03 { margin-bottom: 70px; }
#idx_box03 .idx_txt { color: #fff; }
.message_list { width: 100%; margin: 50px auto 0px; }
.message_list li { width: 100%; background: #d0121b; }
.message_list li:nth-child(n+2) { margin-top: 30px; }

.message_box { width: 100%;  }

.message_img { width: 100%; }
.message_img img { width: 100%; height: auto; }
.message_txtbox { flex-basis: 100%; padding:30px 15px; box-sizing: border-box; color: #fff; }


.message_list li a .read_btn_list { font-size: 16px; color: #fff; position: relative; text-align: right; padding-right: 50px; margin-top: 30px; font-weight: bold; }
.message_list li a .read_btn_list::before {position: absolute; display: block; content: "\f0a9"; font-family: "Font Awesome 5 Free"; color: #fff; font-weight: bold; right: 20px;  font-size: 18px; top: 2px;  -webkit-transition: all 0.3s ease-out;
-moz-transition: all 0.3s ease-out;
-ms-transition: all 0.3s ease-out;
transition: all 0.3s ease-out; }
.message_list li a:hover .read_btn_list::before {right: 10px; -webkit-transition: all 0.3s ease-out;
-moz-transition: all 0.3s ease-out;
-ms-transition: all 0.3s ease-out;
transition: all 0.3s ease-out;
}

.photo_hover_wrap img {
width: 100%;
height: auto;
}

.photo_hover_wrap {
flex-basis: 40%; 
display: block;
height: 55vw;
overflow: hidden;
position: relative;
text-decoration: none;
z-index: 0;
}
.photo_hover_wrap .photo {
display: block;
height: auto;
left: 0;
position: absolute;
top: 0;
transition: all 0.2s linear 0s;
width: 100%;
}
.message_list li a:hover .photo_hover_wrap {
text-decoration: none;
cursor: pointer;
}
.message_list li a:hover .photo_hover_wrap .photo {
transform: scale(1.1);
transition: all 2s cubic-bezier(0.23, 1, 0.32, 1) 0s;
}

/*-----------idx_04---------*/

#idx_box04 { margin-bottom: 100px; }
/*-----------idx_05---------*/

.entry_btn { width: 100%; display: table; text-align: center; }
.entry_btn a { display: block; color: #fff; font-family: 'Open Sans', sans-serif; font-size: 25px; text-align: center; background: #d0121b; padding: 70px 0px;  transition: all 2s cubic-bezier(0.23, 1, 0.32, 1) 0s; }
.entry_btn a p { font-family: 'Open Sans', sans-serif; font-size: 30px; font-weight: bold; text-align: center; letter-spacing: 0.1em;  }
.entry_btn a:hover { background: #ff4e56; transition: all 2s cubic-bezier(0.23, 1, 0.32, 1) 0s; }






}