@charset "utf-8";
@import url('https://fonts.googleapis.com/earlyaccess/notosansjapanese.css');
@import url('https://fonts.googleapis.com/css2?family=Noto+Serif+JP:wght@200;300;400;500;600;700;900&display=swap');


* {
    padding: 0;
    margin: 0;
}
a{
  text-decoration: none;
  color:inherit;

}
ul,li{
  list-style: none;
}
.hide{display: none;}
body{
  font-family: zen-kaku-gothic-antique, sans-serif;
  font-size: 16px;
  font-feature-settings: "palt";
}

/* headerロゴ */

.logo {
	position: absolute;
	width: 240px;
	left: 20px;
	top: 20px;}
.logo img {
	width: 100%;}
	
@media (max-width: 700px) {

.logo {
	left: 1em;
	top: 1em;
	width: 20vw;
}

}


/* トップページ　メイン */
.pc{display: block;}
.sp{display: none;}
.container{width: 800px; margin: 0 auto ;}
.main-img{width: 100%; height: auto; position: relative;}
.main-img figure { margin: 0 !important;}
.main-img figure img{width: 100%; height: auto;  vertical-align: bottom;}
.main-img h1{
  position: absolute; 
  width:40%; 
  top: 23%;
  left: 32%;
}
.main-img h1 img{width: 100%;}
.text-hide{font-size: 0;}
.registration{
  position: absolute;
  width: 15%;
  bottom: 10%;
  right: 5%;
}
.registration img{width: 100%;}
.nav-main{
  width: 100%;
  background-color: #2f6acd;
}
.ul-nav{
  width: 70%;
  margin: 0 auto;
  display: flex;
  flex-wrap: wrap;
  justify-content: space-between;
}
.ul-nav li{
  color: #FFF!important;
  font-weight: 500;
  padding: 30px 0;
  width: 24%;
  text-align: center;
  border-right: 1px solid #FFF;
  line-height: 1;
}
.ul-nav li img{width: 15%; display: block; margin: 0 auto 10px; }
.ul-nav li:nth-child(1){border-left:1px solid #FFF ;}
.nav-span{font-weight: 300; font-size: 0.7rem;}
#news{margin-top: 80px;}
.news-area h2{color: #00b4e1; font-size: 1.5rem; text-align: center; border-bottom: 1px solid #00b4e1;}
.p-news{color: #00b4e1; font-size: 1rem; text-align: center; font-weight: 600;}
.ul-news{margin-top: 30px;}
.ul-news li{display: flex; 
  flex-wrap: wrap; 
  justify-content: flex-end; 
  border-bottom: 1px dotted #000000; 
  padding: 15px 0;
}
.ul-news li time{width: 30%; font-weight: 500;}
.ul-news li h3{width: 70%;}
.ul-news li p{width: 70%; font-size: 0.8rem;}
.btn-01{
  width: 150px; 
  padding: 10px; 
  margin: 20px auto; 
  border: 2px solid #00b4e1;
  border-radius: 10px;
  text-align: center;
  font-size: 0.9rem;
  position: relative;
  color: #00b4e1;
  font-weight: 500;
}
.btn-01 p:after{
  content: '>';
  position: absolute;
  right: 10px;
  top: 8px;
}
.btn-02{
  width: 250px; 
  padding: 20px; 
  margin: 0 auto; 
  border: 2px solid #FFF;
  border-radius: 10px;
  text-align: center;
  font-size: 1.2rem;
  position: relative;
  color: #FFF;
  font-weight: 600;
  background-color:rgba(47, 106, 205, 0.8);
}
.btn-02 p:after{
  content: '>';
  position: absolute;
  right: 10px;
  top: 35px;
}
.seminar-photo-title{
  margin-top: 80px;
  display: flex;
  align-items: center;
  width: 100%;
  height: 200px;
  background-image: url(../images/ph-img01.jpg);
  background-repeat: no-repeat;
  background-size: cover;
}
.member-area{background-color: #e5f7fc; padding: 70px 0;}
.member-area h2{
  display: flex; 
  color: #00b4e1;
  align-items: center;
  width: 500px;
  margin: 0 auto;
}
.member-area h2 img{width: 50%;}
.member-area h2 span{
  margin-left:30px ;
  border-top: 1px solid #00b4e1; 
  border-bottom: 1px solid #00b4e1;
  padding: 2px 30px;
  font-size: 1.2rem;
  font-weight: 400;
}.ul-member-list{
  margin-top: 50px; 
  display: flex; 
  flex-wrap: wrap; 
  justify-content: space-between;
  row-gap: 30px;
}
.ul-member-list li{width: 28%;}
.ul-member-list li h4{font-size: 1.1rem; font-weight: 500; border-bottom: 1px solid #00b4e1;}
.ul-member-list li p{margin-top: 3px; font-size: 0.9rem; line-height: 1.3;}
.ul-member-list li p span{color: #00b4e1;}
.btn-03{
  width: 400px; 
  padding: 20px 0; 
  margin: 80px auto; 
  border: 2px solid #2f6acd;
  border-radius: 10px;
  text-align: center;
  font-size: 1.5rem;
  position: relative;
  color: #2f6acd;
  font-weight: 500;
  box-shadow: 2px 2px 15px -5px #777777;
}
.btn-03 p{margin-left: 10px; display: inline;}
.btn-03 p:after{
  content: '＞';
  position: absolute;
  right: 10px;
}
.footer-area{
  width: 100%; 
  background-color: #2f6acd; 
  text-align: center;
   padding: 30px 0;
}
.ul-footer{
  display: flex; 
  margin: 20px auto; 
  justify-content: center;
  font-size: 0.9rem;
  color: #FFF;
}
.ul-footer li:after{content:'｜'; margin-left: 10px;}
.regist-btn{
  opacity: 0;
  position: absolute;
  width: 15%;
  bottom: 10%;
  right: 5%;
  pointer-events: none; 
  cursor: not-allowed;
}
  .regist-btn img{width: 100%;}
.regist-btn.none.fixed{
  position: fixed;
  top: 50px;
  left: auto;
  z-index: +1;
  transform: translateY(0);
  opacity: 90%;
  transition: 1s;
  pointer-events:all; 
  cursor:auto;
}
.regist-btn.none{
  transform: translateY(-100%);
  opacity: 0;
  z-index: -1;
}
/* ハンバーガー--------------------------------------------- */
.hamburger{
  display: none;
  position: fixed;
  /* border-radius: 50%; */
  background-color: #2f6acd; 
  text-align: center;
  top: 10px;
  right: 10px;
  width: 40px;
  height: 40px;
  cursor: pointer;
  transition: 0.5s;
  border: 1px solid #FFF;
  z-index: 999;
}
.inner_line {
  display: block;
  position: absolute;
  right: 10px;
  width: 20px;
  height: 3px;
  background-color: #000000;
  transition: 0.1s;
  border-radius: 4px;
}
.inner_line-0 {
  display: block;
  position: absolute;
  right: 10px;
  width: 20px;
  height: 3px;
  background-color: #FFF;
  transition: 0.1s;
  border-radius: 4px;
}
#line1 {
  top: 10px;
}
#line2 {
  top: 18px;
}
#line3 {
  bottom: 10px;
}

.in{
  transform: translateX(100%);
}
.line_1,.line_2,.line_3{
  background: #FFF;
}
.line_1 {
  /*-45度回転させる*/
  transform: rotate(-45deg);
  top: 18px!important;
}
.line_2 {
  opacity: 0;
}
.line_3 {
  /*45度回転させる*/
  transform: rotate(45deg);
  bottom: 18.8px!important;
}
.nav-sp{
  position: fixed;
  width: 100%;
  height: 100vh;
  background-color: #2f6acd;
  z-index: 900;
  transform: translateX(-100%);
  transition: ease .4s;
}
.ul-nav-sp{
  display: flex;
  width: 80%;
  color: #FFF;
  margin: 0 auto;
  font-size: 1.2em;
  text-align: center;
  align-items: center;
  flex-wrap: wrap;

}
.ul-nav-sp li{
  padding: 30px 0; 
  width: 100%;
  border-bottom: 1px dotted #FFF;
  text-align: center;
}
.ul-nav-sp img{text-align: center; width: 30px; }
.nav-active{transform: translateX(0);}

@media (max-width: 700px) {
  .hamburger{display: block;}
  .nav-main{display: none;}
}

.sub-img{
  width: 100%;
  height: 200px;
  background-image: url(../images/main-img.png);
  background-repeat: no-repeat;
  background-size: cover;
  background-position: center center;
}
.sub-title{
  display: flex;
  align-items: center;
  width: 500px;
  margin: 0 auto;
  background-color: #FFF;
  height: 200px;
  justify-content: center;

}
.sub-title h1{
  text-align: center;
  color: #00b4e1;
  font-size: 2.5rem;
  line-height: 0.8;
}
.sub-title h1 span{
  font-size: 1rem ;
  color: #6d6d6d;
}
.contact-area{
  width: 80%;
  background-color: #eaf0fa;
  margin: 50px auto;
}
.news-seminar{margin: 50px auto;}
.news-seminar img{width: 100%;}
.h2-sminar{text-align: center; font-size: 1.5rem; margin-bottom: 30px;}
.margin-top80{margin-top: 80px;}
.h3-seminar{background-color: #2f6acd; color: #FFF; padding: 10px;}
.dl-seminar-info{display: flex; width: 100%; flex-wrap: wrap; justify-content: space-between; margin: 15px auto;}
.dl-seminar-info dt{width: 30%; border-bottom: 1px dotted #6d6d6d; padding: 10px 0; color: #2f6acd;font-weight: 500;}
.dl-seminar-info dd{width: 70%; border-bottom: 1px dotted #6d6d6d; padding: 10px 0;}
.p-seminar{text-align: center; font-size: 1.5rem; color: #6d6d6d;}
#form-title .notice {
	margin-top: 1.5em;
	padding: 1em 2em;
	border: solid 2px #2f6acd;
	border-radius: 0.5em;}
#form-title .notice .notice_title {
	margin-bottom: 0.5em;
	font-size: 1.1em;
	font-weight: 700;}
#form-title .notice p {
	text-align: left;
	font-weight: 400;}
#entry{padding: 50px 0;}
#entry .additional {
	display: none;}
.p-contact{text-align: center;}
.form-area{width: 80%; margin: 0 auto ;}
.dl-form{font-size: 1rem; width: 100%; display: flex; flex-wrap: wrap; justify-content: space-between; }
.dl-form dt{width: 100%; padding: 5px 0;  color: #2f6acd; font-weight: 500;}
.dl-form dt span{font-size: 0.8rem; padding: 1px; color: #f30e0e; margin-left: 5px; font-weight: 500;}
.dl-form dd{width: 100%; padding: 15px 0; }
.dl-form dd span{font-size: 0.9rem;}
.input-area{width: 90%; border:1px solid #6d6d6d; padding: 10px;}
.input-area02{width: 10%; border:1px solid #6d6d6d; padding: 10px;}
.con-span{margin-left: 5px!important}
.form-textarea{border:1px solid #6d6d6d; width: 90%; padding: 10px;}
.btn-contact-area{width: 200px; margin: 50px auto 0; }
.btn-contact-area-back{width: 200px; margin: 20px auto 0; }
.btn-contact{ color: #2f6acd; width: 200px; padding: 10px; background-color: #FFF; border: 1px solid #2f6acd; border-radius: 5px;}
.btn-contact{cursor: pointer;}
.btn-back{ color: #666666; width: 200px; padding: 10px; background-color: #FFF; border: 1px solid #999999; border-radius: 5px;}
.radio-css{margin-right: 50px;}
.form-title-area{width: 80%; margin: 50px auto; text-align: center;}
.form-title-area h2{color: #2f6acd; margin-bottom: 30px;}
.form-title-area p{font-weight: 500;}
.note-contact{width: 80%; margin: 0 auto; font-weight: 500; font-size: 0.8rem;}
select{width: 95%; padding: 10px;}
.link-seminar{display: flex; justify-content: end;}
.p-link-seminar{text-align: right; width: 150px; color: #2f6acd; border-bottom: 1px solid #2f6acd;}
#entry-select{margin: 100px auto;}
#entry-select h2{font-weight: 500; color: #6d6d6d; text-align: center;}
.select-btn-area{width: 100%; display: flex; justify-content: center; margin-top: 50px; column-gap: 50px; margin-bottom: 200px;}
.select-btn01{
  font-weight: 500;
  font-size: 1.1rem;
  color: #FFF;
  width:300px; 
  padding: 20px 0; 
  text-align: center; 
  border-radius: 10px;
  border: 2px solid #FFF;
  box-shadow: 2px 2px 15px -5px #777777;
}
.cont-border-line{width: 100%; border-bottom: 1px dotted #6d6d6d; margin-bottom: 10px;}
.select-btn01 a p:after{content: "＞"; margin-left: 20px;}
.btn-color01{background-color: #00b4e1;}
.btn-color02{background-color: #2f6acd;}
.line01{ border-bottom: 1px solid #2f6acd;}
.h2-title01{color: #00b4e1; font-weight: 2rem; text-align: center;}
.p-greeting{width: 90%; margin: 50px auto 1em auto; line-height: 1.8;}
.p-greeting-signature{width: 90%; margin: 0 auto 50px auto; line-height: 1.8; text-align: right;}
.greeting-area{width: 100%; background-color: #eaf0fa; padding: 80px 0;} 
.col2-area{display: flex; justify-content: space-between; align-items: center;}
.width40{width: 40%; margin: 0 auto;}
.col2-img{width: 30%;}
.col2-img img{width: 100%;}
.col2-text{width: 65%;}
.p-profile01 span{font-size: 1.3rem; font-weight: 500;}
.p-profile01{margin-bottom: 20px;}
.ul-pro01{margin-top: 20px;}
.h2-title02{border-bottom: 1px solid #6d6d6d; font-size: 1.4rem;}
.h3-title01{font-weight: 500; color: #00b4e1;}
.p-contitution{margin-bottom: 30px; line-height: 1.6;}
.c-area{margin: 30px auto;}
.ol-conti{margin-top: -10px;}
.ol-conti li{position: relative;padding-left: 18px; }
.ol-conti li:before {
  position: absolute;
  right: calc(97% + 0.5rem);  /* 0.5remは連番とテキストとの余白 */
  content: "(" counter(list-item) ")";
}


.seminar-list {
	margin-top: 2em;
	display: flex;
	flex-wrap: wrap;
	justify-content: flex-start;
	gap: 25px;}
.seminar-list li {
	width: 250px;}
.seminar-list dl {
	display: flex;
	flex-direction: column;}
.seminar-list dl dt {
	margin-bottom: 0.5em;
	order: 2;
	font-weight: 700;
	font-size: 1.2em;
	text-align: center;}
.seminar-list dl dd:nth-of-type(1){ margin-bottom: 0.5em; order: 1;}
.seminar-list dl dd:nth-of-type(2){ order: 3; text-align: center;}
.seminar-list dl dd:nth-of-type(3){ order: 4;}
.seminar-list dl dd img {
	border: solid 1px #999;
	width: 100%;
	box-sizing: border-box;}
.article-semi{margin-top: 50px;}
.h2-title03{border-bottom: 1px solid #6d6d6d; margin-top: 50px; color: #00b4e1;}
.h2-title04{border-bottom: 1px solid #6d6d6d; margin-top: 50px; color: #00b4e1; text-align: center;}
.article-gall{margin: 50px auto;}
.article-gall h3{font-size: 1.3rem; text-align: center; margin-bottom: 50px; color: #6d6d6d; font-weight: 500;}
.ul-gall{display: flex; flex-wrap: wrap; justify-content: flex-start; margin: 0 auto; gap: 2%;} 
.ul-gall li{width: 32%;}
.ul-gall li img{width: 100%;}
.ul-fee{width: 50%; display: flex; justify-content: center; flex-wrap: wrap; margin: 50px auto; font-size: 1.3rem;}
.ul-fee dt{padding: 10px 0; width: 50%; border-bottom: 1px dotted #6d6d6d;}
.ul-fee dd{padding: 10px 0; width: 50%; border-bottom: 1px dotted #6d6d6d; color: #00b4e1; font-weight: 500;}
.h3-title04{text-align: center; font-weight: 500; font-size: 1.3rem;}
.border-area{border: 1px solid #00b4e1; padding: 30px;}
.p-center{text-align: center;}
.margin-bottom50{margin-bottom: 50px;}
.width800{width: 800px; margin: 0 auto;}
.h2-news02{margin-bottom: 30px;}
.sp{display: none;}
/* -----------700PX--------------------------------------------------------- */
@media (max-width: 700px) {
  body{font-size: 15px;}
  .width800{width: 90%; margin: 0 auto;}
  .sp{display: block;}
  .regist-btn.none.fixed{display: none;}
  .container{width: 80%; margin: 0 auto;}
  .btn-02{font-size: 1rem;}
  .btn-03{width: 295px; }
  .registration{display: none;}
  .seminar-photo-title{
    height: 400px; 
    background-image: url(../images/ph-img01-sp.jpg);
    background-position: center;
  }
  .member-area{padding: 40px 0;}
  .member-area h2{flex-direction: column; width: 70%; margin: 0 auto;}
  .ul-member-list{flex-direction: column; margin-top: 50px;}
  .ul-member-list li{width: 100%; text-align: center;}
  .ul-footer{flex-direction: column;}
  .ul-footer li:after{content:''; }
  .pc{display: none;}
  .sp{display: block;}
  .main-img h1{width: 90%; top: 30%; left:5% ;}
  .ul-nav-sp{margin-top: 40px;}
  .ul-nav-sp li{padding: 20px 0; line-height: 1;}
  .dl-form{flex-direction: column;}
  .dl-form dt{width: 100%; border-bottom: none;}
  .dl-form dd{width: 100%; padding: 0 0 10px;}
  .contact-area{width: 100%;}
  .form-area{width: 90%;}
  .input-area{width: 90%;}
  .form-textarea{width: 90%;}
  select{width: 100%; }
  .sub-title{width: 200px;}
  .select-btn-area{flex-direction: column; row-gap: 20px; margin-top: 30px; margin-bottom: 30px;}
  #entry-select h2{font-size: 1.1rem;}
  .sub-title h1{font-size: 1.5rem; line-height:1.5 ;}
  .btn-03{width: 70%; font-size: 1rem;}
  .btn-03 img{width: 30px; position: relative; top: 5px;}
  .ul-fee{width: 100%;}
  .col2-area{flex-direction: column; width: 80%; margin: 0 auto;}
  .col2-img{width: 80%; margin: 0 auto;}
  .col2-text{width: 100%;}
  .ul-gall{width: 100%;}
  .ul-gall li{width: 100%;}
  .article-gall h3{margin-bottom: 20px; font-size: 1.1rem;}
  
.seminar-list li {
	width: 100%;}
  
}