@charset "utf-8";

/*google fontsの読み込み*/
@import url('https://fonts.googleapis.com/css?family=Righteous&display=swap');
@import url('https://fonts.googleapis.com/css?family=Advent+Pro&display=swap');

@import url('https://fonts.googleapis.com/css?family=M+PLUS+1p');

/*認証ページ背景*/
body#op {
background: url(https://www.dokidokicospara.jp/upload/pub/gb240603.jpg) fixed no-repeat center top !important;
background-size:contain;
}

body#op div#wrap{
	display: none;
}

.item {
  background: #ddd;
 /* padding: 10px;*/
  border-radius: 7px;
  /*border: 1px solid #ccc;*/
  overflow: hidden;
}
#banner ul li img{
width: 100% !important;
}
.container {
  display: grid;
  gap: 10px;
  grid-template-columns: 2fr 2fr 2fr 2fr 2fr;
  grid-template-rows: 2fr 2fr 2fr;
}

/*おしゃれ見出し*/
.head_test {
    margin:  0;             /* デフォルトCSS打ち消し */
    font-size:  24px;       /* 文字サイズ指定 */
    position:  relative;    /* 位置調整 */
    font-weight:  normal;   /* 文字の太さ調整 */
    display:  inline-block; /* インラインブロックにする */
    background-color: #fff; /* 背景色指定 */
    margin-left: 20px;      /* 周りの余白指定 */
    padding: 0 10px;        /* 余白指定 */
}
p {
    margin:  0;             /* デフォルトCSS打ち消し */
    line-height: 2;         /* 行間調整 */
}
.head_test-wrap {
    position: relative;     /* 位置調整 */
    margin-bottom:15px;     /* 周りの余白指定 */
}
.head_test-wrap:before {
    content:  '';           /* 空白の要素を作る */
    background-color: #000; /* 背景色指定 */
    display:  block;        /* ブロック要素にする */
    position:  absolute;    /* 位置調整 */
    left:  0;               /* 位置調整 */
    width:  100%;           /* 幅指定 */
    height:  1px;           /* 高さ指定 */
    top: 0;                 /* 位置調整 */
    bottom:  0;             /* 位置調整 */
    margin:  auto;          /* 位置調整 */
}
/*ここまで*/

/*おしゃれ見出し2*/
.testh3{
    position: relative;
    padding: 7px 10px;
    border-bottom: 2px solid #ff69b4;
    width:100%;
    margin: 0 auto;
    text-align: left !important;
    font-size: 1.4rem !important;
}

.testh3:before {
    position: absolute;
    left: 50px;
    bottom: -40px;
    content: '';
    border-width: 20px;
    border-style: solid;
    border-color: #ff69b4 transparent transparent transparent;
}

.testh3:after {
    position: absolute;
    left: 50px;
    bottom: -36px;
    content: '';
    border-width: 20px;
    border-style: solid;
    border-color: #ffffff transparent transparent transparent;
}
/*ここまで*/


#list li .timedata{
  background: #FFF;
}

.box-big1 {
  grid-row: 1 / 3; 
  grid-column: 1 / 3;

}
.box-big2 {
  grid-row: 2 / 4; 
  grid-column: 4 / 6;  
}

.btn--orange,
a.btn--orange {
  color: #fff;
  background: rgb(207,0,184);
  background: linear-gradient(0deg, rgba(207,0,184,1) 0%, rgba(241,20,221,1) 100%);
  padding: 5%;
}
.btn--orange:hover,
a.btn--orange:hover {
opacity: 0.7;
}

a.btn--radius {
    border-radius: 19px;
    padding: 2% 5%;
}

/*画面幅1370px以下の背景調整*/
@media screen and (max-width: 1370px) {
body#op {
background: url(https://www.dokidokicospara.jp/upload/pub/gb240603.jpg) fixed no-repeat center top !important;
background-size:contain;
}	
}

/*画面幅500px以下の背景調整*/
@media screen and (max-width: 500px) {
body#op {
background: url(https://www.dokidokicospara.jp/upload/pub/bg240603m.jpg) fixed repeat center top !important;
/*background-size:cover !important;*/
}	
}

