.contents_center {
    text-align: center;
}

.cm-section {
  margin-top: 80px;
}

.cm-section-title {
  position: relative;
  text-align: center;
  background:
    url(/sp/petit/cm/img/index_local_title_bg01.png) center right / 8px 8px no-repeat,
    url(/sp/petit/cm/img/index_local_title_bg01.png) center left / 8px 8px no-repeat;
}

.cm-section-title:before,
.cm-section-title:after {
  content: "";
  top: 0;
  bottom: 0;
  margin: auto;
  position: absolute;
  height: 2px;
  width: calc(50% - 125px);
  background-color: #000;
}
.cm-section-title:before {right: 0;}
.cm-section-title:after {left: 0;}

.cm_contents_area {
    width: 100%;
    height: 693px;
    margin-top: 50px;
    margin-left: .5%;
    background-size: 100% 100%;
    background-repeat: no-repeat;
    box-shadow: 6px 6px 6px 0px rgba(0,0,0,0.1);
}
.cm_contents_area + .cm_contents_area {
    margin-top: 60px;
}

.cm_contents_area.theme-kimuchi {
  background-image: url("/sp/petit/cm/img/cm_area_kimuchi_bg01_pc.png");
}

.cm_contents_area.theme-tantan {
  background-image: url("/sp/petit/cm/img/cm_area_tantan_bg01_pc.png");
}

.cm_contents_area.theme-yose {
  background-image: url("/sp/petit/cm/img/cm_area_yose_bg01_pc.png");
}

.cm_contents_area.theme-kamatama {
  background-image: url("/sp/petit/cm/img/cm_area_kamatama_bg01_pc.png");
}

.cm_contents_area.theme-sudachi {
  background-image: url("/sp/petit/cm/img/cm_area_sudachi_bg01_pc.png");
}
.cm_contents_area.theme-asari {
  background-image: url("/sp/petit/cm/img/cm_area_asari_bg01_pc.png");
}
.cm_contents_area.theme-sirunasitantanmen {
  background-image: url("/sp/petit/cm/img/cm_area_sirunasitantan_bg01_pc.png");
}

.cm_area_title {
    text-align: center;
    padding-top: 40px;
}
.cm_area_title span {
    display: inline-block;
    margin: 0 5%;
}

.cm_flex_pc {
    display: flex;
    margin: 60px;
    padding-top: 50px;
    justify-content: space-between
}

.cm_movie {
    position: relative;
    width: 102%;
    max-width: 750px;
    height: 426px;
    max-height: 426px;
    text-align: center;
  }

.cm_movie_modal_wrap {
  display: flex;
  justify-content: center;
  align-items: center;
  position: fixed;
  z-index: 100;
  top: 0;
  right: 0;
  left: 0;
  bottom: 0;
  margin: auto;
  opacity: 0;
  pointer-events: none;
  transition: opacity .3s ease;
  background-color: rgba(0,0,0,.5);
}

.cm_movie_modal_wrap.is-open {
  pointer-events: auto;
  opacity: 1;
}

.cm_movie_modal {
  position: relative;
  width: 90%;
  max-width: 900px;
}

.cm_movie_modal_inner {
  position: relative;
  padding-top: 56.25%;
  width: 100%;
}

.cm_movie_modal_inner > iframe {
  position: absolute;
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
  width: 100%;
  height: 100%;
}

.cm_movie_modal_close {
  position: absolute;
  right: 0;
  top: -20px;
  width: 20px;
  height: 20px;
}

.cm_movie_modal_close > button {
  border: 0;
  padding: 0;
  margin: 0;
  text-indent: 200%;
  white-space: nowrap;
  overflow: hidden;
  width: 100%;
  height: 100%;
  background: url(/sp/petit/shared/img/controls.png) no-repeat 0 0;
  background-position: -50px 0px;
  vertical-align: top;
}

.cm_movie_modal_close > button:hover {
  background-position: -50px -25px;
}

.cm_movie .movie-image{
  position: absolute;
  top: 0;
  bottom: 0;
  left: 0;
  right: 0;
  margin: auto;
  outline: none;
}

.cm_movie .movie-image:focus{
  outline: none;
}
.cm_movie .movie-image img{
  position: absolute;
  top: 0;
  bottom: 0;
  left: 0;
  right: 0;
  margin: auto;
}

.cm_contents {
    text-align: center;
    padding-left: 40px;
    width: 40%;
}
.contents_image {
    margin-bottom: 40px;
}

.contents_link_image {
    margin-bottom: 30px;
}

.contents_button {
    margin: 0 auto;
}
.contents_button .mod-petit-button {
    margin-top: 20px;
}

.petit_various_type {
    margin-top: 80px;
}

