@charset "utf-8";


/*===========================================================*/
/* Common Contents */
/*===========================================================*/

body{
	background-image: url(../img/all_bg.jpg);
	background-repeat: repeat;
	font-family: "Open Sans", sans-serif;
	color: #333;
	font-size:1rem;
	line-height:1.85;
	-webkit-font-smoothing: antialiased;
	-moz-osx-font-smoothing: grayscale;
	-webkit-text-size-adjust: 100%; 
	word-wrap: break-word;
	box-sizing: border-box;
}

@media  (max-width:768px) {
body{
	font-size:0.9rem;
	line-height:1.5;
}
}

ul{
	margin:0;
	padding: 0;
	list-style: none;
}

a{
	color: #333;
	text-decoration: none;
    outline: none;
}

img{
    width:100%;
    height: auto;
}

*{
    box-sizing: border-box
}

/* font-family */

.header-area{
    font-family:'Sawarabi Mincho';
}

#g-nav-list li:nth-child(1),
#footer dl dd{
    font-family:'Parisienne', cursive;
}

#g-nav-list li:nth-child(1),
#footer dl dd{
    font-family:'Parisienne', cursive;
}

/* heading */


#wrapper {
	background-attachment: scroll;
	background-image: url(../img/all_bg.jpg);
	background-repeat: repeat-x;
	background-position: top;
	width: 100%;
	height: 100%;
	margin-right: auto;
	margin-left: auto;
}
#page {
    width: 100%;
    background-attachment: scroll;
    background-image: url(../img/bg_pic.webp);
    background-repeat: no-repeat;
    background-position: center top;
    margin: auto;
    background-size: contain;
}



/* area */
.inner{
    width:100%;
    margin:0 auto;
    padding:30px;
}

@media  (max-width:940px) {
.inner{
    padding:30px;
}
}

@media  (max-width:768px) {
.inner{
    padding:10px;
}
}
@media  (max-width:550px) {
.inner{
    padding:0px;
}
}

/* header */

#header{
    padding:30px 70px 40px 70px;
    display: flex;
    justify-content: space-between;
    align-items: center;
    text-transform: uppercase;
}

#header h1 a{
    color: #59BB98;
    font-size: 1rem;
    letter-spacing: 0.5em;
    font-weight: bold;
}


#header .header-area{
    display: flex;
    justify-content: space-between;
    align-items: center;
}

#header ul{
    font-weight: bold;
    letter-spacing: 0.1em;
    margin: 0 20px 0 0;
}

#header li,
#header dl,
#header dt,
#header dd{
    display: inline-block;
}

#header li:first-child::after{
    content:'/';
    padding:0 10px;     
}

#header .float3{
    border-radius: 30px;
}

@media  (max-width:960px) {
#header {
    padding: 5px 30px 0 90px;
    }
}

@media  (max-width:870px) {
#header {
    padding: 5px 30px;
    justify-content: center;
    }  
#header ul{
    display: none;
    }
#header .float3{
    display: none;
}
}

@media  (max-width:768px) {
#header h1 a{
padding-top: 20px;
    font-size: 0.8rem;
    }
}



/* gnavi */

#g-nav-list li:nth-of-type(1) a{
    font-size: 2rem;
    text-transform: none;
    font-weight: normal;
    line-height: 1;
    white-space: nowrap;
    margin: 20px 0 20px 0;
}

#g-nav-list li:nth-of-type(2){
    animation-delay: .02s;
	font-size: 0.8em;
    font-weight: normal;
}
#g-nav-list li:nth-of-type(3){
    animation-delay: .03s;
	font-size: 0.8em;
    font-weight: normal;
}
#g-nav-list li:nth-of-type(4){
    animation-delay: .04s;
		font-size: 0.8em;
    font-weight: normal;
}
#g-nav-list li:nth-of-type(5){
    animation-delay: .05s;
		font-size: 0.8em;
    font-weight: normal;
}
#g-nav-list li:nth-of-type(6){
    animation-delay: .06s;
		font-size: 0.8em;
    font-weight: normal;
}
#g-nav-list li:nth-of-type(7){
    animation-delay: .07s;
			font-size: 0.8em;
    font-weight: normal;
}
#g-nav-list li:nth-of-type(8){
    animation-delay: .08s;
		font-size: 0.8em;
    font-weight: normal;
}
#g-nav-list li:nth-of-type(9){
    animation-delay: .09s;
		font-size: 0.8em;
    font-weight: normal;
}
#g-nav-list li:nth-of-type(10){
    animation-delay: .1s;
		font-size: 0.8em;
    font-weight: normal;
}
#g-nav-list li:nth-of-type(11){
    animation-delay: .2s;
		font-size: 0.8em;
    font-weight: normal;
}
#g-nav-list li:nth-of-type(12){
    animation-delay: .3s;
		font-size: 0.8em;
    font-weight: normal;
}
#g-nav-list li:nth-of-type(13){
    animation-delay: .4s;
		font-size: 0.8em;
    font-weight: normal;
}
#g-nav-list li:nth-of-type(14){
    animation-delay: .5s;
		font-size: 0.8em;
    font-weight: normal;
}
#g-nav-list li:nth-of-type(15){
    animation-delay: .6s;
		font-size: 0.8em;
    font-weight: normal;
}
#g-nav-list li:nth-of-type(16){
    animation-delay: .7s;
		font-size: 0.8em;
    font-weight: normal;
}
#g-nav-list li:nth-of-type(17){
    animation-delay: .8s;
		font-size: 0.8em;
    font-weight: normal;
}

@media  (max-width:480px) {
#g-nav-list li:nth-of-type(1) a{
    font-size: 1rem;
	display: none;
	 margin: 0;
}
}
    
/* footer */

#footer{
background-color: #B1DBCB;
    border-top: 1px solid #ccc;
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    justify-content: space-between;
	letter-spacing: 0.2em;
	color:#595555;
}

#footer dl{
     width:30%;   
}

#footer dl dt{
    font-size: 0.8rem;
}

#footer dl dd{
    font-size: 2rem;
}

#footer .footer_popora{
    font-size: 1rem;
	font-family:'Sawarabi Mincho';
}

#footer .footer-list{
     width:65%; 
    text-align: right;
}

#footer ul li{
    display: inline-block;
    padding: 0 13px;
    font-size: 0.8rem;
    line-height: 2;
	background-color: aliceblue;
}

#footer small{
    text-align: right;
    margin: 20px 0 0 0;
    display: block;
    width: 100%;
    font-size: 0.7rem;
}

#footer #page-top span{
    display: inline-block;
  width: 13px;
  height: 13px;
  border-top: 4px solid #fff;
  border-left: 4px solid #fff;
  transform: rotate(45deg);
}


@media  (max-width:900px){
#footer dl,
#footer .footer-list,
#footer small{
    width:100%;
    text-align: center;
}
}

@media  (max-width:900px) {
    #footer dl{
        margin: 50px 0;
    }
}

@media  (max-width:768px) {

#footer dl dd{
    font-size: 1.5rem;
}
#footer ul li{
    font-size: 0.8rem;
    line-height: 2;
	margin-bottom: 5px;
}
#footer img{
     width:65%; 
	 margin-bottom: auto;
} 
}


/* container */

#container{
    padding:0 40px 0 40px;
}

@media (max-width:960px) {
#container{
    padding:0 30px;
}
    
}


/* head-area */

.head-area{
    position: relative;
    height: 30vh;
    display: flex;
    align-items: center;
}

.head-lead{
    padding: 70px 0 30px 50px;
}

.head-lead h2{
    font-size: 3vw;
    letter-spacing: 0.2em;
    line-height: 1.4;
    margin: 0 0 20px 0;
	color: dimgray;
}


.head-lead p{
    font-size: 1.1rem;
    line-height: 2;
	font-weight: bolder;
    margin: 0 0 40px 70px;
	color: dimgray;
}


@media (max-width:1190px) {
.head-area{
    height: 50vh;
}
.head-lead p{
    font-size: 1.1rem;
    margin: 0 0 40px 50px;
}
}


@media (max-width:960px) {
.head-area{
    height: 50vh;
}
.head-lead h2{
    letter-spacing: 0.15em;
    }
}

@media  (max-width:768px) {
.head-area{
    height: 40vh;
}
.head-lead{
padding: 0px;
    text-align: left;
}
.head-lead p{
padding: 30px 0px 0px;
	font-size: 0.9em;
}

.head-lead h2{
padding: 0px 0px 30px 0px;
text-align: left;
    }

}

@media  (max-width:550px) {
.head-area{
    height: 30vh;
}
.head-lead{
padding: 0px;
    text-align: center;
}
.head-lead p{
padding: 50px 0px 10px;
	text-align: center;
	font-size: 0.8em;
}

.head-lead h2{
padding: 0px 0px 30px 0px;
text-align: center;
    }

}


@media  (max-width:380px) {
.head-area{
    height: 30vh;
}
.head-lead{
padding: 0px;
    text-align: center;
}
.head-lead p{
padding: 30px 0px;
    margin: 0;
	text-align: center;
	font-size: 0.7em;
}

.head-lead h2{
padding: 0px 0px 30px 0px;
text-align: center;
    }

}


/* link */

#link{
	padding: 2%;
}
.item-list{
  display: flex;
  justify-content: center; /* 中央寄せ */
}
.item-list .item{
  padding: 20px;  
}
#link img{
	zoom: 90%;
}

@media  (max-width:600px) {
.item-list .item{
  padding: 5px;  
}
}

@media  (max-width:600px) {
.item-list{
  display: block;
  justify-content: center; /* 中央寄せ */
}
}

/* contact */

#contact{
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    justify-content: space-between;
    flex-direction: row-reverse;
	background-color: #F4F0E9;
}

#contact .contact-img{
    width:70%;
    min-height: 300px;
    background:url("../img/contact2.webp") no-repeat center;
    background-size: cover;
}

#contact .contact-area{
    width:25%;
    text-align: center;
	letter-spacing: 0.2em;

}

#contact .contact-area h2{
color: #59BB98;
     font-size:1.3rem;   
    margin:0 0 10px 0;
}

#contact .contact-area dt{
     font-size:0.8rem;   
    margin:0 0 10px 0;
	
}

#contact .contact-area dd{
    font-size: 1.2rem;
    margin:0 0 30px 0;
}

@media  (max-width:1190px) {
#contact .contact-img{
    width:60%;
    }
#contact .contact-area{
    width:35%;
    }
}

@media (max-width:768px) {
#contact .contact-img{
    width:48%;
    }
#contact .contact-area{
    width:48%;
    }
}

@media (max-width:600px) {
#contact .contact-img,
#contact .contact-area{
    width:100%;
    }
#contact .contact-img{
        margin:0 0 50px 0;
}
#contact .contact-btn{
        margin:0 0 30px 0;
}
}




/* PageTitle */

.pageTitle{
    font-family:'Sawarabi Mincho';
}

.pageTitle-block{
    padding: 20px;
	text-align: center;
}

.pageTitle-block h1  {
    font-weight: normal;
    font-size: 3em;
    letter-spacing: 0.1em;
    line-height: 1;
    color:#5E6363;
}

.pageTitle-block h1:first-letter {
  font-size: 3em;
  color:#F7C1AF;
}

.pagetitle_jp{
    font-size:1.3em;
	color:#666666;
	letter-spacing: 0.1em;
	text-align: center;
}

.pagetitle_op{
position: relative;
right:500px;
top:80px;
    font-size:1.3em;
	color:#666666;
	letter-spacing: 0.1em;
	padding: 0px  0px 0px 100px;
	font-family: 'Noto Sans JP', sans-serif;   
	text-align: right
}

@media (max-width:1190px) {
.pagetitle_op{
right:300px;
}
}


@media (max-width:940px) {
.pagetitle_op{
right:200px;
}
}

@media (max-width:768px) {
.pageTitle-block h1  {
    font-size: 2.5em;
    letter-spacing: 0.1em;
}

.pageTitle-block h1:first-letter {
  font-size: 3em;
  color:#F7C1AF;
}

.pagetitle_jp{
    font-size:1em; 
}
.pagetitle_op{
right:100px;
top:60px;
}

}