ul.topiclist li img{
    z-index: 5;
}

#obi{
	width: 100%;
	background: #FD5FB8;
	color: #FFFFFF;
	font-weight: 600;
	font-size: 1.3em;
	padding: 5px 8px;
	margin-bottom: 1%;
	margin-top: 1%;
}


.keiretu img{
	margin-bottom: 5px;
}



/*ボタンのデザイン*/
#entrance .more_btn a{
font-family: 'Righteous';
width: 95%;
display: inline-block;
padding: 0.1em 0.2em;
text-decoration: none;
background: #f5f3f1;
color: #534741;
border-radius: 4px;
box-shadow: 0px 0px 0px 5px #f5f3f1;
border: dashed 2px #534741;
box-sizing: border-box;
filter:drop-shadow(1px 3px 5px rgba(0, 0, 0, 0.2));
}

#entrance .more_btn a:hover {
border: dotted 2px #534741;
color: #534741;
background: #f5f3f1;
}

#entrance .more_btn a span {
	font-size: 0.4em;
}
#entrance .more_btn a:active{
	-webkit-transform: translateY(2px);
  transform: translateY(2px);/*沈むように*/
}

/*ロゴの位置*/
#main{
	margin:30% auto 50px !important;
}
#op h2{
	margin: 0% auto 2% !important;
}

/*画面幅500px以下の背景調整*/
@media screen and (max-width: 500px) {
#main{
	margin:80% auto 50px !important;
}
}

/*料金ページデザイン*/
.title001 {
	color: #ff45bd;
	font-family: "ヒラギノ角ゴ Pro W3", "Hiragino Kaku Gothic Pro", "メイリオ", Meiryo, Osaka, "ＭＳ Ｐゴシック", "MS PGothic", "sans-serif";
	font-weight: 700;
	letter-spacing: 0.3em;
	text-align: center;
	margin-bottom:2%;
	margin-top: 5%;
font-size:1.3rem;
}
/*----------------------------------------------------
  .demo01
----------------------------------------------------*/
table.demo01 {
	width: 100% !important;
	font-family: "メイリオ", Meiryo, Osaka, "ＭＳ Ｐゴシック", "MS PGothic", "sans-serif" ;
	color: #4E4E4E !important;
	border: none !important;
}
table.demo01 th  { 
	width: 30%; 
	text-align:center !important;
	background:rgba(255,241,254,0.2);
	padding: 1% !important;
	font-size: 1em !important;
	border-bottom: #B6B6B6 dashed 1px !important;
	line-height: 1em !important;
}
table.demo01 td  { 
	font-weight: 700 !important;
	text-align:center !important;
	padding: 1% !important;
	font-size: 1em !important;
	border-bottom: #B6B6B6 dashed 1px !important;
	border-left: none !important;
	border-top: none !important
}
.op001{
	font-size: 0.8em !important;
	font-weight: 200 !important;
}



.demo02 {
	width: 100% !important;
	font-family: "メイリオ", Meiryo, Osaka, "ＭＳ Ｐゴシック", "MS PGothic", "sans-serif";
	color: #4E4E4E !important;
}

.demo02 td  {
	width: 33%;
	text-align:center;
	padding: 1%;
	font-size: 1em;
	border-bottom: #B6B6B6 dashed 1px;
}
.demo002 {
	font-weight: 200 !important;
	font-size: 0.9em !important;
}

dl#test04 {
	display: inline-block !important;
	width: 100% !important;
	text-align: center !important;
	font-size: initial !important;
	border-bottom:initial !important;
	float:initial !important;
	overflow:initial !important;
	padding:initial !important;
}

#test04 dt {
font-family: "メイリオ", Meiryo, Osaka, "ＭＳ Ｐゴシック", "MS PGothic", "sans-serif";
margin-top: 3em !important;

margin-bottom: 1em !important;
text-align: center !important;
float: none !important;
width: 100% !important;
}

