body{ background: #fff; }

#top-line{
  background: #f8dd52;
  height: auto;
}
#top-line h1{ color: #333; }
#top-line .button.bordered{
  background: #62d5ea;
  color: #fff;
  padding: 0 10px;
  line-height: 29px;
}
.shop-info {
  background: #fcf4dc;
  margin-bottom: 0;
}

.title-ber2 {
  border-bottom: none;
  background-image: -webkit-gradient(
    linear,
    left top,
    left bottom,
    color-stop(0, #FFC885),
    color-stop(0.77, #F09724)
  );
  background-image: -o-linear-gradient(bottom, #FFC885 0%, #F09724 77%);
  background-image: -moz-linear-gradient(bottom, #FFC885 0%, #F09724 77%);
  background-image: -webkit-linear-gradient(bottom, #FFC885 0%, #F09724 77%);
  background-image: -ms-linear-gradient(bottom, #FFC885 0%, #F09724 77%);
  background-image: linear-gradient(to bottom, #FFC885 0%, #F09724 77%);
}
h2.t-ber {width:100%; line-height:32px; color:#FFF; font-size:80%; text-align:center; text-shadow:1px 1px 1px #c4363e; margin:0px; padding:0px; filter:dropshadow(color=red, offx=1, offy=1);}
/**/
.flex_paginator{
  display:-webkit-box;
  display:-ms-flexbox;
  display:flex;
  -webkit-box-pack:justify;
  -ms-flex-pack:justify;
  justify-content:space-between;
}

.more{
  display: block;
  text-align: right;
  padding: 0 10px;
  font-weight: bold;
  line-height: 23px;
  font-size: 12px;
  position: relative;
  padding-right: 35px;
  margin-bottom: 10px;
  color: #ff8c00;
}
.more:after{
  content: "";
  display: block;
  background-color: #ff8c00;
  background-image: url(../images/layout/arrowR.png);
  background-repeat: no-repeat;
  background-position: 58% 50%;
  border-radius: 100%;
  -webkit-border-radius: 100%;
  height: 20px;
  width: 20px;
  position: absolute;
  right: 10px;
  top: 0;
}

.prev{
  display: block;
  text-align: right;
  padding: 0 10px;
  font-weight: bold;
  line-height: 23px;
  font-size: 12px;
  position: relative;
  padding-left: 35px;
  margin-bottom: 10px;
  color: #ff8c00;
}
.prev:before{
  content: "";
  display: block;
  background-color: #ff8c00;
  background-image: url(../images/layout/arrowL.png);
  background-repeat: no-repeat;
  background-position: 42% 50%;
  border-radius: 100%;
  -webkit-border-radius: 100%;
  height: 20px;
  width: 20px;
  position: absolute;
  left: 10px;
  top: 0;
}

#contents{
  border-bottom: none !important;
}

/* IndexPage */
.top-image-box{ padding: 10px; }
.top-image-box img{ display: block; }

.index_navigation{
  background-color: #ffeff1;
  padding-bottom: 15px;
}

.index_navigation ul{
  width: 320px;
  margin: 15px auto 0 auto;
  border-top: solid 2px #fff;
  border-left: solid 2px #fff;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -ms-flex-wrap: wrap;
      flex-wrap: wrap;
}
.index_navigation ul li{
  flex-basis: 160px;
  border-bottom: solid 2px #fff;
  border-right: solid 2px #fff;
  box-sizing: border-box;
}
.index_navigation ul li a{
  display: block;
  padding: 0 10px;
  height: 40px;
  line-height: 38px;
  background-color: #fcec9c;
  color: #fc6c74;
}

.layout_realtime{
  display: block;
  padding: 10px;
  height: 370px;
  overflow: hidden;
  position: relative;
}
.layout_realtime:after{
  content: "";
  width: 100%;
  height: 50px;
  background: linear-gradient(rgba(255, 255, 255, 0) 0, rgba(255, 255, 255, .7) 20%, rgba(255, 255, 255, 1) 80%);
  position: absolute;
  left: 0;
  bottom: 0;
}
.layout_realtime .item + .item{
  margin-top: 15px;
}
.layout_realtime .item font{
  font-size: 12px !important;
}
.layout_realtime time{
  display: block;
  font-size: 14px;
  font-weight: bold;
  padding-bottom: 3px;
  border-bottom: solid 1px #fff;
}

.footer_links{
  background-color: #fff;
  padding: 15px 0;
  text-align: center;
}
.footer_links a{
  display: inline-block;
}
.footer_links a.footer_links-safety{
  margin-top: 10px;
}

/**/
.index_events{
  padding-top: 5px;
  padding-bottom: 35px;
}

/**/
.news-title {
  margin:5px 0px;
  padding:6px 0px;
  background: #f3617e;
  border: none;
}
h3.news-t {
  background: #f3617e;
  color:#fff;
  text-align:center;
  margin:0px;
  padding:0px;
}
.news-inner{
  color: #fc6c74;
  margin-bottom: 0;
}

/**/
.page_beginner{
  
}
.page_beginner .introduction{
  padding: 10px;
  color: #333;
  font-size: 12px;
}
.page_beginner .faq{
  padding: 10px;
  font-size: 12px;
}
.page_beginner .faq dt{
  background-color: #f0af22;
  color: #fff;
  padding: 5px;
}
.page_beginner .faq dd{
  padding: 8px;
}
.page_beginner .caution_list li{
  color: #F3617E;
  padding: 5px;
  font-size: 12px;
}
.page_beginner .caution_list li + li{
  border-top: solid 1px #fba0b8;
}
.page_beginner .no_next{
  color: #fff;
  background-color: #F3617E;
  padding: 10px;
  border-radius: 5px;
  -webkit-border-radius: 5px;
  margin: 0 5px 0 5px;
}

/**/
  
.system_wrap > div{
  text-align: center;
}
.system_wrap > div > img {
  width: 100%;
  max-width: 400px;
}
.costume_list{
  background-color: #fff;
}
.costume_list ul{
  width: 100%;
  max-width: 300px;
  margin: 0 auto;
  display: flex;
  flex-basis: 100px;
  flex-wrap: wrap;
}
.costume_list ul li img{
  width: 100%;
}
.option_list{
  text-align: center;
  display: block;
}
.option_list img{
  width: 100%;
  max-width: 400px;
}

/**/

#s-day {width:90px; font-size:80%; font-weight:bold; color:#FFF; text-align:center; text-shadow: 1px 1px 1px #222; filter: dropshadow(color=#222, offx=1, offy=1); margin:0px auto; padding:5px 0px; border:1px solid #FF6B97;

background-image: -webkit-gradient(
  linear,
  left top,
  left bottom,
  color-stop(0.51, #FF6B97),
  color-stop(1, #FFD4E1),
  color-stop(1, #FFA6BE)
);
background-image: -o-linear-gradient(bottom, #FF6B97 51%, #FFD4E1 100%, #FFA6BE 100%);
background-image: -moz-linear-gradient(bottom, #FF6B97 51%, #FFD4E1 100%, #FFA6BE 100%);
background-image: -webkit-linear-gradient(bottom, #FF6B97 51%, #FFD4E1 100%, #FFA6BE 100%);
background-image: -ms-linear-gradient(bottom, #FF6B97 51%, #FFD4E1 100%, #FFA6BE 100%);
background-image: linear-gradient(to bottom, #FF6B97 51%, #FFD4E1 100%, #FFA6BE 100%);

}

/**/

.event_list{
  text-align: center;
}
.event_list img{
  width: 100%;
  max-width: 400px;
}

/**/

.rank_title{
  text-align: center;
  font-size: 14px;
  margin-top: 10px;
  color: #f56079;
}
span.rank-no {color:#f56079;}

/**/

.page_mail{
  background-color: #fff;
}
.page_mail p{
  padding: 8px;
  font-size: 12px;
}
.page_mail hr{
  margin: 0;
  padding: 0;
}
.page_mail h3{
  margin: 5px;
}
.page_mail .form-line input{
  background-color: #f56079;
  padding: 3px 8px;
  color: #fff;
}
.page_mail .form-line input::placeholder {
  color: #f5ece6;
}
.page_mail .form-line input:-ms-input-placeholder {
  color: #f5ece6;
}
.page_mail .form-line input::-ms-input-placeholder {
  color: #f5ece6;
}
.page_mail input[type=submit]{
  background-color: #fbcd4d;
  border: #f0af22;
  color: #000;
}

/**/

#main-img{
  background: #ffffff;
}
p.name { text-shadow: 1px 1px 1px #999999; filter: dropshadow(color=#999999, offx=1, offy=1);}
.list01 {background:#fc6c74;}
.list02 {background:#f9bcd1;color:#FFF;}
.list03 {background:#fff;color:#666;font-weight: normal;}
.list04 {background:#f9bcd1;color:#FFF;}
.list05 {background:#fff;color:#666; border: none}
.list05 + .list05{ border-top: dashed 1px #ccc; }
span.day {float:left; padding-left:10px;}
span.time {float:right; color:#f56079; padding-right:15px;}

/**/

.index_schedules h3{
  display: block;
  overflow: hidden;
  margin-top: 10px;
  margin-right: 5px;
}
.schedule_select_dates{
  text-align: center;
  margin-top: 10px;
}
.schedule_select_dates li{
  display: inline-block;
  width: 25%;
}
.schedule_select_dates li a{
  display: block;
  text-align: center;
  background: #60d0f4;
  border-radius: 20px;
  color: #fff;
  font-weight: bold;
  font-size: 12px;
  padding: 5px 0;
}
.schedule_items{
  display: flex;
  flex-wrap: wrap;
  justify-content: center;
  margin: 0 auto;
  padding: 4px 0 0 0;
  width: 320px;
}
.schedule_items .item{
  box-sizing: border-box;
  -webkit-box-sizing: border-box;
  border-radius: 7px;
  -webkit-border-radius: 7px;
  width: 100px;
  font-size: 12px;
  padding: 5px;
  margin: 1px;
  flex: none;
  background-repeat: no-repeat;
  background-size: cover;
  position: relative;
}
.schedule_items .item .newface_icon{
  position:absolute;
  right: 17px;
  top: 95px;
}
.schedule_items .item .entry_days{
  position:absolute;
  left: 20px;
  top: 97px;
  width: 40px;
}
.schedule_items .item span{
  display: block;
  text-align: center;
}
.schedule_items .item .name{
  font-weight: bold;
}

.schedule_items.hayaban .item{
  border: solid 1px #eabad2;
  background-image: url(/html/includes/schedulebox/bg_haya.png);
}
.schedule_items.hayaban .item span{
  color: #ff69b4;
}
.schedule_items.hayaban .item .name{
  color: #db7093;
}

.schedule_items.osoban .item{
  border: solid 1px #a9c6e5;
  background-image: url(/html/includes/schedulebox/bg_oso.png);
}
.schedule_items.osoban .item span{
  color: #6495ed;
}
.schedule_items.osoban .item .name{
  color: #1e90ff;
}

/* system page */
.wagamama_setting{
  padding: 10px 10px 2px 10px;
  font-size: 14px;
}
.wagamama_setting h3{
  color: #9acd32;
}
.wagamama_setting p{
  margin-bottom: 5px;
  color: #ff69b4;
}
.wagamama_setting p.intro{
  color: #ff8c00;
}

.course_introduction{
  padding: 10px 10px 6px 10px;
  text-align: center;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -ms-flex-wrap: wrap;
      flex-wrap: wrap;
}
.course_introduction a{
  flex-basis: 31%;
  margin: 0 1%;
  box-sizing: border-box;
  -webkit-box-sizing: border-box;
}
.course_introduction a img{
  width: 100%;
}
.check_sheet{
  margin-top: 15px;
}
.check_sheet a{
  display: block;
  max-width: 320px;
  margin: 0 auto;
}
.check_sheet a img{
  width: 100%;
}
.image_container {
  height: 195px;
  width: 300px;
  position: relative;
  margin: 15px auto;
}

.image_container img {
  display:none;
  position:absolute;
  top:0; left:0;
  width: 300px;
}

#nextPageBtn{
  display: block;
  text-align: center;
  background: #ff69b4;
  color: #fff;
  width: 150px;
  border-radius: 40px;
  font-size: 14px;
  padding: 10px;
  margin: 0 auto;
}