@media (max-width:600px) {
.pageTitle-block h1  {
    font-weight: normal;
    font-size: 2em;
    letter-spacing: 0.1em;
    line-height: 1;
    color:#5E6363;
}
.pagetitle_op{
font-size:1em;
right:80px;
top:50px;
}
}


@media (max-width:440px) {
.pageTitle-block h1  {
    font-size: 2em;
    letter-spacing: 0.1em;
}

.pageTitle-block h1:first-letter {
  font-size: 2em;
}

.pagetitle_jp{
    font-size:0.9em;
	letter-spacing: 0.1em;
}
.pagetitle_op{
right:30px;
top:20px;
}
}


/* ↓↓↓↓↓見出し ↓↓↓↓↓ */


.heading02{
	margin: 50px auto 50px;
	text-align: center;
} 

.heading02{
	position: relative;
	color: #59BB98;
	font-size: 1.7em;
	text-align: center;
	letter-spacing: 0.2em;
	border-bottom: 5px solid #DDDDDD;
	margin: 0px auto 50px auto;
	padding-bottom: 10px;
	width: 80%;
}

.heading02::after {
	content: '';
	position: absolute;
	bottom: -5px;
	left: 50%;
	transform: translateX(-50%);
	width: 70px;
	height: 5px;
	background-color: #59BB98;
}

@media  (max-width:768px) {
.heading02{
	font-size: 1.6em;
	letter-spacing: 0.05em;
	width: 80%;
}
} 

@media  (max-width:440px) {
.heading02{
	font-size: 1.4em;
	letter-spacing: 0.05em;
	width: 90%;
}
} 

.heading03 {
	display: flex;
	justify-content: center;
	align-items: center;
	font-size: 1.5em;
	text-align: center;
	color:#727171;
	letter-spacing: 0.2em;
}

.heading03::before,
.heading03::after {
	content: '';
	width: 70px;
	height: 3px;
	background-color: #59BB98;
}

.heading03::before {
	margin-right: 20px;
}
.heading03::after {
	margin-left: 20px;
}

@media  (max-width:440px) {
.heading03 {
	font-size: 1.3em;
	letter-spacing: 0.2em;
}

.heading03::before,
.heading03::after {
	content: '';
	width: 40px;
	height: 3px;
	background-color: #59BB98;
}

.heading03::before {
	margin-right: 20px;
}
.heading03::after {
	margin-left: 20px;
}

}

.heading00 {
    position: relative;
    overflow: hidden;
    padding: 20px 0px 20px 150px;
    border: 1px solid #59BB98;
	font-size: 1.3em;
		letter-spacing: 0.2em;
		text-align: left;
		font-weight:bolder;
}

.heading00:before {
    position: absolute;
    top: -107%;
    left: -24px;
    content: '';
    width: 150px;
    height: 230%;
    -webkit-transform: rotate(35deg);
    transform: rotate(35deg);
    background: #59BB98;
}
.heading00 span {
    font-size: 2em;
    position: absolute;
    z-index: 1;
    top: 0;
    left: 18px;
    color: #fff;
}


@media  (max-width:440px) {
.heading00 {
    padding: 5px 0px 5px 100px;
    border: 1px solid #59BB98;
	font-size: 1.2em;
		letter-spacing: 0.2em;
		text-align: left;
		font-weight:bolder;
}

.heading00:before {
    position: absolute;
    top: -107%;
    left: -24px;
    content: '';
    width: 100px;
    height: 230%;
    -webkit-transform: rotate(30deg);
    transform: rotate(30deg);
    background: #59BB98;
}
.heading00 span {
    font-size: 1.3em;
    left: 10px;
}
}




.heading04 {
	display: flex;
	justify-content: center;
	align-items: center;
	font-size: 1.3em;
	text-align: center;
	letter-spacing: 0.1em;
}

.heading04::before,
.heading04::after {
	content: '';
	width: 3px;
	height: 40px;
	background-color: #e3bf00;
}

.heading04::before {
	margin-right: 30px;
	transform: rotate(-35deg)
}
.heading04::after {
	margin-left: 30px;
	transform: rotate(35deg)
}



.heading05 {
  position: relative;
  padding: 0.6em;
  background: #FBD8AA;
}

.heading05:after {
  position: absolute;
  content: '';
  top: 100%;
  left: 30px;
  border: 15px solid transparent;
  border-top: 15px solid #FBD8AA;
  width: 0;
  height: 0;
}


@media  (max-width:440px) {

}
/* ↑↑↑↑↑見出し色々↑↑↑↑↑ */



/* ↓↓↓↓↓ボタン ↓↓↓↓↓ */

.button09 a {
  display: flex;
  justify-content: space-between;
  align-items: center;
  position: relative;
  margin: 30px auto;
  padding: 1em 2em;
  width: 300px;
  color: #3d9ec8;
  font-size: 18px;
  font-weight: 700;
  background-color: #F9FF83;
  transition: 0.3s;
}

.button09 a::before {
  content: '';
  position: absolute;
  top: -5px;
  left: -5px;
  width: calc(100% - 4px);
  height: calc(100% - 4px);
  border: 2px solid #3d9ec8;
  transition: 0.2s;
}

.button09 a::after {
  content: '';
  width: 5px;
  height: 5px;
  border-top: 3px solid #3d9ec8;
  border-right: 3px solid #3d9ec8;
  transform: rotate(45deg);
}

.button09 a:hover::before {
  top: 0;
  left: 0;
}

.button09 a:hover {
  text-decoration: none;
  background-color: #a0c4d3;
}



/* 019 */
.button019 a {
    background: #eee;
    border-radius: 3px;
    position: relative;
    display: flex;
    justify-content: space-around;
    align-items: center;
    margin: 0 auto;
    max-width: 280px;
    padding: 10px 25px;
    color: #313131;
    transition: 0.3s ease-in-out;
    font-weight: 500;
}
.button019 a:after {
  content: "";
  position: absolute;
  top: 50%;
  bottom: 0;
  right: 2rem;
  font-size: 90%;
  display: flex;
  justify-content: center;
  align-items: center;
  transition: right 0.3s;
  width: 6px;
  height: 6px;
  border-top: solid 2px currentColor;
  border-right: solid 2px currentColor;
  transform: translateY(-50%) rotate(45deg);
}
.button019 a:hover {
  background: #6bb6ff;
  color: #FFF;
}
.button019 a:hover:after {
  right: 1.4rem;
}



@media  (max-width:440px) {
.button09 a {
  width: 280px;
  font-size: 15px;
}
}
/* ↑↑↑↑↑ボタン↑↑↑↑↑ */




/*===========================================================*/
/* about*/
/*===========================================================*/

/* greeting */

#greeting-content{
max-width: 1400px;
    display: flex;
    justify-content:space-between;
    align-items: center;
    flex-wrap: wrap;
    margin:50px auto 0px;
}

#greeting-content .img{
    width:50%;
	position: relative;
	top:-150px;

}

#greeting-content .content{
   width:45%; 
    text-align: left;
}



#greeting-content h3{
	font-size: 1.6rem;
    margin:  30px 0 30px 0;
	text-align: left;
	color: #59BB98;
	letter-spacing: 0.1em;
}

#greeting-content p{
	font-size: 1em;
    line-height: 2;
    margin: 0 0 20px 0;
}


@media  (max-width:940px) {
#greeting{
        margin:0 0 20px 0;
    }
#greeting h2{
	font-size: 1.3em;
	width: 80%;
}
#greeting-content .img{
    width:60%;
		margin: auto;
			top:-10px;

}

#greeting-content .content{
	width:100%; 
   text-align: left;
}  
#greeting-content p{
    font-size:0.9rem;
    letter-spacing: 0.1em;
    } 
}


@media  (max-width:600px) {
#greeting-content h3{
	font-size: 1.2em;
}
#greeting-content .img{
    width:80%;
		margin: auto;
			top:-20px;

}
}

greeting-content .txt-r{
     text-align: right;
}


/* profile */

#profile {
    margin:0px auto 50px ;
}


.profile-area{
    margin:auto ;
max-width: 1400px;
    display: flex;
    justify-content: space-between;
    flex-wrap: wrap;
}

.profile-area p{
font-size: 0.8em;
    margin: 0 0 30px 0;    
}

.profile-area span{
    font-size: 1rem;
	font-weight: normal;
	font-family: 'Noto Sans JP', sans-serif; 
}

.profile-img{
    width:45%;
}

.profile-content{
    width:50%;
}

#profile ul, ol {
  padding: 30px;
  font-family: 'Noto Sans JP', sans-serif; 
  color: #505050;
  font-size: 1.12em;
}
#profile ul li, ol li {
  line-height: 1.5;
  padding: 0.5em 0;
}

#profile ul li:before{ 
  display:inline-block; 
  vertical-align: middle;
  /*以下白丸つくる*/
  content:'';
  width:1em;
  height: 1em;
  background: #59BB98;
  border-radius: 50%;
  margin-right: 8px;
}


@media (max-width:960px) {
#profile{
    margin:0 0 30px 0;
}  

.profile-area{
    display: block;
    }
.profile-img{
    width: 80%;
    margin:0 auto;
    }
.profile-content{
    width:100%;
}

}

@media  (max-width:550px) {
.profile-content{
    padding:0;
} 
.profile-img{
    width:80%;
	margin:0 auto;
}
#profile ul {
  padding: 0;
	font-size: 0.8em;
}
}

/* achievement */

#achievement{
    margin:50px auto 50px;
}
#achievement h2{
    margin:0px auto 30px;
	letter-spacing: 0.2em;
	text-align: center;
}



.achievement-content .midashi{
	color: #59BB98;
    font-size:  1.3em;
	font-weight: normal;
	letter-spacing: 0.2em;
	text-align: center;
	margin:0px 0 30px 0;
}


.achievement-content{
    width:90%;
	margin: auto;
}

.achievement-content dl{
letter-spacing: 0.1em;
  padding: 1em 0 1em 0;
  border-bottom: dashed 1px #cccccc;
}

.achievement-content dt{
font-size: 0.9em;
  color: #ffffff;/*文字色*/
  padding: 0.5em;/*文字周りの余白*/
  display: inline-block;/*おまじない*/
  line-height: 1.3;/*行高*/
  background: #59BB98;/*背景色*/
  vertical-align: middle;
  border-radius: 25px 0px 0px 25px;/*左側の角を丸く*/
}

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

.achievement-content dd{
font-size: 1em;
  line-height: 1.5;
  padding: 1em 0  0  1em;
}

@media (max-width:960px) {
#achievement{
    margin:0 0 50px 0;
}  
}

@media  (max-width:768px) {
.achievement-content{
    width:100%;
}
.achievement-content .midashi{
    font-size:  1.2em;
}
}

@media  (max-width:550px) {
.achievement-content{
    padding:10px;
} 
.achievement-content .midashi{
    font-size:  1em;
}

.achievement-content dt{
font-size: 0.8em;
}
.achievement-content dd{
font-size: 0.9em;
}
}


/* access */

#access{
    position: relative;
    margin:0 auto 100px ;
    padding: 130px 0 0 0;
    text-align: center;
}

#access::before{
    content:"";
    width:1px;
    height: 100px;
    background:#333;
    position: absolute;
    left:50%;
    top:0;
}

#access h2{
text-align: center;
     margin: 0 auto 30px;
    font-size:2.5rem;
    letter-spacing: 0.1em;
	color: #59BB98;
}


#access h2 span{
    font-size: 1rem;
    display: block;
}

#access ul{
    margin: 20px 0 50px 0;
    letter-spacing: 0.1em;
}

#access li,
#access dl,
#access dt,
#access dd{
    display: inline-block;
}

#access dt{
    padding: 0 10px 0 0;
}

#access dd{
    font-size: 1.5rem;
}


#access li:first-child::after{
    padding:0 10px;     
}

#access map{
width: 100%;
    padding: 30px 0 0;
}


@media  (max-width:960px) {
#access h2{
    font-size: 2rem;
    }
}

