@charset "utf-8";
/*
Theme Name: Anelaokal?2025
Description: Anelaokal?2025テーマ
*/

/*基本設定*/
html { margin-top: 0 !important; }
	* html body { margin-top: 0 !important; }<div class="sub-title">
<div class="fukidashi">
<p>基本クラス</p>
</div>
<h3>Maile Class</h3>
</div>
	@media screen and ( max-width: 767px ) {
		html { margin-top: 0 !important; }
		* html body { margin-top: 0 !important; }
	}
html,body{
 ? ?width: 100%; height:100%;
}
body {height:100%;font-family: sans-serif ; position: relative; right: 0;	overflow-x: hidden; margin:0; padding:0; color:#252525; line-height:2em; background:#f0f0f0; letter-spacing:.13em; font-size:16px;}
.body-wrapper::before {
content:"";
display:block;
position:fixed;
top:0;
left:0;
z-index:-1;
width:100%;
height:100vh;
background-repeat:no-repeat;
background-position:50% 100%;
background-image:url(https://anelaokala.com/anelahp/wp-content/uploads/bg.jpg);
background-size:cover;
}
/*base*/
html, div, span, applet, object, iframe,h1, h2, h3, h4, h5, h6, p, blockquote, pre,a, abbr, acronym, address, big, ite, code,del, dfn, em, img, ins, kbd, q, s, samp,small, strike, strong, sub, sup, tt, var,b, u, i, center, ol, ul, li, fieldset, form, label, legend,caption, tbody, tfoot, thead,tt,article, aside, canvas, details, embed,figure, figcaption, footer, header, hgroup,menu, nav, output, ruby, section, summary,time, mark, audio, video, p{ margin: 0; ?padding: 0; ?border: 0; ?font: inherit;-webkit-box-sizing: border-box; -moz-box-sizing: border-box; -o-box-sizing: border-box; -ms-box-sizing: border-box; box-sizing: border-box; /*color:#5eb4b5;*/ color:#000;}

body{background-color:#fff; background-image:url(https://anelaokala.com/anelahp/wp-content/uploads/bg.jpg); position:relative; background-attachment:fixed; background-size:cover; background-position:top;}
li{list-style:none;}
html {scroll-behavior: smooth;}
a.page-link{
   display: block;
   margin-top:-100px;
   padding-top:100px;
}
a{text-decoration: none;}
ul{margin:0; padding:0;}
/*#eria-center{width:100%; max-width:650px; background:#fff; position:absolute; left:50%; top:100px; border-radius:30px 30px 0 0; overflow:hidden;}*/
#eria-center{position:relative; width:100%; max-width:650px; min-height:100vh; background:#5eb4b5; margin-left:50%; margin-top:50px; border-radius:30px 30px 0 0; /*overflow:hidden;*/}
@media screen and (min-width:798px) and ( max-width:1350px) {
	#eria-center{width:100%; max-width:650px; margin-right:20px; margin-left:auto;}
}
@media screen and (max-width:797px) {
#eria-center{width:100%; max-width:100%; left:0; border-radius:0; top:-30px; padding-top:0; padding-bottom:100px;  margin:100px auto 0; overflow:hidden;}
}
.pc-top{right:-30px; top:-30px; z-index:100;}

/*スマホ用ヘッダー*/
.head-sp{position:fixed; z-index:100; top:0; height:70px; background:#fff; width:100%; text-align:center; display:flex;}
@media screen and (min-width: 769px) {
	.head-sp{display:none;}
}
.sp-menu{width:30%;}
.sp-logo{width:auto; height:68px; padding-top:1px;}
.sp-btn{width:30%;}
.sp-btn .btn{font-size:0.6em; margin-top:10px; padding:0;}

/*スマホ用ドロワーメニュー*/
.l-header{
  position: fixed;
  top: 0;
  left: 0;
  /*width: 100%;*/
  height: 60px;
  z-index: 200;
  transition: 0.4s ease;
}
.l-header__inner{
  width: 100%;
  height: 100%;
}
.l-header__text{
  text-align: right;
  padding: 0 60px 0 0;
}
.l-header__list{
  position: absolute;
  top: 40px;
  right: 0;
  transition: 0.4s ease;
}
.l-header__item{
  box-sizing: border-box;
  padding: 0 30px;
  border-right: 1px solid #c8c8c8;
}
.l-header__item:last-of-type{
  padding: 0 0 0 30px;
  border-right: none;
}
.l-header__item a{
  color: #000;
  font-size: 14px;
  transition: 0.4s ease;
}
.l-header__item a:hover{
  opacity: 0.7;
}
.l-nav{
  width: 100%;
  zoom: 1;
  position: absolute;
  bottom: 0px;
  height: 70px;
  left: 50%;
  transform: translateX(-50%);
  z-index: 101;
  transition: 0.4s ease;
}
.l-nav__list{
  justify-content: center;
  position: relative;
  left: 50%;
  transform: translateX(-50%);
  margin: auto;
  list-style: none;
}
.l-nav__item{
  box-sizing: border-box;
  border-bottom: 0px solid transparent;
  transition: 0.2s ease;
  height: 70px;
}
.l-nav__item > a{
  font-size: 16px;
  color: #fff;
  height: 70px;
  display: -webkit-flex;
  display: -ms-flex;
  display: flex;
  align-items: center;
  padding: 22.5px;
  font-weight: 500;
  transition: 0.1s ease;
  box-sizing: border-box;
  white-space: nowrap;
}
.l-nav{
  height:100dvh;
  top: 0;
  left:-100%;
  transform: translateX(0); background:#5eb4b5;}
.l-nav__item{
  height: 50px;
}
.l-nav__item > a{
  font-size: 15px;
  height: 50px;
  display: -webkit-flex;
  display: -ms-flex;
  display: flex;
  align-items: center;
  padding: 0 0 0 22px;
  position: relative;
  background-color: #000;
  color: #fff;
  border-bottom: 1px solid #fff;
}
.l-nav__item > a::before,
.l-nav__item > a::after {
  position: absolute;
  top: 0;
  bottom: 0;
  left: 0;
  margin: auto;
  content: "";
  vertical-align: middle;
  transition: 0.4s ease;
}
.l-nav__item > a::after {
  left: auto;
  right: 35px;
  width: 10px;
  height: 10px;
  border-top: 1px solid #fff;
  border-right: 1px solid #fff;
  transform: rotate(45deg);
}
.l-header__list.u-flexWrap{
  position: static;
  flex-direction: row;
  padding: 20px 0;
  border-bottom: 1px solid #fff;
  justify-content: center;
}
.l-header__item:first-of-type{
  padding: 0 30px 0 0;
}
.l-header__item a{
  color: #fff;
}
.on {
  transform: translateX(100%);
  opacity: 1;
	overflow:scroll;
  pointer-events: auto;
}
.zen{width:100%;}
.gnav-btn{
  width: 60px;
  height: 60px;
}
.icon-animation {
  display: block;
  z-index: 9998;
  position: absolute;
  top: 1rem;
  left:2rem;
  width: 25px;
  height: 25px;
  text-align: center;
  cursor: pointer;
  display: block;

}
.icon-animation span {
  display: block;
  position: absolute;
  top: 10px;
  left: 43%;
  width: 25px;
  height: 3px;
  margin-left: -25px;
  transform: rotate(0deg);
  background: #000;
  transition: all 0.3s;
  display: block;
}
.icon-animation .top {
  transform: translateY(-5px);
  display: block;

}
.icon-animation .bottom {
  transform: translateY(13px);
  display: block;
}
.icon-animation .middle {
  transform: translateY(4px);
  display: block;
}
.is-open .middle {
  background: rgba(51, 51, 51, 0);
  display: block;
}
.is-open .top {
  transform: rotate(-45deg) translateY(0px);
  display: block;
}
.is-open .bottom {
  transform: rotate(45deg) translateY(0px);
  display: block;
}
.is-open .icon-animation span{
  top: 14px;
}

#eria-left .head-contents .menu{display:flex; flex-wrap:wrap; justify-content: center;
  align-items: center; font-size:14px;}
#eria-left .head-contents .menu li{position: relative; padding:0.2em 1em;}
#eria-left .head-contents .menu li::before{
    content: "";
    display: block;
    height: 10px;
    width: 0;
    	/*order-right: 1px solid #333;*/
    position: absolute;
    left: 0;
    top: 0;
    bottom: 0;
    margin: auto;
}
#eria-left .head-contents .menu>li:first-of-type::before{
    content: none;
}
.sp-menu .menu-pc-menu-container{width:90%; padding-bottom:100px; margin:0 auto;}
.sp-menu img{width:60%; display:block; margin:3em auto 2em;}
.sp-menu #menu-pc-menu ul{width:100%;;}
.sp-menu #menu-pc-menu li{width:100%; border-bottom:1px solid #fff; line-height:3em;}
.sp-menu #menu-pc-menu li a{color:#fff;}
/*共通設定*/
img{width:100%; height:auto;}
.title{font-weight: 400;?font-style: normal; position:relative; font-size:2em;}
.title span{font-family: 'Zen Kaku Gothic New', sans-serif;}
h2.title{text-align:center; font-size:20px;}
h2{font-size:1.6em;  line-height:2em;}
h3{font-size:1.4em; line-height:2em;}
p{font-size:1em; line-height:1.8em; margin-bottom:1em;}
.pdg-t3{padding-top:3em;}
.marker{font-style: normal;
    font-weight: bold;
    background: -moz-linear-gradient(transparent 60%, #fce493 0%);
    background: -webkit-linear-gradient(transparent 60%, #fce493 0%);
    background: -ms-linear-gradient(transparent 60%, #fce493 0%);
    background: -o-linear-gradient(transparent 60%, #fce493 0%);
    background: linear-gradient(transparent 60%, #fce493 0%);
}
.f-brown{color:#552c32;}
.price {display: flex; flex-wrap: wrap; width: 100%; border:1px solid #fae396; border-bottom:none; color:#552c33; margin-bottom:2em;}
.price dt{width:calc((100% - 60%) - 2em); text-align:right; margin:0; background:#fae396;border-bottom: 1px solid #fae396; padding:0.5em 1em; color:#552c33;}
.price dd{width:calc(60% - 2em); text-align:right; margin:0;border-bottom: 1px solid #fae396; padding:0.5em 1em; color:#552c33;}
.link-pink{color:#fcc6c6;}
.link-blue{color:#5eb4b5; font-weight:bold;}
.color-white{color:#fff;}
/*h3{font-size:120%; font-weight:bold; line-height:3em; margin-top:3em;}*/
.eria-90{width:90%; margin:0 auto;}
.bg-01{background:#5eb4b5;}
.bg-01 p, .bg-01 h2, .bg-01 a,{color:#fff;}
.bg-plant{background-image:url(https://anelaokala.com/anelahp/wp-content/themes/theme-Anelaokala2025/img/bg-plant.png); background-position:top; background-repeat:no-repeat; background-size:100%;}
.center{text-align:center;}
.btn{display:block; text-align:right; background:#fcc6c6; color:#542d33; width:90%; margin:1em auto; padding:8px 0 10px; text-align:center; border-radius:30px;}
.btn a{color:#fff;}
.linkbox {position: relative;}
.linkbox a {position: absolute; top: 0; left: 0; height:100%; width: 100%;	z-index:100;}
.eria-right{text-align:right;}
.eria-center{text-align:center;}
.border{width:100%;  height:100%; border:1px solid #fde394; padding:1em;}
.btn5 a {
	color: #5eb4b5;
	display: block;
	width: 100%;
	height: 100%;
	padding: 10px;
	box-sizing: border-box; padding-right:20px; text-align:right;
}
.btn-t_b {font-size: 14px; text-align:center;padding-right: 30px; padding-top:10px;color:#fff; margin:0 auto; position: relative; border: none;letter-spacing: .2em; margin-top: 0px; overflow:hidden; width:80%; border-bottom:2px dotted #5eb4b5;}
.btn-t_b::before {content: ""; display: block;	width:10px; height:10px; border-right: 1px solid #5eb4b5; border-bottom: 1px solid #5eb4b5; rotate: -45deg; position: absolute; right: 10px; top:50%;}
.btn-t_w {font-size: 14px; text-align:left;padding-right: 20px; padding-top: 10px;color:#fff; margin:0 auto; position: relative; border: none;letter-spacing: .2em;	margin-top: 0px; overflow:hidden;width:50%; border-bottom:2px dotted #fff;}
.btn-t_w::before {content: ""; display: block;	width:10px; height:10px; border-right: 1px solid #fff; border-bottom: 1px solid #fff;	rotate: -45deg;	position: absolute;	right:10px; top:50%;}
.btn-t_w a{color:#fff;}
.circle-f_01{width:80%; margin:2em auto 3em; display:block; position:relative;}
.circle-f_01_img{position:absolute; top:-20px; right:-10px; width:100%;}
.circle{border-radius:50%; border:4px solid #b3dff3;}
.bg-yellow{background:#fde394; width:100%; padding:1em; color:#542d33; position:relative; margin-top:3em;}
.bg-yellow img{position:absolute; top:-15px; left:50%; transform:translatex(-50%);}
.bg-yellow h4{text-align:center; color:#542d33;}
.bg-yellow dt{border-bottom: 2px dotted #fff; margin-top:1em;}
.bg-yellow dd{margin-left:0; font-size:0.8em;}
.bg-yellow dd:first-letter{margin-bottom:2em;}
.bg-yellow i{color:#fff; padding-right:0.5em;}

.line-img{width:98%; margin:0 auto;}
/*PC用左エリア*/
#eria-left{width:50%; position:fixed; left:0; top:0; height:100dvh;}
#eria-left header{position:absolute; border:3px solid #fff; width:40%; min-width:500px; height:auto;  top: 50%; left: 50%; transform:translate(-50%, -50%); padding:1em;}
#eria-left header .head-contents{background:#fff; height:100%; width:100%; padding:1em 0 120px; position:relative;}
#eria-left header .head-contents i{font-size:20px;}
#eria-left header div img{width:60%; display:block; margin:1em auto;}
#eria-left header div .text-sp{position:absolute; left:2em; bottom:1em; font-size:12px; display:block; width:70%;}
#eria-left header div .img-sp_qr{position:absolute; width:20%; right:1em; bottom:0;}
/*レスポンシブ*/
@media screen and (min-width:798px) and ( max-width:1350px) {
	#eria-left{width:calc(100% - 650px);}
	#eria-left header{width:80%;}
}
@media screen and (max-width: 797px) {
	#eria-left{display:none;}
}
/*PC用右エリア*/
#eria-right{width:200px; position:fixed; right:0; bottom:140px; height:100dvh; font-size:14px; text-align:center;}
#eria-right div{width:100%; position:absolute; padding:2em; right:0; bottom:0;}
/*トップページ設定*/
#front-page{background:#fff; width:100%; border-radius:30px 30px 0 0; overflow:hidden;}
#main-visual{width:100%; border-radius:30px 30px 0 0; position:relative; height:100dvh; overflow:hidden;}
#main-visual svg{position:absolute; bottom:0; z-index:100;}
#main-visual .swiper{border-radius:30px 30px 0 0;}
#main-visual h1{width:30%; font-size:2em; color:#fff; position:absolute; top:40px; left:40px; display:block; text-align:center; line-height:1.2em; z-index:5;}
#main-visual .waku{position:absolute; z-index:5; border-radius:20px; display:block; height:calc(100% - 20px); width:calc(100% - 20px); border:2px solid #fff;  top: 50%; left: 50%; transform:translate(-50%, -50%);}
#main-visual h1 span{font-size:0.5em; color:#fff;}
.about-access{width:100%; padding:5px;height: 100% !important;}
@media screen and (max-width: 768px) {
	#front-page{border-radius:0;}
#main-visual{border-radius:0;}
#main-visual .swiper{border-radius:0;}
}
#eria-news{width:90%; margin:0 auto;}
#eria-news .btn-t_b{margin:3em auto;}
#eria-news dd{font-size:14px; display:block; width:100%; margin:0;}
#eria-news dt{font-size:12px; display:block; width:100%; color:#fde394;}
#eria-taiken{text-align:center; width:100%; margin:3em auto 5em; position:relative;}
#eria-taiken .img-fukidashi{position:absolute; top:-3.5em; left:-0.5em; z-index:5; width:20%; height:auto;}
#eria-taiken h1{font-size:2em; line-height:1.4em; border-bottom:2px dotted #5eb4b5; padding-bottom:20px; display:inline-block;}
#eria-taiken h1 span{font-size:0.5em;}
#eria-taiken p{padding-top:20px; font-size:1.2em;}
#eria-taiken .btn{margin-top:20px; position:relative; background:#fcc6c6;}
#eria-taiken .btn img{position:absolute; right:-2%; top:-3em; width:auto; height:auto;}
#eria-aloha{width:90%;  margin:0 auto 3em;}
#eria-aloha img{margin-bottom:1em;}
#eria-class{padding:3em 0 0; color:#fff; background:#5eb4b5;}
#eria-class .line{padding-top:3em;}
#eria-class .sub-title{margin-top:0;}
#eria-class .leftslide02{margin:3em auto; color:#5eb4b5;}
#eria-class .fukidashi p{color:#542d33;}
#eria-class h2{color:#fff;}
#eria-class p{color:#fff;}
#eria-class .leftslide02 .swiper-slide{background:#fff; padding:3px; border-radius:20px; text-align:left; color:#5eb4b5; height: auto; align-items: stretch;}
#eria-class .leftslide02 img{border-radius:20px 20px 0 0; margin-bottom:10px;}
#eria-class .leftslide02 h3{padding:0 10px; border-bottom:2px dotted #fde394;}
#eria-class .leftslide02 .swiper-slide ul{padding:10px 10px 20px; font-size:80%;}
#eria-class i{color:#fde394; padding-right:5px;}
#eria-class .class-slide{position:relative; }
#eria-class .class-slide .keyvisual{position:absolute; left:-10%; top:-10%; z-index:5;} 
#eria-schedule{width:100%; /*background-image:url(https://anelaokala.com/anelahp/wp-content/uploads/343406416_3425847654400138_6547185548153148488_n.jpg); background-repeat:no-repeat; background-size:100%;*/ }
#eria-schedule .eria-position{position:relative; }
.eria-schedule_calendar{position:relative; z-index:10; width:90%; /*border-radius:500px 500px 20px 20px;*/ margin:0px auto 10px; background:#fff;  padding:0 0; text-align:center; /*border:3px solid #fde394;*/}
.eria-schedule_calendar .kazari{position:absolute; top:-30px; left:50%; transform:translatex(-50%);}
.eria-schedule_calendar .kazari02{position:absolute; bottom:-15px; left:50%; transform:translatex(-50%);}
#eria-voice{width:100%; margin:0 auto 3em; overflow:hidden;}
#eria-voice .eria-photo{position:relative;border:1px solid #5eb4b5; border-radius:20px; width:70%; margin:3em auto; padding:0.5em;}
#eria-voice .eria-photo img{border-radius:20px;}
#eria-voice .eria-photo h3{font-size:18px; margin-top:1em;}
#eria-voice .eria-photo p{font-size:14px; }
#eria-voice .eria-photo .keyvisual{position:absolute; top:-50px; right:50px; z-index:10;}
.leftslide01{position:relative;}
.leftslide01 .swiper-button-prev {
  left: -20%; color:#5eb4b5;
}
/* 次への矢印 */
.leftslide01 .swiper-button-next {
  right: -20%; color:#5eb4b5;
}
#eria-insta{background:#5eb4b5; padding:3em 5%; margin:0 auto; width:100%; color:#fff;}
#eria-insta h2 ,#eria-insta p{color:#fff;}
/*ページ共通設定*/
.main-eria{background:#5eb4b5; color:#fff; padding-bottom:2em; border-radius:30px 30px 0 0;}
.main-eria h2{color:#fff;}
.page-title{padding-top:3em; text-align:center;}
.page-title h2{display: inline-block;
    border-bottom: 2px dotted;
    margin: 0 auto 1em;
    text-align: center;}
.page-maru{background:#fff; border-radius:20px; width:90%; margin:2em auto; overflow:hidden;}
.page-maru h3{font-family: "Suravaram", serif;
  font-weight: 400;
 ?font-style: normal; text-align:center; font-size:26px; margin-bottom:30px; margin-top:0; line-height:2em;}
.page-maru h3 span{font-size:12px; margin-top:-20px;} 
.page-maru h3 br{height:0;}
.page-maru_main{padding:0 20px 50px;}
.sub-title{text-align:center; margin-top:3em; margin-bottom:1em;}
.page-title p{color:#fff; text-align:center;}
.voice-name{font-family:"游ゴシック, YuGothic, メイリオ, Meiryo, Osaka, "ＭＳ Ｐゴシック", "MS PGothic", sans-serif;font-weight: 400;
	font-style: normal;}
	
/*サブタイトルの飾り*/
.fukidashi {
  position: relative;
  display: inline-block;
  margin: 1.5em 0; padding:2px 10px; min-width: 120px; max-width: 100%;
  color: #555;
  font-size: 12px;
  background: #fde394;
  border-radius: 15px;
}

.fukidashi:before {
  content: "";
  position: absolute;
  top: 100%;
  left: 50%;
  margin-left: -6px;
  border: 6px solid transparent;
  border-top: 15px solid #fde394;
}

.fukidashi p {
  margin: 0; color:#542d33;
  padding: 0;
}
.page-contents h4{margin-top: 2em; margin-bottom: 1em; border-bottom: 2px dotted;}
/*画像デザイン*/
.kage{width:60%; display: flex;
  box-shadow: 63px -37px 0px 0px rgba(67, 188, 172, 0.57);}
/*体験申し込み*/
.flow-eria{width:100%; border:1px solid #fae396; margin:0 auto 2em; border-radius:20px;}
.flow-eria h4{background:#fae396; color:#542c35; line-height:3em; font-weight:bold; border-radius:20px 20px 0 0; text-align:center;}
.flow-eria div{padding:1em; color:#542c35;}
.flow-eria div p{color:#542c35; text-align:left;}
.page-maru_main ul{margin-bottom:2em;}
/*生徒さんの声*/
.voice-photo{width:50%; margin:0 auto 3em;}
.voice-photo img{width:100%; border-radius:20px;}
.voice-eria .voice-q{border-bottom:2px dotted #fde394; font-weight:bold; margin-bottom:1em;}
.voice-eria .voice-q p{margin-bottom:0;}
.voice-eria .voice-a{margin-bottom:3em;color:#542d33;}
.voice-eria .voice-a p{margin-bottom:0; }
.post-voice_other{width:100%; margin:0 auto 3em;}
.post-voice_other .swiper-slide{background:#fff; padding:1em 1em 0; border-radius:20px;}
.post-voice_other img{border-radius:20px;}
.post-voice_other h3{border-bottom:2px dotted #5eb4b5; font-size:16px; width:80%; margin:0 auto 0.5em; display:block; line-height:2.4em;}
.post-voice_other p{font-size:12px;}
.post-voice_photo{width:80%; margin:0 auto 3em;}
.post-voice_photo img{width:100%; border-radius:20px;}
/*クラス紹介*/
.page-access .sub-title h3{margin-bottom:0;}
.page-access .sub-title .class-name{font-size:0.8em;}
.category-access_text{width:100%; margin:1em auto 3em;}
table{width:100%; font-size:14px; border-collapse: collapse;
	border-spacing: 0; border:1px solid #fde394;}
th{width:30%; text-align:left; border-bottom:1px solid #fff; background:#fde394; color:#252525; padding:5px; font-weight:normal;}
td{width:70%; text-align:left; border-bottom:1px solid #fde394; padding:5px; color:#252525;}
.no-border th{border-bottom:none;}
.no-border td{border-bottom:none;}
.category-access_text .sub-title{margin-top:0;}
.category-access_text h3{text-align:center;line-height: 1.2em; ?margin:0 auto 1em;}
.category-access_text h3 span{font-size:0.6em;}
.category-access_text li{line-height:3em;}
.faq-menu{width:100%; margin:2em auto 0;}
.faq-menu li{width:100%; line-height:2.6em; text-align:center; background:#5eb4b5; margin:1em 0; border-radius:20px; font-weight:bold; transition: 0.5s; position:relative;}
.faq-menu li:before{position: absolute; content: '→'; right:5%; color:#fff; top:50%; transform:translatey(-50%);}
.faq-menu li a{color:#fff; display:block;}
.faq-menu li:hover{background:#c4e4e4;transition: 0.5s;}
.cp_qa02 {
  margin: 0 auto;
}
.cp_qa02 .cp_actab input[type=checkbox] {
  display: none;
}
.cp_qa02 .cp_actab {
  padding: 20px 0;
  border-bottom: 1px dotted #fde394;
}
/*質問テキスト*/
.cp_qa02 label {
  position: relative;
  display: flex;
  align-items: center;
  font-size: 100%;
  width: calc(100% - 70px);
  margin: 0 0 0 50px;
  padding: 10px;
  cursor: pointer;
}
/*＋アイコン*/
.cp_qa02 label::before {
  position: absolute;
  content: '+';
  display: flex;
  align-items: center;
  justify-content: center;
  font-size: 210%;
  font-weight: bold;
  margin-left: -50px;
  padding: 0 0 0 0;
  transition: 0.4s ease;
}
.cp_qa02 .cp_actab input[type=checkbox]:checked ~ label::before {
  transform: rotate(45deg);
}
/*答えテキスト*/
.cp_qa02 .cp_actab-content {
  font-size: 1em; color:#542d33;
  position: relative;
  overflow: hidden;
  height: 0;
  margin: 0 40px;
  padding: 0 14px;
  transition: 0.4s ease;
  opacity: 0;
}
.cp_qa02 .cp_actab input[type=checkbox]:checked ~ .cp_actab-content {
  height: auto;
  padding: 14px;
  opacity: 1;
}

/*沿革*/
.cp_timeline04 {
  position: relative;
  margin: 3em auto;
  padding-bottom: 2em;
}
.cp_timeline04:before {
  position: absolute;
  top: 0px;
  top: -30px;
  left: 15px;
  width: 3px;
  height: 100%;
  content: '';
  background: #fde394;
}
.cp_timeline04 .timeline_item {
  margin: 0px 0px 0px 50px;
}
.cp_timeline04 .timeline_item .time_date .time {
  font-size: 1em; line-height:1em;
  font-weight: bold;
  position: relative;
  margin: 0 0 0.5em;
  letter-spacing: 3px;
 color:#542d33;
}
.cp_timeline04 .timeline_item .time_date .time:before {
  position: absolute;
  top: 50%;
  left: -42px;
  width: 10px;
  height: 10px;
  content: '';
  transform: rotate(45deg);
  border: 3px solid #fde394;
  background: #fff;
}
.cp_timeline04 .timeline_item .time_date .flag {
  font-size: 1em; border-bottom:1px solid #fde394;
  font-weight: bold;
  margin:0;
  color: #542d33;
}

.cp_timeline04 .timeline_item .time_date .flag .point-01{font-size:80%;color:#5eb4b5;}

.cp_timeline04 .timeline_item .time_date .flag .point-award{color:#5eb4b5;}
.cp_timeline04 .timeline_item .desc {
  font-size: 1em;
  line-height: 20px;
  margin-top: 10px;
  /*padding-left: 20px;*/
  /*border-left: 1px solid #fae591;*/
  margin-bottom: 60px;
}
.cp_timeline04 .timeline_item .desc img {margin-bottom:1em;}

@media only screen and (max-width: 767px) {
  .cp_timeline04:before {
    left: 15px;
  }
  .cp_timeline04 .timeline_item .time_date .time:before {
    left: -32px;
  }
  .cp_timeline04 .timeline_item {
    margin: 0px 0px 0px 40px;
  }
  .cp_timeline04 .timeline_item .desc {
    padding-left: 0px;
    border-left: none;
  }
}
/*スライド()*/
.swiper {
      width: 100%;
      height: 100%;
    }

    .swiper-slide {
      text-align: center;
      font-size: 18px;
      background: #fff;
      display: flex;
      justify-content: center;
      align-items: center;
    }

    .swiper-slide img {
      display: block;
      width: 100%;
      height: 100%;
      object-fit: cover;
    }

@keyframes zoomUpAnimation {
0% {
    transform: scale(1);
}
100% {
    transform: scale(1.15);
}
}
.swiper-slide-active .swiper-img,
.swiper-slide-duplicate-active .swiper-img,
 .swiper-slide-prev .swiper-img {
animation: zoomUpAnimation 12s linear infinite;
}
 .swiper-slide img {
height: auto;
width: 100%;
}


/*波のデザイン*/
canvas {
  position: absolute;
  bottom: -1%;
  left: 0;
  width: 100%;
z-index:5;
}
/*かめふわふわ*/
.fuwafuwa {
-webkit-animation:fuwafuwa 3s infinite linear alternate;
animation:fuwafuwa 3s infinite linear alternate;
}

@-webkit-keyframes fuwafuwa {
0% {-webkit-transform:translate(0, 0) rotate(-5deg);}
50% {-webkit-transform:translate(0, -5px) rotate(0deg);}
100% {-webkit-transform:translate(0, 0)rotate(5deg);}
}

@keyframes fuwafuwa {
0% {transform:translate(0, 0) rotate(-5deg);}
50% {transform:translate(0, -5px) rotate(0deg);}
100% {transform:translate(0, 0)rotate(5deg);}
}
/*テキストくるくる*/
.keyvisual{
  position: relative;
}

.keyvisual__scroll{
  width:100px;
  position: absolute;
}

.keyvisual__scroll--circle{
  height: auto;
  animation: rotate 15s linear infinite;
}

@keyframes rotate {
  0% {
    transform: rotate(0);
  }
  100% {
    transform: rotate(360deg);
  }
}
/*フラふわふわ
.fulafula {
-webkit-animation:fulafula 3s infinite linear alternate;
animation:fulafula 3s infinite linear alternate;
}
.fulafula img{width:auto;}
@-webkit-keyframes fulafula {
0% {-webkit-transform:translate(0, 0) rotate(-5deg);}
30% {-webkit-transform:translate(0, 0) rotate(5deg);}
60% {-webkit-transform:translate(0, 0) rotate(ー5deg);}
100% {-webkit-transform:translate(0, 0)rotate(5deg);}
}

@keyframes fulafula {
0% {transform:translate(0, 0) rotate(-5deg);}
30% {transform:translate(0, 0) rotate(5deg);}
60% {transform:translate(0, 0) rotate(-5deg);}
100% {transform:translate(0, 0)rotate(5deg);}
}*/

/*スライダー右から左*/
/* スライドの動き等速 */
.slide-r-l{margin-bottom:5px;}
.slide-r-l .swiper-wrapper, .slide-l-r .swiper-wrapper{
  transition-timing-function: linear;
}


/* 画像のサイズ調整 */
.slide-r-l.swiper-slide img ,.slide-l-r.swiper-slide img{
  height: auto;
	width: 100%;}
.slide-r-l .swiper-slide img {border-radius:10px;}
.slide-l-r .swiper-slide img {border-radius:10px;}
.voice-contents ul{display:flex; width:100%; gap:20px; flex-wrap:wrap; padding:0 0; margin:0 0 3em;}
.voice-contents ul li{width:calc((100% - 20px) / 2); text-align:center; margin-bottom:1em; font-size:16px;}
.voice-contents ul li .voice-photo{margin-bottom:1em; width:100%;}
.voice-contents ul li h3{margin-bottom:0; border-bottom:2px dotted #fde394; font-size:14px;}
.page-title ul{width:100%; display:flex; margin:2em 0 0; padding:0; gap:10px; justify-content: center;
  align-items: center;}
.page-title ul li{display:block; background:#fde394; padding:3px; color:#542d33; border-radius:10px; font-size:14px; line-height:1.6em;}
.reserve-btn{width:50%; margin:2em auto;}

.photo{width:80%; margin:0 auto 2em; text-align:center; font-size:90%;}
.photo img{border-radius:20px;}
.page-classes h4{text-align:center; margin:2em 0; border-bottom:2px dotted #fde394;}
.page-classes ul{margin:0; padding:0;}
.page-classes h5{font-size:14px; margin-bottom:0.5em;}
.page-classes h5:before{content: url("https://anelaokala.com/anelahp/wp-content/uploads/icon-triangle.png");display: inline-block; width: 20px; height: 20px;  margin-right:10px;}
.page-classes table{margin-bottom:1em;}
.voice-contents h4{text-align:center; margin-bottom: 2em;
    line-height: 2em;
    background: #5eb4b5;
    border-radius: 30px;
    color: #fff;
    font-weight: normal;}
.voice-contents .btn-t_b{margin-bottom:3em;}

.class-price{border-top:2px dotted #252525; text-align:left; padding-top:1em; margin-bottom:1em;}
.class-price span{font-size:80%;}
.right{text-align:right;}
.link-voice{font-size:12px; text-align:right;}

.class-photo{position:relative; margin-bottom:1em;}
.class-photo h6{color:#252525; z-index:1;}
.sp-foot-btn{background:#fcc6c6; position:fixed; bottom:0; z-index:999999; display:block; text-align:center; width:100%;transition: .5s; color:#542d33; padding:10px 0; font-size:1.4em;}
.sp-foot-btn span{font-size:60%;}
.sp-foot-btn.hide{transform: translateY(100%);}
@media screen and (min-width: 769px) {
	.sp-foot-btn{display:none;}
}

.history{font-size:120%; color:#542d33; padding:20px 0; margin-top:1em;}
.history:before{content: url(https://anelaokala.com/anelahp/wp-content/uploads/icon-triangle.png);
    display: inline-block;
    width: 20px;
    height: 20px;
    margin-right: 10px;}
.cp_history {
  margin: 0 auto;
}
.cp_history .cp_actab input[type=checkbox] {
  display: none;
}
.cp_history .cp_actab {
  border-bottom: 2px dotted #fde394;
}
/*質問テキスト*/
.cp_history label {
  position: relative;
  display: flex;
  align-items: center;
  font-size:1em;
  width: calc(100% - 70px);
  margin: 0 0 0 50px;
  padding: 10px;
  cursor: pointer;
}
/*＋アイコン*/
.cp_history label::before {
  position: absolute;
  content: '+'; color:#fde394;
  display: flex;
  align-items: center;
  justify-content: center;
  font-size: 210%;
  font-weight: bold;
  margin-left: -50px;
  padding: 0 0 0 0;
  transition: 0.4s ease;
}
.cp_history .cp_actab input[type=checkbox]:checked ~ label::before {
  transform: rotate(45deg);
}
/*答えテキスト*/
.cp_history .cp_actab-content {
  font-size: 1em;
  position: relative;
  overflow: hidden;
  height: 0;
  transition: 0.4s ease;
  opacity: 0;
}
.cp_history .cp_actab input[type=checkbox]:checked ~ .cp_actab-content {
  height: auto;
  opacity: 1;
}
.voice-next{width:60%; margin:2em auto; background:#fff; padding:20px; border-radius:20px; text-align:center;}
.voice-next img{border-radius:20px;}

.eria-foot{text-align:center; padding-bottom:100px;}
.eria-foot img{width:60%; display:block; margin:0 auto;}
.eria-foot ul{display:flex; flex-wrap: wrap; width:90%; margin:2em auto; gap:20px; text-align:center; justify-content: center;
  align-items: center;}
.eria-foot a{color:#fff;}
.eria-foot a i{color:#fff;}
.eria-foot p{border-top:1px solid #fff; padding-top:2em; display:block; width:90%; margin:0 auto;}
.eria-foot .btn{color:#252525;}

.leftslide04{width:100%;}
.leftslide04 .swiper-slide{display:block;}
.leftslide04 p{font-size:80%; padding-top:0.5em;}

.award-eria{text-align:center; margin-bottom:2em;}
.award-year{font-weight:bold; margin-bottom:0;}
/*.award-title{border-bottom:2px dotted #fde394;}*/

.leftslide05{width:100%;}
.leftslide05 .swiper-slide{display:block;}
.leftslide05 p{font-size:80%; padding-top:0.5em;}

.leftslide06{width:100%;}
.leftslide06 .swiper-slide{display:block;}
.leftslide06 p{font-size:80%; padding-top:0.5em;}
.leftslide07{width:100%;}
.leftslide07 .swiper-slide{display:block;}
.leftslide07 p{font-size:80%; padding-top:0.5em;}

.qxCTlb{width:100%!important;border-radius: 100px!important; line-height: 2em!important; font-size: 16px!important; margin-bottom: 1em!important; letter-spacing: 0.2em!important; font-weight:normal!important;}