/*
  Skin Name: ウェルネスプログラム用テンプレート
  Description: 
  Skin URI:
  Author: イーザー
  Author URI: 
  Screenshot URI: https://im-cocoon.net/wp-content/uploads/skin-template.png
  Version: 1.0.0
  Priority: 9999000000
*/
/*以下にスタイルシートを記入してください*/

@import url('https://fonts.googleapis.com/css2?family=Nunito:wght@700&display=swap&text=0123456789');

.container{overflow-x: hidden;}

/* ヘッダー */
body.home .header-container:not(.fixed-header){
  width: 100%!important;
  z-index: 3;
  position: absolute!important;
}
body.home .header-container:not(.fixed-header),
body.home .navi:not(.fixed-header){background-color: transparent;}

.navi-in > ul li{width: auto!important;margin: 0 1em;}
.navi-in a{padding: 0 1em;}
.navi-in a:hover{background-color: transparent;}
.navi-in a::after {
  position: absolute;
  left: 0;
  content: '';
  width: 100%;
  height: 3px;
  background: #fca103;
  bottom: 0;
  transform: scale(0, 1);
  transform-origin: center top; /*変形（アンダーラインの伸長）の原点がaタグ（各メニュー）の右端*/
  transition: transform 0.3s;   /*変形の時間*/
}
.navi-in li.current-menu-item a::after,
.navi-in a:hover::after {transform: scale(1, 1); /*ホバー後、x軸方向に1（相対値）伸長*/}

