@charset "utf-8";
/*
Theme Name: amagasaki chiiki club
Version: 1.0
*/
@import url('https://fonts.googleapis.com/css2?family=M+PLUS+1p:wght@100;300;400;500;700;800;900&family=Noto+Sans+JP:wght@100..900&display=swap');


/*
html5doctor.com Reset Stylesheet
v1.4
2009-07-27
Author: Richard Clark - http://richclarkdesign.com
*/

html, body, div, span, object, iframe,
h1, h2, h3, h4, h5, h6, p, blockquote, pre,
abbr, address, cite, code,
del, dfn, em, img, ins, kbd, q, samp,
small, strong, sub, sup, var,
b, i,
dl, dt, dd, ol, ul, li,
fieldset, form, label, legend,
table, caption, tbody, tfoot, thead, tr, th, td,
article, aside, dialog, figure, footer, header,
hgroup, menu, nav, section,
time, mark, audio, video {
	margin:0;
	padding:0;
	border:0;
	outline:0;
	font-size:100%;
	vertical-align:baseline;
	background:transparent;
}
* {
  -webkit-box-sizing: border-box;
     -moz-box-sizing: border-box;
          box-sizing: border-box;
}

article, aside, dialog, figure, footer, header,
hgroup, nav, section {
	display:block;
}

nav ul {
	list-style:none;
}

blockquote, q {
	quotes:none;
}

blockquote:before, blockquote:after,
q:before, q:after {
	content:'';
	content:none;
}
a {
	margin:0;
	padding:0;
	border:0;
	font-size:100%;
	vertical-align:baseline;
	background:transparent;
}
ins {
	background-color:#ff9;
	color:#000;
	text-decoration:none;
}
mark {
	background-color:#ff9;
	color:#000;
	font-style:italic;
	font-weight:bold;
}
del {
	text-decoration: line-through;
}
abbr[title], dfn[title] {
	border-bottom:1px dotted #000;
	cursor:help;
}
table {
	border-collapse:collapse;
	border-spacing:0;
}
hr {
    display:block;
    height:1px;
    border:0;
    border-top:1px solid #cccccc;
    margin:1em 0;
    padding:0;
}
input, select {
	vertical-align:middle;
}
img{
	line-height:1;
	vertical-align:bottom;
}

/************** layout base ********************/
.clearfix:after {
  content: "";
  clear: both;
  display: block;
}

img{ max-width:100%;}

a{text-decoration:none; color:#000000;}
a:hover{text-decoration: none;}
a:link{}

a:visited{color:#0d5bab;}

/* ボタンrollover */
a:hover img{
   opacity:0.8;
}

sup {
	line-height: 100%;
	font-size:10px;
	vertical-align: 0.4em;
}
sub{
	line-height: 100%;
	font-size:10px;
	vertical-align: -0.1em;
}

.txtLeft{text-align:left;}
.txtRight{text-align:right;}
.txtCenter{text-align:center;}

.fw{font-weight:bold !important;}
.f10{ font-size:10px !important;}
.f11{ font-size:11px !important;}
.f12{ font-size:12px !important;}
.f13{ font-size:13px !important;}
.f14{ font-size:14px !important;}
.f15{ font-size:15px !important;}
.f16{ font-size:16px !important;}
.f17{ font-size:17px !important;}
.f18{ font-size:18px !important;}
.f20{ font-size:20px !important;}
.f22{ font-size:22px !important;}
.f24{ font-size:24px !important;}

.txtRed{ color:#D80000;}

.fLeft{ float:left;}
.fRight{ float:right;}

.mTop0{ margin-top:0 !important;}
.mTop5{ margin-top:5px !important;}
.mTop10{ margin-top:10px !important;}
.mTop15{ margin-top:15px !important;}
.mTop20{ margin-top:20px !important;}
.mTop25{ margin-top:25px !important;}
.mTop30{ margin-top:30px !important;}
.mTop35{ margin-top:35px !important;}
.mTop40{ margin-top:40px !important;}
.mTop45{ margin-top:45px !important;}
.mTop50{ margin-top:50px !important;}
.mTop55{ margin-top:55px !important;}
.mTop60{ margin-top:60px !important;}

.mBtm0{ margin-bottom:0 !important;}
.mBtm5{ margin-bottom:5px !important;}
.mBtm10{ margin-bottom:10px !important;}
.mBtm15{ margin-bottom:15px !important;}
.mBtm20{ margin-bottom:20px !important;}
.mBtm25{ margin-bottom:25px !important;}
.mBtm30{ margin-bottom:30px !important;}
.mBtm35{ margin-bottom:35px !important;}
.mBtm40{ margin-bottom:40px !important;}
.mBtm45{ margin-bottom:45px !important;}
.mBtm50{ margin-bottom:50px !important;}
.mBtm55{ margin-bottom:55px !important;}
.mBtm60{ margin-bottom:60px !important;}
.mBtm70{ margin-bottom:70px !important;}
.mBtm80{ margin-bottom:80px !important;}
.mBtm90{ margin-bottom:90px !important;}
.mBtm100{ margin-bottom:100px !important;}

.pTop0{ padding-top:0 !important;}
.pTop5{ padding-top:5px !important;}
.pTop10{ padding-top:10px !important;}
.pTop15{ padding-top:15px !important;}
.pTop20{ padding-top:20px !important;}
.pTop25{ padding-top:25px !important;}
.pTop30{ padding-top:30px !important;}
.pTop35{ padding-top:35px !important;}
.pTop40{ padding-top:40px !important;}
.pTop45{ padding-top:45px !important;}
.pTop50{ padding-top:50px !important;}

.pBtm0{ padding-bottom:0 !important;}
.pBtm5{ padding-bottom:5px !important;}
.pBtm10{ padding-bottom:10px !important;}
.pBtm15{ padding-bottom:15px !important;}
.pBtm20{ padding-bottom:20px !important;}
.pBtm25{ padding-bottom:25px !important;}
.pBtm30{ padding-bottom:30px !important;}
.pBtm35{ padding-bottom:35px !important;}
.pBtm40{ padding-bottom:40px !important;}
.pBtm45{ padding-bottom:45px !important;}
.pBtm50{ padding-bottom:50px !important;}
.pBtm55{ padding-bottom:55px !important;}
.pBtm60{ padding-bottom:60px !important;}

/************** layout base ********************/
:root{
  scroll-padding-top: 94px;
}
html {
	font-size: 62.5%;
	scroll-behavior: smooth;
}
body{
	background: #ffffff;	
	font-family: "Noto Sans JP", sans-serif;
	font-optical-sizing: auto;
  font-size: 1.6rem;
	font-weight: 400;
	font-style: normal;
	text-align: left;
	line-height:1.67;
	color: #222222;
}

ol,ul {
	list-style:none;
}

p,dt,dd,li,td,th{
	font-size:14px;
}

div,p,dl{
	text-align:left;
}

h1,h2,h3,h4,h5,h6{
	font-size: 1.6rem;
	font-weight: 700;
}

:root{	
 --base:#222222;
	--blue: #2cc3de;
	--blueL: #eafeff;
	--green: #8dce00;
	--greenRGB: 141, 206, 0;
	--yellow: #ffea00;
	--yellowL: #fff799;
	--orange: #ffb400;
	--grayL: #f5f5f5;
	
}
.bgGrd{
	background: linear-gradient(to right, #0074e0 0%, #2cc3de 100%);
}

/*------------------ list style----------------*/
.numberList{
	padding:0 0 0 18px;	
}
.numberList li{
	list-style:decimal outside;
	padding:0 0 5px 0;
}

.discList{
	padding:0 0 0 18px;
}
.discList li{
	list-style:disc outside;
	padding:0 0 2px 0;
}

.indentList li{
	padding-left:1em;
	text-indent:-1em;
}


/* common
---------------------------------------------------------------------------- */
body{
}
.inner{
	width: min(100%, 1280px);
	margin: 0 auto;
}
@media screen and (max-width: 768px) {
	.pc{display: none;}
	.inner{
		width: min(90%, 1280px);
		margin: 0 auto;
	}
}/* //end for SP */
@media screen and (min-width: 769px) {
	.sp{display: none;}
}/* //end for PC */

/*font*/
.fontMplus{
  font-family: "M PLUS 1p", sans-serif;
  font-weight: 700;
  font-style: normal;
}



/* header
---------------------------------------------------------------------------- */
header{ 
   position: fixed;
   top: 0;
   left: 0;
   right: 0;
   z-index: 1000;
   width: 100%;
   text-align: center;
   background: rgba(255, 255, 255, 0.95);
}
header .inner{
   position: relative;
   display: flex;
   justify-content: space-between;
}
#logo{
	display: grid;
	align-items: center;
	width: min(36vw,270px);
	height: auto;
	line-height: 0;
}
#logo a{
	display: block;
}
@media screen and (max-width: 768px) {
header .inner{
	height: 60px;
	display: grid;
	align-items: center;
}
}/* //end for SP */
@media screen and (min-width: 769px) {
}/* //end for PC */


/* gNavi
---------------------------------------------------------------------------- */
.gnavi{
	position: relative;
	flex: 1;
}
.gnavi ul{
	display: flex;
    justify-content: end;
	align-items: center;
	gap: 20px 2.3%;
}
.gnavi ul li{ 
	text-align: center;
}
.gnavi ul li a{
	color: #000000;
	font-weight: bold;
}
.gnavi ul li.email a{
	display: block;
	padding: 25px 10px;
	border: #000000 solid;
	border-width: 0 2px;
}
.gnavi ul li.email img{
	display: block;
	margin: 0 auto 10px;
	width: 26px;
	height: 16px;
}
@media screen and (max-width: 768px) {
.gnavi {
	position: fixed;
	right: -100vw;
	top: 0;
	width: 100%;
	height: 100vh;
	padding-bottom: 140px;
	transition: all 0.6s;
	z-index: 100;
	overflow-y: auto;
	background: var(--base);
}
.gnavi.active{
  right: 0;
}
.gnavi ul{
  padding: 60px 0 0 0;
	width: 100%;
	display: block;
}
.gnavi ul li:not(.email){
 border-bottom: 1px solid #000;
 width: auto;
}
.gnavi ul li a{
  display: block;
  padding: 0.8em 4%;
  font-size: 16px;
  color: #000;
}
.gnavi ul li.email a{
	margin: 20px auto 0;
	width: min(80%, 200px);
	border-width: 2px;
}
}/* //end for SP */
@media screen and (min-width: 769px) {
}/* //end for PC */

/*		menu
-----------------------------*/

/* =======================================
	.menu
========================================== */
@media screen and (max-width: 768px) {
.menu {
      position: absolute;
      right: -5vw;
      top: 0;
      width: 60px;
      height: 60px;
      cursor: pointer;
      z-index: 101;
  background: #000;
}
.menu span {
      position: absolute;
      left: 18px;
      width: 24px;
      height: 2px;
      background-color: #fff;
      transition: all 0.6s;
      border-radius: 50em;
}

.menu span.menuLine01 {
      top: 21px;
}
.menu span.menuLine02{
      top: 28px;
}
.menu span.menuLine03{
      top: 35px;
}
.menu.active  span.menuLine01{
      transform: rotate(45deg);
      top: 30px;
}
.menu.active  span.menuLine02{
      width: 0;
      left: 50%;
}
.menu.active  span.menuLine03 {
      transform: rotate(-45deg);
      top: 30px;
} 

.menuBg {
  position: fixed;
  left: 0;
  top: 0;
  width: 100vw;
  height: 100vh;
  z-index: 99;
  background-color: #fff;
  opacity: 0;
  visibility: hidden;
  transition: all 0.6s;
  cursor: pointer;
}
.menuBg.active {
    opacity: 0.9;
    visibility: visible;
}
}/* //end for SP */
@media screen and (min-width: 769px) {
}/* //end for PC */


/* footer
---------------------------------------------------------------------------- */
footer{
   background: var(--blue);
   padding: 70px 0;
}
.footerWrap{
	display: flex;
	align-items: center;
	justify-content: space-between;
}
.foot_logo img{
	width: min(60%,258px);
	height: auto;
}
.foot_logo span{
  color: #fff;
  display: block;
}
.footerInfo {
	margin-top: 14px;
	display: flex;
	gap: 14px 26px;
  align-items: baseline;
}
.footerInfo a.tel{
	background: url("images/ic_foot_tel.png") no-repeat left center / 1em 1em;
	padding-left: 40px;
	color: #fff;
	font-size: 3.6rem;
	line-height: 1em;
	font-weight: 700;
  display: block;
  margin-bottom: 10px
}
.footerInfo a.mobile{
	background: url("images/ic_foot_mobile.png") no-repeat left center / 1em 1em;
	padding-left: 40px;
	color: #fff;
	font-size: 3.6rem;
	line-height: 1em;
	font-weight: 700;
}
.footerInfo .note{
	font-size: 14px;
	line-height: 1.43em;
	color: #fff;
}

#footerContact a{
	--btnColor: var(--blue);
	position: relative;
	display: grid;
	align-items: center;
	border: 2px solid var(--btnColor);
	border-radius: 6px;
	background: #fff;
	box-shadow: 0 3px 0 0 rgba(12, 174, 203, 0.5);
	width: min(100%, 350px);
	height: 74px;
	padding: 0 28px;
	font-weight: bold;
	text-align: center;
	font-size: 1.8rem;
	color: var(--btnColor);
}
#footerContact a span{
	display: inline-block;
	background: url(images/ic_foot_mail.png) no-repeat left 1px / 31px 21px;
	padding-left: 38px;
	line-height: 1.4;
}
@media screen and (max-width: 768px) {	
.footerWrap{
	display: block;
}
.footerInfo {
	margin-top: 14px;
	display: block;
}
#footerContact{
	margin-top: 20px;
}
#footerContact a{
	font-size: min(4.5vw,1.8rem);
	padding: 0 1.5em;
}
.footerInfo .note{
	margin-top: 10px;
	margin-left: 0 !important;
	text-indent: 0 !important;
}
}/* //end for SP */
@media screen and (min-width: 769px) {
}/* //end for PC */