@media  (max-width:768px) {
#access h2{
    font-size: 1.5rem;
	text-align: center;
    }
}


@media  (max-width:530px) {
    #contact li{
        display: block;
    }   
}



@media  (max-width:768px) {
#access dd{
    font-size: 1rem;
}
}


@media (max-width:530px) {
#access li:first-child::after{
    content:'';
    padding:0;     
}
}


/*===========================================================*/
/* Care */
/*===========================================================*/



/* care */


#care{
	margin: 50px auto 50px;
	text-align: center;
} 

#care p {
    font-size:1.2rem;
    letter-spacing: 0.1em;
	line-height: 3em;
	}

#care .care-comment{
    font-size: 1.5rem;
	font-weight: bolder;
	font-family: 'Noto Sans JP', sans-serif;   
	color: #F29B86;
	line-height: 2.2em;
	letter-spacing: 0.1em;
	margin: 30px auto 30px;
} 

#care .pink_line {
    font-size: 1.3rem;
	font-weight: bold;
	background:linear-gradient(transparent 60%, #ffdfef 0%)
		;}
#care .yellow_line {
	background:linear-gradient(transparent 60%, #F9E595 0%)
		;}

#care-intro{
	margin: 0px auto;
	text-align: left;
	max-width: 1100px;
} 


@media  (max-width:840px) {
#care .care-comment{
    font-size: 1.2em;
    }
}

	
@media  (max-width:600px) {
#care p{
    font-size: 0.8em;
		line-height: 1.8em;
		letter-spacing: 0.01em;
    }
#care .care-comment{
    font-size: 1em;
	font-weight: 800;
	line-height: 2em;
	letter-spacing: 0.01em;
	margin: 20px auto 20px;
} 

#care .pink_line {
    font-size: 0.9em;
	font-weight: bold;
	background:linear-gradient(transparent 60%, #ffdfef 0%)
		;}
#care .yellow_line {
	background:linear-gradient(transparent 60%, #F9E595 0%)
		;}

#care-intro p{
    font-size:0.8rem;
    letter-spacing: 0.1em;
	line-height: 1.8em;
	margin-bottom: 30px;
} 


}

/* kotsubancare */

#kotsuban{
   width:100%; 
	margin: 50px auto 0px;
	text-align: center;
} 


#kotsubancare{
    display: flex;
    justify-content:space-between;
    align-items: center;
    flex-wrap: wrap;
    margin:50px 0 0px 0;
}

#kotsubancare .img{
    width:30%;

}

#kotsubancare .content{
   width:65%; 
    text-align: left;
}



#kotsubancare h3{
	font-size: 1.6rem;
    margin:  30px 0 30px 0;
	text-align: left;
	color: #59BB98;
	letter-spacing: 0.1em;
}

#kotsubancare p{
	font-size: 1em;
    line-height: 2;
    margin: 0 0 50px 0;
}


@media  (max-width:768px) {
#kotsuban{
        margin:0 0 20px 0;
    }

#kotsubancare .img{
    width:60%;
		margin: auto;
}

#kotsubancare .content{
	width:100%; 
   text-align: left;
}  
#kotsubancare p{
    font-size:0.9rem;
    letter-spacing: 0.1em;
    } 
}

@media  (max-width:600px) {
#kotsubancare h3{
	font-size: 1em;
    margin:  20px 0 20px 0;
}
}




/* vision */
 
#care_vision{
    display: flex;
    justify-content:space-between;
    align-items: center;
    flex-wrap: wrap;
    margin:0px;
}

#care_vision .img{
    width:50%;

}

#care_vision .vision-comment{
	width:45%; 
	font-size:1.1rem;
    letter-spacing: 0.1em;
    line-height: 2;
	text-align: left;
}

@media  (max-width:768px) {
#vision{
        margin:0 0 20px 0;
    }

#care_vision .img{
    width:100%;
	margin: auto;
}

#care_vision .vision-comment{
	width:100%; 
    text-align: left;
	font-size:0.9rem;
	margin: auto;
}  
#kotsubancare h3{
	font-size: 1.3rem;
    margin:  30px 0 30px 0;
	letter-spacing: 0.1em;
}

#kotsubancare p{
	font-size: 0.9em;
    line-height: 1.8em;
    margin: 0 0 0px 0;
}
}

.care-message{
    font-size: 1.4rem;
	letter-spacing: 0.1em;
	font-weight: 600;
	font-family: 'Noto Sans JP', sans-serif;   
	color: #59BB98;
	line-height: 2.3em;
	margin: 30px auto 30px;
} 

@media  (max-width:600px) {
#care_vision .vision-comment{
	font-size:0.8rem;
}  
.care-message{
text-align: left;
    font-size: 0.9em;
	line-height: 1.8em;
		letter-spacing: 0.03em;

}
} 


/*===========================================================*/
/* child birth care */
/*===========================================================*/


/* sangoaruaru */


#sangoaruaru{
	margin: 10px auto 0px;
	text-align: center;
} 
#sangoaruaru figure{
	width: 50%;
	margin: 0px auto 50px ;
} 


.popora_support {
    font-size: 1.3rem;
	font-weight: 600;
	color: #59BB98;
	line-height: 2em;
	letter-spacing: 0.1em;
	}

.aruaru-comment{
    font-size: 1.3rem;
	font-weight: normal;
	color: #F29B86;
	line-height: 2em;
	margin: 30px auto 30px;
} 
#sangoaruaru .bold{
    font-size: 1.5rem;
	font-weight: bold;
} 

#sangoaruaru .pink_line {
    font-size: 1.3rem;
	font-weight: bold;
	background:linear-gradient(transparent 60%, #ffdfef 0%)
		;}
#sangoaruaru .yellow_line {
	background:linear-gradient(transparent 60%, #F9E595 0%)
		;}



@media  (max-width:840px) {
.popora_support {
		letter-spacing: 0.05em;
	}
.aruaru-comment{
    font-size: 1.2em;
    }
}

@media  (max-width:768px) {

.popora_support {
		letter-spacing: 0.01em;
		    font-size: 1.2rem;

	}
}
	
@media  (max-width:600px) {
.popora_support{
    font-size: 1rem;
		line-height: 2em;
		text-align: left
    }
.aruaru-comment{
    font-size: 0.9rem;
    }
#sangoaruaru  .pink_line {
    font-size: 1.1rem;
	}


}


/* nayami */

#nayami{
width: 80%;
background-color: #FFFBC7;
margin: auto;
}


.nayami-list{
	font-family: 'Noto Sans JP', sans-serif;   
	display: flex;
    justify-content: space-around;
    flex-wrap: wrap;
}

.nayami-list section{
    width:33%;
    padding:20px 20px 50px 20px;
	text-align: center;
}

.nayami-list section:nth-child(2){
     animation-delay: 0.2s;   
}
.nayami-list section:nth-child(3){
     animation-delay: 0.4s;   
}

.nayami-list section .nayami-num{
    background:#CCAF8C;
	color:#fff;
	display: inline-block;
	padding: 3px 15px;
	font-size:0.9rem;
}

.nayami-list section .nayami-img{
	padding-top:8%;
	margin: auto;
}


.nayami-list section h3{
    font-size: 0.8rem;
    text-align: center;
	line-height: inherit;
	letter-spacing: 0.05em;
}


/*checkのアニメーション*/
.hover1 {
	display: inline-block;
	position: absolute;
    right: 15px;
    bottom: -5px;
	padding: 0.3em 1em;
	margin: 0 0 1em;
	background-color: #3498db;
	font-size: 0.9em;
	color: #fff;
	cursor: pointer;
	transition: all 0.3s ease 0s;
	 border-radius: 5px;
}
.hover1:hover {
	opacity: 0.6;
}

@media  (max-width:1190px) {
#nayami{
width: 90%;
}
}

@media  (max-width:1090px) {
#nayami{
width: 100%;
}
}

@media  (max-width:600px) {

.nayami-list section{
    width:49%;
    padding:20px 5px 50px 5px;
	text-align: center;
}

.nayami-list section:nth-child(2){
     animation-delay: 0.2s;   
}
.nayami-list section:nth-child(3){
     animation-delay: 0.4s;   
}

}




/* kaiketsusaku */

#kaiketsusaku{
width: 100%;
max-width: 1000px;
text-align: center;
margin: 30px auto;
}



#kaiketsusaku h2{
width: 100%;
text-align: center;
color: #666666;
	font-size: 2em;
}

#kaiketsusaku .pink_line {
	font-weight: bold;
	background:linear-gradient(transparent 60%, #F7BA8B 0%)
		;}
		



.kaiketsusaku-list{
	font-family: 'Noto Sans JP', sans-serif;   
	display: flex;
    justify-content: space-around;
    flex-wrap: wrap;
}

.choice{
width: 250px;
margin: auto;
}

.shojyo{
width: 60%;
	background:#FAD9D2;
	text-align: center;
	padding: 30px;
}
.yobo{
width: 35%;
	background:#FAD9D2;
	text-align: center;
	padding: 30px;
}

.shojyo-list{
	display: flex;
    justify-content: space-around;
    flex-wrap: wrap;
}


.shojyo-list section{
    width:46%;
    background: #59BB98;
	position: relative;
	box-shadow: 5px 5px 0 rgba(0,0,0,0.1);
	margin:0 0 20px 0;
    padding:20px 20px 50px 20px;
    border-radius: 5px;
}

.yobo section{
    width:90%;
    background: #59BB98;
	position: relative;
	box-shadow: 5px 5px 0 rgba(0,0,0,0.1);
	margin:0 auto 0;
    padding:20px 20px 50px 20px;
    border-radius: 5px;
}

.shojyo-list section:nth-child(2){
     animation-delay: 0.2s;   
}
.yobo section:nth-child(3){
     animation-delay: 0.4s;   
}

.choice-point{
    background:#F8BC70;
	color:#AC7B3B;
	display: inline-block;
	position: absolute;
    left: -10px;
    top: -8px;
	z-index: 2;
	padding: 5px 10px;
	font-size:0.8em;
	font-weight: bolder
}

 .choice-img{
	padding-top:8%;
}


.shojyo-list section h3{
    color:#ffffff;
    font-size: 1rem;
    text-align: center;
	line-height: inherit;
    border-bottom: 5px double #fff;
    margin: 10px 0 0 0;
    padding: 0 0 5px 0;
	letter-spacing: 0.05em;
}

.yobo section h3{
    color:#ffffff;
    font-size: 1rem;
    text-align: center;
	line-height: inherit;
    border-bottom: 5px double #fff;
    margin: 10px 0 0 0;
    padding: 0 0 5px 0;
	letter-spacing: 0.05em;
}
.choice-text{
    color:#ffffff;
    font-size: 0.8em;
    padding: 0 0 5px 0;
	letter-spacing: 0.01em;
}


/*checkのアニメーション*/
.hover1 {
	display: inline-block;
	position: absolute;
	padding: 0.3em 1.8em;
	margin: 0 0 1em;
	background-color: #6EC4BE;
	font-size: 0.8em;
	color: #fff;
	cursor: pointer;
	transition: all 0.3s ease 0s;
	 border-radius: 5px;
}
.hover1:hover {
	opacity: 0.6;
}


@media  (max-width:768px) {
#kaiketsusaku h2{
width: 100%;
text-align: center;
color: #666666;
	font-size: 1.4em;
}
		

.choice-point{
	font-size:0.8em;
}


.kaiketsusaku-list{
	font-family: 'Noto Sans JP', sans-serif;   
	display: block;
}

.choice{
width: 70%;
margin: auto;
}

.shojyo{
width: 100%;
margin: auto;
}
.yobo{
width: 100%;
margin: auto;
}

.shojyo-list{
	align-items: center;
}


.shojyo-list section{
    width:100%;
}

.yobo section{
    width:100%;
}
}


@media  (max-width:440px) {
#kaiketsusaku h2{
	font-size: 1em;
}
}

/*===========================================================*/
/* topics */
/*===========================================================*/


/* topics一覧 */

