@charset "UTF-8";

/* ==================================================
contents
================================================== */
#contents h2 {
	padding-bottom:25px;
	font-size: 1.5rem;
	line-height: 1.4;
	margin:1.5em 0 30px;
	clear:both;
	position: relative;
	z-index: 1;
}
#contents h2:first-child {
	margin-top:0;
}
#contents h2::before {
	content: "";
	position: absolute;
	left: 65px;
	top: 0.7em;
	width: 200px;
	height: 20px;
	background-color: #f7eefa;
	z-index: -1;
}
#contents h2::after {
	content: "";
	position: absolute;
	left: 0;
	bottom: 0;
	width: 80px;
	height: 2px;
	background-color: #2e77bb;
}
#contents h3 {
	margin:1.5em 0 20px;
	font-size: 1.25rem;
	line-height:1.2;
}
#contents p {
	margin:0 0 20px;
}
#contents table {
	width:100%;
	margin:0 0 20px;
	border-collapse:collapse;
	border-spacing:0;
}
#contents ul {
	list-style:none;
	margin:0 0 10px;
}
#contents ul li {
	background: url("../images/free/list_icon.png") no-repeat left 0.6em;
	padding-left:12px;
	margin:0 0 10px;
}

/* ==================================================
cate_ttl
================================================== */
#cate_ttl {
	margin: 0 -30px 60px;
	position: relative;
	z-index: 0;
	height: 120px;
}
#cate_ttl::before {
	content: "";
	position: absolute;
	left: 0;
	right: 0;
	top: 0;
	height: 120px;
	background-repeat: no-repeat;
	background-position: center center;
	background-size: cover;
	z-index: -1;
}
#cate_ttl.cate_ttl_contact::before {
	background-image: url("../images/free/cate_ttl_contact.jpg");
}
#cate_ttl.cate_ttl_access::before {
	background-image: url("../images/free/cate_ttl_access.jpg");
}
#cate_ttl.cate_ttl_school::before {
	background-image: url("../images/free/cate_ttl_school.jpg");
}
#cate_ttl.cate_ttl_school_jr::before {
	background-image: url("../images/free/cate_ttl_school_jr.jpg");
}
#cate_ttl.cate_ttl_member::before {
	background-image: url("../images/free/cate_ttl_member.jpg");
}
#cate_ttl::after {
	content: "";
	position: absolute;
	width: 70%;
	right: 0;
	bottom: -12px;
	height: 46px;
	background-position: right bottom;
	background-repeat: no-repeat;
}
#cate_ttl.cate_ttl_contact::after {
	background-image: url("../images/main/ttl_en_contact.png");
}
#cate_ttl.cate_ttl_access::after {
	background-image: url("../images/main/ttl_en_access.png");
}
#cate_ttl.cate_ttl_school::after,
#cate_ttl.cate_ttl_school_jr::after {
	background-image: url("../images/main/ttl_en_school.png");
}
#cate_ttl.cate_ttl_member::after {
	background-image: url("../images/main/ttl_en_member.png");
}
#cate_ttl h1 {
	position: absolute;
	left: 0;
	top: 55px;
	display: inline-block;
	color: #ffffff;
	padding: 5px 20px 8px;
	font-size: 1.5rem;
	line-height: 1.25;
	min-width: 360px;
}
#cate_ttl h1::before {
	content: "";
	position: absolute;
	inset: 0;
	background-color: #2e77bb;
	mix-blend-mode: multiply;
	z-index: -1;
}