#test04 dd {
font-family:"メイリオ", Meiryo, Osaka, "ＭＳ Ｐゴシック", "MS PGothic", "sans-serif";
width: 29% !important;
float: left !important;
padding: 0 1em !important;
margin-left: 0 !important;
margin-right: 0.5% !important;
font-size: 0.9em !important;
border-bottom: #B6B6B6 dashed 1px !important;
text-align: center !important;
line-height: 2em;
}

.wawawa {
	margin-top: 5%;
	text-align: center;
	width: 100%;
}
.wawawa img {
	width: 100%;
}




div.clear-left {clear:both;}


@media only screen and (max-width:480px){
    .demo01 { margin: 0 -10px; }
    .demo01 th,
    .demo01 td{
    width: 100% !important;
    display: block;
    border-top: none;
    }
.demo01 th  { 
	background: #ff6aca !important;
	color: #FFFFFF;
}
#test04 dd {
font-family:"メイリオ", Meiryo, Osaka, "ＭＳ Ｐゴシック", "MS PGothic", "sans-serif";
width: 100% !important;
float: none !important;
}
  .demo01 tr:first-child th { border-top: 1px solid #ddd; }

}

#blog_list.type14{
	width: 100% !important;
}



/*各コースの並び順　flaex*/
/*３列の並び*/
*, *:before, *:after {
	box-sizing: border-box;
}
.col_3{
	width: 100%;
	display: flex;
	display: -ms-flexbox; /* IE10 */
	flex-wrap: wrap;
	-ms-flex-wrap: wrap; /* IE10 */
}
.col_3 > div{
	width: 33.33333%;
	padding: 5px;
}

/*画面幅900px以下*/
@media screen and (max-width: 960px) {
	.col_3 > div{
		width: 50%;
	}
}

/*画面幅480px以下*/
@media screen and (max-width: 480px) {
	.col_3 > div{
		width: 100%;
	}

}
/*各コースの並び順　flaex ここまで*/


.marquee {
/*box-shadow: 1px 1px 1px 1px rgba(0,0,0,0.2) inset;*/
background-color:rgba(255, 228, 187,0.6) !important;
/*border:solid 4px #FF5BBB;*/
/*border-radius: 5px;*/
/*color: #6a1917;*/
}

.marquee ul li{
	/*padding-top: 2%;*/
	padding-bottom: 0%;
}


/*LINE会員*/
.kusetuyoi{
	text-align: center;
}

.kusetuyoi img{
	margin-bottom: 2%;
}





/*PICK UP*/
p.midashi09{
	font-family: 'Advent Pro',"M PLUS 1p", sans-serif;
	font-size: 1.3em;
	font-weight: 600;
	margin-bottom: 15px;
}

span.hutatuno{
margin:  0;                     /* デフォルトCSS打ち消し */
    font-size:  24px;               /* 文字サイズ指定 */
    position:  relative;            /* 位置調整 */
    font-weight:  normal;           /* 文字の太さ調整 */
    margin-bottom: 15px;            /* 周りの余白指定 */
    padding-top: 50px;              /* 余白指定 */
    padding-left: 40px;             /* 余白指定 */
	color: rgba(232,53,132,1.0);
}

p.poji2{
	text-align: center;
	margin-bottom: 10px;
}
div.poji img{
	margin-bottom: 10px;
}

span.hutatuno:before{
content:  '';                   /* 空白の要素を作る */
    width: 0;                       /* 幅指定 */
    height: 0;                      /* 高さ指定 */
    border-style: solid;            /* 三角を作る */
    border-width: 0px 0 110px 80px; /* 三角を作る */
    border-color: transparent transparent rgba(232,53,132,0.1) transparent;  /* 三角を作る */
    position:  absolute;            /* 位置調整 */
    z-index:  -1;                   /* 重なり調整 */
    transform: rotate(30deg);       /* 回転 */
    top: -20px;                     /* 位置調整 */
    left: 30px;                     /* 位置調整 */
}

span.hutatuno2{
color: #e83584;/*文字色*/
padding: 0.6em;/*文字周りの余白*/
display: inline-block;/*おまじない*/
line-height: 1.5;/*行高*/
background: #fff495;/*背景色*/
vertical-align: middle;
border-radius: 25px 0px 0px 25px;/*左側の角を丸く*/
font-weight: 600;
}