#topics_all{
    position: relative;
    margin: 0 0 200px 0;
	padding: 20px 0px;
}

#topics_latest{
    margin: 50px 0 10px 0;
	background-color: #F3F7E2;
}

@media screen and (max-width:960px) {
#topics_all{
    margin:0 0 100px 0;
}  
}

#topics_all .topics-area{
    display: flex;
    justify-content: space-around;
    flex-wrap: wrap;
}

#topics_all .topics-area article{
     width:20%;
    box-shadow: 0 0 10px #ccc;
    background:#fff;
    border-radius: 10px;
	position: relative;
     top:0px;
	 margin: 20px;
}


@media screen and (max-width:1190px) {
#topics_all .topics-area article{
     width:23%;
	 margin: 5px;
}
}

@media screen and (max-width:1020px) {
#topics_all .topics-area article{
     width:46%;
    margin:0 0 50px 0;
}
    
#topics_all .topics-area article:nth-of-type(2n+1){
    top:0px;
    }
#topics_all .topics-area article:nth-of-type(2n){
    top:0;
    }
}

@media screen and (max-width:550px) {
#topics_all .topics-area article{
     width:90%;
}

#topics_all .topics-area article:nth-of-type(2n+1){
    top:0;
}   
}

#topics_all .zoomOut .mask{
    border-radius: 10px 10px 0 0;
}


#topics_all .topics-area .topics-block{
     padding:10px 20px;   
}

#topics_all .topics-area .topics-block time{
    font-size: 0.9rem;
    color: #666;
    margin: 0 0 20px 0;
}

#topics_all .topics-area .topics-block h3{
    font-size: 1rem;
	text-align: justify;
}



#topics_all .topics-btn{
    text-align: right;
    padding: 100px 0 0 0;
}

@media screen and (max-width:960px) {
#topics_all  .topics-btn{
    text-align: center;
    padding: 50px 0 0 0;
}
    
}

#topics_all .topics_detail{
position: relative;
top:100px;
text-align: center;
width: 90%;
margin: auto;
}

#topics_all h3.title-16 {
  border-top: double 7px #333;
  border-bottom: solid 3px #333;
  padding: 8px 16px;
  font-family: 'Noto Sans JP', serif;
  font-size: 24px;
  letter-spacing: 0.1em;
  color: #333;
  font-weight: 700;
  display: block;
  box-sizing: border-box;
  max-width: 500px;
  text-align: center; 
  margin: 24px;
  margin-inline: auto;
}



#topics_contents{
text-align: left;
width: 90%;
max-width: 1000px;
margin: 20px auto;
}


/* news article 記事ページ */

/*========= breadcrumb　パンクズリスト ===============*/
nav.breadcrumb {
    padding: 10px;
}
nav.breadcrumb ol {
    margin: 0;
    padding-left: 0;
    list-style: none;
}

nav.breadcrumb li {
    display: inline;
	font-size: 0.8em;
	letter-spacing: 0.1em;
	color:#999999;
}

nav.breadcrumb li + li::before {
    display: inline-block;
    margin: 0 0.25em;
    height: 0.8em;
    content:url(data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHdpZHRoPSI4IiBoZWlnaHQ9IjgiPjxwYXRoIGQ9Ik0yLjUgMEwxIDEuNSAzLjUgNCAxIDYuNSAyLjUgOGw0LTQtNC00eiIgZmlsbD0iY3VycmVudENvbG9yIi8+PC9zdmc+)
}
nav.breadcrumb [aria-current="page"] {
    color: #999999;
    font-weight: 700;
    text-decoration: none;
}


.new-article-detail{
	width:100%;
	margin: 50px auto 100px;
}
.new-article-detail h1{
	font-size: 2rem;
}
time{
    font-size:0.8em;
	color:cadetblue;
    }
.new-mainimg{
	margin: 30px auto 30px;
}

.new-articleimg{
	margin: 30px auto 30px;
}
.new-articleimg img{
 width:60%;
max-width: 600px;
	margin: 30px auto 30px;
}

.new-paragraph p{
	margin: 50px auto 30px;
}



.shokai{
width:80%;
margin:0px auto 30px  auto ;
color:#F8BC70;
font-weight:bolder;
} 

.shokai li{
padding: 10px 0px;
} 

.taiken{
    width: 90%;
    padding: 5px;
    background: #F8BC70;
    border-radius: 10px;
    margin: 30px auto;
    display: block;
} 

.taiken　h4{
    color: #FF8800;
    font-size: 1.2em;
    font-weight: bolder;
} 

@media (max-width:1190px) {
.topics-area .topics-block{
     padding-bottom:20px;   
}

.topics-area .topics-block h3{
    font-size: 1em;
	color: #59BB98;
	text-align: center;
}
}


@media (max-width:1020px) {
.topics-area .topics-block{
     padding:20px 0px;   
}
.topics-area article{
     width:46%;
    margin:0 0 20px 0;
}
}

@media  (max-width:960px) {

#topics .topics-btn{
    text-align: center;
    padding: 50px 0 0 0;
}
.shokai{
width:100%;
margin:0px auto 30px  auto ;
font-size: 1em;
} 
}


@media (max-width:600px) {
.topics-area article{
     width:45%;
}
.shokai{
font-size: 0.9em;
} 
}


@media (max-width:530px) {
.topics-area article{
     width:90%;
}
}


/* topicss article ボタン */
.back_link {
	display: flex;
	align-items: center;
	justify-content: center;
		margin: 50px auto 30px;

}
.back_link a{
	font-size:1.1rem;
  display: inline-block;
  color:#59BB98;
  text-decoration:none;
  position: relative;
  transition: .3s;
}
.back_link a::after{
	position: absolute;
	bottom: 0;
	left: 50%;
	content: '';
	width: 0;
	height: 1px;
	background-color: #59BB98;
	transition: .3s;
	transform: translateX(-50%);
}
.back_link a:hover::after{
	width: 100%;
}

.back_link a::before {
  font-family: "Font Awesome 5 Free";
  content: '\f100';
  font-weight: 900;
}

/* news category */



.new-list {
  display: flex;
  justify-content: center; /* 中央寄せ */
  flex-wrap: wrap;         /* 折り返しを許可 */
  gap: 20px;               /* アイテム間の余白（margin代わり） */
  padding: 30px 20px;
}

.new-list div {
  box-sizing: border-box;
  padding: 5px 40px;
  border-radius: 4px;
  color: #666;
  text-decoration: none;
  cursor: pointer;
  border: thin solid #cccccc;
  flex: 0 1 auto; /* アイテム幅を自動調整 */
  text-align: center;
}

/* aタグにも色を反映させたいなら */
.new-list div a {
  display: block;
  color: inherit;
  text-decoration: none;
  padding: 5px 0;
}

.new-list div:hover {
  background: #a6d3c8;
}


@media screen and (max-width: 600px) {
  .new-list {
    justify-content: flex-start; /* 左寄せ */
  }
  .new-list div {
    flex: 1 1 100%; /* 幅100%で縦に並ぶ */
  }
}

#pager{
  display: flex;
  justify-content: center; /* 中央寄せ */
}

.pagination {
  display: inline-block;
  margin: 0 auto;
}

.pagination a {
  color: black;
  float: left;
  padding: 8px 16px;
  text-decoration: none;
}

.pagination a.active {
  background-color: #a6d3c8;
  color: white;
  border-radius: 5px;
}

.pagination a:hover:not(.active) {
  background-color: #ddd;
  border-radius: 5px;
}



/* menu */

.menu {
    margin: 50px auto;
    text-align: center;
    padding: 10px 0px;
    background-color: #FFFDEC;
} 

 .menu-block{
     padding:20px 0px;
	 text-align: center;
}


.menu .menu-block img{
    width:100vw;
     padding:10px 0px 50px;   
}

.menu .menu-block h3{
    position: relative;
top:30px;
    font-size: 2em;
	color: #59BB98;
	text-align: center;
	letter-spacing: 0.5em;
}

#selfmenu  .menu-block h3{
    font-size: 2em;
	color: #59BB98;
	text-align: center;
	letter-spacing: 0.1em;
}

.menu .menu-block p{
    width:80%;
    max-width: 800px;
    margin: auto;
	text-align: center;
	letter-spacing: 0.01em;
	padding: 30px  80px;
}
.menu .menu-block .ex{
	padding: 50px  0px 0px;
	text-align: left;

}


.menu .sokuwan_ex{
	padding: 0px  0px 0px;
	text-align: center;
}

.menu .menu-block .insole_ex{
	padding: 0px  0px 0px;
	text-align: left;

}
.menu .menu-block .price{
	letter-spacing: 0.01em;
	padding: 10px  0px;
	font-size: 2em;
	color: #E83921;
}
.menu .menu-block span{
	font-size: 0.7em;
	color: #333333;
}
.yoyaku{
font-weight:bolder;
} 

.menu-img{
    width:80%;
    max-width: 600px;
    margin: 20px auto;
	text-align: center;
}

.cource_box{
width:80%;
max-width: 800px;
margin:30px auto 30px  auto ;
padding: 20px;
background-color: #ffffff
} 

.cource_contents {
width:90%;
max-width: 800px;
margin:20px auto 20px  auto ;
color:#666666;
} 

.cource_contents .care{
    position: relative;
    padding: 20px 0px 0px 20px;
	letter-spacing: 0.01em;
	font-size: 1em;
	text-align: left;
}
.cource_contents .price{
	letter-spacing: 0.01em;
	font-size: 1.5em;
	color: #E83921;
	text-align: right;
}
.cource_contents .chu{
	font-size: 0.6em;
	color: #333333;
}

.cource_matome {
    width: 90%;
    max-width: 800px;
    margin: 20px auto 20px  auto;
    color: #666666;
    text-align: left;
    padding: 20px;
    border: 1px solid #59BB98;
    background-color: #C9E5D7;
    border-radius: 10px;
} 

.cource_matome .num {
    margin: 20px auto 20px  auto;
    color: #ffffff;
    text-align: center;
    padding: 5px 10px;
    border: 1px solid #59BB98;
    background-color: #59BB98;
    border-radius: 5px;
} 

@media  (max-width:768px) {
.menu .menu-block h3{
top:30px;
    font-size: 1.7em;
	letter-spacing: 0.1em;
}

#selfmenu .menu-block h3{
    font-size: 1.5em;
	letter-spacing: 0.01em;
}

.menu .menu-block p{
    width:100%;
	padding: 30px 20px;
}
.menu .menu-block .price{
	font-size: 1.5em;
}
.menu .menu-block span{
	font-size: 0.7em;
}
.cource_box{
width:90%;
margin:30px auto 30px  auto ;
padding:10px;
} 

.cource_contents {
width:100%;
} 


.cource_matome p{
padding:5px;
line-height: 1.8em;
} 

.cource_matome .num {
    padding: 3px 5px;
} 

}

@media  (max-width:600px) {
.menu {
    margin:50px auto;
	text-align: center;
	padding:10px 0px;   
} 


#selfmenu  .menu-block h3{
    font-size: 1.3em;
	letter-spacing: 0.01em;
}

.menu .menu-block p{
    font-size: 0.8em;
    width:100%;
}
.cource_box{
width:100%;
margin:20px auto ;
} 

.cource_contents {
width:100%;
} 
}

@media  (max-width:440px) {
.menu .menu-block h3{
top:20px;
    font-size: 1.3em;
	letter-spacing: 0.05em;
}

#selfmenu  .menu-block h3{
    font-size: 1.2em;
	letter-spacing: 0.01em;
}
.menu .menu-block .price{
	font-size: 1em;
}
.cource_contents .care{
	font-size: 0.8em;
}
.cource_contents .price{
	letter-spacing: 0.01em;
	font-size: 1.2em;
	text-align: right;
}
.cource_matome {
    width: 100%;
font-size: 0.8em;
} 

.cource_matome .num {
padding: 2px 5px;
} 

.taiken {
    width: 100%;
font-size: 0.8em;
padding: 10px;
} 

}

.medama {
	margin: 0px auto;
	text-align: center;
	width: 800px;
	max-width: 90%;
}

