@charset "UTF-8";

ul,.breadcrumb {
	margin-bottom:0;
}

/* =============================================================================

	トップ

============================================================================= */
#main-visual-info{
	background: url(../images/bg.jpg) no-repeat;
	background-size: cover;
}
.main-visual{
	text-align: center;
	position: relative;
	padding-top:60px;
}

.main-visual img{
	max-width: 889px;
	margin:0 auto;
}

.main-visual-button{
	padding: 60px 0;
}
.main-visual-button img{
	 -webkit-transition: all .3s;
	transition: all .3s;
}

.main-visual-button img:hover{
	opacity: 1;
	filter: alpha(opacity=100);
	-ms-filter: "alpha(opacity=100)";
	-webkit-transform: translate(0px,5px);
	-moz-transform: translate(0px,5px);
	-ms-transform: translate(0px,5px);
	-o-transform: translate(0px,5px);
	transform: translate(0px,5px);
}


/* タブレット以下 */
@media screen and (max-width: 1070px) {

}/* for tablet max-width: 1070px */

/* SP向けレイアウトの指定：～800px */
@media only screen and (max-width: 800px) {
	#main-visual-info .col-xxs-4{
		padding-left: 5px;
		padding-right: 5px;
	}
	.main-visual-button{
		padding: 30px 0;
	}
}/* for SP max-width: 800px */

/*-----------------------------------
channel
------------------------------------*/
#drawchannel{
	padding: 80px 0;
	background-image: url(../images/bg-draw.jpg);
	background-repeat: no-repeat;
	background-size: cover;
}
#lecturechannel{
	padding: 80px 0;
	background-image: url(../images/bg-lecture.jpg);
	background-repeat: no-repeat;
	background-size: cover;
}
#schoolchannel{
	padding: 80px 0;
	background-image: url(../images/bg-school.jpg);
	background-repeat: no-repeat;
	background-size: cover;
}
.col-xs-12 {
	padding: 0 25px;
}
.channel-movie{
	float: right;
	width: 75%;
}
.channel-icon{
	float: left;
	width: 22%;
	border:4px solid #000;
	 border-radius: 10px;        /* CSS3草案 */  
    -webkit-border-radius: 10px;    /* Safari,Google Chrome用 */  
    -moz-border-radius: 10px;   /* Firefox用 */
    padding: 20px;
    background-color: white;
}
.channel-icon-thum{
	max-width: 70%;
	margin:0 auto;
}
.channel-icon-title{
	max-width: 70%;
	margin:0 auto;
}
.channel-icon-desc{
	padding:12px 0;
}
.channel-icon-desc p{margin-bottom: 0;}
.channel-icon-button{
	max-width: 65%;
	margin:0 auto;
}

.swiper-text{
	clear: both;
	background-color: white;
}
.swiper-slide p{
	text-align: left;
	padding: 5px;
	margin-bottom: 0;
}

/* タブレット以下 */
@media screen and (max-width: 1070px) {
.swiper-button-next, .swiper-container-rtl .swiper-button-prev, .swiper-button-next2, .swiper-container-rtl .swiper-button-prev2, .swiper-button-next3, .swiper-container-rtl .swiper-button-prev3 {
	 right: 0%!important;
}
.swiper-button-prev, .swiper-container-rtl .swiper-button-next, .swiper-button-prev2, .swiper-container-rtl .swiper-button-next2, .swiper-button-prev3, .swiper-container-rtl .swiper-button-next3 {
	left: 0%!important;
}
.swiper-button-prev, .swiper-button-next, .swiper-button-prev2, .swiper-button-next2, .swiper-button-prev3, .swiper-button-next3 {
	width: 20px;
	height: 33px;
	background-size: 20px 33px;
}
}/* for tablet max-width: 1070px */

/* SP向けレイアウトの指定：～800px */
@media only screen and (max-width: 800px) {
#drawchannel{
	padding: 30px 0;
	background-image: url(../images/bg-draw.jpg);
	background-repeat: no-repeat;
	background-size: cover;
}
.channel-icon{
	float: none;
	width: 100%;
	border:3px solid #000;
	margin-bottom: 24px;
}
.channel-icon-thum{
	max-width: 30%;
	margin:0 auto;
}
.channel-icon-title{
	max-width: 40%;
	margin:0 auto;
}
.channel-icon-button{
	max-width: 35%;
	margin:0 auto;
}
.channel-movie{
	float: none;
	width: 100%;
	position: relative;
	padding: 0 5px;
}
.swiper-button-next, .swiper-container-rtl .swiper-button-prev, .swiper-button-next2, .swiper-container-rtl .swiper-button-prev2, .swiper-button-next3, .swiper-container-rtl .swiper-button-prev3 {
	 right: -5%!important;
}
.swiper-button-prev, .swiper-container-rtl .swiper-button-next, .swiper-button-prev2, .swiper-container-rtl .swiper-button-next2, .swiper-button-prev3, .swiper-container-rtl .swiper-button-next3 {
	left: -5%!important;
}
}/* for SP max-width: 800px */


/*-----------------------------------
clearfix
------------------------------------*/
.clearfix:after{
  content: "."; 
  display: block; 
  height: 0; 
  font-size:0;	
  clear: both; 
  visibility:hidden;
}

.clearfix{display: inline-block;} 
.img-responsive {
	width: 100%;
}
/* Hides from IE Mac \*/
* html .clearfix {height: 1%;}
.clearfix{display:block;}
/* End Hack */ 
@media screen and (min-width: 768px) and (max-width: 992px){
	.page-fix-375 .col-xs-2.col-xxs-6.masonry-grid-item{
		height: 280px;
	}
}
@media screen and (min-width: 992px){
	.page-fix-375 .col-xs-2.col-xxs-6.masonry-grid-item{
		height: 375px;
	}
}