/* pageTop
---------------------------------------------------------------------------- */
#pageTop{
   display: none;
   position: fixed;
   right: 0;
   bottom: 190px;
   z-index: 1000;
}
#pageTop a{
	position: relative;
   display: inline-block;
   padding: 12px 20px 8px 20px;
   border: 1px solid #fff;
   border-radius: 20px 0 0 20px;
   background: rgba(var(--greenRGB),0.9);
   font-size: 1.3rem;
   color: #fff;
   text-align: center;
}
#pageTop a::before {
    content: "";
    display: block;
    border-style: solid;
    border-color: var(--btnColor);
    border-width: 0 2px 2px 0;
    width: 6px;
    height: 6px;
	margin: 0 auto;
    transform: rotate(45deg) translateY(-50%);
}


/* common
---------------------------------------------------------------------------- */

/*		title
-----------------------------*/
.h2Title{
	font-size: 36px;
  font-family: "M PLUS 1p", sans-serif;
}
.slash{
    display: flex;
    justify-content: center;
    align-items: end;
    gap: 0 1em;
	color: #fff;
}
.slash::before,
.slash::after{
	content: "";
	display: block;
	width: 0px;
	height: 1.67em;
	border-right: 2px solid #fff;
}
.slash::before{
	transform: rotate(-45deg);
}
.slash::after{
	transform: rotate(45deg);
}
@media screen and (max-width: 768px) {
.h2Title{
	font-size: 20px;
}
}/* //end for SP */
@media screen and (min-width: 769px) {
}/* //end for PC */


/*		btn
-----------------------------*/