/* ==================================================
school
================================================== */
/* school_lebel_tbl
============================== */
#contents .school_lebel_tbl {
	width: 100%;
	border-collapse: collapse;
	border-top: 1px solid #c3defc;
	margin: 0 0 5px;
}
#contents .school_lebel_tbl th {
	width: 68px;
}
#contents .school_lebel_tbl.jr th {
	width: 198px;
}
#contents .school_lebel_tbl th p {
	display: flex;
	justify-content: center;
	align-items: center;
	width: 100%;
	height: 100%;
	background-size: cover;
}
#contents .school_lebel_tbl th.lebel1 p {
	background-image: url("../images/free/bg_green.jpg");
}
#contents .school_lebel_tbl th.lebel2 p {
	background-image: url("../images/free/bg_orange.jpg");
}
#contents .school_lebel_tbl th.lebel3 p {
	background-image: url("../images/free/bg_pink.jpg");
}
#contents .school_lebel_tbl th.lebel4 p {
	background-image: url("../images/free/bg_blue.jpg");
}
#contents .school_lebel_tbl th,
#contents .school_lebel_tbl td {
	border-bottom: 1px solid #c3defc;
	padding: 4px;
	min-height: 60px;
	vertical-align: middle;
	line-height: 1.25;
}
#contents .school_lebel_tbl th p,
#contents .school_lebel_tbl td p {
	margin-bottom: 0;
	min-height: 60px;
}
/* school_lebel_tbl_note */
#contents .school_lebel_tbl_note {
	text-align: right;
	font-size: 0.75rem;
}

/* school_price
============================== */
#contents .school_price {
	margin: 0 0 50px;
}
#contents .school_price_ttl {
	margin: 0 0 30px;
	position: relative;
	text-align: center;
	z-index: 0;
}
#contents .school_price_ttl::before {
	content: "";
	position: absolute;
	left: 0;
	right: 0;
	top: 0.7em;
	border-bottom: 6px double #c3defc;
	z-index: -1;
}
#contents .school_price_ttl h3 {
	display: inline-block;
	padding: 0 10px;
	background-color: #ffffff;
	margin: 0;
}
#contents .school_price_cnt .price_list {
	list-style: none;
	margin: 0;
	display: flex;
	-webkit-justify-content: center;
    justify-content: center;
}
#contents .school_price_cnt .price_list li {
	padding: 0 10px;
	background-image: none;
	margin: 0;
	line-height: 1.2;
}
#contents .school_price_cnt .price_list li span {
	display: inline-block;
	padding: 1px 4px 3px;
	margin-right: 10px;
	background-color: #079103;
	color: #ffffff;
	font-size: 0.875rem;
	min-width: 40px;
	text-align: center;
	border-radius:3px;
}
#contents #school_price_ticket .school_price_cnt .price_list li span {
	background-color: #ef7115;
}

/* cautionary_note */
#contents .cautionary_note {
	background-color: #f5f5f5;
	padding: 30px 30px 20px;
	margin: 0 -30px;
}
#contents .cautionary_note h3 {
	margin-top: 0;
	text-align: center;
}
#contents .note_list {
	font-size: 0.875rem;
}

/* data_tbl
============================== */
#contents .data_tbl {
	width: 100%;
	border-collapse: collapse;
	border-top: 1px solid #ddd;
	border-left: 1px solid #ddd;
	margin: 0 0 40px;
}
#contents .data_tbl caption {
	text-align: left;
	margin: 0 0 8px;
	font-size: 1.125rem;
	line-height: 1;
	padding: 0 0 0 6px;
	border-left: 5px solid #005500;
}
#contents .data_tbl th,
#contents .data_tbl td {
	border-right: 1px solid #ddd;
	border-bottom: 1px solid #ddd;
	padding: 10px 20px;
}
#contents .data_tbl th {
	background-color: #F3FFD8;
}

/* map_wrap
============================== */
.map_wrap {
  position: relative;
  width: 100%;
  padding-top: 75%;
}

.map_wrap iframe {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  border: 0;
}
/* ==================================================
contact
================================================== */
/* mfp_phase
============================== */
#contents #mfp_phase {
	display: flex;
	justify-content: space-between;
	list-style: none;
	padding: 0;
	margin: 40px 0;
}

#contents #mfp_phase li {
	position: relative;
	flex: 1;
	text-align: center;
	padding: 12px 10px;
	font-size: 14px;
	background-color: #eeeeee;
	color: #666;
	background-image: none;
}

