body * {
  overflow: hidden;
  box-sizing: border-box;
}

.sp {
  display: none;
}

header, header * {
  overflow: visible;
}

#sp-side {
  box-sizing: content-box;
}

#sidebar-button div {
  width: 25px;
}

p {
  margin-top: 0;
}

.content {
  overflow: visible;
}

#pankuzu {
  font-size: 15px;
}

#page-title {
  text-align: center;
  background-color: #f6f6f6;
  padding: 20px;
  margin-top: 1em;
}

#page-title > div:first-child {
  font-weight: bold;
  font-size: 30px;
}

#page-title > div:last-child {
  color: #8d6601;
}

#blue-headline {
  color: #0c2f8d;
  text-align: center;
  font-size: 26px;
  margin-top: 30px;
  font-weight: bold;
}

.br-pc { display:block; }
.br-sp { display:none; }

.center-text {
  text-align: center;
  margin-top: 30px;
}

#ct-top {
  font-size: 19px;
}

#plan_bnr{
  width: 700px;
  margin: 0 auto;
}

.slider-frame {
  text-align: center;
  position: relative;
  width: 980px;
  margin: auto;
  margin-top: 30px;
}

.left, .right {
  position: absolute;
}

.left-s, .right-s {
  height: 33px;
  top: calc(50% - 16px);
}

.left-l, .right-l {
  top: calc(50% - 24px);
}

.left {
  left: 10px;
}

.right {
  right: 10px;
}

.slider-frame > div:last-child {
  text-align: left;
}

#gray-back-title {
  text-align: center;
  font-size: 30px;
  color: #0c2f8d;
  background-color: #f5f6fa;
  line-height: 2em;
  margin-top: 50px;
  font-weight: bold;
}

section > div:first-child {
  margin-bottom: 10px;
}

.main_img{
	width: 100%;
	margin: 20px 0 0 0;
}

.main_img img{
	width: 100%;
}

#recommend-area{
	background-color: #FFFFE6;
	padding: 0px 20px 20px 20px;
}

#recommend-area h3{
	color: #FF7F00;
	border: solid 1px #FF7F00;
	padding: 1%;
	text-align: center;
	background-color: #FFFFFF;
	font-size: 160%;
}

#recommend-area img{
  width: 100%;
}

.r_center{
width: 90%;
margin: 0 auto;
}

#recommend-area h4{
  color: #0c2f8d;
  font-size: 26px;
  margin: 10px 0 10px 0;
  font-weight: bold;
}

#recommend-area h4 span{
  font-size: 80%;
}

#cat-area01{
  width: 100%;
  overflow: hidden;
  clear: both;
  margin: 0 0 30px 0;
}

#cat-area01 h3{
  width: 100%;
  font-size: 180%;
  color: #0B318C;
  text-align: center;
  margin: 30px 0 30px 0;
}

.cat-left{
  width: 48%;
  float: left;
  margin: 0 4% 0 0;
}

.cat-left img{
  width: 100%;
}

.cat-left h4{
  color: #0c2f8d;
  font-size: 140%;
  font-weight: bold;
  margin: 10px 0 10px 0;
}

.cat-left h4 span{
  font-size: 80%;
}

.cat-right{
  width: 48%;
  float: right;
  margin: 0 0 0 0;
}

.cat-right img{
  width: 100%;
}

.cat-right h4{
  color: #0c2f8d;
  font-size: 140%;
  font-weight: bold;
  margin: 10px 0 10px 0;
}

.cat-right h4 span{
  font-size: 80%;
}

#cat-area02{
  width: 100%;
  overflow: hidden;
  clear: both;
  margin: 0 0 30px 0;
}

#cat-area02 h3{
  width: 100%;
  font-size: 180%;
  color: #0B318C;
  text-align: center;
  margin: 30px 0 30px 0;
}

#cat-area03{
  width: 100%;
  overflow: hidden;
  clear: both;
  margin: 0 0 30px 0;
}