/* btn */
.btnWrap{
	text-align: center;
	gap: 20px 2.65%;
	display: flex;
	justify-content: center;
}
.btn,
.kindSearch .cat-item a{
	--btnColor: var(--blue);
	--btnColorBg: var(--blueL);
	position: relative;
	display: grid;
	align-items: center;
	border: 2px solid var(--btnColor);
	border-radius: calc(infinity * 1px);
	background: #fff;
	width: min(100%, 425px);
	height: 74px;
	padding: 0 1em;
	font-weight: bold;
	text-align: center;
	font-size: 1.8rem;
	color: var(--btnColor);
}
.kindSearch .cat-item a{
  height: 55px;
  font-size: 1.4rem;
  color: var(--blue);
}
.btn span::after{
	position: absolute;
	right: 1.3em;
	top: 50%;
	content: "";
	display: inline-block;
	border-style: solid;
	border-color: var(--btnColor);	
	border-width: 2px 2px 0 0;
	width: 7px;
	height: 7px;
   transform: rotate(45deg) translateY(-50%);
}
.kindSearch .cat-item a::after{
  position: absolute;
	right: 1.3em;
	top: 50%;
	content: "";
	display: inline-block;
	border-style: solid;
	border-color: var(--btnColor);	
	border-width: 2px 2px 0 0;
	width: 7px;
	height: 7px;
   transform: rotate(45deg) translateY(-50%);
}
.btn.btnS{
	width: 250px;
	height: 50px;
	box-shadow: 0 3px 0 0 rgba(12, 174, 203, 0.5);
}
.btn.btnSS{
	width:180px;
	height: 50px;
	box-shadow: 0 3px 0 0 rgba(12, 174, 203, 0.5);
}
.btn.btnColor{
	background: var(--btnColorBg);
	border: none;
}
.btn.bgGrd{
	background: linear-gradient(to right, #0074e0 0%, #2cc3de 100%);
	border: none;
	color: #fff;
}
.btn.bgGrd span::after{
	border-color: #fff;
}
/* ボタン全幅 */
.btnL{
	display: block;
}

/* hover */
.btn:hover,
.kindSearch .cat-item a:hover{
	background: linear-gradient(to right, #0074e0 0%, #2cc3de 100%);
	border: none;
	color: #fff;
	transition: 0.3s;
}
.btn:hover span::after,
.kindSearch .cat-item a:hover::after{
	border-color: #fff;
}
@media screen and (max-width: 768px) {
.btnWrap{
	flex-wrap: wrap;
}
.btn{
	height: 74px;
	font-size: 1.6rem;
	color: var(--btnColor);
	padding: 0 1.5em;
}
}/* //end for SP */
@media screen and (min-width: 769px) {
  .btnWrap.colm3 .btn{
    width: min(100%, 400px);
  }
}/* //end for PC */

/* visited */
.btn:visited{
	color: var(--btnColor);
}
.btn:hover:visited{
	color: #fff;
}

/* Top
---------------------------------------------------------------------------- */


/*		topMvWrap
-----------------------------*/
.topMvWrap{
	position: relative;
	background-color: var(--blue);
	border-radius: 0 0 10vw 0;
	padding: 0 0 160px 0;
}
.topMvWrap::before {
	position: absolute;
	top: 0;
	right: 0;
	content: "";
	display: block;
	width: min(calc(1184/1280*100vw),1184px);
	height: min(calc(758/1280*100vw),758px);
	background: url('images/bg_stripe.png') no-repeat right bottom/ min(calc(1184/1280*100vw),1184px) auto;
}
.topMvWrap::after{
	position: absolute;
	top: 100%;
	left: 0;
	right: 0;
	content: "";
	display: block;
	width: 100%;
	height: min(calc(1222/1480*100vw),1222px);
	background: url('images/top_bg_stripe01.png') no-repeat left top / 671px auto;
}

.co-bnrs{
  margin: 40px auto 0;
  width: calc(1226/1280*100%);
  display: flex;
  gap:10px;
}
@media screen and (max-width: 768px) {
.topMvWrap{
	padding: 0 0 160px 0;
}
.topMvWrap::before {
	width: 92.5%;
	height: calc(70vw + 30px);
}
.topMvWrap::after{
	height: min(calc(1222/1480*100vw),1222px);
	background: url('images/top_bg_stripe01.png') no-repeat left top / 336px auto;
}
}/* //end for SP */
@media screen and (min-width: 769px) {
}/* //end for PC */

/*		topMv
-----------------------------*/
#topMv {
	position: relative;
}

#topMvImg{
	display: flex;
	align-items: start;
}
#topMvImg figure{
	width: calc((508/1280)*100%);
}
#topMvImg figure:nth-of-type(2){
	width: calc((436/1280)*100%);
}
#topMvImg figure:nth-of-type(3){
	width: calc((336/1280)*100%);
}
#topMv p{
	position: absolute;
	right: 2.3%;
	bottom: 1.6%;
	width: calc((768/1280)*100%);
}
@media screen and (max-width: 768px) {
#topMvImg figure{
	width: 54%;
}
#topMvImg figure:nth-of-type(2){
	width: 46%;
}
#topMvImg figure:nth-of-type(3){
	width: 0;
}
#topMv p{
	right: 2.3%;
	bottom: 1.6%;
	width: min(80%, 600px);
}
}/* //end for SP */
@media screen and (min-width: 769px) {
}/* //end for PC */

/*		topAbout
-----------------------------*/
#topAbout{
	margin-top: 42px;
}
#topAbout .h2Title{
	color: var(--blue);
}
#topAbout .h2Title span.bg{
	display: inline-block;
	background: url(images/top_baloon01.png) no-repeat left top / 100% auto;
	padding: 20px 20px 46px 55px;
	width: 477px;
}
#topAbout .h2Title .fontS{
	font-size: calc(30/36*1em);
}
.topAboutBox{
	border: 1px solid #ffff;
	border-radius: 30px;
	width: calc(1226/1280*100%);
	margin: -70px 0 0 auto;
	padding: 75px 0 35px;
}
.topAboutBox p{
	margin: 0 auto;
	width: calc(980/1226*100%);
	color: #fff;
	font-size: 20px;
	line-height: 1.9em;
}
.topAboutBox .btnWrap{
	margin-top: 10px;
	padding-right: calc(100/1226*100%);
  text-align: right;
}
.topAboutBox .btnWrap .btn{
	margin-left: auto;
}
@media screen and (max-width: 768px) {
#topAbout{
	margin-top: 42px;
}
#topAbout .h2Title span.bg{
	padding: 10px 10px 23px 30px;
	width: 300px;
	height: 74px;
}
.topAboutBox{
	width: calc(1226/1280*100%);
	margin: -35px 0 0 auto;
	padding: 38px 0 20px;
}
.topAboutBox p{
	width: calc(980/1226*100%);
	font-size: 16px;
}
.topAboutBox .btnWrap{
	margin-top: 10px;
}
.topAboutBox .btnWrap .btn{
	margin-left: auto;
}
}/* //end for SP */
@media screen and (min-width: 769px) {
}/* //end for PC */

/*		#topMovie
-----------------------------*/
#topMovie{
	position: relative;
}
.topMovieInner{
	width: min(90%, 900px);
	margin: -120px auto 0;
}

/*		topClubs
-----------------------------*/
#topClubs{
	position: relative;
	padding: 80px 0;
	background: url(images/top_bg_circle01.png) no-repeat left top / 497px auto;
}
#topClubsInner{
	display: flex;
	align-items: center;
	gap: 30px 4.69%;
}
.topClubsTxts{
	flex: 1;
}
.topClubsTxts .h2Title{
	margin-bottom: 30px;
	font-size: 4rem;
}
.topClubsTxts p{
	margin-bottom: 26px;
	font-size: 1.8rem;
	line-height: 1.67em;
}
.topClubsTxts .btnWrap{
	margin-top: 20px;
}
@media screen and (max-width: 768px) {
#topClubs{
	padding: 80px 0;
	background: url(images/top_bg_circle01.png) no-repeat left top / 497px auto;
}
#topClubsInner{
	display: block;
}
.topClubsTxts .h2Title{
	margin-bottom: 30px;
	font-size: 3rem;
}
.topClubsTxts p{
	margin-bottom: 26px;
	font-size: 1.8rem;
}
.topClubsTxts .btnWrap{
	margin-top: 20px;
}
}/* //end for SP */
@media screen and (min-width: 769px) {
}/* //end for PC */

