@charset "UTF-8";
/*
    Template: swell
    Theme Name: 中央歯科矯正
    Theme URI:
    Description:
    Version: 1.0.0
    Author:
    Author URI:

    License: GNU General Public License
    License URI: http://www.gnu.org/licenses/gpl.html
*/

/* サイト全体 */
@import url('https://fonts.googleapis.com/css2?family=Zen+Maru+Gothic:wght@500;700&display=swap');

body {
  font-feature-settings: "palt" 1;
  letter-spacing: 0.15em;
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
  font-family: "Zen Maru Gothic", "Yu Gothic";
}

/* 角丸 */
.kadomaru{
  border-radius: 1em;
}
.kadomaru_img img, .kadomaru_img figure{
  border-radius: 1em;
}
.kadomaru_ov_img img, .kadomaru_ov_img figure{
  border-radius: 10em;
}
.clip_kadomaru{
  clip-path: inset(0 0 round 1em);
}
.kadomaru .wp-block-group__inner-container{
  padding: 1em;
}
/* 表の角丸調整 */
figure.kadomaru.wp-block-flexible-table-block-table {
  position: relative;
  border: 1px solid #e6d2d3;
}
figure.kadomaru.wp-block-flexible-table-block-table table{
  clip-path: inset(1px 1px round 1em);
}


/* ---------- ボタン ---------- */

.btn_line a{
  background: #06c755 !important;
}
.btn-white a{
  background: #FFF;
  color: var(--color_main);
}
.btn-white a:hover{
  background: var(--color_main);
  color: #FFF;
}
[data-type="loos/button"].is-style-btn_normal.btn-white a, [data-type="loos/button"].is-style-btn_shiny.btn-white a, [data-type="loos/button"].is-style-btn_solid.btn-white a {
  color: var(--color_main);
}
.is-style-btn_shiny a{
  border-radius: 12px !important;
  padding: 3px;
}
.is-style-btn_shiny a span{
  background: #fff;
  color: #7a6c69;
  font-weight: bold;
  border-radius: 8px;
  width: 100%;
  padding: 1em;
  clip-path: polygon(100% 0, 100% 25%, 80% 100%, 0 100%, 0 0);
}
.swell-block-button.is-style-btn_shiny .__icon.-right {
  width: 2em;
  height: 2em;
  padding-right: 0.5em;
  bottom: -0.2em;
  right: 0;
  position: absolute;
}

/* フォント */
.font-shadow-w {
  text-shadow: 0px 0px 5px #fff, 0px 0px 5px #fff, 0px 0px 10px #fff, 0px 0px 10px #fff, 0px 0px 15px #fff, 0px 0px 15px #fff;
}
mark.has-inline-color {
  padding: 0.1em 0.3em;
}

