@charset "utf-8";
/* movie css */
.bg_imgbox {
background: url("../img/movie/title_bg.jpg") ;
background-size: cover;
}
main {
background-image: url("../img/common/pc_bg_01.png");
background-repeat: repeat;
background-position: left top;
}
.teaching_title {
font-size: 1.2rem;
font-weight: 400;
letter-spacing: 0.4em;
line-height: 100%;
text-align: center;
margin-bottom: 30px;
}
.adage_title {
font-size: 2.2rem;
font-weight: 400;
letter-spacing: 0.4em;
line-height: 100%;
text-align: center;
margin-bottom: 50px;
}
.adage_txt {
max-width: 980px;
line-height: 220%;
margin: 0 auto;
}
.teaching_box {
padding-bottom: 100px;
border-bottom: solid 1px #DEDEDE;
margin-bottom: 70px;
}

@media all and (max-width : 820px ){
.teaching_box {
padding-bottom: 50px;
margin-bottom: 40px;
}
}


.search_number {
display: flex;
align-items: flex-end;
justify-content: flex-end;
margin-bottom: 25px;
}
.search_number dd {
display: flex;
align-items: flex-end;
}
.search_number em {
padding-left: .2em;
font-size: 5.0rem;
font-family: 'Libre Baskerville', serif;
font-weight: 400;
font-style: normal;
line-height: 100%;
position: relative;
top: 5px;
}
.search_number dd  {
color: #C6C1AB
}

.movie_box {
width: calc(33.3333333% - 40px / 3);
margin-right: 20px;
margin-bottom: 30px;
}
.movie_box:nth-child(3n) {
margin-right: 0px;
}

.movie_title {
font-size: 1.4rem;
font-weight: bold;
line-height: 145%;
display: block;
}
.movie_wrap_box {
width: 100%;
display: flex;
flex-wrap: wrap;
}



/* youtube video */
.vdo-unit {
width: 100%;
margin-right: 20px;
}

.vdo-base {
margin-bottom: 15px;
position: relative;
background: 000;
transition-duration: 0.7s;	
}
.vdo-base:hover {
opacity: 0.7;
transition-duration: 0.7s;	
}
.modal-open {
width: 100%;
height: 100%;
position: absolute;
top: 0;
left: 0;
z-index: 6;
}
.vdo-body {
max-width: 100%;
height: auto;
padding-bottom: 56.25%;
position: relative;
overflow: hidden;
background: 000;
}

.vdo-body iframe {
width: 100%;
height: 100%;
position: absolute;
top: 0;
left: 0;
}

/* modal */
.blocker {
z-index: 11;
}
.modal {
background-color: #242424;
border-radius: 4px;
max-width: 1200px;
padding: 10px;
color: #fff;
}
.modal-window .vdo-txt {
 margin-left: 2%;
}
.modal-window .vdo-txt .txt-ttl {
	margin-bottom: 6px;
}
.modal-window .vdo-txt .txt-txt {
margin-bottom: .4rem;
font-size: 1.3rem;
}
.modal a.close-modal {
background-color: #000;
border: 2px solid #242424;
border-radius: 50%;
display: block;
width: 26px;
height: 26px;
padding: 30px 30px 0 0;
overflow: hidden;
position: absolute;
top: -13px;
right: -13px;
}
.modal a.close-modal:hover {
background-color: #424242;
}
.modal a.close-modal::before,
.modal a.close-modal::after {
background-color: #999;
content: '';
display: block;
width: 2px;
height: 24px;
margin-left: -1px;
position: absolute;
top: 3px;
left: 50%;
}
.modal a.close-modal::before {
transform: rotate(-45deg);
}
.modal a.close-modal::after {
transform: rotate(45deg);
}












/*スマートフォン*/

@media all and (max-width : 767px ){
.bg_imgbox {
background: url("../img/movie/title_bg_sp.png") ;
background-size: cover;
}

.teaching_title {
font-size: 1.1rem;
margin-bottom: 20px;
}
.adage_title {
font-size: 1.6rem;
letter-spacing: 0.3em;
line-height: 145%;
margin-bottom: 30px;
}
.adage_txt {
font-size: 1.2rem;
line-height: 180%;
}
.teaching_box {
padding-bottom: 30px;
margin-bottom: 30px;
}
.search_number {
margin-bottom: 25px;
}
.search_number dt {
font-size: 1.1rem
}
.search_number em {
padding-left: .1em;
font-size: 3.0rem;
}
.search_number dd  {
font-size: 1.1rem
}
.movie_box {
width: calc(50% - 15px / 2);
margin-right: 15px;
margin-bottom: 20px;
}
.movie_box:nth-child(3n) {
margin-right: 15px;
}
.movie_box:nth-child(2n) {
margin-right: 0px;
}

.movie_title {
font-size: 1.1rem;

line-height: 145%;
display: block;
}

}