/*.clubListWrap*/
.clubListWrap{
	position: relative;
	padding: 45px 0;
}
.clubListWrap::before{
	position: absolute;
  top: 0;
  right: 0;
  left: 0;
	content: "";
	display: block;
	width: 84.375%;
	height: 100%;
	background-color: var(--orange);
	border-radius: 30px;
	margin: 0 auto;
	z-index: 0;
}
.clubListWrap h3{
    position: relative;
	margin-bottom: 1.25em;
	font-size: 2.4rem;
}
.clubList{
    position: relative;
	display: flex;
	flex-wrap: wrap;
    justify-content: center;
	gap: 27px;
}
.clubList li{
	width: min(calc(92.8%/3), 220px);
	background-color: #fff;
	border-radius: 30px;
	box-shadow: 0 0 10px rgba(0, 0, 0, 0.2);
}
.clubList li a{	
	display: block;
}
.clubList li figure{
	height: 150px;
	padding: 15px 0;
}
.clubList li figure img{
	width: 100%;
	height: 100%;
	object-fit: contain;
	margin: 0 auto;
}
.clubList li .clubName{
	display: grid;
	align-items: center;
	background-color: var(--blue);
	border-radius: 0 0 30px 30px;
	padding: 0.5em 0;
	min-height: 4.35em;
	color: #fff;
	text-align: center;
	font-weight: 500;
}
.clubListWrap .btnWrap{
	margin-top: 24px;
}
@media screen and (max-width: 768px) {
.clubListWrap{
	padding: 45px 0;
}
.clubListWrap::before{
	width: 84.375%;
	border-radius: 30px;
}
.clubListWrap h3{
	font-size: 2rem;
}
.clubList{
	gap: 13px 3.6%;
}
.clubList li{
	width: min(calc(96.4%/2), 220px);
	background-color: #fff;
	border-radius: 30px;
	box-shadow: 0 0 10px rgba(0, 0, 0, 0.2);
}
.clubList li a{	
	display: block;
}
.clubList li figure{
	height: 150px;
	padding: 15px 0;
}
.clubList li figure img{
	width: 100%;
	height: 100%;
	object-fit: contain;
	margin: 0 auto;
}
.clubList li .clubName{
	display: grid;
	align-items: center;
	background-color: var(--blue);
	border-radius: 0 0 30px 30px;
	padding: 0.5em 0;
	min-height: 4.35em;
	color: #fff;
	text-align: center;
	font-weight: 500;
}
.clubListWrap .btnWrap{
	margin-top: 24px;
}
}/* //end for SP */
@media screen and (min-width: 769px) {
}/* //end for PC */



#topClubs .clubListWrap{
	width: 61%;
}
#topClubs .clubListWrap::before{
    width: 92.1875%;
    margin: 0 0 0 auto;
}
#topClubs .clubListWrap::after{
	position: absolute;
	top: 0;
	left: calc(100% - 30px);
	content: "";
	display: block;
	width: calc((100vw - 1300px)/2 + 30px);
	height: 100%;
	background-color: var(--orange);
	border-radius: 0 30px 30px 0;
	margin: 0 auto;
	z-index: -1;
}
#topClubs .clubList li{	
    width: min(calc((100% - 54px) / 3), 240px);
}
#topClubs .clubList li figure{
	height: 170px;
	padding: 15px 0;
}
@media screen and (max-width: 768px) {
#topClubs .clubListWrap{
	width: 100%;
	margin-top: 30px;
}
#topClubs .clubListWrap::before{
    width: 92.1875%;
    margin: 0 0 0 auto;
}
#topClubs .clubListWrap::after{
	left: calc(100% - 30px);
	width: calc((100vw - 100%)/2 + 30px);
	border-radius: 0 30px 30px 0;
}
#topClubs .clubList li{	
    width: min(calc((100% - 27px) / 2), 240px);
}
#topClubs .clubList li figure{
	height: 170px;
	padding: 15px 0;
}
}/* //end for SP */
@media screen and (min-width: 769px) {
}/* //end for PC */

/*		topLocal
-----------------------------*/
#topLocal{
	position: relative;
	padding: 70px 0 calc(100px + 10vw);
	background: var(--grayL) url(images/top_bg_stripe02.png) no-repeat right bottom/742px auto;
	border-radius: 10vw 0 0 0;
}
#topLocal .inner::before{
	position: absolute;
	top: min(-4vw,-60px);
	right: 0;
	content: "";
	display: inline-block;
	width: 419px;
	height: 494px;
	background: url('images/top_bg_circle02.png') no-repeat top right / 100% ;
}
#topLocal .h2Title{
	position: relative;
	margin-bottom: 30px;
	text-align: center;
}
#topLocal .lead{	
	position: relative;
    margin-bottom: 6px;
    font-size: 1.8rem;
    line-height: 1.67em;
	text-align: center;
}
#topLocal .centerWrap{
	position: relative;
	text-align: center;
}
#topLocal .note{
	display: inline-block;
    font-size: 1.5rem;
    line-height: 1.6em;
	text-align: left;
}
#topLocal .clubListWrap{
	margin-top: 25px;
}
#topLocal .clubListWrap + .btnWrap{
	margin-top: 40px;
}

/*		topCoaches
-----------------------------*/
#topCoaches{
	position: relative;
    background: var(--green) url(images/top_bg_stripe03.png) no-repeat left top / 640px auto;
    border-radius: 0 10vw 0 0;
	margin-top: -10vw;
    padding: 60px 0 calc(100px + 10vw);
}
.coachBoxWrap{
  display: grid;
  grid-template-columns: repeat(3, 1fr);
	gap: 30px 3%;
}
.coachBox{
	position: relative;
  display: flex;
  flex-direction: column;

}
.coachBox .h2Title{
	position: relative;
	margin-bottom: 0.3em;
	padding-top: 10px;
	padding-left: 90px;
	color: #fff;
	font-size: 3rem;
	z-index: 2;
}
.coachBox .h2Title .slash{
	justify-content: start;
}
.coachBox .h2Title .slash::before{
	display: none;
}
.coachBox .h2Title .slash::after{
	border-right: 2px dotted #fff;
}
.coachBox .h2Title::before{
	position: absolute;
	top: 0;
	left: 0;
	content: "";
	display: block;
	width: 80px;
	height: 84px;
	background-repeat: no-repeat;
	background-position: left top;
	background-size: 100% 100%;
	background-image: url(images/ic_ttl_yellow.png);
}
.coachBox:nth-of-type(2) .h2Title::before{
	background-image: url(images/ic_ttl_blue.png);
}
.coachBox .imgTxtBox{
	position: relative;
	padding: 30px;
	background-color: #fff;
	box-shadow: 0 0 10px rgba(0, 0, 0, 0.2);
	border-radius: 30px;
	z-index: 1;
height: 100%
}
.coachBox .imgTxtBox figure{
	margin-bottom: 20px;
	border-radius: 20px;
	overflow: hidden;

}

.coachBox .imgTxtBox h3{
	font-size: 2.2rem;
	font-weight: 700;
	line-height: 1.64;
}
.coachBox .imgTxtBox p{
	font-size: 1.8rem;
	line-height: 1.67;
}
.coachBox .imgTxtBox .btnWrap{
margin-top: 30px;
	width: auto;
flex-direction: column
}
.coachBox .imgTxtBox .btnWrap .btn{
	height: 70px;
	font-size: 1.6rem;
}
@media screen and (max-width: 768px) {
#topCoaches{
    background: var(--green) url(images/top_bg_stripe03.png) no-repeat left top / 320px auto;
    border-radius: 0 10vw 0 0;
	margin-top: -10vw;
    padding: 60px 0 calc(100px + 10vw);
}
.coachBoxWrap{
  grid-template-columns: 1fr;
}
.coachBox{
}
.coachBox .h2Title{
	padding-top: 4px;
	padding-left: 90px;
	font-size: 2.4rem;
}
.coachBox .h2Title::before{
	left: 20px;
	width: 60px;
	height: 63px;
}
.coachBox .imgTxtBox{
	position: relative;
    flex-grow: 1;
	padding: 30px;
	background-color: #fff;
	box-shadow: 0 0 10px rgba(0, 0, 0, 0.2);
	border-radius: 30px;
	z-index: 1;
}
.coachBox .imgTxtBox figure{
	margin-bottom: 20px;
	border-radius: 20px;
	overflow: hidden;
}
.coachBox .imgTxtBox h3{
	font-size: 1.8rem;
}
.coachBox .imgTxtBox p{
	font-size: 1.6rem;
}
.coachBox .imgTxtBox .btnWrap{
	position: relative;
	bottom: 0px;
	right: 0px;
	left: 0px;
	width: 100%;
	margin-top: 20px;
}
.coachBox .imgTxtBox .btnWrap .btn{
    width: 100%;
	height: 70px;
	font-size: min(3.8vw,1.6rem);
}
}/* //end for SP */
@media screen and (min-width: 769px) {
}/* //end for PC */

