
.warpper-banner{width:100%; margin: 20px auto;  padding: 8px 0;}
button.slick-next.slick-arrow, button.slick-prev.slick-arrow{ display: none !important;}

.link-banner{ width: 100%; text-align: center; overflow: hidden;}
.link-banner a{ display: block; width: 50%; padding: 6px; float: left; margin: 8px auto;}
.link-banner a img{ width: 100%; margin: 1% auto;}
.link-banner a:nth-child(odd){ padding-right: 8px;}
.link-banner a:nth-child(even){ padding-left: 8px;}

.link-banner-topic{ width: 100%; display: flex; flex-wrap:wrap; align-items: flex-end;}
/* .link-banner-topic div{ width: 48%; margin: 1%;} */
/* .link-banner-topic a img{ width: 100%; margin: 1% auto;} */

.link-banner-topic .title{ color: #06348b; font-size: 22px; font-weight: bold; text-align: center; text-shadow: 1px 1px 0 #fff, 2px 3px 1px #ccc; display: block; margin: 22px auto 12px;}
.link-banner-topic .click-banner{ width: 50%; position: relative;}
.link-banner-topic .click-banner .fb{ position: absolute;}
.link-banner-topic .click-banner .zaiko{ position: absolute; bottom: 15px;}
.link-banner-topic .click-banner .zaiko-s{ position: absolute; bottom: 15px;}
.link-banner-topic .banner-yellow{ position: relative;  padding: 12px; padding-left: 0;}
.link-banner-topic .banner-yellow figure{ position: relative;}
.link-banner-topic .banner-yellow a.detail{
	position: absolute; 
	bottom: 29px; 
	left: 4%; 
	background: #ff8100; 
	display: inline-block; 
	padding: 18px 30px; 
	font-size: 18px; 
	border-radius: 6px; 
	color: #fff;  
	width: 89%; 
	text-align:center;}
@media(max-width:580px){
	.link-banner-topic .banner-yellow a.detail{
	width: 87%;
	left: 22px;
}	
}
.link-banner-topic .banner-yellow a.fb{ bottom: 29px; right: 6%;}
.link-banner-topic .banner-yellow a.zaiko{ bottom: 75px;}
.link-banner-topic .banner-yellow a:hover{ opacity: 0.8;}
.link-banner-topic .banner-yellow img{ width: 100%;}

.click-banner .banner-blue{ position: relative;  padding: 12px; padding-left: 0;}
.click-banner .banner-blue figure{ position: relative;}
.click-banner .banner-blue a.detail{
	position: absolute; 
	bottom: 29px; 
	left: 4%; 
	background: #15a8f9; 
	display: inline-block; 
	padding: 18px 0; 
	font-size: 18px; 
	border-radius: 6px; 
	border-bottom: 3px solid #375194; 
	color: #fff;  
	width: 89%; 
	text-align:center;}
@media(max-width:580px){
	.click-banner .banner-blue a.detail{
	width: 87%;
	left: 22px;
}	
}
.click-banner .banner-blue a.fb{ bottom: 29px; right: 6%;}
.click-banner .banner-blue a.zaiko-s{ bottom: 75px;}
.click-banner .banner-blue a:hover{ opacity: 0.8;}
.click-banner .banner-blue img{ width: 100%;}

.link-banner-topic a.zaiko {
    display: block;
    width: 95%;
    padding: 20px 0;
    text-align: center;
    left: 14px;
}

@media(max-width:580px){
	.link-banner-topic a.zaiko {
    width: 93%;
    padding: 10px 0 1px 5px;
    left: 16px;
}
}

.link-banner-topic a.zaiko-s {
    display: block;
    width: 92%;
    padding: 20px 0;
    text-align: center;
    left: 14px;
}

@media(max-width:580px){
	.link-banner-topic a.zaiko-s {
    width: 90%;
    padding: 10px 0 1px 5px;
    left: 16px;
}
}

.link-banner-topic a.fb {
	position: absolute; 
    display: inline-block;
    width: 20%;
    background: #4b6dad;
    padding: 18px 0;
    border-radius: 6px;
    text-align: center;
    color: #FFF;
    font-size: 18px;
    border-bottom: 3px solid #284daf;
    margin-left: 4%;
}

@media(max-width:580px){
	.link-banner-topic a.fb{
	padding:18px 0;
}
}






/* NEW ここから */
.link-banner{ width: 100%; text-align: center; overflow: hidden;}
.link-banner a{ display: block; width: 50%; padding: 6px; float: right; margin: 8px auto;}
.link-banner a img{ width: 100%; margin: 1% auto;}
.link-banner a:nth-child(odd){ padding-right: 8px;}
.link-banner a:nth-child(even){ padding-left: 8px;}

.link-banner-topic{ width: 100%; display: flex; flex-wrap:wrap; align-items: flex-end;}
.link-banner-topic .title{ color: #06348b; font-size: 22px; font-weight: bold; text-align: center; text-shadow: 1px 1px 0 #fff, 2px 3px 1px #ccc; display: block; margin: 22px auto 12px;}
.link-banner-topic .click-banner{ width: 50%; position: relative;}
.link-banner-topic .click-banner .zaiko{ position: absolute; bottom: 15px;}
.link-banner-topic .click-banner .zaiko-s{ position: absolute; bottom: 15px;}
.link-banner-topic .flat7-yellow{ position: relative;  padding: 12px; padding-left: 0;}
.link-banner-topic .flat7-yellow figure{ position: relative;}
.link-banner-topic .flat7-yellow a.detail,.click-banner .flat7-blue a.detail{
	  position: absolute;
    bottom: 28px;
    right: 6%;
    float: right;
    display: inline-block;
    padding: 21px 32px;
    font-size: 18px;
    border-radius: 6px;
    color: #fff;
    width: 35%;
    text-align: center;
    line-height: 1;
  }
.link-banner-topic .flat7-yellow a.detail {
  background: #ff8100;
  border-bottom: 3px solid #bd0003;
}
.click-banner .flat7-blue a.detail {
  background: #15a8f9;
  border-bottom: 3px solid #375194;  
}
.link-banner-topic .flat7-yellow a i,.click-banner .flat7-blue a i{ margin-left:5px;}
.link-banner-topic .flat7-yellow a.zaiko{ bottom: 75px;}
/*.link-banner-topic .flat7-yellow a:hover{ opacity: 0.8;}*/
.link-banner-topic .flat7-yellow img{ width: 100%;}
.click-banner .flat7-blue{ position: relative;  padding: 12px; padding-left: 0;}
.click-banner .flat7-blue figure{ position: relative;}
.click-banner .flat7-blue a.zaiko-s{ bottom: 75px;}
/*.click-banner .flat7-blue a:hover{ opacity: 0.8;}*/
.click-banner .flat7-blue img{ width: 100%;}

.link-banner-topic a.zaiko {
    display: block;
    width: 95%;
    padding: 20px 0;
    text-align: center;
    left: 14px;
}
.link-banner-topic a.zaiko-s {
    display: block;
    width: 92%;
    padding: 20px 0;
    text-align: center;
    left: 14px;
}

@media(max-width:580px){
  .link-banner-topic .flat7-yellow a.detail{
    width: 40%;
    right: 22px;
  }
  .click-banner .flat7-blue a.detail{
    width: 40%;
    right: 22px;
  }	
  .link-banner-topic a.zaiko {
    width: 93%;
    padding: 10px 0 1px 5px;
    right: 16px;
  }
	.link-banner-topic a.zaiko-s {
    width: 90%;
    padding: 10px 0 1px 5px;
    right: 16px;
  }
}
/* NEW ここまで */










.new-topic{ width: 69%; display: inline-block;}
.new-topic .title-topic{ padding: 4px 0; color: #303030; font-weight: bold; font-size: 20px;}
.new-topic .title-topic a.more{ color: #fff; background: #52a8fc; padding: 4px 8px; border-radius: 8px; float: right; font-size: 12px; font-weight: lighter;}
.new-topic .title-topic .line-topic{ background: url(../images/line-topic.png) repeat-x left; height: 12px; width: 100%; display: block; margin-top: 8px;}
.new-topic .thumb-topic{ display: table; width: 100%; margin:8px auto; border-bottom: 1px solid #a3deea; vertical-align: top;}
.new-topic .thumb-topic .images-topic, .new-topic .thumb-topic .content-topic{ display: table-cell; vertical-align: top; padding: 4px;}
.new-topic .thumb-topic .images-topic{ width: 35%;}
.new-topic .thumb-topic .content-topic{ width: 65%;}
.new-topic .thumb-topic .images-topic img{ width: 100%;}
.new-topic .thumb-topic .content-topic p{ font-size: 14px;}
.new-topic .thumb-topic .content-topic .highlight-yellow{ background: #fae23c; font-size: 10px; padding: 2px 4px; width: auto; margin: 8px 0; display:inline-block;}
.new-topic .thumb-topic .content-topic .highlight-blue{ background: #aadffe; font-size: 10px; padding: 2px 4px; width: auto; margin: 8px 0; display:inline-block;}
.new-topic .thumb-topic .content-topic .highlight-green{ background: #b5fadc; font-size: 10px; padding: 2px 4px; width: auto; margin: 8px 0; display:inline-block;}
.new-topic .thumb-topic .content-topic .head{ height: 18px; overflow: hidden; font-size: 16px;}
.new-topic .thumb-topic .content-topic .detail{ height: 65px; overflow: hidden; font-size: 12px; margin-top: 8px;}




.calendar{ width: 30%; display: inline-block; vertical-align: top; padding-left: 12px; }
.calendar .cal_wrapper table{ width: 100%; }
.calendar p{ padding: 2px 0 8px;}
.calendar span{width: 13px; height: 13px;display: inline-block; border-radius: 3px;  }
.calendar .pink{  background: #ff5c5d;}
.calendar .blue{  background: #52a8fb; }
.calendar .green{ background: #548235; }
.calendar .yellow{  background: #FFD966; }
.calendar .purple{background: #967adc;}

.remark { font-size: 12px }
.remark p{ display: inline-block; width: 32%;margin: 0 !important; padding: 0;}
.remark p:last-child{ width: 50%;}
.calendar .cal_ui input.prev{ float: left;}
.calendar .cal_ui input.next{ float: right;}


div.cal_wrapper table.cal tr th{
  border-top-left-radius: 8px;
  border-top-right-radius: 8px;
}

div.cal_wrapper table.cal tr:last-child td:first-child {
  border-bottom-left-radius: 8px;
}


div.cal_wrapper table.cal tr:last-child td:last-child {
  border-bottom-right-radius: 8px;
}
.stock-banner{ margin: 22px auto;}
.stock-banner img{ width: 100%; border: 2px solid #fff;}
.stock-banner a:hover img{ border: 2px solid #28adf8;}

.hayatarou_movie{
  margin-top: 20px;
  background: #ff7718;
  border-radius: 5px 5px;
  padding: 0 4px 1px;
  /* max-width: 345px; */
  width: 100%;
  margin: 20px auto 0;
}
.hayatarou_movie p{
  padding: 7px 0px 4px;
  text-align: center;
}

@media (max-width:768px) {
  .new-topic{ width: 100%; display: block;}
  .new-topic .thumb-topic .content-topic .detail{ height: auto;}

  .calendar{ width: 100%; display: block; padding-left: 0;}

  .link-banner-topic .click-banner{ width: 100%; display: block;}

  .link-banner-topic .banner-yellow,
  .link-banner-topic .banner-blue{ padding: 12px !important;}

 .link-banner-topic .flat7-yellow { padding: 12px !important;}
 .link-banner-topic .flat7-blue { padding: 12px !important;}
 
 .link-banner-topic .flat7-yellow a.detail,.click-banner .flat7-blue a.detail{
    padding: 38px 32px;
  }


}

@media (max-width:580px)
{
  .new-topic .thumb-topic .images-topic{ display: block; width: 70%; margin: auto;}
  .new-topic .thumb-topic .content-topic{ display: block; width: 100%;}



 .link-banner-topic .flat7-yellow a.detail,.click-banner .flat7-blue a.detail{
    padding: 20px 0px;
    width: 38%;
  }



}

@media (max-width:420px){
  .link-banner a{ display: block; width: 70%; float: none; margin: 8px auto; padding: 0 !important;}
  .link-banner a img{ margin: 1% auto !important; padding: 0; width:100%;}

  .link-banner-topic div{ width: 100%; display: block;}
  .link-banner-topic .banner-yellow a.detail,.link-banner-topic .banner-blue a.detail{ padding:15px 5px ;font-size: 14px; border-radius: 5px;}


 .link-banner-topic .flat7-yellow a.detail,.click-banner .flat7-blue a.detail{
    padding: 15px 0px;
    bottom: 18px;
  }


}
@media (max-width:320px){

 .link-banner-topic .flat7-yellow a.detail,.click-banner .flat7-blue a.detail{
 	font-size: 14px;
 	width: 36%;
 }
}
/*----- flat_bt -----*/
.flat_bt {
  max-width: 100%;
  width: 100%;
  background-color: #fae23c;
  box-sizing: border-box;
  padding: 0 0 0 14px;
  text-align: left;
  border-radius: 7px;
  display: flex;
  height: 130px;
}
.flat_bt ul  {
  margin: 16px 0 0 33px;;
}
.flat_bt ul li {
  width: 205px;
  height: 95px;
  float: left;
  margin: 0 14px 0 0;
}
.flat_bt ul li a {
  display: block;
  width: 100%;
  height: 100%;
  box-sizing: border-box;
  margin: 0;
  text-align: left;
  font-weight: bold;
}
.flat_bt ul li a .fa {
  padding: 0 0 0 5px ;
  font-size: 22px;;
}
.flat_bt ul li:first-child a {
  background:#ff8100;
  padding: 18px 30px;
  font-size: 18px;
  border-radius: 6px;
  border-bottom: 3px solid #bd0003;
  color:#fff;
  box-sizing: border-box;;
  padding: 0 0 0 41px;
  line-height: 97px;;
}
.flat_bt ul li:last-child a {
  background:#15a8f9;
  padding: 18px 0;
  font-size: 18px;
  border-radius: 6px;
  border-bottom: 3px solid#375194;
  color:#fff;
  padding: 0 0 0 41px;;
  position: relative;
  line-height: 97px;
}
.flat_bt ul li:last-child a .fa {
  position: absolute;
  top: 37px;
  right: 35px;
  font-size: 22px;;
}

.img-banner .link-banner a {
  float: none;
}

@media(max-width:580px){
  .flat {
    padding: 12px;;
  }
  .flat_bt {
    display: block;
    height: auto;
    padding: 0 13px 10px;
  }
  .flat_bt img {
    width: 100%;
  }
  .flat_bt ul  {
    margin: 10px auto 0px;;
    width: 80%;
  }
  .flat_bt ul li {
    width: 100%;
    text-align: center;
    margin: 0 auto;
    height: 60px;
    margin: 0 auto 10px;
    display: block;
  }
  .flat_bt ul li a {
    display: block;
    width: 100%;
    height: 100%;
    box-sizing: border-box;
    margin: 0;
    text-align: left;
    font-weight: bold;
  }
  .flat_bt ul li a .fa {
    padding: 0 0 0 5px ;
    font-size: 20px;;
  }
  .flat_bt ul li:first-child a {
    padding: 0  !important;
    line-height: 60px;;
    text-align: center;
  }
  .flat_bt ul li:last-child a {
    padding: 0px;;
    position: relative;
    line-height: 60px;;
    text-align: center;;
  }
  .flat_bt ul li:last-child a .fa {
    position: relative;
    top: auto;
    right: auto;
    font-size: 20px;;
  }
  .pc {
    display: none;
  }
  .img-banner .link-banner a {
    float: none;
  }
 }
 @media(max-width:321px){  
   .flat_bt ul  {
    width: 100%;
  }
  .img-banner .link-banner a {
    float: none;width: 100%;
  }
}

/*----- hayataro banner -----*/
.pc { display: block !important; }
.sp { display: none !important; }
.hayatarou-banner {
  padding: 20px 0 0 0;
  position: relative; 
}

.hayatarou-back {
 width: 100%;
}

.hayatarou-btn {
  position: absolute;
  top: 42px;
  right: 20px;
}
@media(max-width:768px){
  .pc { display: none !important; }
  .sp { display: block !important; }
  .hayatarou-btn{
    top: 36px;
    right: -3%;

  }  
  .hayatarou-btn img {
    width:80%;
  }
}


/*----- under banner -----*/
.under-banner { 
  overflow: hidden;}
.under-banner li {
  width: 50%;   
}
.under-banner li a {
  width: 100%;
}
.under-banner li:nth-child(2n-1){ 
  padding-right: 8px;
  float: left;
}
.under-banner li:nth-child(2n){ 
  padding-left: 8px;
  float: right;
}

@media (max-width:768px) {
  .under-banner li {
    width: 100%;   
  }
  .under-banner li:nth-child(2n-1){ 
    padding: 0 10px;
  }
  .under-banner li:nth-child(2n){ 
    padding: 0 10px;
  }
}


/* add */
.d-new {
    background: #15a8f9;
    display: inline-block;
    padding: 18px 0;
    font-size: 18px;
    border-radius: 6px;
    border-bottom: 3px solid #375194;
    color: #fff;
    width: 60%;
    text-align: center;
    margin-left:20%;
}