.petit-list {
    display: flex;
    width: 100%;
    margin: 20px auto 0;
    justify-content: center;
}
.cm-anchor-link {
  display: flex;
  justify-content: center;
  margin-top: 60px;
}
.cm-anchor-link li {
  width: 224px;
  padding: 0 10px;
  font-weight: 500;
}

.cm-anchor-link a {
  display: flex;
  justify-content: center;
  align-items: center;
  position: relative;
  box-sizing: border-box;
  width: 100%;
  height: 57px;
  border: 2px solid #222;
  border-radius: 28.5px;
  background-color: #fff;
  transition: background-color .3s ease, color .3s ease, opacity .3s ease;
  color: #222;
  text-align: center;
  font-size: 1.06rem;
}
.cm-anchor-link a:hover {
  text-decoration: none;
  background-color: #222;
  color: #fff;
}

.cm-anchor-link a:after {
  content: "";
  display: block;
  position: absolute;
  top: 0;
  bottom: 0;
  margin: auto 0;
  right: 15px;
  width: 6px;
  height: 10px;
  transition: background-position .3s ease;
  transform: rotate(90deg);
  background: url(/sp/petit/shared/img/button_bg01.png) no-repeat right center / 300% 100%;
}
.cm-anchor-link a:hover:after {
  background-position: left center;
}

/*  調整用 */
.mt20 {
    margin-top: 20px;
}

@media only screen and (max-width: 640px) {

    .cm-section {
      margin-top: 50px;
    }
    .cm-section-title {
       background-size: 6px 6px;
    }
    .cm-section-title:before,
    .cm-section-title:after {
        width: calc(50% - 95px);
    }
    .cm_contents_area {
        width: 100%;
        height: 100%;
        background: url("/sp/petit/cm/img/cm_area_sp.png");
        background-size: 100% 100%;
        background-repeat: no-repeat;
        margin-top: 20px;
    }
    .cm_contents_area.theme-kimuchi {
        background-image: url("/sp/petit/cm/img/cm_area_kimuchi_bg01_sp.png");
    }
    .cm_contents_area.theme-tantan {
        background-image: url("/sp/petit/cm/img/cm_area_tantan_bg01_sp.png");
    }
    .cm_contents_area.theme-tantan.long {
        background-image: url("/sp/petit/cm/img/cm_area_tantan_bg02_sp.png");
    }
    .cm_contents_area.theme-yose {
        background-image: url("/sp/petit/cm/img/cm_area_yose_bg01_sp.png");
    }
    .cm_contents_area.theme-kamatama {
        background-image: url("/sp/petit/cm/img/cm_area_kamatama_bg01_sp.png");
    }
    .cm_contents_area.theme-sudachi {
        background-image: url("/sp/petit/cm/img/cm_area_sudachi_bg01_sp.png");
    }
    .cm_contents_area.theme-asari {
        background-image: url("/sp/petit/cm/img/cm_area_asari_bg01_sp.png");
    }
    .cm_contents_area.theme-sirunasitantanmen {
      background-image: url("/sp/petit/cm/img/cm_area_sirunasitantan_bg01_sp.png");
  }

    .cm_area_title {
        padding: 25px 15px 42px;
    }

    .cm_area_title.big-size {
      padding: 25px 0 42px;
  }

    .cm_flex_pc {
        display: block;
        margin: 0;
        padding: 10px 20px 30px;
    }
    .cm_flex_sp {
        display: flex;
    }

    .cm_movie {
        position: relative;
        width: 100%;
        height: auto;
        padding: 30% 0;
    }

    .cm_contents {
        width: 100%;
        padding: 0;
    }

    .cm_contents .mod-petit-button > a, .mod-petit-button > button {
        min-height: 48px;
        border-radius: 24px;
        padding-right: 15px;
        padding-left: 5px;
    }
    .contents_image {
        margin: 20px auto;
    }
    .contents_link_image {
        margin: auto 0;
    }
    .contents_button {
        width: 75%;
        margin: 0 auto;
        margin-left: 20px;
    }

    .mod-petit-button:first-child {
        margin-top: 0;
    }

    .petit_various_type {
        margin-top: 30px;
    }

    .petit-list {
        display: flex;
        width: 100%;
        margin: 10px auto 0;
        justify-content: center;
    }
    .cm-anchor-link {
      margin: 30px -7.5px 0;
    }

    .cm-anchor-link li {
      width: 50%;
      max-width: 180px;
      padding: 0 7.5px;
    }
    .cm-anchor-link a {
      height: 48px;
      border-radius: 24px;
      font-size: 0.93em;
    }
}


/*modal*/
#cboxOverlay {
  background-color: rgba(0,0,0,0.5);
}