span.hutatuno2:before{
content: '●';
color: white;
margin-right: 8px;
}


*, *:before, *:after {
	box-sizing: border-box;
}
.col_2{
	width: 100%;
	display: flex;
	display: -ms-flexbox; /* IE10 */
	flex-wrap: wrap;
	-ms-flex-wrap: wrap; /* IE10 */
}
.col_2 > div{
	width: 50%;
	padding: 10px;
}
@media screen and (max-width: 960px) {
	.col_2 > div{
		width: 100%;
	}
}


/*バナー三列、スマホだとアコーデオン*/
.accbox {
    margin: 2em 0;
    padding: 0;
    max-width: 500px;
	width: 100%;
}


.accbox label {
    display: block;
    margin: 1.5px 0;
    padding : 11px 12px;
    color :#5d2a09;
    font-weight: bold;
    background :#ffffff;
	border: 1.2px solid #5d2a09;
	border-radius: 5px;
    cursor :pointer;
    transition: all 0.5s;
	text-align: center;
}

.accbox input {
    display: none;
}

.accbox .accshow {
    height: 0;
    padding: 0;
    overflow: hidden;
    opacity: 0;
    transition: 0.8s;
}

.cssacc:checked + .accshow {
    height: auto;
    padding: 5px;
  
    opacity: 1;
	text-align: center;
}



@media only screen and (max-width:480px){
.sumaho{
	display: none;
	}
#banner ul li:nth-child(1){
	/*display: none;*/
}
#banner ul li:nth-child(2){
	/*display: none;*/
}
#banner ul li:nth-child(3){
	/*display: none;*/
}
}

@media only screen and (min-width:481px){
	.accbox{
		display: none;
	}
}


p.midashi001{
	background:rgba(255,157,233,1.00);
	color: rgba(255,255,255,1.00);
	font-weight: 700;
	font-size: 1.5em;
	padding: 1%;
	margin-top: 1%;
}
p.midashi001 img{
	width: 4%;
	margin-right: 10px;
}

p.midashi002{
	color:rgba(69,69,69,1.00);
	font-weight: 700;
	font-size: 1.4em;
	padding-left: 2%;
}
span.atama01{
	color: rgba(255,157,233,1.00);
}


.subtitle span.more a{
	color: #80273F !important;
}
.subtitle span.more a:hover{
	color: rgba(255,255,255,1.00) !important;
}
.pagetitle{
	padding-bottom: 3%;
}



.box27 {
    position: relative;
    margin: 2em 0;
    padding: 0.5em 1em;
}
.box27 .box-title {
    position: absolute;
    display: inline-block;
    top: -27px;
    left: -3px;
    padding: 0 9px;
    height: 25px;
    line-height: 25px;
    font-size: 17px;
    color: #ffffff;
    font-weight: bold;
    border-radius: 5px 5px 0 0;
}

.colors_01{
  background: #fe0000;
}
.border_01{
  border: solid 3px #fe0000;
}
.colors_h201{
  border-bottom: #fe0000 1px dashed;
	color: #fe0000;
}
.colors_02{
  background: #ff5bbb;
}
.border_02{
  border: solid 3px #ff5bbb;
}
.colors_h202{
  border-bottom: #ff5bbb 1px dashed;
	color: #ff5bbb;
}
.colors_03{
  background: #14beff;
}
.border_03{
  border: solid 3px #14beff;
}
.colors_h203{
  border-bottom: #14beff 1px dashed;
	color: #14beff; 
}
.colors_04{
  background: #f49f00;
}
.border_04{
  border: solid 3px #f49f00;
}
.colors_h204{
  border-bottom: #f49f00 1px dashed;
	color: #f49f00;
}
.colors_05{
  background: #0fae25;
}
.border_05{
  border: solid 3px #0fae25;
}
.colors_h205{
  border-bottom: #0fae25 1px dashed;
	color: #0fae25;
}
.colors_06{
  background: #264aff;
}
.border_06{
  border: solid 3px #264aff;
}
.colors_h206{
  border-bottom: #264aff 1px dashed;
	color: #264aff;
}
.colors_07{
  background: #6d6d6d;
}
.border_07{
  border: solid 3px #6d6d6d;
}
.colors_h207{
  border-bottom: #6d6d6d 1px dashed;
	color: #6d6d6d;
}
.colors_08{
  background: #c926ff;
}
.border_08{
  border: solid 3px #c926ff;
}
.colors_h208{
  border-bottom: #c926ff 1px dashed;
	color: #c926ff;
}
.box27 p {
    margin: 0; 
    padding: 0;
}