/*		topNews
-----------------------------*/
#topNews{
	position: relative;
    background: var(--yellowL) url(images/top_bg_stripe04.png) no-repeat right top / 640px auto;
    border-radius: 10vw 0 0 0;
	margin-top: -10vw;
    padding: 60px 0 100px;
}
#topNews .h2Title{
	margin-bottom: 26px;
}
#topNews .h2Title .slash{
	color: var(--blue);	
    text-align: center;
}
#topNews .h2Title .slash::before,
#topNews .h2Title .slash::after{
	border-color: var(--blue);
}
.newsListWrap{
	background-color: #fff;
	border: 1px solid var(--blue);
	border-radius: 30px;
	padding: 30px;
}
.newsList{
	width: min(100%, 1080px);
	margin: 0 auto;
}
.newsList li{
	display: flex;
	align-items: start;
	gap: 10px;
}
.newsList li + li{
	margin-top: 23px;
	padding-top: 23px;
	border-top: 1px dotted #666666;
}
.newsList li.date{
	font-size: 1.4rem;
	color: #666666;
}
.newsList li .cat{
	background-color: #5177f3;
	padding: 0.3em 0.8em 0.4em;
	border-radius: calc(infinity * 1px);
	font-size: 1.3rem;
	color: #fff;
	line-height: 1em;
}
.newsList li .catEXperience{
	background-color: #ff6b6b;
}
.newsList li p a{
	color: var(--blue);
}
.newsList li p{
	font-size: 1.6rem;
	flex: 1;
}


.newsListWrap .btnWrap{
	margin-top: 40px;
}
@media screen and (max-width: 768px) {
.newsList li{
	flex-wrap: wrap;
}
.newsList li + li{
	margin-top: 23px;
	padding-top: 23px;
}
.newsList li.date{
	font-size: 1.3rem;
}
.newsList li .cat{
	padding: 0.3em 0.8em 0.4em;
	font-size: 1.2rem;
}
.newsList li p{
	font-size: 1.4rem;
	width: 100%;
    flex: auto;
}


.newsListWrap .btnWrap{
	margin-top: 40px;
}
}/* //end for SP */
@media screen and (min-width: 769px) {
}/* //end for PC */


/* pgs
---------------------------------------------------------------------------- */
/*-----------------------------
	common
-----------------------------*/
body:not(#top) main{
	margin-top: 94px;
}
.mainTitle{
	background: url(images/bg_maintitle.png) no-repeat center center / cover;
	height: 180px;
	display: grid;
	align-items: center;
	text-align: center;
}
.mainTitle h2{
  font-family: "M PLUS 1p", sans-serif;
  font-weight: 700;
  font-style: normal;
  font-size: 45px;
  color: #fff;
}
@media screen and (max-width: 768px) {
body:not(#top) main{
	margin-top: 60px;
}
.mainTitle{
	height: 80px;
}
.mainTitle h2{
	font-size: 2.4rem;
}
}/* //end for SP */
@media screen and (min-width: 769px) {
}/* //end for PC */

/*.bnavi*/
.bnavi{
	padding: 1em 0;
}
.bnavi a{
	color: var(--blue);
}
.bnavi a::after{
	content: "";
	display: inline-block;
	border-style: solid;
	border-color: #000;	
	border-width: 1px 1px 0 0;
	margin-left: 4px;
	width: 5px;
	height: 5px;
   transform: rotate(45deg) translateY(-50%);
}
.bnavi a,
.bnavi span{
	display: inline-block;
	margin-right: 10px;
	font-size: 1.4rem;
}

.page section{
	margin-bottom: 50px;
}

.pgs p.note,
.pgs .note li{
	font-size: 83.3% !important;
	margin-left: 1em;
	text-indent: -1em;
}

/*-----------------------------
	club list
-----------------------------*/

#clubVideo{
  background: var(--yellowL);
  padding: 25px;
  text-align: center;
  margin-bottom: 42px;
}

#clubVideo h3{
  font-size: 2rem;
  margin-bottom: 15px;
  font-weight: bold;
  align-items: center; 
  display: flex; 
  justify-content: center; 
  color: #222
}

#clubVideo h3::before,
#clubVideo h3::after{
  background-color: #222; 
  border-radius: 3px; 
  content: "";
  height: 3px; /* 線の高さ */
  width: 40px; /* 線の長さ */
}
#clubVideo h3::before {
  margin-right: 10px; 
  transform: rotate(60deg); 
}
#clubVideo h3::after{
  margin-left: 10px; 
  transform: rotate(-60deg); 
}

#searchArea{
  display: flex;
  background: var(--green);
  margin-bottom: 35px;
}

#searchArea .mapSearch{
  width: 50%;
  border-radius: 0 120px 0 0;
  background: var(--orange);
  padding: 0 35px 40px 7%
}

#searchArea .mapSearch img{
  height: auto;
}

#searchArea .kindSearch{
   width: 50%;
  background: var(--green);
  padding: 0 7% 40px 35px
}

#searchArea h4{
	position: relative;
	margin-bottom: 0.3em;
	padding-top: 20px;
	padding-left: 120px;
	color: #fff;
	font-size: 3rem;
	z-index: 2;
}

#searchArea h4::before{
	position: absolute;
	top: -20px;
	left: 0;
	content: "";
	display: block;
	width: 112px;
	height: 112px;
	background-repeat: no-repeat;
	background-position: left top;
	background-size: 100% 100%;
	background-image: url(images/ic_ttl_yellow.png);
}
#searchArea .kindSearch h4::before{
	background-image: url(images/ic_ttl_blue.png);
}

#searchArea div.box{
  background: #fff;
  box-shadow: 0 0 10px rgba(0, 0, 0, 0.2);
  border-radius: 30px;
  max-width: 605px;
  width: 100%;
  padding: 25px;
  text-align: center;
	position: relative
}

#searchArea div.box p{
  font-size: 1.8rem;
  margin-bottom: 10px;
  text-align: center
}

#searchArea .kindSearch ul{
  display: flex;
  gap:20px 18px;
  flex-wrap: wrap
}
#searchArea .kindSearch ul li{
  width: calc((100% - 18px)/2)
}

#searchArea #map{
 position: relative;
 max-width: 427px;
 margin: 0 auto;
}
#searchArea .arealist{
	position: absolute;
	top:0;
	left:0;
	width: 100%;
	height: 100%
}
#searchArea .arealist > li{
	position: absolute;
	width: 73px;
	height: 75px;
	background-size:100% auto;
 background-repeat: no-repeat;
	cursor: pointer
}

#searchArea .arealist > li >span{
	display: none
}

#searchArea ul.eventList{
	margin-top: 80px;
  width: 200px;
  text-align: left;
  background: #fff;
  padding: 10px;
  border: 1px solid #2cc3de;
	display: none;
 position: relative;
 z-index: 3;
}
#searchArea ul.eventList.active{
	display: block;
}

#searchArea .arealist > li#map_chuou{
	left: 31%;
	top:50%;
	background-image: url("images/f_chuou.png") ;
	width: 64px;
}

#searchArea .arealist > li#map_muko{
	left: -5%;
	top:25.6%;
	background-image: url("images/f_muko.png");
}

#searchArea .arealist > li#map_tachibana{
	left: 32%;
	top:8%;
	background-image: url("images/f_tachibana.png") ;
 width: 64px;
}
#searchArea .arealist > li#map_ousho{
	left: 3.6%;
	top:56.2%;
	background-image: url("images/f_ousho.png") ;
 width: 64px;
}
#searchArea .arealist > li#map_oda{
	left: 64.8%;
	top:50.4%;
	background-image: url("images/f_oda.png");
}
#searchArea .arealist > li#map_sonoda{
	left: 60%;
	top:2.0%;
	background-image: url("images/f_sonoda.png") ;
 width: 64px;
}

@media screen and (max-width: 768px) {
 #searchArea .arealist > li#map_tachibana{
  left: 28%;
  top: 4%;
 }
 #searchArea #map_ousho ul.eventList{
  margin-left: -20px;
 }
 #searchArea #map_oda ul.eventList{
  margin-left: -75px;
 }
}/*-SP only-*/


#clubList{
  margin-bottom: 50px;
}

#clubList .tabs{
  display: flex;
  border-bottom: 2px solid var(--blue);
  gap:10px;
  margin-bottom: 18px;
}

#clubList .tabs li{
  border: 2px solid var(--blue);
  border-bottom: none;
  text-align: center;
  color: var(--blue);
  padding: 25px;
  border-radius: 12px 12px 0 0;
  cursor: pointer;
  font-size: 1.6rem;
  font-weight: bold;
  width: 100%;
}