/*===========================================================*/
/* sokuwan *//* shogaishamama *//* class */
/*===========================================================*/


#page-intro{
	margin: 0px auto;
	text-align: center;
	max-width: 1100px;
} 


#page-intro .pink_line {
    font-size: 1.3rem;
	font-weight: bold;
	background:linear-gradient(transparent 60%, #ffdfef 0%)
		;}

#page-intro .yellow_line {
	background:linear-gradient(transparent 60%, #F9E595 0%)
		;}

.figure30{
	width: 30%;
	margin: 20px auto 0px ;
	text-align: center;
} 

.figure50{
	width: 50%;
	margin: 20px auto 0px ;
	text-align: center;
} 

.figure80{
	width: 80%;
	margin: 20px auto 0px ;
	text-align: center;
} 

.figure100{
	width: 100%;
	max-width: 1000px;
	margin: 20px auto 0px ;
	text-align: center;
} 


.figure_bnr li{
	width: 100%;
	max-width: 960px;
	margin: 20px auto ;
} 

.question{
	width: 80%;
	max-width: 800px;
	margin:  50px auto ;
	background-color: #E1DFD2;
	font-size: 1.8em;
		letter-spacing: 0.2em;
} 

.yaji{
	width: 165px;
	margin: 0px auto 20px ;
} 

 .trouble {
	line-height: 3em;
	letter-spacing: 0.2em;
		margin:  50px auto ;
	}
 .pic-title {
 	font-family: 'Noto Sans JP', sans-serif;   
 	background-color: #DAEDDA;
	letter-spacing: 0.2em;
	color: #59BB98;
	}
 .aruaru-comment{
	letter-spacing: 0.2em;
    font-size: 1.5em;
	font-weight: bold;
	color: #F29B86;
	line-height: 2em;
	margin: 30px auto 30px;
} 

.care-popora{
    font-size: 2em;
	font-weight: bold;
	font-family: 'Noto Sans JP', sans-serif;   
	color: #59BB98;
	margin: 0px auto 0px;
} 

.care-comment{
    font-size: 1.5em;
	font-weight: bold;
	font-family: 'Noto Sans JP', sans-serif;   
	color: #59BB98;
	line-height: 2em;
	margin: 0px auto 0px;
	letter-spacing: 0.02em;
} 

.sokuwan_enter{
	text-align: center;
	padding: 30px;
} 

.sokuwan_enter p{
    font-size: 1em;
	font-weight: bold;
	font-family: 'Noto Sans JP', sans-serif;   
	color: #59BB98;
	line-height: 2em;
	margin: 0px auto 20px;
	letter-spacing: 0.02em;
} 



@media  (max-width:840px) {

.care-popora{
    font-size: 1.8em;
} 
.care-comment{
    font-size: 1.2em;
    }
.trouble {
	line-height: 2em;
	letter-spacing: 0.02em;
		margin: 10px auto 20px ;
	}
}

@media  (max-width:768px) {

.figure30{
	width: 50%;
	margin: 20px auto 0px ;
	text-align: center;
} 
.figure50{
	width: 90%;
	margin: 20px auto 0px ;
	text-align: center;
}
} 
	
@media  (max-width:600px) {

.figure_bnr li{
	width: 100%;
	max-width: 960px;
	margin: 20px auto ;
} 

.trouble{
    font-size: 0.9rem;
		line-height: 2.5em;
		text-align: left
    }
.aruaru-comment{
	letter-spacing: 0.2em;
    font-size: 1.2em;
}
.care-popora{
    font-size: 1.5em;
} 
.care-comment{
    font-size: 0.9rem;
	letter-spacing: 0.01em;
    }

#page-intro  .pink_line {
    font-size: 0.9rem;
		;}
}

@media  (max-width:440px) {
.question{
	width: 100%;
	font-size: 1.3em;
} 
.trouble{
    font-size: 0.9rem;
		line-height: 2em;
		text-align: left
    }
.aruaru-comment{
	letter-spacing: 0.05em;
    font-size: 1.1em;
	line-height: 1.5em;
}
.care-popora{
    font-size: 1.5em;
} 
.care-comment{
    font-size: 0.9em;
	letter-spacing: 0.01em;
	line-height: 1.5em;
    }
#page-intro  .pink_line {
    font-size: 0.9rem;
	}

}


/* class_ichiran */
.classmenu {
    margin:20px auto;
	text-align: center;
	padding:10px 0px;   
} 

 .classmenu-block{
     padding:10px 0px;
	 text-align: center;
}


@media  (max-width:600px) {
.classmenu {
    margin:10px auto;
} 
}



/* class_detail */

.class_detail img{
    width:100vw;
     padding:10px 0px 50px;   
}

.class_block h3{
    position: relative;
    top:80px;
    font-size: 2em;
	color: #59BB98;
	text-align: center;
	letter-spacing: 0.1em;
}

.class_block .ex{
    width:90%;
    max-width: 1000px;
    margin: auto;
	text-align: left;
	letter-spacing: 0.1em;
	padding: 100px  80px  20px;
}

.class_fee{
	width: 80%;
	max-width: 1000px;
    background-color: #ffffff;
	font-family: 'Noto Sans JP', sans-serif;  
	text-align: center;
	margin: 0px auto 20px;
	box-shadow: 3px 3px 0 rgba(0,0,0,0.1);
    border-radius: 20px;
	padding: 20px;
} 

.class_fee .price{
	letter-spacing: 0.01em;
	padding: 10px  0px;
	font-size: 2em;
	color: #E83921;
}

.class_fee li{
	font-size: 1.2em;
	color: #333333;
}
.class_fee .taisho{
	font-size: 1.2em;
	color: #ffffff;
	font-weight: 600;
	background-color:  #59BB98;
	width: 15em;
	margin: auto;
}
.class_fee .point{
	font-size: 1em;
	color: #333333;
}


.annual_program{
	width: 80%;
    background-color: #DEF2CB;
	font-weight: normal;
	font-family: 'Noto Sans JP', sans-serif;   
	margin: 20px auto;
	padding: 30px;
	box-shadow: 3px 3px 0 rgba(0,0,0,0.1);
    border-radius: 20px;
} 

.annual_program dl{
	font-size: 1.2em;
	color: #333333;
}

.annual_program h5{
	padding: 20px;
		font-size: 1.2em;
		letter-spacing: 0.2em;
} 

.ex_box{
	font-size: 1em;
	background-color:  #ffffff;
	width: 100%;
	margin: 20px auto;
	padding-bottom: 20px;
}

.annual_program_pic{
	display: block;
	margin: 10px auto;
}


#tomioka{
    background-color: #ffffff;
    width: 100%;
    max-width: 1000px;
    margin: 20px auto;
    padding: 50px;
    border: 1px solid #59BB98;
}


@media  (max-width:940px) {
.annual_program{
	width: 90%;
    background-color: #DEF2CB;
	font-weight: normal;
	font-family: 'Noto Sans JP', sans-serif;   
	margin: 20px auto;
	padding: 30px;
	box-shadow: 3px 3px 0 rgba(0,0,0,0.1);
    border-radius: 20px;
} 

.class_block .ex{
    width:100%;
    margin: auto;
	text-align: left;
	letter-spacing: 0.1em;
	padding: 50px  20px 20px;
}
}



@media  (max-width:768px) {

.class_block h3{
    position: relative;
    top:25px;
    font-size: 2em;
	color: #59BB98;
	text-align: center;
	letter-spacing: 0.1em;
}

.class_block .ex{
    width:100%;
    margin: auto;
	text-align: left;
	letter-spacing: 0.1em;
	padding: 50px  20px 20px;
}

.class_fee{
	width: 95%;
	margin: 0px auto 0px;
	padding: 20px;
} 

.class_fee .price{
	letter-spacing: 0.01em;
	padding: 10px  0px;
	font-size: 1.5em;
}

.class_fee li{

	font-size: 1.1em;
	color: #333333;
}
.class_fee .taisho{
	font-size: 1.2em;
	color: #ffffff;
	background-color:  #59BB98;
	width: 15em;
	margin: auto;
}
.class_fee .point{
	font-size: 1em;
	color: #333333;
}


.annual_program{
	width: 100%; 
	padding: 20px;
	box-shadow: 3px 3px 0 rgba(0,0,0,0.1);
    border-radius: 20px;
}

.annual_program dl{
	font-size: 1.2em;
	color: #333333;
}

.ex_box{
	font-size: 1em;
	background-color:  #ffffff;
	width: 100%;
	margin: 20px auto;
	padding-bottom: 20px;
}

.annual_program_pic{
	display: block;
	margin: 10px auto;
}

#tomioka{
    padding: 20px;
}


}


	
@media  (max-width:600px) {
.class_block h3{
    position: relative;
	top:30px;
    font-size: 1.5em;
	letter-spacing: 0.05em;
}

.class_fee{
	width: 100%;
	padding: 10px;
} 

.class_fee li{
	font-size: 0.9em;
	color: #333333;
}
.class_fee .taisho{
	font-size: 1em;
	width: 15em;
	margin: auto;
}
.class_fee .point{
	font-size: 0.8em;
}
#page-intro  .pink_line {
    font-size: 1rem;
}
#tomioka{
    padding: 10px;
}

}




/* gallery */

.img-gallery{
    background:url("../img/border.png") repeat-x top left,url("../img/border.png") repeat-x bottom left;
    background-size: 50px 16px;
    padding:50px 0;
    margin:  50px 0 50px 0;
}

.img-gallery img{
    border-radius: 10px;
}

@media  (max-width:600px) {
.img-gallery{
    margin:  20px 0 20px 0;
}
}


/* class一覧 */
#class_ichiran {
  margin: 100px auto;
  font-family: "Open Sans", sans-serif;
  line-height: 1.8;
}

#class_ichiran table {
  border-collapse: collapse;
  margin: 0 auto;
  padding: 0;
  width: 100%;
  table-layout: fixed;
}

#class_ichiran table  tr {
  background-color: #E5F3EC;
  padding: .35em;
  border-bottom: 2px solid #fff;
}
#class_ichiran table  th,
#class_ichiran table  td {
  padding: 1em 10px 1em 1em;
  border-right: 2px solid #fff;
}
#class_ichiran table  th {
  font-size: .85em;
}
#class_ichiran table  thead tr{
  background-color: #286E55;
  color:#fff;
}
#class_ichiran table  tbody th {
    background: #59BB98;
    color: #fff;
}

#class_ichiran .subject {
    background: #FFE02E;
    color: #666;
	padding: 3px;
}

#class_ichiran .txt{
   text-align: left;
   font-size: .85em;
}
#class_ichiran .price{
  text-align: right;
  color: #333;
  font-size:  .85em;
  padding: 1em 10px 1em 1em;
}

#class_ichiran .price span{
  font-size:  .7em;
}

#class_ichiran .non{
  background:#fff
}
@media  (max-width: 600px) {
#class_ichiran table {
    border: 0;
    width:100%
  }
#class_ichiran table th{
    background-color: #167F92;
    display: block;
    border-right: none;
  }
#class_ichiran table thead {
    border: none;
    clip: rect(0 0 0 0);
    height: 1px;
    margin: -1px;
    overflow: hidden;
    padding: 0;
    position: absolute;
    width: 1px;
  }
#class_ichiran table tr {
    display: block;
    margin-bottom: .625em;
  }
#class_ichiran table td {
    border-bottom: 1px solid #bbb;
    display: block;
    font-size: .8em;
    text-align: right;
    position: relative;
    padding: .625em .625em .625em 4em;
    border-right: none;
  }
  
#class_ichiran table td::before {
    content: attr(data-label);
    font-weight: bold;
    position: absolute;
    left: 10px;
    color: #167F92;
  }
#class_ichiran table td:last-child {
    border-bottom: 0;
  }
#class_ichiran table tbody th {
    color: #fff;
}
}


/* blog ---Pick upクラスへのリンク*/

#blog{
    margin:0px 0 10px 0;
}
.blog-area{
    display: flex;
    justify-content: space-between;
    text-align: center;
    flex-wrap: wrap;
    overflow: hidden;
	margin:50px 0 10px 0;
}

