@charset "UTF-8";

/*common*/

h2.opentitle {
    font-family: "Roboto", sans-serif;
    font-weight: normal;
    font-size: 54px;
    letter-spacing: 0.03em;
    text-align: center;
    color: #212b54;
    line-height: 0.6;
}

h2.opentitle span {
    font-family: "Noto Sans JP", sans-serif;
    font-weight: normal;
    font-size: 15px;
    letter-spacing: 0.05em;
    line-height: 22px;
    text-align: center;
    color: #111;
}

@media screen and (max-width: 959px) {
    h2.opentitle {
        font-size: 40px;
        line-height: 0.6;
    }
    h2.opentitle span {
        font-size: 14px;
        line-height: 18px;
    }
}


/*secRead*/

.secRead {
    background: #FFEE48;
    padding: 60px 0;
    position: relative;
}

.secRead img.img_flag_L {
    width: 80px;
    position: absolute;
    top: 0;
    left: 0;
}

.secRead img.img_flag_R {
    width: 80px;
    position: absolute;
    top: 0;
    right: 0;
}

.secRead p.read {
    font-size: 16px;
    font-weight: bold;
    text-align: center;
}

.secRead p.read small {
    font-size: 12px;
    display: block;
    margin-top: 16px;
}

.secRead ul {
    width: 88%;
    margin-top: 40px;
    display: flex;
    flex-wrap: wrap;
    margin: 24px auto 0;
}

.secRead ul li {
    width: 33%;
    padding: 1% 1%;
}

.secRead ul li img {
    width: 100%;
}

@media screen and (max-width: 959px) {
    .secRead p.read {
        font-size: 13px;
        width: 92%;
        margin: 0 auto;
    }
    .secRead ul {
        width: 88%;
        margin-top: 40px;
        display: flex;
        flex-wrap: wrap;
        margin: 24px auto 0;
    }
    .secRead ul li {
        width: 33%;
        padding: 1% 1%;
    }
    .secRead ul li img {
        width: 100%;
    }
}


/*secOutline*/

.secOutline {
    background: #EAEEF9;
    padding: 80px 0;
}

.secOutline table {
    width: 88%;
    margin: 32px auto 0;
}

.secOutline th {
    background: #97A9DE;
    border: 1px #97A9DE solid;
    border-bottom: 1px solid #fff;
    width: 140px;
    padding: 20px 0;
    color: #fff;
}

.secOutline th.last {
    border-bottom: 1px solid #97A9DE;
}

.secOutline td {
    background: #fff;
    padding: 20px;
    border: 1px #97A9DE solid;
}

.calendarimg {
    width: 88%;
    margin: 24px auto 0;
}

@media screen and (max-width: 959px) {
    .secOutline th {
        width: 120px;
    }
}


/*secProgram*/

.secProgram {
    padding: 80px 0;
    background-image: url(../img/bg_img_program@2x.jpg);
    background-repeat: repeat;
    background-size: cover;
    background-position: center;
}

.secProgram ul {
    margin: 32px auto 0;
    display: flex;
    justify-content: space-between;
    flex-wrap: wrap;
    width: 88%;
}

.secProgram ul li {
    width: 48%;
    margin-bottom: 6%;
}

.secProgram ul li h3 {
    font-weight: bold;
    font-size: 22px;
    letter-spacing: 0.05em;
    line-height: 30px;
    text-align: center;
    color: #111;
    margin: 20px 0 8px;
}

.secProgram .classbox {
    display: flex;
    align-items: center;
    border: 1px solid #DDDDDD;
    width: 88%;
    margin: 16px auto 0;
    border-radius: 3px;
    background: #fff;
}

.secProgram .classh2title {
    margin-top: 64px;
}

.secProgram .classbox .classboxL {
    background: #64D68A;
    width: 180px;
    text-align: center;
    padding: 20px;
	display: table;
}

.secProgram .classbox .classboxL p {
    font-size: 18px;
    color: #fff;
	width: 100%;
	display: table-cell;
	vertical-align: middle;
	line-height: 1.65;
}

.secProgram .classbox .classboxL .tag {
    font-size: 16px;
    color: #fff;
    display: inline-block;
    padding: 2px 12px;
    background: #49BC6F;
    border: 3px;
    margin-top: 3px;
}

.secProgram .classbox .classboxR {
    position: relative;
    width: 100%;
}

.secProgram .classbox .classboxR a {
    padding: 20px;
    background: #fff;
    display: block;
}

.secProgram .classbox .classboxR a:hover {
    text-decoration: underline;
}

.secProgram .classbox .classboxR a::after {
    content: url(../img/img_arrow_r.svg);
    width: 24px;
    height: 24px;
    position: absolute;
    right: 12px;
    bottom: 12px;
    display: inline-block;
}

.secProgram .classbox .classboxR .classtitle {
    font-weight: normal;
    font-size: 18px;
    letter-spacing: 0.05em;
    line-height: 30px;
    text-align: left;
    color: #111;
}

.secProgram .classbox .classboxR .name {
    font-size: 14px;
}

