@charset "UTF-8";

/*!
Theme Name: Cocoon Child
Description: Cocoon専用の子テーマ
Theme URI: https://wp-cocoon.com/
Author: わいひら
Author URI: https://nelog.jp/
Template:   cocoon-master
Version:    1.1.3
*/

/************************************
** 子テーマ用のスタイルを書く
************************************/
/*必要ならばここにコードを書く*/

/*-------------------------------------------------------------
リセットCSS
--------------------------------------------------------------*/

@charset "UTF-8";
html, body, div, span, applet, object, iframe,
h1, h2, h3, h4, h5, h6, p, blockquote, pre,
a, abbr, acronym, address, big, cite, code,
del, dfn, em, img, ins, kbd, q, s, samp,
small, strike, strong, sub, sup, tt, var,
b, u, i, center,
dl, dt, dd, ol, ul, li,
fieldset, form, label, legend,
table, caption, tbody, tfoot, thead, tr, th, td,
article, aside, canvas, details, embed,
figure, figcaption, footer, header, hgroup,
menu, nav, output, ruby, section, summary,
time, mark, audio, video {
margin: 0;
padding: 0;
border: none;
font-style: normal;
text-align: left;
zoom: 1;
}
article, aside, details, figcaption, figure,
footer, header, hgroup, menu, nav, section {
display: block;
}
table {
border-collapse: collapse;
font-family: inherit;
}
h1,h2,h3,h4,h5 {
font-size: 100%;
font-weight: normal;
line-height: 1;
}
input,textarea,select {
font-family: inherit;
font-size: 16px;
}
input[type="button"],input[type="text"],input[type="submit"] {
-webkit-appearance: none;
border-radius: 0;
}
textarea {
resize: none;
-webkit-appearance: none;
border-radius: 0;
}
th,td {
border-collapse: collapse;
}
table th,table td {
white-space: nowrap;
}
ul,ol {
list-style-type: none;
}
img {
vertical-align: text-bottom;
vertical-align: -webkit-baseline-middle;
max-width: 100%;
height: auto;
width /***/:auto;
}
a {
    text-decoration: none;
    color: white;
}

