﻿@charset "utf-8";
/* ---------------------------------------------------------------
 
    top contents
 
--------------------------------------------------------------- */

/* top slider
--------------------------------------------------------------- */
/*
#slider2 .sp-selected-thumbnail{
border:2px solid #000;
box-sizing:content-box;
position:relative;
top:-2px;
left:0;
}
*/

#slider .sp-thumbnails{
margin-top:-74px;
margin-left:auto!important;
margin-right:auto!important;
cursor: pointer;
}

.sp-thumbnails-container{
position:relative;
overflow:visible;
width:100%!important;
background-color:#C6000B;
filter:alpha(opacity=90);
-moz-opacity: 0.9;
opacity: 0.9;
height:70px;
}

.sp-thumbnails a:hover img{
opacity:0.7;
filter:alpha(opacity=70);
-ms-filter: “alpha( opacity=70 )”;
text-decoration:none;
}

/*
.sp-thumbnail{-moz-box-sizing:content-box;box-sizing:content-box;}
.sp-thumbnail-container{position:relative;display:block;overflow:hidden;float:left;-moz-box-sizing:content-box;box-sizing:content-box;}
*/


/* top contents
--------------------------------------------------------------- */
.wp_bg_gray{
background-color:#F1F1F1;
width:100%;
padding:50px 0 50px 0;
}

h2.topttl{
font-size:32px;
text-align:center;
}

#feature1 a,
#feature2 a,
#feature3 a{
-webkit-transition: 0.3s ease-in-out;  
-moz-transition: 0.3s ease-in-out;  
-o-transition: 0.3s ease-in-out;  
transition: 0.3s ease-in-out;
}

/* tutaetai */
#feature1 a{
background:url(../../img/feature1.jpg) left top no-repeat;
float:left;
display:block;
width:350px;
height:120px;
padding-top:200px;
margin-right:30px;
border-radius:5px;
}
#feature2 a{
background:url(../../img/feature2.jpg) left top no-repeat;
float:left;
display:block;
width:350px;
height:120px;
padding-top:200px;
margin-right:30px;
border-radius:5px;
}
#feature3 a{
background:url(../../img/feature3.jpg) left top no-repeat;
float:left;
display:block;
width:350px;
height:120px;
padding-top:200px;
border-radius:5px;
}

#feature1 a p.ttl , #feature2 a p.ttl , #feature3 a p.ttl{
display:block;
padding:10px 0;
background-color:#C6000B;
font-size:24px;
color:#ffffff;
text-align:center;
}

#feature1 a p.ttl span , #feature2 a p.ttl span , #feature3 a p.ttl span{
display:block;
margin-bottom:10px;
font-size:14px;
}


#feature1 a span.dtl , #feature2 a span.dtl , #feature3 a span.dtl{
display:block;
padding-top:10px;
font-size:16px;
color:#ffffff;
height:29px;
border-top:1px solid #D1333C;
text-align:center;
background:url(../img/arrow_btn.png) 70% 50% no-repeat;
background-color:#9D0000;
border-radius: 0 0 5px 5px;
}

#feature1 a:hover , #feature2 a:hover , #feature3 a:hover{
opacity:0.7;
filter:alpha(opacity=70);
-ms-filter: “alpha( opacity=70 )”;
text-decoration:none;
}

/* gakunenbetu sagasu */
#shogaku a{
background:url(../../img/gakunen1.jpg) left top no-repeat;
float:left;
display:block;
width:350px;
height:105px;
padding-top:200px;
margin-right:30px;
}
#shogaku a span.ttl{
display:block;
background:url(../../img/gakunen1_1.jpg) left top no-repeat;
font-size:14px;
line-height:130%;
color:#000000;
height:75px;
padding:30px 0 0 105px;
}
#chugaku a{
background:url(../../img/gakunen2.jpg) left top no-repeat;
float:left;
display:block;
width:350px;
height:105px;
padding-top:200px;
margin-right:30px;
}
#chugaku a span.ttl{
display:block;
background:url(../../img/gakunen2_1.jpg) left top no-repeat;
font-size:14px;
line-height:130%;
color:#000000;
height:75px;
padding:30px 0 0 105px;
}

#shogaku a:hover , #chugaku a:hover{
opacity:0.7;
filter:alpha(opacity=70);
-ms-filter: “alpha( opacity=70 )”;
text-decoration:none;
}

#gakunen li:first-child{
padding-top:0;
}
#gakunen li{
padding-top:32px;
height:80px;
}
#gakunen li a:hover img{
opacity:0.7;
filter:alpha(opacity=70);
-ms-filter: “alpha( opacity=70 )”;
text-decoration:none;
}



hr.ttl_line{
height:0;
margin:0;
padding:0;
border:0;
border-top: 1px solid #dcdcdc;
width:200px;
margin:0 auto;
}
hr.ttl_line_white{
height:0;
margin:0;
padding:0;
border:0;
border-top: 1px solid #ffffff;
width:200px;
margin:0 auto;
}


/* course */
#course a{
-webkit-transition: 0.3s ease-in-out;  
-moz-transition: 0.3s ease-in-out;  
-o-transition: 0.3s ease-in-out;  
transition: 0.3s ease-in-out;
}