#clubList .tabs li.active{
  background: var(--blue);
  color:  #fff
}
#clubList .listPanel{
  display: none
}
#clubList .listPanel.active{
  display: block
}
#clubList .listPanel ul.clubs{
  display: flex;
  gap:18px;
  flex-wrap: wrap;
}

#clubList .listPanel ul.clubs > li{
  width: calc((100% - 54px)/4);
  border: 1px solid var(--blue);
  padding: 20px;
  border-radius: 16px;
  
}
#clubList .listPanel ul.clubs li figure{
  border-radius: 16px;
  margin-bottom: 16px;
  overflow: hidden;
  height: 180px;
  display: flex;
  align-items: center;
}

#clubList .listPanel ul.clubs li figure img{
  object-fit: contain;
  object-position: center center
}

#clubList .listPanel ul.clubs li figure img{
  height: auto;
}

#clubList .listPanel ul.clubs li h5{
  font-size: 1.8rem;
  margin-bottom: 6px;
  
}

#clubList .listPanel ul.clubs li .infoList{
  margin-bottom: 20px;
}

#clubList .listPanel ul.clubs li .infoList li{
  font-size: 1.4rem
}

#clubList .listPanel ul.clubs li p{
  font-size: 1.6rem;
  line-height: 1.4
}

#clubList .h2Title{
  text-align: center;
margin-bottom: 30px;
  font-size: 28px;
}
#clubList .h2Title span{
  color: #222;
}
#clubList .h2Title .slash:before,
#clubList .h2Title .slash:after{
  border-color: #222;
}
#clubList h3{
 border-bottom: 1px var(--blue) solid;
 font-size: 2rem;
 margin-bottom: 15px;
}
#clubList .listPanel + h3{
 margin-top: 50px;
}

@media screen and (max-width: 768px) {
	#searchArea{
		background: #fff;
		flex-wrap: wrap;
	}
	#searchArea .mapSearch,
	#searchArea .kindSearch{
		border-radius: 0 70px 0 0;
		padding: 0 5% 40px;
		width: 100%;
	}
	#searchArea .mapSearch{
		padding-bottom: 110px;
	}
	#searchArea .kindSearch{
		margin-top: -70px;
	}
	#searchArea .mapSearch > .inner,
	#searchArea .kindSearch > .inner{
		width: 100%;
	}
	#searchArea .kindSearch div.box{
		padding: 25px 5%;
	}
	#searchArea .kindSearch .cat-item a{
		line-height: 1.4;
		padding: 0 1.5em 0 0.5em;
	}
	#searchArea .kindSearch .cat-item a::after{
		right: 1em;
	}
	#searchArea .kindSearch ul{
		gap: 12px 4%;
	}
	#searchArea .kindSearch ul li{
		width: 48%;
	}
	#searchArea div.box p{
		font-size: min(3.8vw,1.6rem);
	}
	#searchArea h4{
		font-size: 2.2rem;
		padding-top: 15px;
		padding-left: 95px;
	}
	#searchArea h4::before{
		top: -20px;
		width: 90px;
		height: 90px;
	}
	#clubList .tabs li{
		padding: 15px 5px;
	}
	#clubList .listPanel ul.clubs > li{
		width: 100%;
	}
}/* //end for SP */

/*-----------------------------
	club detail
-----------------------------*/
#clubBox{
  background: url("images/bg_clubdetail.png") no-repeat top left
}

#clubBox .inner{
  padding-top: 38px
}

.clubhead,
.clubinfo{
  width: 85%;
  max-width: 1080px;
  margin: 0 auto 35px;
}
.clubhead{
  padding-top: 36px;
}
@media screen and (min-width: 769px) {
.clubhead:has(figure){
 display: flex;
 justify-content: space-between;
}
}/*-PC only-*/
 .clubhead figure{
  width: 120px;
 }
.clubhead figcaption{
 font-size: 14px;
}
.clubinfo{
  margin-bottom: 50px;
}

.clubTxts h3{
  font-size: 3rem;
  font-weight: bold;
}
.infoList{
  display: flex;
 flex-flow: row wrap;
  gap:10px;
  margin-bottom: 38px;
}
.infoList li{
  border-radius: calc(Infinity * 1px);
    font-size: 1.6rem;
  line-height: 1;
  display: inline-block;
}

.infoList li.local{
  border: 1px solid #2cc3de;
  padding: 5px 10px;
  background: #fff;
  color: #2cc3de;
}

.infoList li.kind{
  border: 1px solid #0074e0;
  padding: 5px 10px;
  background: #0074e0;
  color: #fff;
}

.clubinfo{
  display: flex;
  gap:50px;
}

.clubinfo dl{
  max-width: 680px;
  display: flex;
  flex-wrap: wrap;
  width: 63%;
}

.clubinfo dl dt{
  background: #f0f0f0;
  width: 25%;
  border-bottom: 1px solid #cccccc;
  font-size: 1.8rem;
  padding: 15px 20px
}
.clubinfo dl dd{
  width: 75%;
  border-bottom: 1px solid #cccccc;
  font-size: 1.8rem;
  padding: 15px 20px
}

.clubinfo dl dt:last-child,
.clubinfo dl dd:last-child{
  border-bottom: none;
}

.clubinfo figure{
  max-width: 360px;
  width: calc(37% - 50px)
}
.clubActivity{
  background: var(--orange);
  padding: 45px 7.8% 50px;
  border-radius: 20px;
  margin-bottom: 50px
}

.clubActivity h4,
.clubCoach h4{
  font-size: 2.4rem;
  color: #fff;
  font-weight: bold;
  align-items: center; 
  display: flex; 
  justify-content: center; 
  margin-bottom: 30px;
}
.clubActivity h4::before,
.clubActivity h4::after,
.clubCoach h4::before,
.clubCoach h4::after{
  background-color: #fff; 
  border-radius: 3px; 
  content: "";
  height: 3px; /* 線の高さ */
  width: 40px; /* 線の長さ */
}
.clubActivity h4::before,
.clubCoach h4::before {
  margin-right: 10px; 
  transform: rotate(60deg); 
}
.clubActivity h4::after,
.clubCoach h4::after{
  margin-left: 10px; 
  transform: rotate(-60deg); 
}

.clubActivity p{
  font-size: 1.8rem;
}

.clubActivity ul{
  display: flex;
  gap:25px;
  flex-wrap: wrap;
  margin-top: 25px;
}

.clubActivity ul li{
  width: calc((100% - 50px)/3);
  border-radius: 20px;
  height: calc((75% - 35px)/3);
  overflow: hidden;
  display: flex;
  align-items: center
}

.clubActivity ul li video,
.clubActivity ul li img{
  width: 100%;
  height: auto
}

#cboxOverlay{
  background: rgba(0,0,0,0.78) !important
}

#video video#player,
#video-student video#player,
#video-coarch video#player,
#video-coarch2 video#player,
#video-certification video#player,
#video-certification2 video#player,
#video-certification3 video#player{
width: 100%;
}

.clubActivity ul li.movie{
  position: relative;
}

.clubActivity ul li.movie a{
  display: block;
  width: 100%;
  height: 100%;
  position: absolute;
  top:0;
  left: 0;
  background: url("images/btn_play.png") no-repeat;
  background-position: center;
  background-size: 44px;
  z-index: 10;
}

.clubActivity ul li.movie video{
  position: relative;
  z-index: 5
}

.clubCoach{
 background: var(--green);
  padding: 45px 7.8% 50px;
  border-radius: 20px;
  margin-bottom: 50px
}

.clubCoach ul{
  display: flex;
  gap:25px;
  flex-wrap: wrap;
  margin-top: 25px;
}

.clubCoach ul li{
  width: calc((100% - 25px)/2);
    box-shadow: 0px 4px 10px -5px rgba(0,0,0,.2);
border-radius: 20px;
  color: rgba(0,0,0,1.00);
  background: #fff;
  display: flex;
  gap:20px;
  padding: 25px;
}

.clubCoach ul li figure{
  width: 40%;
  max-width: 190px;
}

.clubCoach ul li dl.txt{
  width: calc(60% - 20px)
}

.clubCoach ul li dl.txt dt{
  font-size: 1.8rem;

}