/* 矢印部分 */
#mfp_phase li:not(:last-child)::after {
  content: "";
  position: absolute;
  top: 0;
  right: -20px;
  width: 0;
  height: 0;
  border-top: 22px solid transparent;
  border-bottom: 22px solid transparent;
  border-left: 20px solid #eeeeee;
  z-index: 2;
}

/* アクティブ（現在のページ） */
#contents #mfp_phase li.mfp_active {
  background: #2e77bb;
  color: #fff;
  font-weight: bold;
}

#mfp_phase li.mfp_active::after {
  border-left-color: #2e77bb;
}

/* 既に通過した工程（必要なら追加） */
#contents #mfp_phase li.mfp_done {
  background: #9cc7f2;
  color: #fff;
}

#mfp_phase li.mfp_done::after {
  border-left-color: #9cc7f2;
}

/* form_txt
============================== */
#contents .form_txt {
	border: 1px solid #c48a2f;
	background-color: #FFFFEE;
	padding: 15px 20px 10px;
	margin: 0 0 30px;
}
#contents .form_txt p {
	margin: 0 0 5px;
	line-height: 1.25;
}
#contents .form_txt ul {
	margin: 0;
	font-size: 0.875rem;
}
#contents .form_txt ul li {
	margin: 0 0 5px;
}

/* tbl_form
============================== */
#contents .tbl_form,
#contents .tbl_form thead,
#contents .tbl_form tbody,
#contents .tbl_form tfoot,
#contents .tbl_form tr,
#contents .tbl_form th,
#contents .tbl_form td {
	display:block;
	width:100% !important;
	box-sizing:border-box;
}

#contents .tbl_form {
	border:none;
	background:#ffffff;
	border-radius:12px;
	box-shadow:0 8px 20px rgba(0,0,0,0.05);
	overflow:hidden;
	padding:10px 0;
}

/* 項目ごとに余白 */
#contents .tbl_form tr {
	padding:20px 25px;
	border-bottom:1px solid #eee;
}

#contents .tbl_form tr:last-child {
	border-bottom:none;
}

/* 見出し */
#contents .tbl_form th {
	color:#444;
	padding-bottom:8px;
	text-align: left;
}

/* 入力欄 */
#contents .tbl_form input[type="text"],
#contents .tbl_form .in_txta {
	border:1px solid #ddd;
	border-radius:8px;
	padding:10px 12px;
	transition:all 0.3s ease;
	background:#fafafa;
}
#contents .tbl_form .in_txta {
	width:100% !important;
}
/* フォーカス時 */
#contents .tbl_form input[type="text"]:focus,
#contents .tbl_form .in_txta:focus {
	border-color:#915F10;
	background:#ffffff;
	outline:none;
	box-shadow:0 0 0 3px rgba(145,95,16,0.1);
}

/* 必須マーク */
#contents .must {
	background:#e63946;
	color:#fff;
	font-size: 0.625rem;;
	padding:2px 8px 3px;
	border-radius:20px;
	vertical-align:middle;
	margin: 0 8px 0 0;
}
#contents .tbl_form .must {
	margin: 0 0 0 8px;
}

/* エラーメッセージ */
#contents .tbl_form .msg {
	color:#e63946;
	font-size:0.875rem;
	margin-top:5px;
}

/* ボタンエリア */
#contents .form_btn {
	text-align:center;
	margin:30px auto;
}

#contents .form_btn p {
	display:inline-block;
	margin:0 10px;
}

/* 送信ボタン */
#contents .form_btn input {
	background:linear-gradient(135deg,#915F10,#c48a2f);
	color:#ffffff;
	border:none;
	padding:12px 30px;
	border-radius:30px;
	font-size:0.875rem;
	cursor:pointer;
	transition:all 0.3s ease;
	min-width:180px;
}