p.obi03{
  background: rgba(254,109,221,1.00);
  padding: 0.5em;/*文字まわり（上下左右）の余白*/
	color: #FFFFFF;
	font-weight: 700;
	font-size: 1.4em;
}

p.midashi0033 {
    color: rgba(69,69,69,1.00);
    font-weight:900;
    font-size: 1.25em;
    padding-left: 2%;
}

*, *:before, *:after {
	box-sizing: border-box;
}
.col_200{
	width: 100%;
	display: flex;
	display: -ms-flexbox; /* IE10 */
	flex-wrap: wrap;
	-ms-flex-wrap: wrap; /* IE10 */
}
.col_200 > div{
	width: 50%;
	padding: 10px;
}
@media screen and (max-width: 600px) {
	.col_200 > div{
		width: 100%;
	}
}

.systemlist table tr:hover td{
background:none;
}


/* 2020年10月20日追加 */
.subtitle{
background: url(https://www.dokidokicospara.jp/upload/pub/11111.png) no-repeat, url(https://www.dokidokicospara.jp/upload/pub/00000.gif) repeat !important;
color: #5d2a09 !important;
}
.subtitle span{
	color: #5d2a09 !important;
}

#header{
	background: url(https://www.dokidokicospara.jp/upload/pub/header.jpg) repeat center top !important;
}
#gnav li {
    background: url(https://www.dokidokicospara.jp/upload/pub/listbg.jpg) repeat !important;
}
.upside {
    background: url(https://www.dokidokicospara.jp/upload/pub/listbg.jpg) repeat;
}
#gnav ul li.gli a.gbtn, #top_navi ul li a {
    color: #FFf;
}

#gnav a.current {
    background: #fbeaf4 !important;
	color:  #ff5bbb !important;
}
#gnav a.current span {
    color:  #ff5bbb !important;
}

#gnav ul li.gli:hover{
	background: url(https://www.dokidokicospara.jp/upload/pub/listbg2.jpg) repeat !important;
}
#gnav ul li.gli a.gbtn:hover {
    color: #ff5bbb;
}
#gnav ul li.gli a.gbtn .jp:hover{
	color: #ff5bbb;
}
#gnav ul li.gli a.gbtn span:hover{
	color: #ff5bbb;
}
#gnav ul li.gli a.gbtn div span:hover{
	color: #ff5bbb;
}
body{
background: url(https://www.dokidokicospara.jp/upload/pub/bg002.jpg) fixed repeat center top !important;
}
#wrap{
background: rgba(255,255,255,1);
}