.clubCoach ul li dl.txt dt:before{
  color: var(--blue);
  content: '●';
  display: inline;
}

.clubCoach ul li dl.txt dd{
  font-size: 1.6rem
}

@media screen and (max-width: 768px) {
	.clubhead,
	.clubinfo{
		width: 100%;
	}
	.clubhead{
		margin-top: 0;
		margin-bottom: 25px;
	}
 
 .clubhead figure{
  margin: 20px auto 0;
 }
	.clubTxts h3{
		font-size: 2.2rem;
	}
	.infoList{
		margin-top: 5px;
		margin-bottom: 0;
	}
	.infoList li{
		font-size: 1.4rem;
	}
	.clubinfo{
		flex-wrap: wrap;
	}
	.clubinfo dl{
		width: 100%;
	}
	.clubinfo dl dt,
	.clubinfo dl dd{
		font-size: 1.6rem;
		padding: 10px;
	}
	.clubinfo dl dt{
		width: 22%;
	}
	.clubinfo dl dd{
		width: 78%;
	}
	.clubinfo figure{
		width: 100%;
	}
	.clubActivity,
	.clubCoach{
		padding: 25px 5%;
	}
	.clubActivity h4,
	.clubCoach h4{
		font-size: 2rem;
		margin-bottom: 15px;
	}
	.clubActivity p{
		font-size: 1.6rem;
	}
	.clubActivity ul li,
	.clubCoach ul li{
		flex-wrap: wrap;
		width: 100%;
		height: auto;
	}
	.clubCoach ul li figure,
	.clubCoach ul li dl.txt{
		width: 100%;
	}
	.clubCoach ul li figure{
		margin-left: auto;
		margin-right: auto;
		max-width: 140px;
	}
	#clubBox + .btnWrap{
		width: min(90%, 1280px);
    margin: 0 auto;
	}
}/* //end for SP */

/*-----------------------------
	memberShip
-----------------------------*/
#memberHowto .inner{
	width: min(100%, 1000px);
}
#memberHowto .leadTxt{
	font-size: 22px;
	margin-top: 50px;
}
#memberHowto .stepBox{
	margin-bottom: 50px;
}
#memberHowto .stepBox h3{
	border-bottom: 2px solid var(--blue);
	font-size: 2.4rem;
	margin-bottom: 20px;
	padding-bottom: 12px;
}
#memberHowto .stepBox h3 span{
	background: var(--blue);
	border-radius: 10px;
	color: #fff;
	margin-right: 0.5em;
	padding: 5px 20px;
}
#memberHowto .stepBox .stepTxt{
	background: var(--blueL);
	border-radius: 10px;
	margin-bottom: 20px;
	padding: 20px 2%;
}
#memberHowto .stepBox p,
#memberHowto .stepBox li{
	font-size: 1.6rem;
}
#memberHowto .stepBox p.note,
#memberHowto .stepBox span.note,
#memberHowto .stepBox ul.note li,
#memberHowto .stepBox .stepTxt ol li{
	margin-left: 1em;
	text-indent: -1em;
}
#memberHowto .stepBox span.note{
	display: inline-block;
}
@media screen and (min-width: 769px) {
#memberHowto .stepBox .pcFlex {
	display: flex;
  align-items: flex-start;
  gap: 0 3%;
}
#memberHowto .stepBox .pcFlex .stepTxt{
	width: 57%;
}
#memberHowto .stepBox div.pcFlex > figure{
	width: 40%;
}
}/* //end for PC */

#memberHowto .appDl > figure{
	max-width: 150px;
}
#memberHowto .appDl ul li{
	border: 1px solid var(--blue);
	display: flex;
	justify-content: center;
	padding: 20px 2%;
}
#memberHowto .appDl li figure{
	margin-left: 20px;
	max-width: 100px !important;
}
#memberHowto .appDl dl dt{
	font-size: 1.8rem;
	font-weight: bold;
}
#memberHowto .appDl dl dt span{
	font-size: 2.2rem;
}
#memberHowto .appDl dl dd img{
	max-width: 150px;
}
@media screen and (min-width: 769px) {
	#memberHowto .appDl.pcFlex{
		align-items: center;
	}
	#memberHowto .appDl ul{
		width: calc(100% - (150px + 3%));
	}
	#memberHowto .appDl ul li{
		width: 48.5%;
	}
}/* //end for PC */

#memberHowto #step02 div.pcFlex:nth-of-type(2) figure img{
	margin: 0 auto;
	width: 200px;
}
#memberHowto #step03 .stepTxt ul{
	display: flex;
	gap: 0 3%;
}
#memberHowto #step03 .stepTxt ul li{
	border: 2px solid #fff;
	width: 50%;
	max-width: 98px;
}
#memberHowto #step04 ol{
	gap: 0 2%;
}
#memberHowto #step04 ol li{
	width: calc(92% / 5);
}
#memberHowto #step04 ol li p{
	font-size: 1.4rem;
	margin-top: 5px;
	margin-left: 1em;
	text-indent: -1em;
}
#memberHowto #step04 ol li em{
	font-style: normal;
	font-weight: bold;
}

#memberHowto .qrPdf h4{
	background: var(--blue);
	border-radius: 10px;
	color: #fff;
	font-size: 2rem;
	margin-bottom: 15px;
	padding: 5px;
}
#memberHowto .qrPdf ul{
	display: flex;
	flex-wrap: wrap;
	gap: 15px 3%;
}
#memberHowto .qrPdf ul li{
	width: calc(94% / 3);
}

#memberHowto .notice{
	margin: 50px 0;
	padding: 30px 50px;
	background: var(--blueL);
	border-radius: 30px;
}
#memberHowto .notice li{
	list-style: disc;
	font-size: 1.6rem;
	margin-bottom: 1em;
}
#memberHowto .notice li ol{
	margin-left: 4em;
}
#memberHowto .notice li ol li{
	margin-bottom: 0;
}

#memberHowto .contactBox{
	background: var(--blue);
	padding: 30px 50px 40px;
	margin: 0 auto 30px;
	color: #fff;
	font-weight: bold;
	width: min(100%,600px);
	border-radius: 10px;
}
#memberHowto .contactBox h3{
	font-size: 3rem;
	text-align: center;
}
#memberHowto .contactBox h4{
	font-size: 2.4rem;
	text-align: center;
}
#memberHowto .contactBox p{
	font-size: 1.8rem;
}
@media screen and (max-width: 768px) {
	#memberHowto .inner{
		width: min(90%, 1000px);
	}
	#memberHowto .leadTxt{
		font-size: 1.6rem;
		margin-top: 15px;
		margin-bottom: 30px;
	}
	#memberHowto .stepBox h3{
		font-size: 2rem;
		padding-bottom: 5px;
	}
	#memberHowto .stepBox h3 span{
		display: inline-block;
		line-height: 1;
		margin: 0 0 3px;
		padding: 5px 6px 6px;
	}
	#memberHowto .appDl > figure{
		margin: 0 auto;
	}
	#memberHowto .appDl ul li{
		margin-top: 20px;
	}
	#memberHowto #step02 h3:nth-of-type(2){
		margin-top: 30px;
	}
	#memberHowto #step03 .stepTxt ul{
		justify-content: center;
	}
	#memberHowto #step04 ol li{
		margin-bottom: 30px;
		text-align: center;
		width: 100%;
	}
	#memberHowto #step04 ol li figure img{
		margin: 0 auto;
  	width: 200px;
	}
	#memberHowto #step04 ol li p{
		text-align: center;
	}
	#memberHowto .qrPdf ul li{
		width: calc(97% / 2);
	}
	#memberHowto .qrPdf h4{
		font-size: 1.6rem;
	}
	
	#memberHowto .notice{
		margin: 30px 0;
		padding: 15px 5% 15px 10%;
		background: var(--blueL);
		border-radius: 30px;
	}
	#memberHowto .notice li ol{
		margin-left: 2em;
	}
	
	#memberHowto .contactBox{
		padding: 15px 10% 20px;
	}
	#memberHowto .contactBox h3{
		font-size: 2rem;
	}
	#memberHowto .contactBox h4{
		font-size: 1.8rem;
		margin-bottom: 10px;
	}
	#memberHowto .contactBox p{
		font-size: 1.6rem;
	}
}/* //end for SP */