.header-login a.btn-m{
  padding-left:28px;
  padding-right:28px;
  width: max-content;
  max-width: 320px;
  background-color: #fca103;
  color:var(--_darker-color-gray);
}
.header-login a.btn-m:hover{opacity: 1;background-color: #fc7D13;}

/* インナーを囲む */
.header-container-in.hlt-top-menu.wrap{width:100%;}

.logo-menu-button {
  text-align: left;
  line-height: 1.5;
  padding: 0.3em 0;
}
.mobile-header-menu-buttons .navi-menu-button:nth-child(2){width: 85px;}
.mobile-header-menu-buttons .navi-menu-button a span.fa-user:before{color:#fca103;}

@media screen and (max-width: 1023px) {
  .header-container-in.hlt-top-menu {flex-direction: row;}
}
@media screen and (min-width: 853px) {
body.home .header-container:not(.fixed-header) .site-name-text-link,
body.home .header-container:not(.fixed-header) .navi-in a{color: var(--cocoon-white-color);}
}

@media screen and (max-width: 852px) {
/*
  body.home .header-container:not(.fixed-header){
    background-color: var(--cocoon-white-color);
    position: relative!important;
  }
  .header-login a.btn-sp{
    text-decoration: none;
    width: max-content;
    text-align: center;
    display: inline-block;
    padding:0.3em;
  }
  .header-login a.btn-sp i{color:#fca103;font-size: 25px;}
  .header-login a.btn-sp span{display: block;font-size: 9px;color: var(--cocoon-text-color);}
*/
  .header-container-in.hlt-top-menu{display: none;}
}

body.home .article,
body.home .entry-content{margin-bottom: 0!important;}

/* スライダー */
.swiper-container{position: relative;overflow-x: hidden;}
.swiper-wrapper{margin: 0;}
.swiper-slide .post__thumb--img {margin: 0;position: relative;}
.swiper-slide .post__thumb--img::after {
  content: "";
  position: absolute;
  top: 0;
  left: 0;
  height: 100%;
  width: 100%;
  background:linear-gradient(rgba(0,0,0,0.5) 0,rgba(0,0,0,0) 20%);
}
.swiper-slide .post__thumb--img a {
  padding-top: 50%;
  width: 100%;
  display: block;
  background-position: center;
  background-repeat: no-repeat;
  background-size: cover;
}
.swiper-slide .text-block{
  position: absolute;
  top: 50%;
  bottom: 0;
  left: 10%;
  transform: translateY(-50%);
  width: 30%;
  padding:1em;
  background-color: rgba(255, 255, 255, 0.6);
  box-shadow: 0px 1px 10px 0px RGBA(0,0,0,0.22);
  height: fit-content;
}
.swiper-slide .text-block h3{
  background-image: repeating-linear-gradient(45deg, #2FA770 0 2px, transparent 2px 4px);
  background-repeat: no-repeat;
  background-size: 4rem 0.4rem;
  background-position: left bottom;
  padding-bottom: 1em;
  margin-bottom: 0.8em;
}
.swiper-slide .list-more-button{
  background-color: #2FA770;
  color: var(--cocoon-white-color);
  transition-duration: .4s;
}
  
.swiper-slide .list-more-button:hover { transform: scale(1.1);}
.swiper-pagination {
  left: 50%!important;
  transform: translateX(-50%)!important;
  width: fit-content!important;
  background: var(--cocoon-white-color);
  box-shadow: 0px 0px 10px 0px RGBA(0,0,0,0.16);
  padding: 0.1em 0.5em;
  border-radius: 18px;
  bottom: 2em !important;
}
.swiper-pagination-bullet {
  background-color: #2FA770!important;
  opacity: 0.5;
  width: 12px!important;
  height: 12px!important;
}
.swiper-pagination-bullet-active {opacity: 1;}
.swiper-button-next, .swiper-button-prev{color: #2FA770!important;z-index: 2!important;}

@media screen and (max-width: 852px) {
  .swiper-slide .text-block p {display: none;}
  .swiper-slide .list-more-button{
      position: absolute;
      bottom: 0;
      left: 25%;
      right: 25%;
      margin-bottom: 0.5em;
  }
}

.content{margin-top: 0;}
.no-sidebar .content .main{padding-bottom: 0;border: 0!important;padding-top: 0;}

/* 新着記事カラム表示 */
.new-entry-card-link{max-width: 100%!important;}
.new-entry-cards {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 5% 3%;
}
.new-entry-cards a:hover,
.list a.entry-card-wrap:hover{background-color: transparent;}
.new-entry-cards a figure img,
.list a.entry-card-wrap figure img{
  transition: all .3s ease-in-out;
  position: relative;
}
.new-entry-cards a:hover figure img,
.list a.entry-card-wrap:hover figure img{
  border-radius: 15px;
  opacity: .6;
}
.new-entry-cards a figure .cat-label,
.list a.entry-card-wrap figure .cat-label {
	top: -6px;
	left: 5%;
	padding: 10px 10px 5px 10px;
	border: 0;
	border-top-right-radius: 3px;
	overflow: visible;
}
.new-entry-cards a figure .cat-label::before,
.list a.entry-card-wrap figure .cat-label::before {
	position: absolute;
	content: "";
	width: 0;
	height: 0;
	top: 0;
	left: -6px;
	border-bottom: 6px solid var(--cocoon-grey-color);
	border-left: 6px solid transparent;
}
.new-entry-cards a figure .status,
.list a.entry-card-wrap figure .status {
  position: absolute;
  top: 0;
  bottom: 0;
  left: 0;
  right: 0;
  margin: auto !important;
  width: fit-content;
  height: fit-content;
  background-color: #fc3703;
  padding: 0.5em 1em;
  border: 3px solid var(--cocoon-white-color);
}
.new-entry-cards a figure .status span,
.list a.entry-card-wrap figure .status span{color: var(--cocoon-white-color);}

.new-entry-cards.card-large-image dl.schedule,
.new-entry-cards.card-large-image dl.location,
.list a.entry-card-wrap .entry-card-content dl.schedule,
.list a.entry-card-wrap .entry-card-content dl.location{
  display: flex;
  margin-top: 0.7em;
  margin-bottom: 0.7em;
  font-size: 16px;
}
.new-entry-cards.card-large-image dl.schedule dt,
.new-entry-cards.card-large-image dl.location dt,
.list a.entry-card-wrap .entry-card-content dl.schedule dt,
.list a.entry-card-wrap .entry-card-content dl.location dt{
  width: 30%;
  height: fit-content;
  padding: 0.2em 0.8em;
  background-color: var(--cocoon-blue-gray-color);
  color: var(--cocoon-white-color);
}
.new-entry-cards.card-large-image dl.schedule dt::before,
.new-entry-cards.card-large-image dl.location dt::before,
.list a.entry-card-wrap .entry-card-content dl.schedule dt::before,
.list a.entry-card-wrap .entry-card-content dl.location dt::before{
  font-family: "Font Awesome 5 Free";
  display: contents;
  margin-right: 0.5em;
  text-align: left;
}
.new-entry-cards.card-large-image dl.schedule dt::before,
.list a.entry-card-wrap .entry-card-content dl.schedule dt::before{content: "\f073";  font-weight: 400;}
.new-entry-cards.card-large-image dl.location dt::before,
.list a.entry-card-wrap .entry-card-content dl.location dt::before{content: "\f3c5";  font-weight: 900;}
.new-entry-cards.card-large-image dl.schedule dd,
.new-entry-cards.card-large-image dl.location dd,
.list a.entry-card-wrap .entry-card-content dl.schedule dd,
.list a.entry-card-wrap .entry-card-content dl.location dd{margin-left:1em;padding:0.2em 0;}

@media screen and (max-width: 852px) {
  .new-entry-cards { grid-template-columns: repeat(2, 1fr);gap: 3%; }
}
@media screen and (max-width: 480px) {
  .new-entry-cards a figure .status,
  .list a.entry-card-wrap figure .status {font-size: 16px;}
  .new-entry-cards.card-large-image dl.schedule,
  .new-entry-cards.card-large-image dl.location,
  .list a.entry-card-wrap .entry-card-content dl.schedule,
  .list a.entry-card-wrap .entry-card-content dl.location{ flex-direction: column; }
  .new-entry-cards.card-large-image dl.schedule dt,
  .new-entry-cards.card-large-image dl.location dt,
  .list a.entry-card-wrap .entry-card-content dl.schedule dt,
  .list a.entry-card-wrap .entry-card-content dl.location dt{width: 100%;}
  .new-entry-cards.card-large-image dl.schedule dd,
  .new-entry-cards.card-large-image dl.location dd,
  .list a.entry-card-wrap .entry-card-content dl.schedule dd,
  .list a.entry-card-wrap .entry-card-content dl.location dd{margin:0 0.5em;}
}

.wp-block-group.search-cat,
.wp-block-group.voice-list{
	margin: 0 calc(50% - 50vw);
	width: 100vw;
  margin-bottom: 0!important;
}
ul.wp-block-categories-list{
  display: grid;
  gap: 1em;
  grid-template-columns: repeat(4, 1fr);
}
ul.wp-block-categories-list li a{
  display: flex;
  flex-direction: column;
  align-items:center;
  text-decoration: none;
}
ul.wp-block-categories-list li .fa-stack{width: 12.5em;height: 12em;line-height: 12em;}
ul.wp-block-categories-list li .fa-stack .fa-stack-2x{font-size: 12em;transition: all 0.3s;}
ul.wp-block-categories-list li a:hover .fa-stack .fa-stack-2x{text-shadow: 0 0 15px var(--cocoon-grey-color);}
ul.wp-block-categories-list li .fa-stack .fa-stack-1x{font-size: 5em;}

.is-list-horizontal.large-thumb .widget-entry-card-link{max-width: 25%!important;}
.is-list-horizontal .swiper-button-prev{display: flex;}

@media screen and (max-width: 852px) {
  ul.wp-block-categories-list { grid-template-columns: repeat(3, 1fr);padding-left: 0; }
}
@media screen and (max-width: 480px) {
  ul.wp-block-categories-list { grid-template-columns: repeat(2, 1fr); }
  ul.wp-block-categories-list li .fa-stack{width: 10.5em;height: 10em;line-height: 10em;}
  ul.wp-block-categories-list li .fa-stack .fa-stack-2x{font-size: 10em;}
  .is-list-horizontal.large-thumb .widget-entry-card-link{max-width: 100%!important;}
}

/* 活動予定 */
.event-calendar a{text-decoration: none;}
h4.event-calendar{text-align: center;font-family: 'Nunito', "Kosugi Maru", sans-serif;}
h4.event-calendar .prev{float: left;}
h4.event-calendar .next{float: right;}
h4.event-calendar a.button{color: #2FA770;}
table.event-calendar{border: 2px solid var(--cocoon-thin-color);font-family: 'Nunito', "Kosugi Maru", sans-serif;}
table.event-calendar tr:nth-of-type(2n+1){background-color: transparent;}
table.event-calendar th{width: 14%;}
table.event-calendar th,
table.event-calendar td{border: 1px solid var(--cocoon-thin-color);}
table.event-calendar tr th:first-child,
table.event-calendar tr td:first-child{color: #c9144e;}
table.event-calendar tr th:last-child,
table.event-calendar tr td:last-child{color: #2c70a4;}
table.event-calendar td{vertical-align: top;height: 150px;}
table.event-calendar td.today{background-color: #e5ffef;}
table.event-calendar td div.event{
  margin: 0 0 0.2rem;
}
table.event-calendar td div.event a{
  font-size: var(--wp--preset--font-size--small);
  border-radius: 0.3rem;
  color: var(--cocoon-white-color);
  display: block;
  padding: 0.1rem 0.2rem;
}
table.event-calendar td div.event a:hover{opacity: 0.7;}

/* 参加者の声 */
.wp-block-lazyblock-voice-list{margin-bottom: 3em;}
ul.voice-list{
  list-style: none;
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 3em 2em;
  padding-left: 0;
}
ul.voice-list li{
  margin: 0;
  padding: 1em;
  border: 1px solid var(--cocoon-grey-color);
  box-shadow: 10px 10px 0 0 RGBA(0,0,0,0.15);
  background-color: var(--cocoon-white-color);
}
ul.voice-list li .voice-title{padding: 0.5em 0 0.3em;}
ul.voice-list li .voice-content{font-size: var(--cocoon-text-size-s);margin-bottom: 1em;}
ul.voice-list li .voice-name{
  font-size: var(--wp--preset--font-size--small);
  text-align: right;
  border-top: 1px solid var(--cocoon-basic-border-color);
  padding-top: 1em;
}

@media screen and (max-width: 480px) {
  .wp-block-lazyblock-voice-list{padding-left: 1em;padding-right: 1em;}
  ul.voice-list{grid-template-columns: repeat(1, 1fr);}
}

.wp-block-cover.recruiting{
  margin: 0 calc(50% - 50vw)!important;
	width: 100vw;
}

body.page header.entry-header,
body.blog header.entry-header{
  position: relative;
  margin: 0 calc(50% - 50vw)!important;
	width: 100vw;
}
body.page header.entry-header h1.entry-title,
body.blog header.entry-header h1.entry-title{
  position: absolute;
  top: 0;
  right: 0;
  bottom: 0;
  left: 0;
  margin: auto;
  z-index: 2;
  width: fit-content;
  height: fit-content;
  color: var(--cocoon-white-color);
  text-shadow: 1px  1px 5px var(--cocoon-blue-gray-color),
            -1px  1px 5px var(--cocoon-blue-gray-color),
             1px -1px 5px var(--cocoon-blue-gray-color),
            -1px -1px 5px var(--cocoon-blue-gray-color);
}
body.post header.entry-header h1.entry-title{margin: 1.5em 0;}

.archive-title{
  background: url(images/bg-cat-title.jpg) no-repeat center center;
  margin: 0 calc(50% - 50vw) 1.5em!important;
	width: 100vw;
  padding: 2em 0;
  text-align: center;
}

/* 協力施設一覧 */
ul.facilities-list{
  list-style: none;
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 3em 2em;
  padding-left: 0;
}
ul.facilities-list li{ margin: 0;}
ul.facilities-list li a{
  display: block;
  border: 1px solid var(--cocoon-grey-color);
  box-shadow: 0 4px 8px rgba(0, 0, 0, 0.1);
  transition: transform 0.3s ease-in-out;
  text-decoration: none;
  color: var(--cocoon-text-color);
}
ul.facilities-list li a:hover {
    transform: scale(1.05);
    box-shadow: 0 8px 16px rgba(0, 0, 0, 0.2);
}
ul.facilities-list li figure.facilities-thumb{ position: relative;}
ul.facilities-list li figure.facilities-thumb img{width: 100%;aspect-ratio: 3 / 2;}
ul.facilities-list li .facilities-name{padding: 0.8em 0 0.3em;text-align: center;}
ul.facilities-list li .facilities-content{font-size: var(--cocoon-text-size-s);padding: 0.5em;}
ul.facilities-list li dl.address{
  display: flex;
  margin: 0.7em 0;
  padding:0 0.5em;
  font-size: 16px;
}
ul.facilities-list li dl.address dt{
  width: 20%;
  text-align: center;
  height: fit-content;
  padding: 0.2em 0.8em;
  background-color: var(--cocoon-blue-gray-color);
  color: var(--cocoon-white-color);
}
ul.facilities-list li dl.address dd{margin-left:1em;padding:0.2em 0;}

/* 協力施設詳細 */
.facility-detail{display: flex; justify-content:space-between;}
.facility-detail table,
.facility-detail .googlemap{width: 47%;}

@media screen and (max-width: 480px) {
  .facility-detail{flex-direction: column;}
  .facility-detail table,
  .facility-detail .googlemap{width: 100%;}
}

/* 協力施設募集 */
@media screen and (min-width: 853px) {
  input[type="email"]{width: 35%;}
}
@media screen and (min-width: 481px) {
  input[type="tel"]{width: 35%;}
}
/* 必須ラベル */
.smf-item:has([data-validations~="required"]) .smf-item__label__text::after,
.swpm-form-row.required label::after {
	content: "必須";
	display: inline-block;
	padding: 5px 6px;
	color: #fff;
	background-color: crimson;
	font-size: 13px;
	font-weight: 700;
	line-height: 1;
	margin-left: 1em;
	border-radius: 4px;
}
.smf-action .smf-button-control__control[data-action="confirm"],
.smf-action .smf-button-control__control[data-action="complete"],
.smf-action .smf-button-control__control[data-action="back"] {
	border-radius:30px;
  font-size: var(--cocoon-default-text-size);
  font-family: "Kosugi Maru", sans-serif;
  letter-spacing: 0.1em;
}
.smf-action .smf-button-control__control[data-action="confirm"],
.smf-action .smf-button-control__control[data-action="complete"] {
	background: #2FA770;
  background: linear-gradient(110deg, #2FA770 10%, #41c2ce 50%, #2FA770 100%);
  background-size: 200% auto;
	color:white;
	border:none;
	padding:1em 80px;
  transition: .2s cubic-bezier(0.45, 0, 0.55, 1);
}
.smf-action .smf-button-control__control[data-action="confirm"]:hover,
.smf-action .smf-button-control__control[data-action="complete"]:hover{background-position: 100% 0;}
.smf-action .smf-button-control__control[data-action="back"] {
	padding:1em 40px;
	margin-bottom:1em;
}

/* スポーツ庁 */
figure.aligncenter .video-container{margin: 0 auto;}

/* ログイン・新規登録 */
#post-6 .swpm-join-us-link{margin-bottom: 2em;}
.swpm-registration-widget-form input[type="email"]{width: 95%;}
.swpm-submit-btn-default-style{
  border-radius:30px;
  font-size: var(--cocoon-default-text-size);
  font-family: "Kosugi Maru", sans-serif;
  letter-spacing: 0.1em;
	background: #2FA770;
  background: linear-gradient(110deg, #2FA770 10%, #41c2ce 50%, #2FA770 100%);
  background-size: 200% auto;
	color:white!important;
	border:none!important;
	padding:1em 80px!important;
  transition: .2s cubic-bezier(0.45, 0, 0.55, 1);
}
.swpm-submit-btn-default-style:hover{background-position: 100% 0;}

/* 会員登録について */
@media screen and (min-width: 853px) {
  #post-7 figure.wp-block-flexible-table-block-table table thead th.membertype{width: 20%;}
}

#post-7 .cocoon-block-timeline .timeline-title{
  padding-bottom: var(--wp--preset--spacing--40);
  margin-bottom: var(--wp--preset--spacing--40);
  position: relative;
}
#post-7 .cocoon-block-timeline .timeline-title::before,
#post-7 .cocoon-block-timeline .timeline-title::after {
  content: '';
  position: absolute;
  margin:auto;
  left: 0;
  bottom: 0;
  width: 2em;
  background-color: var(--cocoon-thin-color);
  height: 5px;
  right: 2em; 
}
#post-7 .cocoon-block-timeline .timeline-title::before { 
  background-color:#2FA770;
  left:2em;
  width:4em;
}
#post-7 .cocoon-block-timeline ul.timeline li.timeline-item::before{content: none;}
#post-7 .cocoon-block-timeline ul.timeline li.timeline-item:not(:last-child){border-bottom: 2px dotted #2FA770;}
#post-7 .cocoon-block-timeline ul.timeline li.timeline-item .timeline-item-label{
  font-size: 5em;
  font-family: "Nunito";
  line-height: 1;
  color: #2FA770;
  padding: 0.1em 0;
}
#post-7 .cocoon-block-timeline ul.timeline li.timeline-item:not(:last-child) .timeline-item-label::after{
  font-family: "Font Awesome 5 Free";
  content: "\f063";
  font-weight: 900;
  display: block;
  font-size: 70% !important;
  margin-top: 0.3em;
}
#post-7 .cocoon-block-timeline ul.timeline li.timeline-item .timeline-item-content{border-left: 0;}
#post-7 .cocoon-block-timeline ul.timeline li.timeline-item .timeline-item-title{font-size: 21px;}
#post-7 .cocoon-block-timeline ul.timeline li.timeline-item .timeline-item-snippet figure figcaption{
  background-color: var(--cocoon-blue-gray-color);
  color: var(--cocoon-white-color);
  display: inline-block;
  margin-bottom: 0.5em;
  border-radius: 18px;
}
#post-7 .cocoon-block-timeline ul.timeline li.timeline-item .timeline-item-snippet figure table th{width:25%;}

/* マイページ */
div.swpm-login-widget-logged > div[class^="swpm-logged-"]:not(.swpm-logged-logout-link){
  display: flex;
  border-bottom: 1px solid var(--cocoon-custom-border-color);
  padding: 0.5em 0;
  margin: 0 25px;
}
div.swpm-login-widget-logged .swpm-logged-label{width:40%;}
div.swpm-login-widget-logged .swpm-logged-value{width:calc(100% - 40%);}
div.swpm-mypage-link{font-weight: bold;}
div.swpm-logged-logout-link,
div.swpm-profile-account-delete-section{margin-top: 2em;}
div.swpm-logged-logout-link a,
div.swpm-profile-account-delete-section a{text-decoration: none;display: block;line-height: 2.5!important;}
div.swpm-logged-logout-link a{background-color: #fca103;color:var(--_darker-color-gray)!important;text-align: center;}
div.swpm-profile-account-delete-section a{background-color: #fc1313;color:#FFF!important;}
div.swpm-logged-logout-link a:hover{background-color: #fc7D13;}
div.swpm-profile-account-delete-section a:hover{background-color: #cb0000;}

/* フッター */
.footer{margin-top: 0;padding-top: 0;}
.footer-widgets{
	background-color: var(--cocoon-light-grey-color);
  margin: 0 calc(50% - 50vw);
	width: 100vw;
}
.footer-widgets:not(:has(.footer-center):has(.footer-right)) > .footer-left{width: 100%;}
.footer-widgets:not(:has(.footer-right)) > .footer-left,
.footer-widgets:not(:has(.footer-right)) > .footer-center{width: 50%;}
.footer-widgets .widget_nav_menu ul{
  display: flex;
  justify-content:space-evenly;
  font-size: 14px;
}
.footer-widgets .widget_nav_menu ul li a:hover{background-color: transparent;color:#2FA770;}
.footer-widgets .widget_block .wp-block-social-links{margin-bottom: 0;}
.navi-footer-in > .menu-footer li{border-left: 1px solid var(--cocoon-text-color);}
.navi-footer-in > .menu-footer li:last-child{border-right: 1px solid var(--cocoon-text-color);}
.navi-footer-in a:hover{background-color: transparent;color:var(--cocoon-white-color)}
@media screen and (min-width: 853px) {
  .footer-bottom.fdt-left-and-right .footer-bottom-content{flex-direction:row-reverse;}
}
@media screen and (max-width: 480px) {
  .footer-bottom{margin-top: 0;padding:0;}
  .navi-footer-in > .menu-footer li.menu-item{border: 1px solid #333;margin: -1px 0 0 -1px;}
  .navi-footer-in > .menu-footer li.menu-item a,
  .copyright{line-height: 3;}
}