.blog-area article{ 
    width:30%;
}


.blog-area article img{
    width: auto;
    height:50vh;
}

.blog-area figure h3{
    position: absolute;
    bottom:0;
    left:0;
    background:rgba(133,201,172,0.8);
    display: block;
    width:100%;
    padding: 5px;
    color: #fff;
}

.blog-area p{
    margin:0 0 20px 0; 
    text-align: left;
    font-size: 0.9rem;
}

.blog-area span{
    border:1px solid rgba(255,255,255,0.7);
    display: inline-block;
    padding:5px 10px;
    text-align: center;
    font-size: 0.8rem;
    white-space: nowrap;
}

.blog-area h3::after {
  font-family: "Font Awesome 5 Free";
  content: '\f35a';
  font-weight: 900;
}


@media  (max-width:820px) {
    .blog-area article{
        width:50%;
        margin:0 auto 3vh auto;
    }
}

@media  (max-width:768px){

    .blog-area article{
        width:100%;
    }
}

@media  (max-width:450px){

.blog-area h3{
    font-size:0.9rem;
}
    
.blog-area p{
  display: none;
    }
}




@media (max-width:820px) {
.blog-area article img{
    width:100%;
    height:auto;
} 
}
  
@media  (max-width:450px){
.blog-area img{
    width:100%;
    height:auto;
}
}



/*===========================================================*/
/* Staff */
/*===========================================================*/


.staff-midashi {
  position: relative;
  color: #59BB98;
  font-size: 2em;
  letter-spacing: 0.3em;
  padding: 20px 0;
  text-align: center;
  margin: 1.5em 0;
}
.staff-midashi:before {
  content: "";
  position: absolute;
  top: -8px;
  left: 50%;
  width: 200px;
  height: 110px;
  border-radius: 50%;
  border: 5px solid #FBD8AB;
  border-left-color: transparent;
  border-right-color: transparent;
  -webkit-transform: translateX(-50%);
  transform: translateX(-50%);
}

.intra-img{
width: 100%;
    margin:20px auto 20px ;
	padding: 10px  10px  5px  10px;
	background-color: #59BB98;
		filter: drop-shadow(5px 5px 5px rgba(0,0,0,0.2));

}


.introduction-waku{
    margin:30px auto 150px ;
}


/* introduction */

.introduction{
width: 80%;
    margin:100px auto 0px ;
	color:#666666;
}


.introduction-area{
    display: flex;
    justify-content: space-between;
    flex-wrap: wrap;
}


.introduction h2{
    border-bottom-color: #F8BC70;
    border-bottom-style: double;
	padding: 0 0 5px 0;
	letter-spacing: 0.3em;
	font-size: 1.8em;
    font-family:'Parisienne', cursive;
}

.introduction h3{
    border-bottom-color: #59BB98;
    border-bottom-style: double;
	padding: 0 0 5px 0;
	letter-spacing: 0.3em;
	font-size: 1.8em;
    font-family:'Parisienne', cursive;
}

.introduction-area p{
    margin:  30px 0 30px 0;  
	line-height: 1.8em;
	letter-spacing: 0.1em;
}

.introduction-area .txt-r{
     text-align: right;
}

.introduction-lead{
    font-weight: 600;
	font-size: 0.9em;
}

.introduction-img{
    width:30%;
	margin: 20px 0 30px 0;  
	filter: drop-shadow(5px 5px 5px rgba(0,0,0,0.2));
}

.introduction-img img{
    animation: fluidrotate 30s ease 0s infinite;
}

.introduction-content{
    width:60%;
}


@media  (max-width:960px) {
.staff-midashi {
  position: relative;
  color: #59BB98;
  font-size: 1.8em;
  letter-spacing: 0.3em;
  padding: 20px 0;
  text-align: center;
  margin: 1.5em 0;
}
.staff-midashi:before {
  content: "";
  position: absolute;
  top: -8px;
  left: 50%;
  width: 200px;
  height: 110px;
  border-radius: 50%;
  border: 5px solid #FBD8AB;
  border-left-color: transparent;
  border-right-color: transparent;
  -webkit-transform: translateX(-50%);
  transform: translateX(-50%);
}
.introduction{
width: 80%;
    margin:100px auto 0px ;
	color:#666666;
}


.introduction-area{
    display: flex;
    justify-content: space-between;
    flex-wrap: wrap;
}


.introduction h2{
    border-bottom-color: #F8BC70;
    border-bottom-style: double;
	padding: 0 0 5px 0;
	letter-spacing: 0.3em;
	font-size: 1.8em
}

.introduction h3{
    border-bottom-color: #59BB98;
    border-bottom-style: double;
	padding: 0 0 5px 0;
	letter-spacing: 0.3em;
	font-size: 1.8em
}

.introduction-area p{
    margin:  30px 0 30px 0;  
	line-height: 1.8em;
	letter-spacing: 0.1em;
}

.introduction-area .txt-r{
     text-align: right;
}

.introduction-lead{
    font-weight: 600;
	font-size: 0.9em
}

.introduction-img{
    width:30%;
	margin: 20px 0 30px 0;
}

.introduction-img img{
    animation: fluidrotate 30s ease 0s infinite;
}

.introduction-content{
    width:60%;
}
}


@media  (max-width:768px) {
.staff-midashi {
  position: relative;
  color: #59BB98;
  font-size: 1.6em;
  letter-spacing: 0.3em;
  padding: 20px 0;
  text-align: center;
}
.staff-midashi:before {
  content: "";
  position: absolute;
  top: -8px;
  left: 50%;
  width: 200px;
  height: 90px;
  border-radius: 50%;
  border: 5px solid #FBD8AB;
  border-left-color: transparent;
  border-right-color: transparent;
  -webkit-transform: translateX(-50%);
  transform: translateX(-50%);
}
.introduction{
width: 90%;
}
.introduction-area{
    display: block;
    }
.introduction h2{
    border-bottom-color: #F8BC70;
    border-bottom-style: double;
	padding: 20px 0 10px 0;
	letter-spacing: 0.3em;
	font-size: 1.4em
}

.introduction h3{
    border-bottom-color: #59BB98;
    border-bottom-style: double;
	padding: 20px 0 10px 0;
	letter-spacing: 0.3em;
	font-size: 1.4em
}

.introduction-area p{
    margin:  30px 0 30px 0;  
	line-height: 1.8em;
	letter-spacing: 0.1em;
	font-family: 'Noto Sans JP', sans-serif;   
}
.introduction-img{
    width: 60%;
    margin:0 auto;
    }
.introduction-content{
    width:100%;
    padding: 0 30px 0 70px;
}
    
}

@media  (max-width:550px) {

.staff-midashi {
  position: relative;
  color: #59BB98;
  font-size: 1.3em;
  letter-spacing: 0.03em;
  padding: 20px 0;
  text-align: center;
    margin: 1em 0;
}
.staff-midashi:before {
  content: "";
  position: absolute;
  top: -8px;
  left: 50%;
  width: 200px;
  height: 80px;
  border-radius: 50%;
  border: 5px solid #FBD8AB;
  border-left-color: transparent;
  border-right-color: transparent;
  -webkit-transform: translateX(-50%);
  transform: translateX(-50%);
}
.introduction{
width: 90%;
}
.introduction-content{
    padding:0;
} 

.introduction-img{
    width: 80%;
    margin:0 auto;
}
}




/*===========================================================*/
/* condition */
/*===========================================================*/

#condition-pop{
    margin: 50px auto;
    padding: 20px;
    color: #59BB98;
    font-size: 2.3em;
    letter-spacing: 0.1em;
    font-family: 'Noto Sans JP', sans-serif;
    text-align: center;
    border: 1px solid #59BB98;
    width: 20em;
}

@media  (max-width:1090px) {
#condition-pop{
	color:#59BB98;
	font-size: 2em;
}
	}
	
@media  (max-width:600px) {
#condition-pop{
    width: 80%;
	color:#59BB98;
	font-size: 1.5em;
}
	}

@media  (max-width:440px) {
#condition-pop{
    width: 100%;
	color:#59BB98;
	font-size: 1.2em;
}
	}

/* condition */

#condition{
    margin:0 0 100px 0;
}


@media  (max-width:550px) {
#condition{
    margin:0 0 100px 0;
}
}

#ohana{
    width: 100%;
    margin: auto;
    padding-top: 30px;
    padding-right: 30px;
    padding-left: 30px;
    padding-bottom: 30px;
    border: 1px solid #9D9D9D;
    max-width: 1000px;
    background-color: #fff;
	text-align: center
}


#ohana h2{
width:300px;
height:300px;
color:#90A4A4;
letter-spacing: 0.3em;
text-align: center;
background-color: #FFFDE5;
border-radius: 50%;
margin: auto;
padding: 110px 0;
}


@media  (max-width:550px) {
#ohana h2{
width:200px;
height:200px;
color:#90A4A4;
letter-spacing: 0.3em;
text-align: center;
background-color: #FFFDE5;
border-radius: 50%;
margin: auto;
padding: 70px 0;
}
}

/*===========================================================*/
/* schedule */
/*===========================================================*/

.message {
    padding:  20px 50px;
    background-color: #FFFD;
    line-height: 2em;
    text-align: left;
    margin: 50px auto;
    width: 90%;
	font-family: "Open Sans", sans-serif;
	filter: drop-shadow(6px 6px 6px rgba(0,0,0,0.2));
}
.message h4 {
    font-size: 1.5em;
	letter-spacing: 0.2em;
    padding: 10px 0px;
    border-bottom: 5px solid #F9D2C5;
	margin: 20px 0;
}

.theme {
margin: 20px 0;
padding: 10px;
font-size: 1em;
letter-spacing: 0.1em;
background-color: #FDEDE7;
font-weight: 600;
}

.theme_pic {
margin: 10px auto;
width:80%;
}


.btn {
margin: 20px auto;
padding: 10px;
font-size: 1em;
letter-spacing: 0.1em;
font-weight: 500;
}

#schedule {
	width: 100vw;
	background-color: #FFFEF1;
	font-family: "Open Sans", sans-serif;
  line-height: 1.25;
  padding: 100px 0px 50px;
}
#schedule  .text {
	text-align: center;
	line-height: 2em;
	letter-spacing: 0.2em;
	margin:  50px auto 0px ;
	}

#tab {
    display: flex;
    justify-content: center;
    flex-wrap: wrap;
}
#tab li {
    list-style: none;
    cursor: pointer;
    background: #fff;
    font-size: 1em;
    padding: 10px 20px;
    margin: 50px 5px;
    border: 1px solid #333;
}
#tab li.select {
	background-color: #FF9;
}
.disnon {
  display: none;
}


.calendar  {
	width: 100%;
	padding: 20px;
}

#schedule table {
	width: 90%;
	margin: 60px auto;
	font-size:0.8em;
	border-collapse: collapse;
	table-layout: fixed;
	background-color: #FFF;
	border: 1px solid #CCC;
}



.calendar  td {
	border: 1px solid #CCCCCC;
	padding: 5px;
	text-align: center;
	vertical-align: top;
	height: 15em;
}
.calendar .dayoff {
       font-weight: bolder;
       color: #FF0033;
}
.calendar  th {
	color: #333333;
	background-color: #FFF;
	text-align: center;
	border: 1px solid #CCC;
	width: 14%;
	padding: 5px;
}
.calendar .day {
	font-weight: bolder;
	width: 2em;
}
.calendar ul {
    clear: both;
    padding: 10px 0px;
    border-bottom: 1px dotted #C2C2C2;
}
.calendar .kotsuban {
	background-color: #9C9;
}
.calendar .kotsubanYoyaku {
	background-color: #9C9F00;
}
.calendar .koza {
	background-color: #9CC;
}
.calendar .kotsuka {
	background-color: #CF9;
}
.calendar .kotsumoku {
	background-color: #6C9;
}
.calendar .ladys {
	background-color: #FED3DA;
}
.calendar .mens {
	background-color: #7DB5FF;
}
.calendar .senior {
	background-color: #CCF;
}
.calendar .kids {
	background-color: #F96;
	font-size: 0.8em;
	padding-top: 2px;
	padding-bottom: 2px;
}
.calendar .chibi {
	background-color: #FF9;
}
.calendar  .earo {
	background-color: #F99;
}
.calendar .baby {
	background-color: #FCF;
}
.calendar .hula {
	background-color: #F90;
}
.calendar .body {
	background-color: #fc3;
}
.calendar .pifiratis {
	background-color: #C4F1FA;
}
.calendar .balletone {
	background-color: #fca2fc;
}
.calendar .yochiyochi {
	background-color: #FFE800;
}
.calendar .pregnancy {
	background-color: #F0A7FA;
}
.calendar .taikan {
background-color: #0069EE;
color: #FFFFFF;
}
.calendar .yoga {
background-color: #C833D5;
color: #FFFFFF;
}
.calendar .dance {
    background-color: #72F375;
}