#course a{
/*background:url(../../ci/img/course.jpg) left top no-repeat;*/
float:left;
display:block;
width:100%;
/*padding-top:200px;*/
margin-right:30px;
border-radius:5px;
}

#course a p.ttl{
display:block;
padding:10px 0;
background-color:#C6000B;
font-size:24px;
color:#ffffff;
text-align:center;
}

#course a p.ttl span{
display:block;
margin-bottom:10px;
font-size:14px;
}


#course a span.dtl{
display:block;
padding-top:10px;
font-size:16px;
color:#ffffff;
height:29px;
border-top:1px solid #D1333C;
text-align:center;
background:url(../img/arrow_btn.png) 70% 50% no-repeat;
background-color:#C6000B;
border-radius: 0 0 5px 5px;
}

#course a:hover{
opacity:0.7;
filter:alpha(opacity=70);
-ms-filter: “alpha( opacity=70 )”;
text-decoration:none;
}





/* kyousitu sagasu list_style*/
#wp_school{
background:url(../../img/bg_sagasu.jpg) center top no-repeat;
width:100%;
padding:50px 0 10px 0;
height:385px;
}

.school_list li a{
float:left;
background:url(../img/arrow_right_blue.gif) left 8px no-repeat;
padding-left:12px;
width:195px;
height:17px;
margin-bottom:25px;
position:relative;
color:#000000;
}

.school_list li span{
	background:#E91828;
	color:#ffffff;
	border-radius:5px;
	font-size:10px;
	margin:0 0 0 5px;
	padding:1px 3px;
	vertical-align:top;
}

.school_list li a.renew:after{
content:url("../../img/icon_renew.gif");
padding-left:5px;
position:absolute;
top:50%;
margin-top:-8px ;
}

.school_list li a:hover{
color:#C6000B;
text-decoration:none;
}

/* for IE7 */
.school_list li a.renew{
after:url("../../img/icon_renew.gif");
}







#txt_newicon{
background:url(../../img/icon_renew.gif) left center no-repeat;
padding-left: 76px;
color:#ffffff;
margin-top:20px;
}



/* news */
h2#topnews{
padding-bottom:25px;
font-size:24px;
border-bottom:1px solid #dcdcdc;
}





/* top gray button
--------------------------------------------------------------- */
.btn_gray_l a{
background-position:33% center; 
background-image:url(../img/arrow_gray.gif);
background-repeat:no-repeat;
width:100%;
padding:16px 0;
display: inline-block;
text-align: center;
outline: none;
background-color:#F2F2F2;
border:2px solid #DEDEDE;
border-radius: 4px;
color: #000000;
letter-spacing:0.15em;
position: relative;
text-decoration:none;
font-size:18px;
}
.btn_gray_l a:hover{
background-color:#F7F7F7;
}

.top-inc ul.sidebnr{
	margin-left:15px;
}

.top-inc ul.sidebnr li{
	float:left;
	margin-right:20px;
}

.top-inc ul.sidebnr li:nth-child(4n){
	margin-right:0;
}
.movie-slide{
text-align: center;
}


  #main-youtube-wrap {
 position: relative;
 width: 94%;
 height: 700px;
 margin: 0 auto 50px;
}
#main-youtube-wrap #iframe_youtube {
 position: absolute;
 top: 0;
 right: 0;
 bottom: 0;
 left: 0;
 margin: auto;
 width: 100%;
 height: 100%;
}

@media screen and (max-width: 1024px) {
#main-youtube-wrap {
 height: 500px;
}
}

@media screen and (max-width: 767px) {
#main-youtube-wrap {
 height: 300px;
}
}
#main-youtube-wrap .main-youtube-msg {
 position: absolute;
 top: 0;
 bottom: 0;
 left: 0;
 right: 0;
 margin: auto;
 max-width: 800px;
 display: -webkit-box;
 display: -ms-flexbox;
 display: flex;
 -webkit-box-align: center;
 -ms-flex-align: center;
 align-items: center;
 -webkit-box-pack: center;
 -ms-flex-pack: center;
 justify-content: center;
 z-index: 2;
}
#main-youtube-wrap .main-youtube-msg p {
 font-size: 55px;
 font-weight: 700;
 line-height: 1.3;
 color: #fff100;
 text-align: center;
 text-shadow: black 0 0 5px;
}

@media screen and (max-width: 1024px) {
#main-youtube-wrap .main-youtube-msg p {
 font-size: 45px;
}
}

@media screen and (max-width: 767px) {
#main-youtube-wrap .main-youtube-msg p {
 font-size: 30px;
}
}
.main-youtube-btn .btn a {
 width: 90%;
 padding: 30px 45px 30px 35px;
 font-size: 32px;
 border-radius: 50px;
}

@media screen and (max-width:1024px), print {
.main-youtube-btn .btn a {
 width: 100%;
 padding: 30px 45px 30px 35px;
 font-size: 26px;
 border-radius: 50px;
}
}

@media screen and (max-width:767px), print {
.main-youtube-btn .btn a {
 width: 100%;
 padding: 20px 45px 20px 35px;
 font-size: 20px;
 border-radius: 50px;
}
}