#cat-area03 h3{
  width: 100%;
  font-size: 180%;
  color: #0B318C;
  text-align: center;
  margin: 30px 0 30px 0;
}

footer {
  padding-top: 30px;
  border-top: solid 1px #d9d9d9;
  overflow: visible;
}

section .bx-wrapper {
  width: 51%;
}

section .bx-wrapper, .bx-wrapper * {
  overflow: visible;
}

section .bx-wrapper img {
  width: 96.3%
}

.bx-wrapper .bx-controls-direction {
  display: block;
}

.bx-wrapper .bx-controls-direction a.disabled {
  display: block;
}

.bx-wrapper .bx-pager {
  display: none;
}

section .bx-wrapper .bx-next {
  right: -94%;
}

.bx-wrapper {
  margin-bottom: 0;
}

@media only screen and (max-width: 768px) {
  body {
    font-size: 15px;
  }

  .pc {
    display: none;
  }

  .sp {
    display: block;
  }

  header.content {
    padding-top: 10px;
  }

  #pankuzu {
    font-size: 14px;
  }

  #page-title > div:first-child {
    font-size: 29px;
  }

  #blue-headline, .center-text, .offer, .banquet-name, .banquet-text {
    width: 95%;
    margin-left: auto;
    margin-right: auto;
  }

  #blue-headline {
    font-size: 25px;
  }
	
.br-pc { display:none; }
.br-sp { display:block; }

  #ct-top {
    font-size: 18px;
  }

  #beige-title {
    font-size: 20px;
  }

  #beige-title > div {
    width: 240px;
    line-height: 30px;
  }

  .center-text.sp {
    text-align: left;
  }

  .slider-frame {
    width: 100%;
  }

  .left-s, .right-s, .left-l, .right-l {
    width: 25px;
    height: 25px;
    top: calc(50% - 12px);
  }

  #gray-back-title {
    font-size: 25px;
  }

  .content > .banquet:nth-last-of-type(n + 2) {
    margin-bottom: 0;
  }

  section > div:first-child {
    margin-bottom: 0;
  }
	
#recommend-area{
	margin: 0 0 30px 0;
}

	
#recommend-area h3{
	font-size: 140%;
}

#recommend-area img{
  width: 100%;
}

.r_center{
width: 100%;
margin: 0 auto;
}

#recommend-area h4{
  font-size: 120%;
}

#recommend-area h4 span{
  font-size: 80%;
}

#cat-area01{
  width: 100%;
  overflow: hidden;
  clear: both;
  margin: 0 0 30px 0;
}

#cat-area01 h3{
  width: 100%;
  font-size: 160%;
  color: #0B318C;
  text-align: center;
  margin: 0 0 5px 0;
}

.cat-left{
  width: 90%;
  float: none;
  margin: 0 auto 0 auto;
}

.cat-left img{
  width: 100%;
}

.cat-left h4{
  color: #0c2f8d;
  font-size: 130%;
  font-weight: bold;
  margin: 10px 0 10px 0;
}

.cat-left h4 span{
  font-size: 80%;
}

.cat-right{
  width: 90%;
  float: none;
  margin: 0 auto 0 auto;
}

.cat-right img{
  width: 100%;
}

.cat-right h4{
  color: #0c2f8d;
  font-size: 130%;
  font-weight: bold;
  margin: 10px 0 10px 0;
}

.cat-right h4 span{
  font-size: 80%;
}

#cat-area02{
  width: 100%;
  overflow: hidden;
  clear: both;
  margin: 0 0 30px 0;
}

#cat-area02 h3{
  width: 100%;
  font-size: 160%;
  color: #0B318C;
  text-align: center;
  margin: 0 0 5px 0;
}

#cat-area03{
  width: 100%;
  overflow: hidden;
  clear: both;
  margin: 0 0 30px 0;
}

#cat-area03 h3{
  width: 100%;
  font-size: 160%;
  color: #0B318C;
  text-align: center;
 margin: 0 0 5px 0;

}