.pagetitle {
background: url(https://www.dokidokicospara.jp/upload/pub/11111.png) no-repeat, url(https://www.dokidokicospara.jp/upload/pub/00000.gif) repeat !important;
color: #5d2a09;
margin-top: 2%;
}
.pagetitle span{
	color: #5d2a09 !important;
}

#gnav ul li.gli a.gbtn .bg:after {
    content: "";
    display: block;
    position: absolute;
    left: 0%;
    top: 100px;
    z-index: 2;
    width: 100%;
    height: 100%;
    margin: 0;
	background: url(https://www.dokidokicospara.jp/upload/pub/listbg2.jpg) repeat !important;
}

#todayssche li .time, #schedule #list li .timedata{
	background: url(https://www.dokidokicospara.jp/upload/pub/sub_bg22.gif) repeat 0 0;
	/*background: url(https://www.dokidokicospara.jp/upload/pub/sub_bg22.gif) repeat 0 0;*/
color: #673401;
}

.toptop th{
	-moz-text-align-last: justify;
  text-align-last: justify;
}
@media screen and (max-width: 768px){
	#top_navi {
    background: url(https://www.dokidokicospara.jp/upload/pub/listbg.jpg) repeat scroll 0 0;
}
#header{
	background: url(https://www.dokidokicospara.jp/upload/pub/he123.jpg) repeat center top !important;
}
}








ul.sample1{
  counter-reset:li;
  font: 14px/1.6 'arial narrow', sans-serif;
  list-style: none;
  padding:0;
}
ul.sample1 li{
  position: relative;
  font-weight: bold;
  line-height: 28px;
  margin: 10px 0;
  padding-left: 40px;
  -webkit-transition: 0.3s;
  -moz-transition: 0.3s;
  -o-transition: 0.3s;
  -ms-transition: 0.3s;
  transition: 0.3s;
	color: #9FCDFF !important;
}
ul.sample1 li:nth-child(4n+1){
  border:solid 1px #9FCDFF;
}
ul.sample1 li:nth-child(4n+2){
  border:solid 1px #9FCDFF;
}
ul.sample1 li:nth-child(4n+3){
  border:solid 1px #9FCDFF;
}
ul.sample1 li:nth-child(4n+4){
  border:solid 1px #9FCDFF;
}
ul.sample1 li:before{
  counter-increment: li;
  content: counter(li);
  position: absolute;
  left: -1px;
  color: #fff;
  text-align: center;
  line-height: 30px;
  width: 30px;
  height: 30px;
  top: 50%;
  -moz-transform: translateY(-50%);
  -webkit-transform: translateY(-50%);
  -o-transform: translateY(-50%);
  -ms-transform: translateY(-50%);
  transform: translateY(-50%);
}
ul.sample1 li:nth-child(4n+1):before{
  background: #9FCDFF;
}
ul.sample1 li:nth-child(4n+2):before{
  background: #9FCDFF;
}
ul.sample1 li:nth-child(4n+3):before{
  background: #9FCDFF;
}
ul.sample1 li:nth-child(4n+4):before{
  background: #9FCDFF;
}
ul.sample1 li:hover{
  color:#fff !important;
  overflow: hidden;
  z-index: 1;
}
ul.sample1 li:nth-child(4n+1):hover{
  background: #9FCDFF;
}
ul.sample1 li:nth-child(4n+1):hover:before{
  background: #fff;
  color: #9FCDFF;
}
ul.sample1 li:nth-child(4n+2):hover{
  background: #9FCDFF;
}
ul.sample1 li:nth-child(4n+2):hover:before{
  background: #fff;
  color: #9FCDFF;
}
ul.sample1 li:nth-child(4n+3):hover{
  background: #9FCDFF;
}
ul.sample1 li:nth-child(4n+3):hover:before{
  background: #fff;
  color: #9FCDFF;
}
ul.sample1 li:nth-child(4n+4):hover{
  background: #9FCDFF;
}
ul.sample1 li:nth-child(4n+4):hover:before{
  background: #fff;
  color: #9FCDFF;
}


.btn-square-soft {
  display: inline-block;
  position: relative;
  text-decoration: none;
  color: #fff;
  width: 120px;
  height: 50px;
  line-height: 50px;
  border-radius: 5px;
  text-align: center;
  overflow: hidden;
  font-weight: bold;
  background: linear-gradient(#fed6e3 0%, #ffaaaa 100%);
  text-shadow: 1px 1px 1px rgba(255, 255, 255, 0.66);
  box-shadow: 0 1px 1px rgba(0, 0, 0, 0.28);
}

.btn-square-soft:active {
  /*押したとき*/
  -webkit-transform: translateY(2px);
  transform: translateY(2px);/*沈むように*/
  box-shadow: 0 0 1px rgba(0, 0, 0, 0.15);
  background-image: linear-gradient(#fed6e3 0%, #ffbcbc 100%);/*グラデーションを明るく*/
}
#ala01, #ala02, #ala03{
  display: block;
  padding-top: 80px;
  margin-top: -80px;
}