/*-------------------------------------------------------------
基本設定
--------------------------------------------------------------*/
html{
	font-size:16px;
}
body{
	color:#2A2A2A !important;
	background-color:white;
	margin: 0 auto;
	
}
section{
	display:flex;
	flex-direction:column;
	margin:auto;
	margin-top:3%;
	width:90%;
	max-width:1600px;
}
.section-title{
	display:flex;
	flex-direction:column;
	font-weight:bold;
	margin:auto;
	width:100%;
	align-items:flex-start;
	
}
.section-title-sub{
	font-size:1.3rem;
	text-align:center;
	padding-left:5%;
}
.section-title-border{
	height:0.3vh;
	width:30%;
	border-radius:10px;
	background: linear-gradient(to right,#11337F, #8099CC);
}
.section-title-main{
	font-size:2rem;
	letter-spacing: 0.2rem;
	padding-left:5%;
}
.customize-button{
	display:flex;
	justify-content:center;
	align-items:center;
	color:white;
	background: linear-gradient(to right, #11337F, #8099CC);
	padding:1% 2%;
	font-size:1.3rem;
	border-radius:10px;
	box-shadow: 5px 5px 10px rgba(0, 0, 0, 0.3);
	transition: all 0.2s ease-in-out;
}
.customize-button i{
	margin-right:2%;
}
.customize-button:hover{
	box-shadow: none;
    transform: translateY(5px);
	transform: translateX(5px);
	cursor:pointer;
	color:white;
}
a:hover{
	opacity:0.8;
	cursor:pointer;
	color:#1475BD;
}
.blue-accent{
	font-weight:bold;
	font-size:2rem;
	color:#83AFDA;
}
.sp{
	display:none;
}
.pad{
	display:none;
}
.pc{
	display:flex;
}
.se{
	display:none;
}
i{
	margin-right:4%;
	display:block;
}
.grecaptcha-badge { visibility: hidden; }
.section-contents{
	width:90%;
	margin:auto;
}
img{
	border-radius:10px;
}
h2{
	font-size:2rem;
	color:#11337F;
	font-weight:bold;
	margin:1.5% 0%;
	padding-left:2%;
	position: relative;
}
h2::before {
	width:5px;
  content: '';
  position: absolute;
  left: 0;
  top: 0;
  height: 100%; /* 縦の長さ（見出し全体に合わせる） */
  background-color: #010079;
  border-radius: 5px; /* 丸みを付ける（上下に） */
}
h3{
	font-size:1.5rem;
	margin:2% 0%;
	font-weight:bold;
}
h4{
	font-size:1.2rem;
	margin:1% 0%;
	font-weight:bold;
}
.hide-text{
	display:none;
}
/*-------------------------------------------------------------
アニメーション
--------------------------------------------------------------*/
/* アニメーションの定義 */
@keyframes fadeInUp {
    0% {
        opacity: 0;
        transform: translateY(20px); /* 下から */
    }
    100% {
        opacity: 1;
        transform: translateY(0); /* 上へ */
    }
}

/* アニメーションを適用するクラス */
.fade-in {
    animation-name: fadeInUp;
    animation-duration: 2.5s; /* アニメーションの長さ */
    animation-timing-function: ease; /* アニメーションの動き */
    animation-fill-mode: forwards; /* アニメーションが完了したときの状態 */
}

@keyframes fadeInRight {
    0% {
        opacity: 0;
        transform: translateX(-300px); /* 左から */
    }
    100% {
        opacity: 1;
        transform: translateX(0); /* 位置は元に戻る */
    }
}

/* アニメーションを適用するクラス */
.fade-in-right {
    animation-name: fadeInRight;
    animation-duration: 2.5s; /* アニメーションの長さ */
    animation-timing-function: ease; /* アニメーションの動き */
    animation-fill-mode: forwards; /* アニメーションが完了した後の状態 */
}

@keyframes fadeInLeft {
    0% {
        opacity: 0;
        transform: translateX(300px); /* 右から */
    }
    100% {
        opacity: 1;
        transform: translateX(0); /* 位置は元に戻る */
    }
}

/* アニメーションを適用するクラス */
.fade-in-left {
    animation-name: fadeInLeft;
    animation-duration: 2.5s; /* アニメーションの長さ */
    animation-timing-function: ease; /* アニメーションの動き */
    animation-fill-mode: forwards; /* アニメーションが完了した後の状態 */
}

.fade-in-order {
    opacity: 0;
    transform: translateY(30px);
    transition: opacity 0.6s ease-out, transform 0.6s ease-out;
}

.fade-in-order.visible {
    opacity: 1;
    transform: translateY(0);
}
/*-------------------------------------------------------------
ヘッダー
--------------------------------------------------------------*/
header{
	display:flex;
	padding:1% 0%;
}
header a{
	color:#2A2A2A;
}
header a:hover{
	color:#11337F;
}
.header-contents{
	display:flex;
	justify-content:space-between;
	width:90%;
	margin: auto;
	align-items:center;
	max-width:1600px;
}
.header-logo-box{
	width:15%;
	display:flex;
	align-items: center;
}
.header-logo{
	display: flex;
    justify-content: center;
    align-items: center;
	margin-right:2%;
}
.header-logo:hover{
	opacity:0.7;
}
.header-menu-contact{
	width:65%;
	display:flex;
	justify-content:space-between;
	font-size: 1.1rem;
	align-items: center;
}
.header-menu{
	display:flex;
	justify-content:space-between;
	width:70%;
}
.header-contact{
	width:25%;
	color:white;
	font-size:1.2rem;
}
.header-contact:hover{
	transform: translate(5px, 5px);
	transition:none;
	transition: all 0.2s ease-in-out;
}
/*-------------------------------------------------------------
固定ヘッダー
--------------------------------------------------------------*/
.fixed-header{
	position: fixed;
	display:flex;
    top: -150px; /* 初期は見えない位置に */
    left: 0;
    width: 100%;
    transition: top 0.5s; /* トランジションで滑らかに動く */
	height:100px;
	z-index:99;
	opacity:0.9;
	background-color:white;
	border-bottom: 2px solid transparent;
  border-image:linear-gradient(to right, #11337F, #8099CC) 1;
  padding-bottom: 2px; /* グラデーションがよく見えるようにパディングを追加 */
}

.fixed-header-container{
	max-width:1600px;
}
/*-------------------------------------------------------------
オーバーレイメニュー_通常
--------------------------------------------------------------*/
.top-header-nav{
	display:block;
	position: fixed;
	top: 0;
	left: -90%; /* 初期位置を画面外に設定 */
	width: 30%; /* メニューの幅 */
	height: 100%;
	background-color: white;
	transition: left 0.5s ease; /* アニメーションの速度とイージングを設定 */
	display: flex;
	justify-content: flex-start;
	flex-direction: column;
	padding-top: 100px;
	z-index:99;
}
.top-header-nav.show{
	left:0;
	opacity:0.98;
	height:100vh;
}
.overlay-menu-logo{
	display:flex;
	justify-content:center;
	width:20%;
	margin: 0px auto;
}
.overlay-menu-box{
	display: flex;
	justify-content: center;
	flex-direction: column;
	padding-left: 25%;
	margin-top: 100px;
}
.overlay-menu-box a{
	font-size: 1.2rem;
	margin-bottom: 30px;
	color:#8C8C8C;
}
.overlay-menu-box a:hover{
	color:#1475BD;
}
.header-nav.show{
	left:0%;
}
.overlay-menu-box i{
	margin-right:25px;
}
.overlay-menu-close{
	margin:auto;
	width:40%;
	border-radius:10px;
	display:flex;
	justify-content:center;
	padding:2%;
	transition: background-color 0.5s ease;
	  background: linear-gradient(to right, #11337F, #8099CC);
	color:white;
}
.overlay-menu-close:hover{
	cursor:pointer;
	background-color:white;
	color:#83AFDA;
	transition: background-color 0.5s ease;
}
/*-------------------------------------------------------------
オーバーレイメニュー_固定ヘッダー用
--------------------------------------------------------------*/
.overlay-menu-close-fixed{
	background-color:#83AFDA;
	color:white;
	margin:auto;
	width:30%;
	border-radius:10px;
	display:flex;
	justify-content:center;
	padding:2%;
	transition: background-color 0.5s ease;
}
.overlay-menu-close-fixed:hover{
	cursor:pointer;
	background-color:white;
	color:#83AFDA;
	transition: background-color 0.5s ease;
}
/*-------------------------------------------------------------
サイドバナー
--------------------------------------------------------------*/
.fixed-banner{
	position:fixed;
	z-index:99;
	background: linear-gradient(to left, #F4C430, #FFA500);
	width:6%;
	display:flex;
	justify-content:center;
	padding:2%;
	color:white;
	right:-7%;
	bottom:20%;
	writing-mode: vertical-rl;
	letter-spacing:0.3rem;
	align-items:center;
	font-size:1.2rem;
	border-radius:5px 0px 0px 5px;
	transition: right 0.5s; /* トランジションで滑らかに動く */
	box-shadow: -5px 0 5px rgba(0, 0, 0, 0.2);
}
.fixed-banner:hover{
	opacity:0.7;
}
.campaign-box{
	width:80%;
	margin:0 auto;
	display:flex;
	justify-content:center;
	margin-top:2%;
	margin-bottom:8%;
}
.campaign-box:hover{
	opacity:0.7;
}
.campaign-box img{
	width:100%;
}
.campaign-box.sp{
	display:none;
}
/*-------------------------------------------------------------
TOP_メインビジュアル
--------------------------------------------------------------*/

.mainvisual{
	width:90%;
	margin-top:1%;
}
.mainvisual-container{
	position:relative;
	display:flex;
	justify-content:flex-end;
  	width: 100%;
	height:85vh;
}
.mainvisual-text-box{
	position:absolute;
	top:20%;
	right:0%;
	z-index:2;
	background-color:white;
	padding:3%;
	padding-right:8%;
}
.mainvisual-main-text{
	font-size:3.2rem;
	letter-spacing:0.8rem;
	color:#11337F;
	font-weight:bold;
}
.mainvisual-sub-text{
	font-size:1.3rem;
	letter-spacing: 0.2rem;
    margin-top: 8%;
}
.mainvisual-img{
	position:absolute;
	left:0%;
	width:70%;
}
.mainvisual img{
	display:block;
	border-radius:0px;
}
.sub-text-accent{
	color:#11337F;
	letter-spacing:0.1rem;
	display:block;
	font-weight:bold;
}
/*-------------------------------------------------------------
TOP_背景色設定
--------------------------------------------------------------*/
.background-gradation {
  background: linear-gradient(to bottom, #ffffff, #d5e2ff);
	padding-bottom:5%;
	max-width: none;
}
.background-gradation {
  background: linear-gradient(to bottom, #ffffff, #d5e2ff);

}

/*-------------------------------------------------------------
TOP_en-について＆特長
--------------------------------------------------------------*/
.double-column {
	width: 100%;
}
.double-column-contents {
	display: flex;
	justify-content: space-between;
	width: 90%;
	margin: 0 auto;
	margin-top: 3%;
}
.double-column-contents img {
	width: 50%;
	border-radius:0px;
}
.double-column-title-text-button {
	width: 42%;
	display: flex;
	flex-direction: column;
}
.double-column-title {
	font-size: 1.5rem;
	letter-spacing:0.2rem;
	font-weight: bold;
	color:#11337F;
}
.double-column-text {
	font-size: 1rem;
	margin-top: 3%;
	letter-spacing:0.05rem;
	line-height:1.8;
}
.double-column-button {
	width: 45%;
	margin-top: 8%;
	padding:1%;
}
.double-column-contents.reverse{
	flex-direction:row-reverse;
}
/*-------------------------------------------------------------
TOP_料金とコース
--------------------------------------------------------------*/
.course-background{
	background-image:url('https://en-jiritsu.com/wp-content/uploads/2025/04/31982793_m.jpg');
	background-attachment: fixed; /* ← これが固定のポイント！ */
	background-position:center;
	background-size:cover;
	width:100%;
	padding:5% 0%;
	max-width:none;
	position:relative;
}

.course-background::before {
  content: "";
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  background-color: rgba(61, 95, 173, 0.6); /* 青のオーバーレイ */
  z-index: 1;
}
.course-background > * {
  position: relative;
  z-index: 2;
}

.course{
	width:100%;
	margin-top:0%;
}
.course .section-title{
	color:white;
}
.course .section-title-border{
	background:white;
}
.course-container{
	width:90%;
	margin:0 auto;
	display:flex;
	justify-content:space-between;
	margin-top:3%;
}
.course-box{
	background-color:white;
	display:flex;
	flex-direction:column;
	width:31%;
	border-radius:10px;
	padding:1%;
	padding-bottom:3%;
}
.course-box img{
	
}
.course-box-title-text{
	display:flex;
	flex-direction:column;
	padding:5%;
	text-align:center;
}
.course-box-title{
	font-size:1.5rem;
	font-weight:bold;
	color:#11337F;
	text-align:center;
	margin-bottom:3%;
}
.course-box-text{
	font-size:1rem;
	text-align:center;
}
.course-box-price{
	text-align:center;
	margin-top:5%;
}
.course-box-old-accent{
	font-size:1.2rem;
	color:gray;
	text-decoration: line-through;
}
.course-box-text-normal-accent{
	font-size:1.5rem;
	font-weight:bold;
}
.course-box-text-accent{
		font-size:1.5rem;
	color:red;
	font-weight:bold;
}
.course-button{
	width:50%;
	margin:0 auto;
	font-size:1.2rem;
}
/*-------------------------------------------------------------
TOP_お知らせ
--------------------------------------------------------------*/
.news{
	width:100%;
}
.menu-list{
	display:flex;
	flex-direction:column;
	width:90%;
	margin:0 auto;
	margin-top:4%;
}
.menu-list li a{
	justify-content:space-between;
	display:flex;
	color:#2A2A2A;
	margin-bottom:3%;
}
.menu-list li img{
	width:28%;
	display:block;
}
.news-content{
	width:68%;
	display:flex;
	flex-direction:column;
	font-size:1rem;
}
.news-title{
	color:#11337F;
	font-size:1.2rem;
	font-weight:bold;
}
/*-------------------------------------------------------------
お問い合わせ
--------------------------------------------------------------*/
.contact{
	width:100%;
}
.page-contact.double-column-contents{
	width:100%;	
}
.CF7_req{
	color:yellow;
	margin-right:3%;
	font-weight:lighter;
}
.CF7_unreq{
	color:lightgray;
	margin-right:3%;
	font-weight:lighter;
}
.CF7_table th{
	background-color:#11337F;
	color:white;
}
.contact-campain-box{
	background-color: #8FAADC;
	background: linear-gradient(to right, #11337F, #8099CC);
	color:white;
    border-radius: 10px;
    padding: 2%;
	display:flex;
	flex-direction:column;
	margin-top:3%;
	justify-content:center;
	align-items:center;
}
.contact-campain-box img{
	margin:3% 0%;
}
.contact-campain-box .course-box-old-accent{
	color:white;
}
/*-------------------------------------------------------------
TOP_アクセス
--------------------------------------------------------------*/
.access{
	width:100%;
}
.access-map{
	width:55%;
}
.access-map iframe{
	width:100%;
	height:50vh;
}
.access .double-column-text{
	font-size:1.2rem;
}
.double-column-text i{
	font-size:1.2rem;
}
.fa-solid.fa-calendar{
	font-size:1.35rem;
}
.fa-solid.fa-school{
	font-size:1.05rem;
}
/*-------------------------------------------------------------
固定ページ_共通設定
--------------------------------------------------------------*/
.page-mainvisual{
	width:100%;
	margin-top:0%;
	height:25vh;
	    background: linear-gradient(to right, #11337F, #8099CC);
	display:flex;
	justify-content:center;
	align-items:center;
}

.page-mainvisual-text{
	width:100%;
	text-align:center;
	color:white;
	font-size:2.5rem;
	letter-spacing:0.2rem;
	font-weight:bold;
	z-index:98;
}
.page-content{
	margin-top:3%;
}
.CF7_btn{
	display:flex;
	justify-content:center;
}
.wpcf7-form-control.wpcf7-submit.has-spinner{
	width:40%;
	margin:0 auto;
	background-color:#11337F;
	color:white;
	margin-top:5%;
	border-radius:5px;
}
.wpcf7-form-control.wpcf7-submit.has-spinner:hover{
	color:#11337F;
	background-color:white;
	border:solid #11337F 1px;
	transition:ease 0.5s all;
}
.wpcf7-spinner{
	display:none;
}
/*-------------------------------------------------------------
個別投稿ページ
--------------------------------------------------------------*/
.post-mainvisual{
	margin-top:0%;
	width:60%;
}
.post-content{
	width:90%;
	margin:0 auto;
	margin-top:5%;
}
.post-title{
	font-size:2rem;
	font-weight:bold;
	color:#11337F;
	margin-bottom:3%;
}
/*-------------------------------------------------------------
投稿まとめページ
--------------------------------------------------------------*/
.pagination-wrapper{
	display:flex;
	justify-content:space-between;
	width:40%;
	margin:auto;
}
.page-numbers {
    display: flex !important;
    width: 100% !important;
	justify-content: space-between;
	border: none !important;
}
.page-numbers li{
	width:30%;
	display:flex;
	justify-content:center;
}
.page-numbers li a{
	width: 100% !important;
    margin: auto;
    display: flex !important;
    justify-content: center;
	border:1px solid lightgray !important;
}
.page-numbers span{
	width: 100% !important;
    margin: auto;
    display: flex !important;
    justify-content: center;
	border:1px solid lightgray !important;
}
/*-------------------------------------------------------------
フッター
--------------------------------------------------------------*/
footer{
	margin-top:5%;
}
.footer-logo-sns{
	width:30%;
	display:flex;
	justify-content:space-between;
	margin:0 auto;
	margin-top:3%;
}
.footer-logo-sns img{
	width:40%;
}
.footer-logo-sns a{
	width:40%;
	display:flex;
	justify-content:center;
}
.footer-logo-sns i{
	width:40%;
	display:block;
	font-size: 4rem;
	color:#2A2A2A;
}
.footer-menu{
	width:40%;
	display:flex;
	justify-content:space-between;
	flex-wrap:wrap;
	margin:0 auto;
	margin-top:3%;
}
.footer-menu a{
	width:30%;
	font-size:1.2rem;
	color:#2A2A2A;
	text-align:center;
}
.footer-menu a:hover{
	color:#11337F;
}
.footer-rights{
	background-color:#11337F;
	color:white;
	text-align:center;
	padding:0.2%;
	margin-top:3%;
	font-size:1rem;
}
.background-gradation.final{
	padding-bottom:0%;
}
.memo-container{
	width:30%;
	margin:5% auto;
	color:#11337F;
	display:flex;
	justify-content:space-between;
}
.memo-container a{
	text-align:center;
	color:#11337F;
	font-size:1.2rem;
	width:42%;
	background-color:#11337F;
	color:white;
	display:flex;
	justify-content:center;
	border-radius:5px;
	padding:2%;
}
.footer-phone-text{
	color:#2A2A2A !important;
}
/*------------------------------------------------------------
コース料金ページ
--------------------------------------------------------------*/
.page-course-section{
	width:100%;
}
.page-mainvisual-subtext{
	font-size:1.2rem;
	color:white;
	text-align:center;
}
.course-table-box{
	width:80%;
	margin:auto;
	display:flex;
	justify-content:center;
	flex-direction:column;
}
.course-table-box.monthly{
	margin-top:2%;
}

  .course-table {
    width: 90%;
    border-collapse: collapse;
	  margin:0 auto;
    margin-top: 3%;
    font-size: 1.2rem;
    text-align: center;
  }

  .course-table th,
  .course-table td {
    padding: 12px;
    color: white;
    border: 1px solid #fff;
  }
.course-table th {
	vertical-align: middle;
	    
}
.course-box-text-black{
	color:black;
}
.course-table th img{
	width:10%;
	border-radius: 50%;
	vertical-align: middle;
	margin-right:3%;
}

  /* 左列（項目名） */
  .course-table td.label {
    background-color: #87888b;
    font-weight: bold;
    text-align: left;
  }

  /* 列タイトル */
  .course-table th.basic {
    background-color: #58a689;
  }

  .course-table th.standard {
	  position:relative;
    background-color: #4a73b7;
  }
.price-campain{
	position:absolute;
	display:flex;
	justify-content:center;
	align-items:center;
	top:-120%;
	left: 100%;
  transform: translateX(-50%);
	width:200% !important;
	color:white;
	padding:2% 3%;
	background: linear-gradient(to right, #11337F, #8099CC);
	color:whtie;
	background-color:#8FAADC;
	border-radius:5px;
	z-index:6;
}
.price-campain.course-table-campaign img{
	width:30%;
}
.course-table-campaign-accent{
	font-size:1.5rem;
	margin-left:3%;
}
.course-table-campaign-accent{
	color:#FFC000;
}
.price-message-campaign-box .course-table-campaign-accent{
	color:#FFC000;
}
.price-message .price-message-campaign-box{
	color:white;
}
.price-message-campaign-box{
	display:flex;
	align-items:center;
	justify-content:center;
	color:white;
	padding:1%;
	background-color:#8FAADC;
	border-radius:5px;
	width:40%;
	margin:2% 0%;
	background: linear-gradient(to right, #11337F, #8099CC);
	color:whtie;
}
  .course-table th.advanced {
    background-color: #59473d;
  }

  /* データ列 */
  .course-table td.basic {
    background-color: #cfe3d8;
	color:#58a689;
  }

  .course-table td.standard {
    background-color: #ccdaf0;
    color: #4a73b7;
  }

  .course-table td.advanced {
    background-color: #eae2d7;
    color: #59473d;
  }
.course-table {
  table-layout: fixed; /* 各列の幅を均等にする */
  border-collapse: collapse;
}

.course-table th,
.course-table td {
  text-align: center; /* セル内の文字を中央揃えにする */
  vertical-align: middle; /* 垂直方向も中央揃えにする */
  padding: 12px;
  border: 1px solid #fff;
  color: white;
}

/* 左上のセル（空白セル）の背景色を削除 */
.course-table th:first-child {
  background-color: transparent;
}

.page-course.double-column-contents.reverse{
	margin-top:5%;
}
.page-course-section .course-box{

	background-color: #d5e2ff;
}
.page-course-section .course-container{
	margin-top:3%;
}
.page-course.double-column-title{
	margin-top:5%;
	padding-left:5%;
}
.price-table-box{
	width:90%;
	display:flex;
	justify-content:center;
	margin:0 auto;
	flex-direction:column;
}
.course-table {
  border-collapse: collapse;
}

.course-table-box tr{
		font-size:1.2rem;
}
/* ベーシック列の外枠に赤い線を適用 */
.course-table.each-basic td.basic,
.course-table.each-basic th.basic {
  border-left: 4px solid red;
  border-right: 4px solid red;
}

/* 最初の行のベーシック列に上枠を追加 */
.course-table.each-basic tr:first-child th.basic {
  border-top: 4px solid red;
}

/* 最後の行のベーシック列に下枠を追加 */
.course-table.each-basic tr:last-child td.basic {
  border-bottom: 4px solid red;
}

.course-table.each-standard {
  border-collapse: collapse;
}

.course-table.each-standard td.standard,
.course-table.each-standard th.standard {
  border-left: 4px solid red;
  border-right: 4px solid red;
}

.course-table.each-standard tr:first-child th.standard {
  border-top: 4px solid red;
}

.course-table.each-standard tr:last-child td.standard {
  border-bottom: 4px solid red;
}

.course-table.each-advanced {
  border-collapse: collapse;
}

.course-table.each-advanced td.advanced,
.course-table.each-advanced th.advanced {
  border-left: 4px solid red;
  border-right: 4px solid red;
}

.course-table.each-advanced tr:first-child th.advanced {
  border-top: 4px solid red;
}

.course-table.each-advanced tr:last-child td.advanced {
  border-bottom: 4px solid red;
}
.price-message{
	width:80%;
	margin:0 auto;
	margin-top:3%;
}
.course-icon-box{
	display:flex;
	justify-content:space-between;
	align-items:center;
	margin-bottom:3%;
}
.course-icon-box img{
	width:10%;
}
.course-icon-box-text{
	width:87%;
}
.course-icon-box-container{
	display:flex;
	justify-content:space-between;
	align-items:center;
	width:30%;
	margin:0 auto;
}
.course-icon-box-container .course-icon-box{
	width:30%;
	justify-content:center;
}
.course-icon-box-container .course-icon-box img{
	width:100%;
}
.price-message{
	border:solid 2px rgb(17, 51, 127);
	border-radius:10px;
	padding:2%;
}
.recomend-student{
	border:solid 2px rgb(17, 51, 127);
	border-radius:10px;
	padding:2%;
}
.page-course-accent-box{
	border-radius:10px;
	padding:2%;
	background-color:;
	background: linear-gradient(to right, #d5e2ff, #E6EEFF);
	
}
.page-course.double-column-contents{
	margin-top:5%;
}
.double-column-title.each-course-title{
	display:flex;
	justify-content:space-between;
	align-items:center;
}
.price-message-img{
	width:40%;
	margin-right:3%;
	vertical-align:middle;
}
.price-message-accent{
	font-size:2rem;
	color:red;
	font-weight:bold;
}
.contact-campain-box .course-box-text-accent{
	color:#FFC000;
}
.price-message-torikeshi{
	text-decoration: line-through;
}
/*------------------------------------------------------------
特長ページ
--------------------------------------------------------------*/
.page-features.concept{
	width:100%;
}
.concept-box{
	display:flex;
	justify-content:space-between;
	margin-bottom:3%;
	padding:2%;
	align-items:center;
}
.concept-box-title{
	display:inline-block;
	width:30%;
	font-size:1.5rem;
	font-weight:bold;
}
.concept-box.plan{
	border-left:10px solid #4269b2;
}
.concept-box.environment{
	border-left:10px solid #21b891;
}
.concept-box.habit{
	border-left:10px solid #9a7966;
}
.concept-box p{
	display:inline-block;
	width:65%;
}
.concept-box.plan h2{
	color:#4269b2;
}
.concept-box.environment h2{
	color:#21b891;
}
.concept-box.habit h2{
	color:#9a7966;
}

.concept-box.plan {
	color:#4269b2;
  background-color: #d8e1f2; /* 濃い青 */
}

.concept-box.environment {
  background-color: #e0efe8; /* 緑系 */
	color:#21b891;
}

.concept-box.habit {
	color:#9a7966;
  background-color: #f3ebe0; /* 茶系 */
}
.features-container{
	display:flex;
	justify-content:space-between;
	width:90%;
	margin:0 auto;
	flex-wrap:wrap;
}
/*------------------------------------------------------------
講師募集ページ
--------------------------------------------------------------*/
.recruit-table-box{
	display:flex;
	justify-content:center;
	width:90%;
	margin:0 auto;
	margin-top:3%;
}
.recruit-table-box table td:first-child, table th:first-child {
    background-color: #11337F;
    color: white;
  }
.recruit-table{
	width:100%;	
	font-size: 1rem;
}
.recruit-form-box{
	width:90%;
	margin:0 auto;
	margin-top:3%;
}
.accordion-toggle {
  background-color: #f0f0f0;
  border: 1px solid #ccc;
  border-radius: 5px;
  cursor: pointer;
  font-size: 1em;
  padding: 2%;
	transition: background-color 0.3s ease, box-shadow 0.3s ease;
  display: flex;
  align-items: center;
	font-family: "Noto Serif JP", sans-serif;
}

.accordion-toggle::before {
  content: "▼";
  display: inline-block;
  margin-right: 0.3em;
  transition: transform 0.3s ease;
}

.accordion-toggle.active::before {
  transform: rotate(180deg);
}

.accordion-content {
  display: none;
  margin-top: 0.5em;
}

.accordion-content.show {
  display: block;
}
.recruit-flow-message{
	margin:3% 0%;
}
.recruit-flow-contents{
	width:90%;
	margin:0 auto;
}
.recruit-flow-box{
	display:flex;
	align-items:center;
	margin-bottom:1.5%;
}
.recruit-flow-box-number{
	width:5%;
	border-radius:5px;
	    background: linear-gradient(to right, #11337F, #8099CC);
	color:white;
	display:flex;
	justify-content:center;
	align-items:center;
	font-weight:bold;
	font-size:2rem;
	margin-right:2%;
	aspect-ratio: 1 / 1;
}

.recruit-flow-comments{
	border:solid 2px rgb(17, 51, 127);
	border-radius:10px;
	padding:2%;
	margin-top:3%;
}
/*------------------------------------------------------------
モニター画面設定
--------------------------------------------------------------*/
@media (min-width: 1800px) {
	.mainvisual-container{
		height:70vh;
	}
}
/*------------------------------------------------------------
IpadPro_基本設定
--------------------------------------------------------------*/
/*1023px以下*/
@media screen and (max-width: 1030px){
	.pc{
		display:none;
	}
	.pad{
		display:flex;
	}
	.section-title{
		width:100%;
	}
	section{
		margin-top:5%;
	}
	.section-title-main{
		font-size:1.8rem;
	}
	.section-title-sub{
		font-size:1.2rem;
	}
	.section-title-border.long{
		width:80%;
	}
	.section-title-border{
		width:40%;
	}
	section-title-border.superlong{
		width:100%;
	}
	body{
		font-size:0.9rem;
	}
	.customize-button{
		font-size:1.1rem;
	}
/*------------------------------------------------------------
IpadPro_ヘッダー
--------------------------------------------------------------*/
	.header-logo-box{
		width:25%;	
	}
	.header-menu-contact{
		width:40%;
		font-size:1.1rem;
		justify-content:flex-end;
	}
	.header-contact{
		font-size:1.125rem;
		border-radius:5px;
		padding:2%;
		letter-spacing:0.1rem;
		width:80%;
	}
/*------------------------------------------------------------
iPad_ヘッダーメニュー
--------------------------------------------------------------*/
	.top-header-nav{
		width:60%;
	}
	.hamburger-box{
		width:15%;
		display:flex;
		align-items:center;
	}
	.hamburger-button{
		display:block;
		width:100%;
		cursor:pointer;
	}
	.bar {
		  height: 0.3vh;
		  margin: 20% 0%;
		  transition: 0.4s;
		background-color:#8C8C8C;
		
		

		border-radius:10px;
	}

	.hamburger-button.active .bar:nth-child(1) {
		transform: rotate(-45deg) translate(-24px, 5px);
	}
	.hamburger-button.active .bar:nth-child(2) {
		opacity: 0;
	}
	.hamburger-button.active .bar:nth-child(3) {
		transform: rotate(45deg) translate(-10px, 10px);
	}
	.hamburger-button-fixed.active .bar:nth-child(1) {
		transform: rotate(-45deg) translate(-24px, 5px);
	}
	.hamburger-button-fixed.active .bar:nth-child(2) {
		opacity: 0;
	}
	.hamburger-button-fixed.active .bar:nth-child(3) {
		transform: rotate(45deg) translate(-10px, 10px);
	}
	.hamburger-box{
		width:27%;
	}
	.hamburger-button{
		width:25%;
	}
	.hamburger-button-fixed{
		width:25%;
	}
	.header-title{
		font-size:1.8rem;
	}
	.header-menu-contact{
		width:35%;	
	}
	.overlay-menu-close{
		margin-top:5%;	
	}
	.overlay-menu-close-fixed{
		margin-top:5%;	
	}
	.fixed-header{
		height:60px;	
	}
/*-------------------------------------------------------------
オーバーレイメニュー_通常
--------------------------------------------------------------*/
	.top-header-nav{
		display:block;
		position: fixed;
		top: 0;
		left: -90%; /* 初期位置を画面外に設定 */
		width: 60%; /* メニューの幅 */
		height: 100%;
		background-color: white;
		transition: left 0.5s ease; /* アニメーションの速度とイージングを設定 */
		display: flex;
		justify-content: flex-start;
		flex-direction: column;
		padding-top: 100px;
		z-index:99;
	}
	.top-header-nav.show{
		left:0;
		opacity:0.98;
		height:100vh;
	}
	.overlay-menu-logo{
		display:flex;
		justify-content:center;
		width:50%;
		margin: 0px auto;
	}
	.overlay-menu-box{
		display: flex;
		justify-content: center;
		flex-direction: column;
		padding-left: 15%;
		margin-top: 50px;
	}
	.overlay-menu-box a{
		font-size: 1rem;
		margin-bottom: 30px;
		color:#8C8C8C;
	}
	.overlay-menu-box a{
		margin-bottom:5%;
	}
	.overlay-menu-box a:hover{
		color:#83AFDA;
	}
	.header-nav.show{
		left:0%;
	}
	.overlay-menu-box i{
		margin-right:25px;
	}
	.overlay-menu-close{
		margin:auto;
		border-radius:5px;
	        background: linear-gradient(to right, #11337F, #8099CC);
		width:55%;
		display:flex;
		justify-content:center;
		padding:2%;
		transition: background-color 0.5s ease;
		color:white;
		margin-top:15%;
	}
	.overlay-menu-close:hover{
		cursor:pointer;
		background-color:white;
		transition: background-color 0.5s ease;
	}
/*-------------------------------------------------------------
オーバーレイメニュー_固定ヘッダー用
--------------------------------------------------------------*/
	.overlay-menu-close-fixed{
		margin:auto;
		border-radius:5px;
	        background: linear-gradient(to right, #11337F, #8099CC);
		width:55%;
		display:flex;
		justify-content:center;
		padding:2%;
		transition: background-color 0.5s ease;
		color:white;
		margin-top:15%;
	}
	.overlay-menu-close-fixed:hover{
		cursor:pointer;
		background-color:white;
		color:#287300;
		transition: background-color 0.5s ease;
	}
/*------------------------------------------------------------
IpadPro_メインビジュアル
--------------------------------------------------------------*/
	.mainvisual-main-text{
		font-size:2.1rem;
		letter-spacing:0.5rem;
	}
	.mainvisual-sub-text{
		font-size:1.1rem;
	}
	.mainvisual-text-box{
		padding-right:0%;
	}
	.mainvisual-container {
		height:50vh;	
	}
/*------------------------------------------------------------
IpadPro_他
--------------------------------------------------------------*/
	.double-column{
		display:flex;
		flex-direction:column;
	}
	.double-column-title-text-button{
		width:100%;
	}
	.double-column-contents img{
		width:100%;
	}
	.double-column-title{
		margin-bottom:3%;
	}
	.double-column-button{
		margin:0 auto;
		margin-top:3%;
	}
	.course-container{
		flex-direction:column;
	}
	.course-box{
		width:70%;
		margin:0 auto;
		margin-bottom:5%;
	}
	.menu-list li img{
		width:35%;
	}
	.news-content{
		width:100%;
		margin-top:3%;
	}
	.menu-list li a{
		flex-direction:column;
		margin-bottom:7%;
	}
	.contact-contents img{
		margin-bottom:3%;
	}
	.double-column-contents.access-contents{
		flex-direction:column;
	}
	.access-map{
		width:100%;
		margin-top:3%;
	}
	.double-column-title.acccess-title{
		display:none;
	}
	.footer-logo-sns{
		width:50%;
	}
	.footer-logo-sns img{
		width:50%;
	}
	.footer-logo-sns a{
		width:50%;
	}
	.memo-container{
		width:60%;
	}
	.footer-menu{
		width:70%;
	}
	.fixed-banner{
		width:50%;
		border-radius:5px;
		padding:1%;
		font-size:1.2rem;
		letter-spacing:0.1rem;
		writing-mode: horizontal-tb;
		left: 50%;
  		transform: translateX(-50%);
		transition:0.5s bottom;
		bottom:2%;
		box-shadow: 3px 3px 5px rgba(0, 0, 0, 0.3);
	}
	
	.campaign-box{
		width:85%;
	}
	.course-icon-box img{
	width:10%;
	}
	.course-table-box{
		width:90%;
	}
	.course-table .course-box-old-accent{
		font-size:0.8rem;
	}
	.recruit-table{
		font-size:0.8rem;	
	}
	.recruit-flow-box-number{
		width:10%;	
	}
	.contact-campain-box img{
		width:60% !important;
	}
	.price-message-campaign-box{
		width:70%;
	}
}
/*------------------------------------------------------------
ProMax
--------------------------------------------------------------*/
@media screen and (max-width: 599px){
	
	section{
		width:100%;
		margin-top:5%;
	}
	.section-contents{
		width:100%;
	}
	 .section-title {
        width: 100%;
		 margin:auto;
    }
	.section-title-main {
		font-size: 1.4rem;
	}
	.section-title-sub{
		font-size:0.8rem;
	}
	.section-title-border {
    	height: 0.2vh;
		width: 50%;
	}
	.customize-button{
		font-size:1.2rem;
		border-radius:5px;
	}
	.pc{
		display:none;
	}
	.pad{
		display:none;
	}
	.sp{
		display:flex;
	}
	.customize-button{
		font-size:1rem;
	}
/*------------------------------------------------------------
IPhone14_Pro_Max_ヘッダー
--------------------------------------------------------------*/
	header{
		margin-bottom:2%;
	}
	.header-logo-box{
		width:20%;
	}
	.top-header-nav{
		width:60%;
	}
	.hamburger-box{
		width:15%;
		display:flex;
		align-items:center;
	}
	.hamburger-button{
		display:block;
		width:100%;
		cursor:pointer;
	}
	.bar {
		  height: 0.3vh;
		  margin: 20% 0%;
		  transition: 0.4s;
		background-color:#8C8C8C;
		
		

		border-radius:10px;
	}

	.hamburger-button.active .bar:nth-child(1) {
		transform: rotate(-45deg) translate(-24px, 5px);
	}
	.hamburger-button.active .bar:nth-child(2) {
		opacity: 0;
	}
	.hamburger-button.active .bar:nth-child(3) {
		transform: rotate(45deg) translate(-10px, 10px);
	}
	.hamburger-button-fixed.active .bar:nth-child(1) {
		transform: rotate(-45deg) translate(-24px, 5px);
	}
	.hamburger-button-fixed.active .bar:nth-child(2) {
		opacity: 0;
	}
	.hamburger-button-fixed.active .bar:nth-child(3) {
		transform: rotate(45deg) translate(-10px, 10px);
	}
	.hamburger-box{
		width:27%;
	}
	.hamburger-button{
		width:25%;
	}
	.hamburger-button-fixed{
		width:25%;
	}
	.header-logo-box{
		width:30%;
	}
	.header-title{
		font-size:1.8rem;
	}
	.header-contact{
		padding:4% 0%;
		font-size: 0.8rem;
		letter-spacing:0.05rem;
		width: 90%;
	}
	.header-menu-contact{
		width:35%;	
	}
	.overlay-menu-close{
		margin-top:10%;	
	}
	.overlay-menu-close-fixed{
		margin-top:10%;	
	}
	.fixed-header{
		height:60px;	
	}
	.mainvisual-text-box{
		top:40%;
	}
	.mainvisual-main-text {
		font-size: 1.5rem;
		letter-spacing: 0.2rem;
	}
	.mainvisual-sub-text{
		font-size:0.8rem;
		letter-spacing:0.1rem;
	}
	.sub-text-accent{
		font-size:0.8rem;
	}
	.double-column-button{
		width:55%;
	}
	.course-box{
		width:100%;
	}
	    .footer-logo-sns {
        width: 60%;
    }
	.footer-logo-sns img{
		object-fit:contain;
	}
	.memo-container {
		width:80%;
	}
	.memo-container a{
		font-size:1rem;
		width:45%;
	}
	.access .double-column-text{
		font-size:1rem;
	}
	.footer-menu {
		width:90%;
	}
	.footer-menu a{
		font-size:0.8rem;
	}
	.footer-rights{
		font-size:0.8rem;
	}
	.fixed-banner{
		width:60%;
	}
	.page-mainvisual{
		height:15vh;
	}
	.page-mainvisual-text{
		font-size:2rem;
	}
	.page-content{
		width:90%;
	}
	h2 {
    font-size: 1.5rem;
    margin: 3% 0%;
    padding-left: 3%;
	}
	h3{
		margin:2% 0%;
		font-size:1.2rem;
	}
	h4{
		font-size:1.1rem;
		margin:2% 0%;
	}
	.post-title{
		margin-bottom:3%;
		font-size:1.5rem;
	}
	.post-mainvisual{
		margin-bottom:2%;
	}
	.CF7_table tr{
		display:flex;
		flex-direction:column;
	}
	tbody{
		width:100%;
	}
	.wpcf7-form-control.wpcf7-radio{
		display:flex;
		flex-wrap:wrap;
	}
	.double-column-title{
		font-size:1.2rem;	
	}
	.mainvisual-container{
		height:55vh;
	}
	.page-course-section .course-table-box tr{
		font-size:0.8rem;
	}
	.page-course-section .course-box-old-accent{
		font-size:0.6rem;	
	}
	.page-course-section .course-box-text-accent{
		font-size:0.9rem;
	}
	.price-message{
		width:90%;
		font-size:0.8rem;
	}
	.campaign-box.sp{
		display:flex;
	}
	.campaign-box{
		width:90%;
	}
	.concept-box p{
		width:70%;
		font-size:0.9rem;
	}
	.page-mainvisual-text{
		font-size:1.5rem;	
	}
	.recruit-table{
	    font-size: 0.8rem;
	}
	.recruit-flow-contents{
		font-size:0.8rem;	
	}
	.recruit-flow-box{
		align-items:flex-start;	
	}
	.recruit-flow-box-number{
		font-size:1.2rem;
	}
	.course-table-campaign-accent{
		font-size:0.8rem;
	}
	.price-campain{
		flex-direction:column;
		top:-130%;
	}
	.price-campain.course-table-campaign{
		font-size:0.6rem;
	}
	.price-campain.course-table-campaign img{
		width:60%;
	}
	.price-message-accent{
		font-size:1.2rem;
	}
	.contact-message{
		width:95%;
	}
	.contact-campain-box img{
		width:50% !important;
		margin:0 auto;
	}
}
/*------------------------------------------------------------
SE
--------------------------------------------------------------*/
@media screen and (max-width: 399px){
	
	.course-table-box tr{
		font-size:0.8rem;
	}
	.mainvisual-container{
		height:60vh;
	}
	.mainvisual-main-text{
		font-size:1.4rem;
		letter-spacing: 0.2rem;
	}
	    .mainvisual-sub-text {
        font-size: 0.8rem;
        letter-spacing: 0.05rem;
    }
	.mainvisual-text-box {
        top: 50%;
    }
	.mainvisual{
		margin-bottom:20%;
	}
	.header-contact{
		width:95%;
		letter-spacing: 0.02rem;
	}
	.section-title-main {
        font-size: 1.3rem;
    }
	.double-column-title{
		font-size:1.1rem;
	}
	.double-column-text{
		font-size:0.8rem;
	}
	.double-column-button{
		width:65%;
	}
	.course-box-title{
		font-size:1.2rem;
	}
	.course-box-text{
		font-size:0.8rem;	
	}
	.customize-button{
		font-size:0.9rem;
	}
	.memo-container {
        width: 90%;
    }
	.memo-container a{
		font-size:0.9rem;
	}
	.footer-rights{
		font-size:0.7rem;
	}
	.page-content p{
		font-size:0.8rem;
	}
	h2{
		margin:5% 0%;
	}
	.course-table-box{
		width:90%;
		overflow-x: auto;
  		-webkit-overflow-scrolling: touch;
		
	}
	.course-table th, .course-table td{
		padding:2%;
	}
	.course-box-old-accent{
		font-size:0.6rem;
	}
	.course .course-box-old-accent{
		font-size:1.1rem;
	}
}