@media screen and (max-width: 959px) {
    .secProgram ul li h3 {
        font-size: 18px;
        line-height: 24px;
        margin: 16px 0 8px;
    }
    .secProgram .classbox .classboxL {
        width: 120px;
    }
    .secProgram .classbox .classboxL p {
        font-size: 14px;
    }
    .secProgram .classbox .classboxL .tag {
        font-size: 14px;
    }
    .secProgram .classbox .classboxR .classtitle {
        font-size: 16px;
        line-height: 24px;
    }
    .secProgram .classbox .classboxR .name {
        font-size: 14px;
    }
}


/*secMovie*/

.secMovie {
    background-image: url(../img/bg_movie@2x.jpg);
    background-repeat: no-repeat;
    background-size: cover;
    background-position: center;
    padding: 80px 0;
}

.slideWidth {
    width: 88%;
    margin: 24px auto 0;
}

.slick-prev {
    left: -44px !important;
}

.slick-next {
    right: -44px !important;
}

.slider01 p.day {
    display: block;
}

.slick-slide {
    color: #111111 !important;
    font-size: 16px !important;
    text-align: left !important;
}

.slideday {
    color: #999999 !important;
    font-size: 13px !important;
    font-family: "Roboto", sans-serif;
}

.movietitle {
    line-height: 1.2;
}

@media screen and (max-width: 959px) {
    .slideWidth {
        width: 94%;
    }
    .slick-prev {
        left: -24px !important;
    }
    .slick-next {
        right: -24px !important;
    }
    .slick-slide {
        font-size: 14px !important;
    }
    .slideday {
        font-size: 12px !important;
    }
}


/*secFreetalk*/

.secFreetalk {
    padding: 80px 0;
    background-image: url(../img/bg_freetalk@2x.jpg);
    background-repeat: no-repeat;
    background-size: cover;
    background-position: center;
}

.secFreetalk ul {
    display: flex;
    flex-wrap: wrap;
    justify-content: space-between;
    width: 88%;
    margin: 24px auto 0;
}

.secFreetalk ul li {
    width: 48%;
    margin-bottom: 4%;
}

.secFreetalk ul li a {
    width: 100%;
    background: #FFEE49;
    display: block;
    padding: 24px;
    position: relative;
    border-radius: 3px;
}

.secFreetalk ul li a:hover {
    background: #FFCE49;
}

.secFreetalk ul li a::after {
    content: url(../img/img_blank.svg);
    width: 16px;
    position: absolute;
    right: 12px;
    bottom: 12px;
}


/*240610*/


h2.opentitle {
	font-family: 'Noto Sans JP', sans-serif;
	font-size: 42px;
	font-weight: bold;
	margin-bottom: 45px;
	
}

.secProgram .programList li {
	position: relative;
}

.secProgram .programList .num {
	font-family: "Roboto", sans-serif;
	position: absolute;
	top: -30px;
	right: 25px;
	font-size: 40px;
	color: #fff;
	text-shadow:1px 1px 0 #212b54,-1px 1px 0 #212b54,1px -1px 0 #212b54,-1px -1px 0 #212b54;
}
@media screen and (max-width: 959px) {
	.secProgram .programList .num {
		font-size: 30px;
		top: -26px;
		right: 15px;
	}
}

.demoPage .sec01 .wrap{
	overflow: hidden;
	zoom:1;
}

.demoPage .sec01 .wrap .txBox{
}
.demoPage .sec01 .wrap .imgBox{
	width: 35%;
	float: right;
	margin: 45px 0 20px 20px;
}
.demoPage .sec01 .day{
	background: #212b54;
	color: #fff;
	font-size: 12px;
	padding: 1px 8px;
	display: inline-block;
	font-weight: bold;
	margin-bottom: 20px;
}
@media screen and (max-width: 959px) {
.demoPage .sec01 .wrap .txBox{
	width:100%;
	float: none;
}
.demoPage .sec01 .wrap .imgBox{
	width:100%;
	float: none;
	margin: 0 0 20px 0;
}
}

.premium_ocPage .sceList{
	margin-top: 30px;
	text-align: center;
}
.premium_ocPage .sceList > li{
	border: 1px solid #ddd;
	border-radius: 3px;
	padding: 25px;
	text-align: left;
	position: relative;
}
.premium_ocPage .sceList > li::before{
	content: "";
	position: absolute;
	right: -10px;
	top: 50%;
	margin-top: -12px;
width: 0;
  height: 0;
  border-style: solid;
  border-top: 15px solid transparent;
  border-bottom: 15px solid transparent;
  border-left: 10px solid #ddd;
  border-right: 0;
}
.premium_ocPage .sceList > li.last::before{
	content: none;
}

.premium_ocPage .sceList > li .time{
	position: absolute;
	top: -12px;
	left: 50%;
    transform: translateX(-50%);
	background: #212b54;
	color: #fff;
	text-align: center;
	padding: 1px;
	border-radius: 90px;
	width: 100px;
	font-size: 12px;
}
@media screen and (max-width: 959px) {
	.premium_ocPage .sceList > li{
		padding: 20px 15px 15px;
		margin-bottom: 25px;
	}
	
}