.pink {
color: #FF438E;
font-weight: bolder;
font-size: 1.7em;
}

.dakkohimo {
   color: #FF438E;
   font-weight: bolder;
}

.shiseicheck{
   color: #0EA3E0;
   font-weight: bolder;
}

.onecoin{
   background-color: #E75F62;
}

.online_price .yellow {
color: #F8BC70;
font-weight: bolder;
font-size: 1.3em;
}


@media  (max-width:768px) {
.message {
    padding:  20px;
	font-size: 0.8em;
    line-height: 1.5em;
    margin: 20px auto;
    width: 100%;
}
.message h4 {
    font-size: 1.2em;
	letter-spacing: 0.02em;
    padding: 10px 0px 5px;
    border-bottom: 5px solid #F9D2C5;
	margin: 10px 0;
}

.theme {
margin: 10px 0;
padding: 5px;
letter-spacing: 0.01em;
}

.theme_pic {
width:100%;
}


#schedule {
	font-size: 0.8em;
    line-height: 1.5em;
  padding: 30px 0px 30px;
}
#schedule  .text {
	text-align: center;
	line-height: 2em;
	letter-spacing: 0.02em;
	margin: 10px auto 0px ;
	}

#tab {
    display: flex;
    justify-content: center;
    flex-wrap: wrap;
}
#tab li {
    font-size: 0.9em;
}



.calendar  {
	width: 100%;
}

#schedule table {
	width: 100%;
	margin: 20px auto;
	font-size:0.7em;
	line-height: 1.2em;
}

.calendar  td {
	padding: 3px;
	text-align: left;
}

}




/* onlinelesson */

#online{
   width:80%; 
	margin: 50px auto 0px;
	text-align: center;
} 



#onlinelesson{
    display: flex;
    justify-content:space-between;
    align-items: center;
    flex-wrap: wrap;
    margin:50px 0 0px 0;
}

#onlinelesson .img{
    width:30%;

}

#onlinelesson .content{
   width:65%; 
    text-align: left;
}



#onlinelesson h3{
	font-size: 1.3rem;
    margin:  30px 0 30px 0;
	text-align: left;
	color: #59BB98;
	letter-spacing: 0.1em;
}

#onlinelesson p{
	font-size: 1em;
    line-height: 2;
    margin: 0 0 50px 0;
}

#onlinelesson  .pink_line {
    font-size: 1.3rem;
	font-weight: bold;
	background:linear-gradient(transparent 60%, #ffdfef 0%);
		}

.online_bnr{
    width:80%;
	margin: auto;
}


@media  (max-width:940px) {
#online{
   width:100%; 
    }		
		

#onlinelesson .img{
    width:80%;
		margin: auto;
}

#onlinelesson .content{
	width:90%; 
   text-align: left;
   margin: 0 auto;
}  

#onlinelesson h3{
	font-size: 1.2rem;
    margin:  10px 0 10px 0;
}

#onlinelesson p{
	font-size: 0.9em;
    line-height: 1.7em;
	    letter-spacing: 0.1em;
    margin: 0 0 50px 0;
}

.online_bnr{
    width:90%;
}

}


/* online_price */
#online_price{
	margin: 50px auto 0px;
} 

.online_price h3{
   width:90%; 
    font-size: 1.5rem;
    margin: 30px auto 30px;
    color: #59BB98;
    letter-spacing: 0.3em;
    border-bottom: 5px solid #C8E5D7;
}

.online_price table {
  line-height: 1.25;
  border-collapse: collapse;
  margin: 50px auto;
  padding: 0;
  width:90%;
  table-layout: fixed;
 letter-spacing: 0.1em;
}

.online_price table tr {
  background-color: #fff;
  padding: .35em;
  border-bottom: 1px dotted #ccc;
}
.online_price table tr:last-child{
   border-bottom: 2px solid #18521b;
}
.online_price table th,
.online_price table td {
  padding: 1em 10px 1em 1em;
}
.online_price tbody th {
    font-size: 1.1rem;
    color: #59BB98;
	 text-align: left;
	 line-height: 1.5em;
}
.online_price .txt{
   text-align: left;
   font-size: .85em;
}
.online_price .price{
  color: #E83921;
   text-align: right;
}


.online_price span{
   text-align: right;
      font-size: .85em;
	    color: #666666;

}

.online_price .private {
    font-size: .9rem;
    color: #fff;
	 text-align: center;
	 background-color:#59BB98;
	 padding:0.5em 1em;
margin: 15px 0px;
}


@media (max-width: 768px) {

  .online_price table th{
    font-size: 1rem;
  }
   }
   
@media (max-width: 600px) {
 .online_price  table {
    border: 0;
    width:100%
  }
  .online_price table th{
    font-size: 0.9rem;
    display: block;
    border-right: none;
    border-bottom: 2px solid #0f7d13;
    padding-bottom: .6em;
    margin-bottom: .6em;

  }
  .online_price table thead {
    border: none;
    clip: rect(0 0 0 0);
    height: 1px;
    margin: -1px;
    overflow: hidden;
    padding: 0;
    position: absolute;
    width: 1px;
  }
  
  .online_price table tr {
    display: block;
    margin-bottom: 2em;
        border-bottom: 2px solid #0f7d13;
  }
  
  .online_price table td {
    border-bottom: 1px solid #bbb;
    display: block;
    font-size: .8em;
    text-align: right;
    position: relative;
    padding: .625em .625em .625em 4em;
    border-right: none;
  }
  
  .online_price table td::before {
    content: attr(data-label);
    font-weight: bold;
    position: absolute;
    left: 10px;
  }
  
  .online_price table td:last-child {
    border-bottom: 0;
  }
  .online_price .private {
    font-size: .8rem;
	padding:0.5em 1em;
	margin: 20px 0px;
}
}





 

/*===========================================================*/
/* Contact */
/*===========================================================*/
#otoiawase {
    width: 80%;
    padding: 50px;
    background-color: #ffffff;
    background-position: center top;
	margin: 0px auto;
}


.otoiawase_contents {
    background-color: #ffffff;
    border-radius: 20px;
    width: 90%;
    margin: 50px auto;
	padding: 50px;
    border: 1px solid #cccccc;
    filter: drop-shadow(3px 3px 3px rgba(0,0,0,0.3));
    text-align: center;
}

.contact_text {
	font-size: 1rem;
    margin: 20px  auto 30px ;
    text-align: left;
    letter-spacing: 1px;
    line-height: 2em;
	color: #494949;/*文字色*/
}

.must_red {
    color: #FF5500;
    border: 1px solid #FF5500;
    padding: 2px;
    border-radius: 3px;
    margin: 0px 10px;
}


#otoiawase .otoiawase_company   {
    text-align: center;
}

#otoiawase .tel:before {
  font-family: "Font Awesome 5 Free";
  content: '\f095';
  font-size:1em;
  font-weight: 900;
}
#otoiawase .tel a {
    color: #C03739;
    font-size: 1.1em;
    font-weight: 900;
}

.otoiawase_form {
    margin: 50px  auto;
}


.Form {
  margin-top: 80px;
  margin-left: auto;
  margin-right: auto;
  max-width: 720px;
}

.Form-Item {
  padding-top: 24px;
  padding-bottom: 24px;
  width: 100%;
  display: flex;
  align-items: center;
}

.Form-Item-Label {
  width: 100%;
  max-width: 248px;
  letter-spacing: 0.05em;
  font-weight: bold;
  font-size: 18px;
}

.Form-Item-Textarea {
  border: 1px solid #ddd;
  border-radius: 6px;
  margin-left: 40px;
  padding: 1em;
  height: 10em;
  flex: 1;
  width: 100%;
  max-width: 410px;
  background: #eaedf2;
  font-size: 18px;
  line-height: 1.5;
}
.Form-Item-Input {
  border: 1px solid #ddd;
  border-radius: 6px;
  margin-left: 40px;
  padding-left: 1em;
  padding-right: 1em;
  height: 48px;
  flex: 1;
  width: 100%;
  max-width: 410px;
  background: #eaedf2;
  font-size: 18px;
}


@media screen and (max-width: 768px) {
  .Form {
    max-width: 100%;
    padding: 0 10px;
    margin: 20px auto;
  }
  .Form-Item {
    flex-direction: column;
    align-items: flex-start;
  }
  .Form-Item-Input,
  .Form-Item-Textarea {
    width: 100%;
    margin-left: 0;
  }
}


.Form-Item-Label.isMsg {
  margin-top: 8px;
  margin-bottom: auto;
}
@media  (max-width: 768px) {
  .Form-Item-Label.isMsg {
    margin-top: 0;
  }
}
.Form-Item-Label-Required {
  border-radius: 6px;
  margin-right: 8px;
  padding-top: 8px;
  padding-bottom: 8px;
  width: 48px;
  display: inline-block;
  text-align: center;
  background: #FF5500;
  color: #fff;
  font-size: 14px;
}
@media  (max-width: 768px) {
  .Form-Item-Label-Required {
    border-radius: 4px;
    padding-top: 4px;
    padding-bottom: 4px;
	  margin-bottom: 8px;
    width: 40px;
    font-size: 13px;
  }
}


.horizon li {
	display:inline-block;
	vertical-align:top;
	white-space:nowrap;
	margin:0 0em 0.5em 3em;
}
.horizon li input,
.horizon li span {
    display: inline-block;
    vertical-align: middle;
    margin-right: 5px;
}
.horizon li label {
	margin-right:5px;
}

@media  (max-width: 768px) {
.horizon li {
	display:block;
	vertical-align:top;
	white-space:nowrap;
	margin: 1em;
}
}


/* form_btn
------------------------------ */

.form_btn {
	display: flex;
	align-items: center;
	justify-content: center;
}
.form_btn p {
	display:inline-block;
	vertical-align: top;
	margin:0 35px;
	width:230px;
	box-sizing:border-box;
}
.form_btn p input {
    cursor: pointer;
    padding: 10px 0;
    width: 100%;
    font-size: 1em;
}
.form_btn .reset input {
	border:1px solid #cccccc;
	background-color:#eeeeee;
	color:#666666;
	border-radius: 6px;
}
.form_btn .submit input {
	border:1px solid #6DC3BD;
	background-color:#6DC3BD;
	color:#ffffff;
	border-radius: 6px;
}


@media screen and (max-width: 480px) {
.form_btn {
    display: flex;
    justify-content:center;
    align-items: center;
    flex-wrap: wrap;
	box-sizing:border-box;
}
.form_btn p {
	margin: 5px;
    display: inline-block;
}
}



@media  (max-width:1190px) {

#otoiawase {
    margin: 20px auto;
    width: 90%;
}
.otoiawase_contents {
    width: 100%;
}

.contact_text {
	font-size: 0.9rem;
}

}

@media  (max-width:768px) {

#otoiawase {
    margin: 20px auto;
    width: 100%;
}
.otoiawase_contents {
    width: 100%;
}

.contact_text {
	font-size: 0.9rem;
}
}


@media  (max-width:440px) {
#otoiawase {
    padding: 10px;
    margin: 10px auto;
    width: 100%;
}
.otoiawase_contents {
    width: 100%;
	padding: 10px 20px;
}