.c-gnav .ttl{
  font-weight: bold;
}
@media (min-width: 960px) {
  .home .-parallel .l-header__inner {
    flex-wrap: nowrap;
    padding-bottom: 0;
  }
  .-parallel .l-header__inner {
      flex-wrap: nowrap;
      padding-bottom: 3em;
  }
  .-parallel-bottom .l-header__gnav{
    position: absolute;
    bottom: 0;
    left: 0;
    background: #f7f7f7;
  }
  .-parallel .l-header__logo{
    width: 360px;
    text-align: left;
  }
  .l-header.-parallel .w-header{
    justify-content: flex-end;
  }
}
.header_info .swell-block-columns__inner{
  justify-content: flex-end;
}
.header_info_tel a{
  padding: 0.25em 1em;
}
.header_info_data{
  color: #71625f;
  font-size: 0.8em;
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  font-weight: bold;
}
.header_info_data .swell-block-dl__dt{
  padding: 0.25em 0.5em;
  margin: 0 0 0.25em;
  width: 84px;
  text-align: center;
  border-radius: 50%;
  position: relative;
  z-index: 1;
}
.header_info_data .swell-block-dl__dt:before{
  content: '';
  width: 84px;
  height: 30px;
  position: absolute;
  background-image: linear-gradient(to right, #ecad9c, #ecc8a4);
  top: 0;
  left: 0;
  z-index: -2;
  border-radius: 15px;
}
.header_info_data .swell-block-dl__dt:after{
  content: '';
  width: 78px;
  height: 24px;
  position: absolute;
  top: 3px;
  left: 3px;
  background: #fff;
  z-index: -1;
  border-radius: 12px;
}
.header_info_data .swell-block-dl__dd{
  width: calc(100% - 84px);
  padding: 0.25em 0 0.25em 1em;
  margin: 0;
}
.header_info_bnr1 img,.header_info_bnr2 img{
  margin-top: -16px;
}
@media (max-width: 1280px) {
  .header_info_txt{
    letter-spacing: 0.05em;
    width: 280px !important;
  }
  .header_info_bnr1{
    width: 9vw !important;
  }
  .header_info_bnr2{
    width: 16vw !important;
  }
}

/* メインビジュアル */
.mv_media-txt .wp-block-media-text__media img{
  border-radius: 10em 0 0 10em;
}
.mv_media-txt .wp-block-media-text__content{
  padding-left: 8vw;
  position: relative;
}
.post_content .mv_txt .is-style-section_ttl{
   display: inline-block;
    padding: 0.25em 1em;
    border-radius: 12px;
    background-color: #f9eae3;
}
.post_content .mv_txt .is-style-section_ttl.-green{
   background-color: #e6fdea;
}
.mv_txt{
  position: relative;
}
.mv_txt p{
  font-weight: bold;
}
.mv1_sub_img, .mv2_sub_img, .mv3_sub_img{
  position: absolute;
  z-index: 100;
  max-width: 100%; 
  bottom: 0;
}
.mv1_sub_img{
  width: 20vw;
  left: 40%;
}
.mv2_sub_img{
  width: 20vw;
  left: 40%;
}
.mv3_sub_img{
  width: 8vw;
  left: 10%;
}
@media (max-width: 600px) {
  .mv1_sub_img,.mv2_sub_img,.mv3_sub_img{
    display: none;
  }
  .mv_media-txt.is-style-broken.wp-block-media-text {
    --swl-mediatext--lap:-8em;
  }
  .post_content .mv_txt .is-style-section_ttl{
    font-size: 0.9em;
  }
  .post_content .mv_txt p{
    font-size: 0.8em;
  }
}

/* 追従ヘッダー */
.l-fixHeader:before{
  background-color: #fff;
}
.l-fixHeader__inner{
  color: var(--color_main);
}

/* トップページのグローバルナビ */
.home .-parallel-bottom .l-header__gnav{
  display: none;
}
.post_content>:first-child.mv_menu{
  margin-top: calc(-2em - 36px) !important;
  padding-top: 1em !important;
  padding-bottom: 1em !important;
}
.wp-block-group.is-row.page_menu{
  justify-content: center;
}
.page_menu_icon{
  padding-right: 1em;
}
.page_menu_list .swell-block-linkList__link{
  padding: 0 1em;
}

/* パンくずリスト */
.p-breadcrumb__list {
    flex-wrap: wrap;
}
.single .p-breadcrumb__item:last-child>span.p-breadcrumb__text {
    display: block!important;
    opacity: 1;
    white-space: pre-wrap;
}

/* メインコンテンツ（下層） */
.l-mainContent__inner>.post_content{
  margin: 0;
}
.l-content {
  padding-top: 1em;
  margin:0 auto;
}

/* フッター */
.l-container.w-footer {
    max-width: 100%;
}
.w-beforeFooter{
  margin-top: 0;
}
.float__btn{
  position: fixed;
  right: -18px;
  bottom: 11vh;
  z-index: 1000;
}
.float__btn a{
  flex-direction: column;
  padding: 1.5em 1em;
  border-radius: 1em 0 0 1em;
}
.float__btn a:before{
  content: 'どうぞお気軽に';
  font-size: 12px;
  display: block;
  background-color: #FFF;
  color: var(--the-btn-color);
  padding: 0.25em 0.5em;
  border-radius: .25em;
}
.float__btn a{
  box-shadow: 0 2rem 2rem -1.5rem rgb(90 115 130 / 30%);
}
.float__btn a:hover{
  transform: translateX(-12px);
}

#fix_bottom_menu .menu-item a{
  display: flex;
  justify-content: center;
  min-height: 52px;
  padding-bottom: 4px;
  align-items: center;
}
#fix_bottom_menu span{
  width: auto;
  margin-left: 0.5em;
  margin-top: 0;
  font-size: 1em;
  font-weight: bold;
  position: relative;
}
#fix_bottom_menu .menu-item.sp-fixf_tel{
  background-color:#92ce82;
}
#fix_bottom_menu .menu-item.sp-fixf_tel span{
  padding-top: 14px;
  font-size: 1.1em;
}
#fix_bottom_menu .menu-item.sp-fixf_tel span:before{
  content: 'お急ぎの方はお電話で';
  font-size: 9px;
  position: absolute;
  top: -1px;
  font-weight: normal;
  left: 0; 
  right: 0;
}

/* 見出し */

.post_content h2.is-style-section_ttl{
  font-size: 2em;
  letter-spacing: 0.2em;
}
.post_content h2.wp-block-heading{
  border-radius: 0.5rem;
}
@media (max-width: 960px){
  .post_content h2.is-style-section_ttl{
    font-size: 1.4em;
  }
}


