.cf:before,
.cf:after {
  content: "";
  display: block;
  overflow: hidden; }

.cf:after {
  clear: both; }

.cf {
  zoom: 1; }


.page_cover {
        display: block;
	width: 100%;
        margin-top: 60px;
	padding: 45px 0 1px;
	z-index: 1000;
	text-align: center;
}


.mb40 {
        margin-bottom: 40px!important;
}
.dsp {
    display: none; }

.dpc {
    display: block; }


@media screen and (max-width: 768px) {
.page_cover {
        margin-top: 50px;
	padding: 25px 0 1px;
	z-index: 1000;
}

.dpc {
        display: none
    }

    .dsp {
        display: block
    }

}



.mvFrame {
	position: relative;
	width: 100%;
        background: url(img/menu.jpg) right center;
        background-size:cover;
}

.mvFrame .inner {
      position: relative;
      width: 100%;
      max-width: 1100px;
      height: auto;
      padding: 40px 20px;
      text-align: center;
      display: flex;
  /*justify-content: center;
  align-items: center;*/
}

.mvFrame .inner .mvText {
      width: 50%;
      float: left;    
}


.mvFrame .inner .mvText p.icon {
         width: 70px;
         margin: 20px auto 5px;
}

.mvFrame .inner .mvText p.icon img {
         width: 100%;
         height: auto;
}


.mvFrame .inner .mvText h2.pink {
      color: #b98a7a;
      font-weight: bold;
      letter-spacing: 0.1rem
}

.mvFrame .inner .mvText h2.pink span {
    display: block;
    color: #b98a7a;
    font-weight: bold;
    font-size: 60%;
    letter-spacing: 0;
}

.mvFrame .inner .mvText p.text {
      margin: 5px auto;
      text-align: left;
      padding: 0 20px;
}

@media screen and (max-width: 768px) {
.mvFrame {
        background: url(img/menu.jpg) 65% 50%;
        background-size:cover;
}


.mvFrame .inner .mvText {
      width: 80%;
      margin: 0 auto;
      float: left;    
}


.mvFrame .inner .mvText p.icon {
         width: 50px;
}



.mvFrame .inner .mvText p.text {
      padding: 0;
}
}




#menu {
     position: relative;
	width: 100%;
}

#menu ul {
	width: 90%;
        max-width: 1100px;
        margin: 80px auto;
}


#menu ul li {
        background: #fff;
        width: 31%;
        margin: 1%;
        float: left;
        border-radius: 8px;
    -webkit-border-radius: 8px;
    -moz-border-radius: 8px;
     padding-bottom: 10px;
}


#menu ul li p.image {
         width: 100%;
}


#menu ul li p.image img {
         width: 100%;
         height: auto;
         -webkit-border-top-left-radius: 8px;  
    -webkit-border-top-right-radius: 8px; 
    -moz-border-radius-topleft: 8px;  
    -moz-border-radius-topright: 8px; 
}



#menu ul li p.icon {
         width: 70px;
         margin: -35px auto 5px;
}


#menu ul li p.icon img {
         width: 100%;
         height: auto;
}


#menu ul li h3.pink {
      color: #b98a7a;
      font-weight: bold;
      font-size: 1.2rem;
      letter-spacing: 0;
      margin: 15px auto;
      line-height: 1.0;
}

#menu ul li h3.pink span {
    display: block;
    color: #b98a7a;
    font-weight: bold;
    font-size: 60%;
    letter-spacing: 0;
    line-height: 1;
}

#menu ul li p.text {
      margin: 5px auto;
      text-align: left;
      padding: 0 30px;
}

@media screen and (max-width: 768px) {

#menu ul {
        margin: 50px auto;
}


#menu ul li p.icon {
         width: 50px;
         margin: -25px auto 5px;
}

   #menu ul li p.text {
      padding: 0 15px;
}
}


@media screen and (max-width: 711px) {

     #menu ul li {
        width: 48%;
        margin: 1%;
        float: left;
        border-radius: 8px;
    -webkit-border-radius: 8px;
    -moz-border-radius: 8px;
     padding-bottom: 10px;
}

     #menu ul li p.text {
      padding: 0 20px;
}


}

@media screen and (max-width: 680px) {

#menu ul {
	width: 80%;
}

     #menu ul li {
        width: 98%;
        margin: 1%;
        float: left;
        border-radius: 8px;
    -webkit-border-radius: 8px;
    -moz-border-radius: 8px;
     padding-bottom: 10px;
     margin-bottom: 20px;
}

     #menu ul li p.text {
      padding: 0 20px;
}
}

@media only screen and (max-width: 759px){
#breadcrumb {
    margin: -10px auto 0 !important;
}
}