.contact_text {
	font-size: 0.8rem;
	line-height: 1.2rem;

}

.otoiawase_form {
    margin: 10px  auto;
}


}



/*===========================================================*/
/* お客様の声 */
/*===========================================================*/

/* interview */

 #interview{
   width:100%; 
	margin: 50px auto 50px;
} 

 #interview .interview-list{
	display: flex;
    justify-content: space-around;
    flex-wrap: wrap;
	box-sizing:border-box;
		margin: 30px auto 30px;

	 } 

.interview-list section{
    width: 90%;
    background-color: #fff;
    position: relative;
    box-shadow: 5px 5px 0 rgba(0,0,0,0.1);
    margin: 0 0 20px 0;
    padding: 50px 20px 50px 20px;
    border-radius: 2px;
    display: flex;
    justify-content: space-around;
    flex-wrap: wrap;
    box-sizing: border-box;
    font-size: 0.9rem;
    background-image: url(../img/clover.webp);
    background-position: right bottom;
    background-size: 200px 135px;
    background-repeat: no-repeat;
    background-origin: padding-box;
}

.interview-list  .interview-intro{
    width: 40%;
    position: relative;
    top: 20px;
    floa: inline-block;
	
}

.interview-list  .interview-waku{
    width:50%;
	display: inline-block;
}

.interview-list section:nth-child(2){
     animation-delay: 0.2s;   
}
.interview-list section:nth-child(3){
     animation-delay: 0.4s;   
}

.interview-list section .interview-img{
	padding-top:100%;
	background-size:cover!important;
}

.interview-list section:nth-of-type(1) .interview-img{
    background:url("../img/voice_kubota.webp") no-repeat center;
    background-size: cover;
}

.interview-list section:nth-of-type(2) .interview-img{
     background:url("../img/voice_kato.webp") no-repeat center;
    background-size: cover;
}

.interview-list section:nth-of-type(3) .interview-img{
     background:url("../img/voice_koseki.webp") no-repeat center;
    background-size: cover;
}

.interview-list section:nth-of-type(4) .interview-img{
     background:url("../img/voice_kitagawa.webp") no-repeat center;
    background-size: cover;
}

.interview-list section:nth-of-type(5) .interview-img{
     background:url("../img/voice_ueno.webp") no-repeat center;
    background-size: cover;
}

.interview-list section h3{
    font-size: 1.3rem;
    text-align: center;
    margin: 0px 0 30px 0;
    padding: 10px 0;
	letter-spacing: 0.2em;
	background-color: #E3EFE3;
}

.interview-list section h3 span{
    font-size: 0.8rem;
    text-align: center;
    padding: 0 10px 0;
	letter-spacing: 0.2em;
	font-weight: 400;
}

.interview-list .form-list{
    padding-top: 20px;
	line-height: 2.3em;
}




@media  (max-width:840px) {
.interview-list section h3{
    font-size: 1.1rem;
    margin: 20px 0 0 0;
    padding: 0 0 5px 0;
	letter-spacing: 0.1em;
}
}

@media  (max-width:768px) {
.interview-list section{
    width:90%;
    background: #fff;
	position: relative;
	box-shadow: 3px 3px 0 rgba(0,0,0,0.1);
	margin:0 auto 20px;
    padding:20px 5px 60px 5px;
    border-radius: 2px;
	background-image: url(../img/clover.webp);
    background-position: right bottom;
    background-size: 200px 135px;
    background-repeat: no-repeat;
    background-origin: padding-box;
}
.interview-list  .interview-intro{
    width: 90%;
    position: relative;
    top: 20px;
    floa: block;
	
}

.interview-list  .interview-waku{
    width:90%;
	position: relative;
    top: 30px;
	display:block;
}
.interview-list .form-list{
	line-height: 2em;
}

} 
	
@media  (max-width:600px) {
.interview-list section{
    width:90%;
    background: #fff;
	position: relative;
	box-shadow: 3px 3px 0 rgba(0,0,0,0.1);
	margin:0 auto 20px;
    padding:20px 5px 60px;
    border-radius: 2px;
	background-image: url(../img/clover.webp);
    background-position: right bottom;
    background-size: 200px 135px;
    background-repeat: no-repeat;
    background-origin: padding-box;
}



.interview-list section h3{
    font-size: 1rem;
    margin: 10px 0 0 0;
    padding: 0 0 5px 0;
	letter-spacing: 0.1em;
}

.interview-list .form-list{
	line-height: 1.8em;
}
}


/* interview form */

.form-list{
    width:100%;
    margin: 0 auto;
}


.form-list p{
    display: flex;
    justify-content: space-between;
    flex-wrap: wrap;
	padding:0 0 10px 0;
}



@media  (max-width:600px) {
.form-list dt,
.form-list dd{
	font-size: 0.8rem;
letter-spacing: 0.1em;	
}
	
}







/* topics */


#topics{
background-color: #F6FAF0;
    border-radius: 10px;
    padding: 0;
}

#topics .date{
color: #59BB98;
}

#topics .pics{
width: 70%;
margin: auto;
}

.topics_detail{
text-align: center;
width: 70%;
margin: auto;
}


@media  (max-width:600px) {
#topics .title{
font-size: 0.8em;
}

#topics p{
font-size: 0.8em;
}

#topics .date{
font-size: 0.8em;
}

#topics .pics{
width: 90%;
margin: auto;
}
}



#kotsucheck{
width: 100%;
background-color: #FFFEED;
margin: 100px auto;
text-align: left;
}

@media  (max-width:1020px) {
#kotsucheck{
margin-top: 0px;
}
}

@media  (max-width:600px) {
#kotsucheck{
margin-top: -10px;
}
}

#process{
    width: 80%;
	margin: auto;
	text-align: left;
    }
.process-contents{
    padding: 20px 0px 60px 60px;
    }

/* 番号付き見だし */
.heading-num {
	padding: 20px 0px 0px 60px;
	position: relative;
	font-size: 26px;
}

.heading-num::before {
    content: attr(data-number);
    display: inline-block;
    margin-right: 20px;
    color: #16BC79;
    font-size: 30px;
    border-bottom: 1px solid #16BC79;
}

@media (max-width:550px) {
#process{
	margin: 10px auto;
    }
.process-contents{
    padding: 20px 0px 30px;
    }
.heading-num {
	font-size: 1.1rem;
	padding: 20px 0px 0px 0px;
	letter-spacing: 0.1em;
}
	}
	
	
	
/*===========================================================*/
/* サブスク */
/*===========================================================*/

.subsc_ex{
max-width: 1000px;
text-align: center;
    margin:50px auto 0px;
	line-height: 200%;
	color:#F67A33;
	Font-weight:bold;
}


#subsc-intro{
max-width: 1400px;
    display: flex;
    justify-content:space-around;
    align-items: center;
    flex-wrap: wrap;
    margin:50px auto 0px;
}

#subsc-intro .img{
    width:40%;
	position: relative;
	top:30px;

}

#subsc-intro .content{
   width:45%; 
    text-align: left;
}



#subsc-intro h3{
	font-size: 1.6rem;
    margin:  30px 0 30px 0;
	text-align: left;
	color: #59BB98;
	letter-spacing: 0.1em;
}

#subsc-intro p{
	font-size: 1em;
    line-height: 2;
    margin: 0 0 20px 0;
}


@media  (max-width:940px) {
#subsc{
        margin:0 0 20px 0;
    }
#subsc h2{
	font-size: 1.3em;
	width: 80%;
}
#subsc-intro .img{
    width:60%;
		margin: auto;
			top:-10px;

}

#subsc-intro .content{
	width:100%; 
   text-align: left;
}  
#subsc-intro p{
    font-size:0.9rem;
    letter-spacing: 0.1em;
    } 
}


@media  (max-width:600px) {
#subsc-intro h3{
	font-size: 1.2em;
}
#subsc-intro .img{
    width:80%;
		margin: auto;
			top:-20px;

}
}

#subsc_intro .txt-r{
     text-align: right;
}


/* point */
.subsc_point{
	font-size: 1.1rem;
	padding: 20px 0px 0px;
	letter-spacing: 0.1em;
	text-align: center;
}

.subsc_point p{
	padding: 20px 0px 0px;
}

.subsc_point span{
	font-size: 1.6rem;
	font-weight: bolder;
	background: linear-gradient(transparent 50%, yellow 50%);
}




/* plan */
.subsc_plan{
	text-align: center;
	width:90%;
	margin: 30px auto;
	  padding: 20px;
	max-width: 1000px;
	background-color:#d6f0c9;
}


.title-06 {
  position: relative;
  padding: 8px 16px;
  outline: 3px solid #44b48e;
  font-family: 'Noto Sans JP', serif;
  font-size: 24px;
  letter-spacing: 0.1em;
  color: #44b48e;
  font-weight: 700;
  display: block;
  box-sizing: border-box;
  max-width: 500px;
  text-align: center; 
  margin: 24px;
  margin-inline: auto;
}

.title-06::before {
  content: "";
  position: absolute;
  top: 6px;
  left: 6px;
  width: 100%;
  height: 100%;
  background: #eee9e6;
  z-index:-999;
}

.subsc_plan .comment{
	font-size: 1.3rem;
	letter-spacing: 0.1em;
	font-weight:bolder;
	font-color:#425ea4;
}

.subsc_plan .info{
	font-size: 1.4rem;
	letter-spacing: 0.1em;
	font-weight:bolder;
	background: linear-gradient(transparent 70%, lightblue 70%);
}

@media  (max-width:600px) {
.subsc_plan .comment{
	font-size: 1rem;
	letter-spacing: 0.05em;
	font-weight:bold;

}

.subsc_plan .info{
	font-size: 1.2rem;
	letter-spacing: 0.05em;
	font-weight:bolder;
}
}


.subsc_plan h4{
width:100%;
	text-align: left;
	padding: 3px 10px;
	font-size: 1.2rem;
	font-weight:bolder;
	background-color: #fedc56;
}
.subsc_box{
    display: flex;
    justify-content: space-between;
	padding:10px;
	background-color: #FFFDFD;

}
.subsc_boxbox{
    display: flex;
    justify-content: space-between;
	padding:10px;

}
.subsc_waku ul {
	padding:10px;
	text-align: left;
	display: block;
}

.subsc_waku h5 {
	font-weight:bolder;
	font-size: 1.1rem;
}

ul.numbered {
  list-style-type: decimal;
  padding-left: 1.5em;
  counter-reset: li; /* カウンターリセット */
}

ul.numbered li {
  list-style-type: none; /* いったんデフォルト番号を消す */
}

ul.numbered li:not(:first-child) {
  counter-increment: li; /* 2つ目以降だけカウント */
}

ul.numbered li:not(:first-child)::before {
  content: counter(li) ". "; /* 1. 2. 3. 形式 */
}


@media  (max-width:1090px) {
.subsc_box{
  display: block; /* flexを解除して縦並びに */
  }
}

@media  (max-width:600px) {
.subsc_boxbox{
  display: block; /* flexを解除して縦並びに */
  }
}

/* schedule */
.schedule-table {
  width: 100%;
  max-width: 900px;   /* PC時は900px */
  margin: 20px auto;
  border-collapse: collapse; /* 枠をスッキリ */
  font-size: 0.95rem;
  text-align: center;
}


.schedule-table th,
.schedule-table td {
  border: 2px solid #60837f;
  padding: 12px;
}/* 枠線 */


.schedule-table th {
  background-color: #60837f;
  color: #fff;
  font-weight: bold;
}/* ヘッダー */


.schedule-table tr:nth-child(even) td {
  background-color: #e4fdf9;
}
.schedule-table tr:nth-child(odd) td {
  background-color: #ffffff;
}/* 行の交互色 */


@media screen and (max-width: 640px) {
  .schedule-table {
    font-size: 0.85rem;
  }
  .schedule-table th,
  .schedule-table td {
    padding: 8px;
  }
}

.to_form{
	margin: 0px auto;
}

.to_form img{
    width:70%;
	max-width:600px;
	text-align: center;
}