/* 【TOP】フロントページ
==================================================== */
.ttl_top{
  position: relative;
}
.ttl_fuki{
  position: absolute;
  top: -6em;
  left: calc(50% - 20em);
}
.ttl_top_sub{
  position: relative;
  padding: 0 2em;
  display: inline-block;
  left: 50%;
  transform: translateX(-50%);
}
.ttl_top_sub:before, .ttl_top_sub:after{
  content: '';
  display: inline-block;
  width: 1em;
  height: 2px;
  background-color: var(--color_main);
  position: absolute;
  top: 50%;
}
.ttl_top_sub:before{
  transform: rotate(60deg);
  left: 0;
}
.ttl_top_sub:after{
  transform: rotate(-60deg);
  right: 0;
}

/* 背景色 */
.bg_gd_yw{
  background-image: linear-gradient(to bottom, #fdfbef, #FFFFFF);
}
.bg_gd_wp{
  background-image: linear-gradient(to bottom, #FFFFFF, #f5e2de);
}
.bg_gd_py{
  background-image: linear-gradient(to bottom, #f5e2de,#fdfbef);
}
.bg_gd_yg{
  background-image: linear-gradient(to bottom, #fdfbef,#cfebc3);
}
.bg_gd_gw{
  background-image: linear-gradient(to bottom, #cfebc3, #FFFFFF);
}
.bg_gd_wy{
  background-image: linear-gradient(to bottom, #ffffff,#fdfbef);
}
.bg_star{
  background-image: url(./assets/img/bg_star_c.png)
}
.top_merit_otona, .top_merit_kodomo{
	margin-left: calc(50% - 50vw);
  margin-right: calc(50% - 50vw);
  padding-left: calc(50vw - 50%) !important;
  padding-right: calc(50vw - 50%) !important;
  padding-top: 3em;
  padding-bottom: 3em;
}
.top_merit_otona{
  background-image: linear-gradient(30deg, rgba(250, 236, 233, 1), rgba(255, 255, 255, 1) 50%);
}
.top_merit_kodomo{
  background-image: linear-gradient(-150deg, rgba(230, 243, 226, 1), rgba(255, 255, 255, 1) 50%);
}
.top_rec_item{
  box-shadow: 0 2rem 2rem -1.5rem rgb(210 210 210 / 25%);
  padding: 5em !important;
}
.top_rec_item.-left{
  border-radius: 0 10em 10em 0;
	margin-left: calc(50% - 50vw);
  padding-left: calc(50vw - 50%) !important;
}
.top_rec_item.-right{
  border-radius: 10em 0 0 10em;
	margin-right: calc(50% - 50vw);
  padding-right: calc(50vw - 50%) !important;
}
.top_rec_item_catch{
  border-radius: 6em;
}
.top_item_rec_feature{
  list-style: none;
  padding-left: 0 !important;
  display: flex;
  justify-content: center;
  align-items: flex-start;
  position: relative;
  margin-bottom: -5em;
}
.top_item_rec_feature li{
  background-image: linear-gradient(to right, #f8eeec, #fbf4ec);
  box-shadow: 0 2rem 2rem -1.5rem rgb(150 150 150 / 30%);
  padding: 3em 1em;
  margin:  0 1em;
  border-radius: 99em;
  font-weight: bold;
  width: 20%;
  text-align: center;
  position: relative;
}
.top_item_rec_feature li:after{
  position: absolute;
  content: '';
  width: 2em;
  height: 1em;
  bottom: -1em;
  left: 0;
  right: 0;
  clip-path: polygon(0 0, 100% 0, 50% 100%);
  margin: auto;
  background: #faf1ed;
}
.top_item_rec_feature li:nth-child(1){
  margin-top: 4em;
}
.top_item_rec_feature li:nth-child(4){
  margin-top: 4em;
}

.hanarabi_list_item{
  box-shadow: 0 2rem 2rem -1.5rem rgb(150 150 150 / 30%);
  padding: 1.5em;
  border-radius: 1em;
}
.top_relier_item{
  counter-increment: number;
}
.post_content h3.ttl_relief{
  position: relative;
  padding-left: 2em;
}
.post_content h3.ttl_relief:after{
  content: counter(number);
  position: absolute;
  top: -0.6em;
  left: 0;
  font-size: 2.5em;
  font-weight: bold;
  color: var(--color_main);
  z-index: 100;
}
/* メディアとテキスト */
@media (min-width: 1280px) {
  .wp-block-media-text.-wsp {
    --swl-mediatext--space: 4rem;
  }
}
.swell-block-columns.top_profile{
  border-top: 1px solid var(--color_main);
}
.post_content .top_profile h4{
  background-color: var(--color_main);
  color: #fff;
  writing-mode: vertical-rl;
  padding: 0.5em;
  width: 2em;
  vertical-align: middle;
  text-align: center;
  box-sizing: border-box;
  line-height: 1;
  margin: 0;
  border-radius: 0 0 1em 1em;
}
.l-mainContent .top_profile .swell-block-column{
  flex-direction: row;
  justify-content: flex-start;
}
.top_profile_list{
  list-style-type: none;
  padding-top: 1em;
}
.sns_links .wp-block-media-text__media{
  margin-bottom: -3em;
}

/* 投稿リストブロックのカード型とサムネイル型を4列表示にする */

@media (min-width: 960px) {
  .-col4 .-type-card.-pc-col3 .p-postList__item, .-col4 .-type-thumb.-pc-col3 .p-postList__item{
    width: calc(100% / 4 - 1vw);
  }
  .-col5 .-type-card.-pc-col3 .p-postList__item, .-col5 .-type-thumb.-pc-col3 .p-postList__item{
    width: calc(100% / 4 - 1vw);
  }
}
@media (min-width: 1500px) {
  .-col5 .-type-card.-pc-col3 .p-postList__item, .-col5 .-type-thumb.-pc-col3 .p-postList__item{
    width: calc(100% / 5 - 1vw);
  }
}
@media (min-width: 1320px) {
  .-sidebar-on.post-type-archive-works .l-mainContent .-type-card.-pc-col3 .p-postList__item,
  .-sidebar-on.archive.tax-works_cat .l-mainContent .-type-card.-pc-col3 .p-postList__item,
  .-sidebar-on.archive.tax-works_tag .l-mainContent .-type-card.-pc-col3 .p-postList__item {
      width: calc(33.33333% - 1vw);
  }
}
.post-type-archive-works .l-mainContent .-type-card .p-postList__item,
.archive.tax-works_cat .l-mainContent .-type-card .p-postList__item{
  width: calc(50% - 1vw);
}

/* リッチカラムの調整 */
.l-mainContent .swell-block-column {
    display: flex;
    flex-direction: column;
    justify-content: space-between;
}
.l-mainContent .swell-block-column .swell-block-button {
    margin-top: auto;
    width: 100%;
}

/* group hyperlink */
a.wp-block-tiptip-hyperlink-group-block {
  text-decoration: none;
  color: inherit;
  transition: 0.3s;
  margin-top: 0;
  margin-bottom: 0;
}
a.wp-block-tiptip-hyperlink-group-block:hover{
  opacity: 0.7;
}

/* 【SP】調整
==================================================== */

/* ヘッダー */
/* ヘッダー */
@media screen and (min-width: 300px){
  .l-header__inner.l-container,
  .l-fixHeader__inner.l-container {
      max-width: 100%;
      padding-left: var(--swl-pad_container, 0);
      padding-right: var(--swl-pad_container, 0);
}
  }
}
@media screen and (min-width: 1540px){
  .l-header__inner.l-container,
  .l-fixHeader__inner.l-container {
      max-width: 95%;
  }
}

@media (max-width: 600px){
  .ttl_fuki{
    position: relative;
    top: auto;
    left: calc(50% - 30vw);
    width: 30vw;
  }
  .top_rec_item{
    padding: 1em !important;
  }
  .top_rec_item.-left{
    border-radius: 0 5em 5em 0;
  }
  .top_rec_item.-right{
    border-radius: 5em 0 0 5em;
  }
  .top_rec_item_catch{
    border-radius: 3em;
  }
  .top_item_rec_feature{
    flex-wrap: wrap;
    justify-content: space-between;
    margin-bottom: 0;
  }
  .top_item_rec_feature li{
    padding: 1em 0.5em;
    margin:  0.5em 0.5em 1em;
    width: calc(50% - 1em);
  }
  .top_item_rec_feature li:nth-child(1){
    margin-top: auto;
  }
  .top_item_rec_feature li:nth-child(4){
    margin-top: auto;
  }
  .top_relier_item div.has-background{
    padding: 1em 0.5em;
  }
  .sns_links .wp-block-media-text__media{
    margin-bottom: 0;
    width: 200px;
    margin: 0 auto;
  }
  .hanarabi_list .swell-block-columns__inner{
    justify-content: center;
  }
  .hanarabi_list.swell-block-columns {
      --swl-clmn-mrgn--x: 0.5rem;
      --swl-clmn-mrgn--y: 1rem;
  }
  .hanarabi_list_item{
    padding: 1em;
  }
  .hanarabi_list_item p{
    font-size: 0.9em;
  }
  .cta_telno{
    font-size: 8vw !important;
  }
}