/* ホバー */
#contents .form_btn input:hover {
	transform:translateY(-2px);
	box-shadow:0 6px 15px rgba(0,0,0,0.15);
}

/* リセットボタン */
#contents .form_btn .form_reset input {
	background:#cccccc;
	color:#333;
}

/* 1行を横並び */
#contents .tbl_form p {
  display: flex;
  align-items: center;
  gap: 15px;
  margin-bottom: 10px;
}

/* ラベル幅を固定 */
#contents p:not(.form_sex) label {
  width: 120px;
  margin-bottom: 0;
  font-weight: bold;
  color: #915F10;
}

/* 入力欄は残り全部 */
#contents input[type="date"],
#contents select {
  flex: 1;
}

/* input / select 共通 */
#contents input[type="date"],
#contents select {
  width: 100%;
  padding: 10px 12px;
  font-size: 1rem;
  color: #333;
  background-color: #fff;
  border: 1px solid #915F10;
  border-radius: 4px;
  box-sizing: border-box;
  transition: all 0.3s ease;
}

/* フォーカス時 */
#contents input[type="date"]:focus,
#contents select:focus {
  outline: none;
  border-color: #c88a2b;
  box-shadow: 0 0 6px rgba(145, 95, 16, 0.3);
}

/* select 矢印カスタム */
#contents select {
  appearance: none;
  -webkit-appearance: none;
  -moz-appearance: none;
  background-image: url("data:image/svg+xml;utf8,<svg fill='%23915F10' height='20' viewBox='0 0 20 20' width='20' xmlns='http://www.w3.org/2000/svg'><path d='M5 7l5 5 5-5z'/></svg>");
  background-repeat: no-repeat;
  background-position: right 12px center;
  background-size: 16px;
  padding-right: 36px;
  cursor: pointer;
}

/* date アイコン色調整（Chrome系） */
#contents input[type="date"]::-webkit-calendar-picker-indicator {
  filter: sepia(100%) hue-rotate(340deg) saturate(300%);
  cursor: pointer;
}

#contents .form_sex {
  display: flex;
  align-items: center;
  gap: 25px;
  margin-bottom: 20px;
}

/* 各ラベル */
#contents .form_sex label {
  display: flex;
  align-items: center;
  gap: 8px;
  cursor: pointer;
  line-height: 1;
}

/* ラジオ本体 */
#contents .form_sex input[type="radio"] {
  appearance: none;
  -webkit-appearance: none;
  -moz-appearance: none;

  width: 18px;
  height: 18px;
  border: 2px solid #915F10;
  border-radius: 50%;
  background: #fff;
  position: relative;
  margin: 0;
  transition: all 0.2s ease;
}

/* チェック時 */
#contents .form_sex input[type="radio"]:checked {
  background-color: #915F10;
  transform: scale(1.1);  /* 少し大きく */
  box-shadow: 0 0 0 4px rgba(145, 95, 16, 0.25); /* 外側リング */
}

/* 中央の白丸 */
#contents .form_sex input[type="radio"]:checked::after {
  content: "";
  position: absolute;
  width: 7px;
  height: 7px;
  background: #fff;
  border-radius: 50%;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
}

/* ==================================================
scroll
================================================== */
/* scroll_box
============================== */
#contents .scroll_box {
	overflow-x: auto;
	-webkit-overflow-scrolling: touch;
	cursor: grab;
}
#contents .scroll_box:active {
	cursor: grabbing;
}
#contents .scroll_box img {
	display: block;
	max-width: none;
	height: auto;
	user-select: none;
	-webkit-user-drag: none;
	pointer-events: none;
}

/* scroll_box_txt */
#contents .scroll_box + .scroll_box_txt {
	text-align: right;
}
/* scroll_box_txt */
#contents .table_scroll + .scroll_box_txt {
	display: none;
}


/* ==================================================
clearfix
================================================== */
#main .box_info_cnt:after,
#main .box_ts:after,
#secondary:after {
	content: ""; 
	display: table;
	clear: both;
}