/*-------------------------------------------
	instructorRegist / certifiedClubApply
-------------------------------------------*/
#registlead h3,
#experiensForm h3{
	font-size: 3rem;
	margin-top: 30px;
	margin-bottom: 30px;
}
#registlead .bgY{
	background: var(--yellowL);
  padding: 50px 0;
}
#registlead .flyer figure{
	border: 1px solid #ccc;
}
#registlead .flyer .btn{
	margin-top: 10px;
	height: 54px;
}
#registlead .txts{
	margin-top: 25px;
}
#registlead h4{
	color: var(--blue);
	font-size: 2.4rem;
	margin-bottom: 40px;
	padding-left: 105px;
	position: relative;
}
#registlead h4::before{
	position: absolute;
	top: -25px;
	left: 0;
	content: "";
	display: block;
	width: 90px;
	height: 90px;
	background-repeat: no-repeat;
	background-position: left top;
	background-size: 100% 100%;
	background-image: url(images/ic_ttl_blue.png);
}
#registlead p{
	font-size: 1.8rem;
	margin-bottom: 15px;
}
#registlead ul.btnWrap{
	display: flex;
	flex-wrap: wrap;
	justify-content: flex-start;
	gap: 25px;
	margin-top: 40px;
}
#registlead ul li{
	width: 100%;
}
@media screen and (max-width: 768px) {
	#registlead h3,
	#experiensForm h3{
		font-size: 2rem;
		margin-top: 15px;
	margin-bottom: 15px;
	}
	#registlead .flyer{
		margin-left: auto;
		margin-right: auto;
		width: 80%;
	}
	#registlead .txts{
		margin-top: 30px;
	}
	#registlead h4{
		font-size: 1.8rem;
		margin-bottom: 10px;
		padding-left: 50px;
	}
	#registlead h4::before{
		top: 0;
		width: 40px;
		height: 40px;
	}
	#registlead ul.btnWrap{
		gap: 15px 0;
		margin-top: 30px;
	}
	#registlead p{
		font-size: 1.6rem;
	}
}/* //end for SP */
@media screen and (min-width: 769px) {
	#registlead .pcFlex{
		display: flex;
		align-items: center;
		justify-content: center;
		gap: 0 5%;
	}
	#registlead .flyer{
		width: 25%;
	}
	#registlead .txts{
		width: 65%;
	}
	#registlead .img{
		width: 30%;
	}
	#registlead ul li{
		width: calc((100% - 25px) / 2);
	}
	#registlead .btn{
		font-size: min(1.55vw,1.8rem);
		padding: 0 8.1%;
	}
}/* //end for PC */

/* =======================================
	form
========================================== */
#experiensForm .inner{
	width: min(90%,800px);
	margin: 0 auto;
}

#experiensForm .basicTable{
	margin-bottom: 30px;
}
.basicTable {
  background: var(--wh);
	border: solid 1px #ccc;
  display: flex;
  justify-content: space-between;
  align-items: stretch;
  flex-wrap: wrap;
}
.basicTable > dt {
  background: var(--blue);
  border-bottom: 1px solid #fff;
  color: #fff;
  display: flex;
  font-weight: 500;
  align-items: center;
	padding: 20px 2.5% !important;
  width: 25% !important;
	font-size: 1.5rem !important;
}

.basicTable > dd {
  padding: 20px 2.5% !important;
  width: 75% !important;
  border-top: solid 1px #ccc;
  margin: 0px;
  font-size: 12px;
  line-height: 1.5em;
  text-align: left;
}
.basicTable > dt:first-of-type,
.basicTable > dd:first-of-type{
	border-top: none !important;
}
.basicTable > dt:last-of-type{
	border-bottom: none;
}

#experiensForm .basicTable .hissu{
	display: inline-block;
	background: #f43d60;
 color: #fff;
	border-radius: 3px;
	line-height: 1;
	margin-left: 0.5em;
	font-size: 1.2rem;
	padding: 2px 4px 4px;
}
#experiensForm .basicTable dd ul li:not(:last-child){
	margin-bottom: 5px;
}
#experiensForm .basicTable dd h4:nth-of-type(2),
#experiensForm .basicTable dd p{
	border-top: 1px solid #ccc;
	padding-top: 0.5em;
}
#experiensForm dd > input{
	padding: 8px;
	width: 80%;
}
#experiensForm dd textarea{
	padding: 8px;
	width: 100% !important;
	height: 150px !important;
}
.confirm .btn{
 cursor: pointer;
}

.policyBox {
  padding: 20px 2%;
  overflow-y: scroll;
  height: 250px;
	border: 1px solid #ccc;
}

#privacyPolicy .h4Tit {
  border-bottom: 1px dotted var(--base);
  padding-bottom: 5px;
  text-align: center;
}
@media screen and (max-width: 768px) {
.basicTable{
	flex-wrap: wrap;
}
.basicTable > dt{
	padding: 5px 2.5% !important;
	width: 100% !important;
}
.basicTable > dd{
	padding: 10px 2.5% 15px !important;
	width: 100% !important;
}
#experiensForm dd > input{
	width: 100% !important;
}
}/* //end for SP */


/*-------------------------------------------
	instructor / trial_briefing
-------------------------------------------*/
#newsList,
#newsDetail{
 padding-top: 50px;
 padding-bottom: 100px;
}
#newsList .newsBox{
 border-bottom: 1px #ccc solid;
 padding-bottom: 40px;
 margin-bottom: 40px;
}
#newsList .newsBox a{
 color: var(--base);
}
@media screen and (min-width: 769px) {
#newsList .pcFlex{
 display: flex;
 justify-content: space-between;
 }
 #newsList .pcFlex figure{
  width: 25%;
	}
	
	#newsList .pcFlex figure img{
		height: auto
	}
 #newsList .pcFlex .txts{
  width: 70%;
 }
}/*-PC only-*/
.newsBox h3{
 font-size: 3rem;
 margin-bottom: 10px;
}
 .newsBox .cat{
  display: inline-block;
	background-color: #5177f3;
	padding: 0.3em 0.8em 0.4em;
	border-radius: calc(infinity * 1px);
  margin-left: 1em;
	font-size: 1.3rem;
	color: #fff;
	line-height: 1em;
}
.newsBox .txts p + p{
 margin-top: 1em;
}
.newsBox .txts .btnWrap{
 margin-top: 30px;
}

@media screen and (max-width: 768px) {/*newsBox SP*/
 #newsList,
#newsDetail{
 padding-top: 30px;
 padding-bottom: 50px;
}
#newsList .newsBox{
 padding-bottom: 30px;
 margin-bottom: 30px;
}
 #newsList .newsBox.pcFlex figure{
  margin-bottom: 20px;
 }
.newsBox h3{
 font-size: 2.2rem;
}
.newsBox .txts .btnWrap{
 margin-top:20px;
}
}/*-SP only-*/

#newsDetail .inner{
 max-width: 1000px;
}
#newsDetail h3{
 margin-bottom: 30px;
}
#newsDetail figure{
 text-align: center;
 margin-bottom: 2em;
}
#newsDetail p + p{
 margin-top: 1em;
}


/* =======================================
  ページャー
========================================== */
/*-- pageNavi --*/
.pageNavi{
	display: flex;
	justify-content: center;
	align-items: center;
	text-align: center;
 margin-top: 50px;
}
.pageNavi .current,
.pageNavi .inactive,
.pageNavi a{
	border: 1px solid var(--blue);
  display:grid;
	align-items: center;
	justify-content: center;
  font-optical-sizing: auto;
	color: var(--blue);
  font-weight: 500;
  font-style: normal;
}
.pageNavi .current{
	background: var(--blue);
	color: #fff;
}
.pageNavi a:hover{
	background: var(--blue);
	color: #fff;
}
.pageNavi a.next:hover{
	background: none;
	border: none;
	color: var(--blue);
}
@media screen and (min-width: 769px) {
.pageNavi{
	gap:0 1.5%;
 margin-top: 80px;
}
.pageNavi .current,
.pageNavi .inactive,
.pageNavi a{
	font-size: 1.8rem;
	width: 40px;
	height: 40px;
}
}/*-PC only-*/
@media screen and (max-width: 768px) {
/*-- pageNavi --*/
.pageNavi{
	gap:0 3%;
 margin-top: 40px;
}
.pageNavi .current,
.pageNavi .inactive,
.pageNavi a{
	width: 35px;
	height: 35px;
}
}/*-SP only-*/