@charset "utf-8";

body
    {
	 font					: 16px/1.5 sans-serif;
     margin:0px;          /* ページ全体のmargin */
     padding:0px;         /* ページ全体のpadding */
     text-align:center;   /* 下記のautoに未対応用のセンタリング */
    }

    .loginmain
    {
     margin-left:auto;    /* 左側マージンを自動的に空ける */
     margin-right:auto;   /* 右側マージンを自動的に空ける */
     text-align:left;     /* 中身を左側表示に戻す */
     width:600px;         /* 幅を決定する */
    }

.main
    {
     margin-left:auto;    /* 左側マージンを自動的に空ける */
     margin-right:auto;   /* 右側マージンを自動的に空ける */
     text-align:left;     /* 中身を左側表示に戻す */
     width:900px;         /* 幅を決定する */
    }

.main_W0240
    {
     margin-left:50rem;    /* 左側マージンを自動的に空ける */
     margin-right:auto;   /* 右側マージンを自動的に空ける */
     text-align:left;     /* 中身を左側表示に戻す */
     width:900px;         /* 幅を決定する */
    }

	@media screen and (min-width:1020px) and (max-width:1629px) {
	.main_W0240{
	margin-left:40rem;    /* 左側マージンを自動的に空ける */
    margin-right:auto;   /* 右側マージンを自動的に空ける */
    text-align:left;     /* 中身を左側表示に戻す */
    width:900px;         /* 幅を決定する */
			
		}
	}

	
.B_header {
background-color: #fff9c1;
display: flex;
justify-content: space-between;
align-items: center;
padding: 5px 10px;
flex-wrap: wrap;

  }
  

  .B_header-left img {
	height: 50px;
	width: auto;
  }
  
  .B_header-right {
display: flex;
flex-wrap: wrap;
gap: 10px;
font-size: 1rem;
justify-content: flex-end;
flex: 1;

  }
  
  .B_header-right a {
	color: #000;
	text-decoration: none;
	margin-right: 10px;
	white-space: nowrap;
  
  }
  
 
/* ▼ 1420px以下：少し文字サイズを縮小 */
@media screen and (max-width: 1420px) {
	.B_header-right {
	  font-size: 0.76rem;
	}
  }

  /* ▼ 1446px以下：少し文字サイズを縮小 */
@media screen and (max-width: 1446px) {
	.B_header-right {
	  font-size: 0.74rem;
	}
  }
  
  /* ▼ 1280px以下：さらに縮小＋中央寄せ */
  @media screen and (max-width: 1280px) {
	.B_header {
	  flex-direction: column;
	  align-items: center;
	}
  
	.B_header-left,
	.B_header-right {
	  width: 100%;
	  text-align: center;
	}
  
	.B_header-right {
	  font-size: 0.85rem;
	  justify-content: center;
	}
  
	.B_header-left img {
	  height: 35px;
	}
  }
  
  
  

/*学校情報確認画面などの表で使用*/
	/*table , td, th {
		border: 1px solid #595959;
		border-collapse: collapse;
		width: 720px;
		height: 250px;
		font-size:30px;
		}
	td, th {
		text-align: center;
		padding: 3px;
		width: 110px;
		height: 25px;
	}
	th {
		background: rgb(255, 168, 69);
	}
	.even {
		background: #fbf8f0;
	}
	.odd {
		background: #fefcf9;
	}*/

  /*パスワード設定画面で使用*/
  .Bunkyo_table , td, th {
		border: 1px solid #595959;
		border-collapse: collapse;
		width: 620px;
		height: 160px;
		font-size:15px;
    margin-bottom: 1rem;
		}
	td, th {
		text-align: center;
		padding: 3px;
		width: 110px;
		height: 25px;
	}
	th {
		background: #fff9c1;
	}
	.even {
		background: #fbf8f0;
	}
	.odd {
		background: #fefcf9;
	}

  /*学校用担当責任者～3学年担当責任者パスワード設定画面で使用*/
  .Bunkyo_table2 , td, th {
		border: 1px solid #595959;
		border-collapse: collapse;
		width: 620px;
		height: 160px;
		font-size:15px;
    margin-bottom: 1rem;
    
		}
	td, th {
		text-align: center;
		padding: 3px;
		width: 110px;
		height: 25px;
	}
	th {
		background: #fff9c1;
	}
	.even {
		background: #fbf8f0;
	}
	.odd {
		background: #fefcf9;
	}

/*お知らせ一覧のtableで使用*/
.Bunkyo_table3 , td, th {
	border: 1px solid #595959;
	border-collapse: collapse;
	width: 950px;
	height: 160px;
	font-size:15px;
margin-bottom: 1rem;

	}
td, th {
	text-align: center;
	padding: 3px;
	width: 110px;
	height: 25px;
}
th {
	background: #fff9c1;
}
.even {
	background: #fbf8f0;
}
.odd {
	background: #fefcf9;
}


.bunkyonet_botton{
/*ぶんきょうねっとのボタン（現在用途不明）に使用*/
    border: 1px solid #333;
    padding: 10px 30px;
    background: #fff9c1;
    cursor: pointer;
}

/*メインメニュータイトルの枠に使用*/
.mainmenu_border{
    padding: 1rem 2rem;
  border-top: 3px dotted rgb(245, 134, 6);
  border-bottom: 3px dotted rgb(245, 134, 6);
    
}

/*ぶんきょうネットのメインメニューのボタン、ログイン画面のボタンで使用*/
.menu_botton{
    border: 3px solid rgb(245, 134, 6);
    padding: 20px 40px;
    margin-bottom: 20px;
    background: rgb(255, 168, 69);
    cursor: pointer;
    width: 160px;
    border-radius:10px;
	text-align: center;
	color: white;
	font-weight: bold;
	display: inline-block;
}
/*ぶんきょうネットの「次へ」・「変更」・「前画面へ」ボタンで使用*/
.small_botton{
    border: 3px solid rgb(245, 134, 6);
    padding: 15px 25px;
    margin-bottom: 20px;
    background: rgb(255, 168, 69);
    cursor: pointer;
    width: 45%;
    border-radius:10px;
	text-align: center;
	color: white;
	font-weight: bold;
	font-size: 20px;
}

/*ぶんきょうネットのW0030「変更」ボタンで使用*/
.small_botton2{
  border: 3px solid rgb(245, 134, 6);
  padding: 15px 25px;
  margin-bottom: 20px;
  background: rgb(255, 168, 69);
  cursor: pointer;
  width: 180px;
  border-radius:10px;
text-align: center;
color: white;
font-weight: bold;
font-size: 20px;
}

/*ぶんきょうネットのW0030「キャンセル」ボタンで使用*/
.cancel_botton{
  border: 3px solid rgb(112, 109, 105);
  padding: 15px 25px;
  margin-bottom: 20px;
  background: rgb(146, 141, 136);
  cursor: pointer;
  width: 180px;
  border-radius:10px;
text-align: center;
color: white;
font-weight: bold;
font-size: 20px;
}

/*ぶんきょうネットTOPのページリロードボタンで使用*/
.reload_botton{
	border: 3px solid rgb(245, 134, 6);
	padding: 15px 25px;
	margin-bottom: 15px;
	background: white;
	cursor: pointer;
	width: 200px;
	border-radius:10px;
  text-align: center;
  color: black;
  font-weight: bold;
  font-size: 16px;
  }

/*メインメニューでボタンを縦に並べるために使用*/
.botton_wrap {
  display:flex;
  flex-flow: column;
  height:300px;
  margin:0 0 1em;
  align-items: center
}

/*ログイン画面の枠に使用*/
.login_waku{
    border: 3px solid rgb(245, 134, 6);
    padding: 20px 20px;
    margin-bottom: 20px;
    background: #fff9c1;
    cursor: pointer;
    width: 460px;
    border-radius:10px;
}

/*注文手続き画面等で使用する細目の囲み枠*/
.thinmenu_botton{
    border: 3px solid rgb(245, 134, 6);
    padding: 5px 15px;
    margin-bottom: 20px;
    background: rgb(255, 168, 69);
    cursor: pointer;
    width: auto;
	height: auto;
	color: white;
	font-weight: bold;
	font-size: 20px;
    border-radius:10px;	
}
	
/*お知らせの枠*/
.Oshirase_box{
	border: 2px solid rgb(245, 134, 6);
	border-radius: 5px;
	position: relative;
	margin-top: 1em;
	width: 900px;
  }
  .Oshirase_box h3{
	text-align: center;
	position: absolute;
	right: 0;
	left: 0;
	top: -1.5em;
  }
  .Oshirase_box span{
	padding: 0 1em;
	background: #FFF;
	color: rgb(245, 134, 6);
	  font-weight: bold;
  }
  /*お知らせが1～5明細の場合、スクロール非表示かつお知らせの幅を明細の数に合わせて調整する。5明細を超えるとスクロールバーが表示される*/
  .Oshirase_box .inner{
	padding: 3em .5em .5em;
	max-height: 320px; /* 最大高さを指定(お知らせが5明細分表示される) */
	overflow-y: auto; /* 5明細分を超えるときスクロールバーが表示される */
  }	

  /*処理メニュー見出し*/
  .syorimenu_midashi{
    display: inline-block;
    color: black;/*文字色*/
    font-size: 23px;
    padding: 0.5em 0;/*上下の余白*/
    border-top: solid 3px rgb(245, 134, 6);/*上線*/
    border-bottom: solid 3px rgb(245, 134, 6);/*下線*/
  }

  
.flex-container {
  display: flex;
  flex-wrap: wrap;
  justify-content: center;
  width: 100%;
}

.flex-item {
  flex: 1 1 25%; /* 各ボタンの幅を45%に設定 */
  /*box-sizing: border-box;*/
  margin: 1.5px;
  text-align: center; /* テキストを中央揃え */
}

/*W0200～W0203,W0300～W0303　ここから*/
/*「変更」ボタンで使用*/
.year_botton{
	border: 3px solid rgb(245, 134, 6);
	padding: 15px 25px;
	margin-bottom: 20px;
	background: #ffffff;
	cursor: pointer;
	width: 180px;
	border-radius:10px;
	text-align: center;
	font-weight: bold;
	font-size: 20px;
}
/*「戻る」ボタンで使用*/
.back_botton{
	border: 3px solid rgb(112, 109, 105);
	padding: 10px 25px;
	margin-top:30px;
	margin-bottom: 20px;
	background: #fff9c1;
	cursor: pointer;
	width: 180px;
	border-radius:10px;
	text-align: center;
	color: #666;
	font-weight: bold;
	font-size: 1rem;
}
/*プルダウンで使用*/
.pulldown{
	font-size: 1rem;
	padding:15px 50px 15px 20px;
	border-radius:5px;
}
.select_wrapper {
    position: relative;
}
.select_wrapper::after {
    content: "";
    position: absolute;
    top: 20px;
    right: 680px;
    border-right: 10px solid transparent;
    border-left: 10px solid transparent;
    border-top: 12px solid #555;
    border-bottom: 0;
	pointer-events: none;
}
.select_wrapper_W0202 {
    position: relative;
}
.select_wrapper_W0202::after {
    content: "";
    position: absolute;
    top: 20px;
    right: 35px;
    border-right: 10px solid transparent;
    border-left: 10px solid transparent;
    border-top: 12px solid #555;
    border-bottom: 0;
	pointer-events: none;
}
select {
    -webkit-appearance: none;
    appearance: none;
}
option:nth-child(2n+1){
	background:lightgray;
}
/*冊数入力で使用*/
.number{
	font-size: 1.5rem;
	padding:10px 5px 10px 25px;
	border-radius:5px;
	display: inline-block;
    width: 100px;
    border: 1px solid #999;
    box-sizing: border-box;
    margin: 0.5em 0;
}
/*冊数確認で使用*/
.number_confirmation{
	font-size: 1.5rem;
	padding:10px 25px 0px 25px;
    margin: 1em 0;
	border-bottom:solid #000 1px;
}
/*「ダウンロード」ボタンで使用*/
.download_botton{
	border: 3px solid rgb(245, 134, 6);
	padding: 10px 25px;
	margin-top:30px;
	margin-bottom: 20px;
	margin-left:30px;
	background-color:#CEE6C1;
	cursor: pointer;
	width: 180px;
	border-radius:10px;
	text-align: center;
	color: #666;
	font-weight: bold;
	font-size: 1rem;
}
/*W0202 登録項目table、W201で使用*/

.table-wrapper {
	overflow-x: auto;
	width: 100%;
  }
  
.registration_table{
	  border: 1px solid #595959;
	  border-collapse: collapse;
	  width: auto;
	  font-size:15px;
	  margin-bottom: 1rem;
}
.registration_table	td, th {
	text-align: center;
	width: auto;
	white-space: nowrap;
}
.registration_table	th {
	background: #fff9c1;
}
/*W0200～W0203,W0300～W0303　ここまで*/

.b_title {
    display: inline-block;
    position: relative;
    padding: 0 2.5em;
	font-size: 2rem;
    color: #333333;
}

.b_title::before,
.b_title::after {
    content: '';
    display: inline-block;
    position: absolute;
    top: 50%;
    width: 45px;
    height: 3px;
    background-color: #f58606;
}

.b_title::before {
    left: 0;
}

.b_title::after {
    right: 0;
}

.W0230_botton{
    border: 3px solid rgb(245, 134, 6);
    padding: 5px 10px;
    margin-bottom: 20px;
    background: rgb(255, 168, 69);
    cursor: pointer;
    width: 45%;
    border-radius:10px;
	text-align: center;
	color: white;
	font-weight: bold;
	font-size: 15px;
	
}

.h-list {
    list-style-type: disc;
    list-style-position: inside;
}

.h-list li {
    padding: .5em;
}

.h-list li:not(:last-child) {
    border-bottom: 1px dashed #f58606;
}

.h-list li::marker {
    color: #f58606;
    font-size: 1.1em;
}

/* W0240の質問一覧表示で使用 */
.b_list {
	list-style-type: none;
	padding: 0;
	margin: 0 auto;
	width: fit-content;
	}
	
	.b_list li {
	display: grid;
	grid-template-columns: 1em auto; /* アイコンとテキストの列幅を固定 */
	align-items: center;
	padding: .3em 0;
	}
	
	.b_list li::before {
	content: '';
	display: inline-block;
	width: 0.4em;
	height: 0.4em;
	transform: rotate(-45deg);
	border-bottom: 2px solid #f58606;
	border-right: 2px solid #f58606;
	margin-right: 0.5em;
	}
	
/*トップページへ戻る、前画面へ戻るボタンで使用*/
.btn-style1 { 
	display: inline-block;
	font-weight: 600;
	text-align: center;
	text-decoration: none;
	cursor: pointer;
	border: none;
	background-color: #f58606;
	color: white;
	transition: background-color 0.3s, transform 0.2s; 
	}

.btn-style1:visited {
	color: white;
	}
		
.size-small { 
	font-size: 0.875rem; 
	padding: 0.5em 1em;
			}
.size-medium { 
	font-size: 1rem;
	padding: 0.75em 1.5em; 
	}
.size-large {
	font-size: 1.125rem;
	padding: 1em 2em;
	}

.width-auto { 
	display: inline-block;
	width: auto;
	}
.width-full {
	display: block;
	width: 100%;
	box-sizing: border-box;
	}

.radius-none {
	border-radius: 0;
	}
.radius-small { 
	border-radius: 4px;
	 }
.radius-medium { 
	border-radius: 8px;
	 }
.radius-large { 
	border-radius: 50px; 
	}

/*キャンセルボタンで使用*/
.btn-style_cancel { 
	display: inline-block;
	font-weight: 600;
	text-align: center;
	text-decoration: none;
	cursor: pointer;
	border: none;
	background-color: rgb(112, 109, 105);
	color: white;
	transition: background-color 0.3s, transform 0.2s; 
	}

.btn-cancel:visited {
	color: white;
	}
		
.size-small { 
	font-size: 0.875rem; 
	padding: 0.5em 1em;
			}
.size-medium { 
	font-size: 1rem;
	padding: 0.75em 1.5em; 
	}
.size-large {
	font-size: 1.125rem;
	padding: 1em 2em;
	}

.width-auto { 
	display: inline-block;
	width: auto;
	}
.width-full {
	display: block;
	width: 100%;
	box-sizing: border-box;
	}

.radius-none {
	border-radius: 0;
	}
.radius-small { 
	border-radius: 4px;
	 }
.radius-medium { 
	border-radius: 8px;
	 }
.radius-large { 
	border-radius: 50px; 
	}

/*ダウンロードボタンで使用*/
.btn-style2 {
	display: inline-block;
	font-weight: 600;
	text-align: center;
	text-decoration: none;
	cursor: pointer;
	border: 2px solid #f58606;
	background-color: transparent;
	color: black;
	transition: background-color 0.3s, color 0.3s; 
		}

.size-small {
	font-size: 0.875rem;
	padding: 0.5em 1em; 
		}
.size-medium {
	font-size: 1rem;
	padding: 0.75em 1.5em;
		}
.size-large {
	font-size: 1.125rem;
	padding: 1em 2em;
		}

.width-auto {
	display: inline-block;
	width: auto;
		}
.width-full {
	display: block;
	width: 100%;
	box-sizing: border-box;
		}

.radius-none {
	border-radius: 0; 
		}
.radius-small {
	border-radius: 4px;
		}
.radius-medium {
	border-radius: 8px;
		}
.radius-large {
	border-radius: 50px;
		}

/*更新ボタンで使用*/
.btn-style3 { 
	display: inline-block;
	font-weight: 600;
	text-align: center;
	text-decoration: none;
	cursor: pointer;
	border: none;
	background-color: #1ea753;
	color: white;
	transition: background-color 0.3s, transform 0.2s; 
	}

.btn-style3:visited {
	color: white;
	}
		
.size-small { 
	font-size: 0.875rem; 
	padding: 0.5em 1em;
			}
.size-medium { 
	font-size: 1rem;
	padding: 0.75em 1.5em; 
	}
.size-large {
	font-size: 1.125rem;
	padding: 1em 2em;
	}

.width-auto { 
	display: inline-block;
	width: auto;
	}
.width-full {
	display: block;
	width: 100%;
	box-sizing: border-box;
	}

.radius-none {
	border-radius: 0;
	}
.radius-small { 
	border-radius: 4px;
	 }
.radius-medium { 
	border-radius: 8px;
	 }
.radius-large { 
	border-radius: 50px; 
	}

/*お知らせページの本文を画面中央に配置しつつ、文頭を左寄せにする*/
.oshirase_container {
	display: flex;
	justify-content: center; /* 横方向中央揃え */
	align-items: center; /* 縦方向中央揃え（必要に応じて） */
		}
		
.oshirase_centered-text {
	text-align: left;/* テキストは左寄せ */
	max-width: 600px; /* 幅を制限して中央に見せる */
	min-width: 320px; /* 最小幅を設定して、短文でも左寄せが効くようにする */
		}

/*質問ページの本文を画面中央に配置しつつ、文頭を左寄せにする*/
.question_container {
	display: flex;
	justify-content: center; /* 横方向中央揃え */
	align-items: center; /* 縦方向中央揃え（必要に応じて） */
		}
		
.question_centered-text {
	text-align: left;/* テキストは左寄せ */
	max-width: 600px; /* 幅を制限して中央に見せる */
	min-width: 320px; /* 最小幅を設定して、短文でも左寄せが効くようにする */
		}
		

/*トップページへ戻る、前画面へ戻るボタンで使用*/
.btn-style4 { 
	display: inline-block;
	font-weight: 600;
	text-align: center;
	text-decoration: none;
	cursor: pointer;
	border: none;
	background-color: #f58606;
	color: white;
	transition: background-color 0.3s, transform 0.2s; 
	}

.btn-style4:visited {
	color: white;
	}
		
.size-small { 
	font-size: 0.875rem; 
	padding: 0.5em 1em;
			}
.size-medium { 
	font-size: 1rem;
	padding: 0.75em 1.5em; 
	}
.size-large {
	font-size: 1.125rem;
	padding: 1em 2em;
	}

.width-auto { 
	display: inline-block;
	width: auto;
	}
.width-full {
	display: block;
	width: 100%;
	box-sizing: border-box;
	}

.radius-none {
	border-radius: 0;
	}
.radius-small { 
	border-radius: 4px;
	 }
.radius-medium { 
	border-radius: 8px;
	 }
.radius-large { 
	border-radius: 50px; 
	}

/*ぶんきょうネット　新年度更新画面上部のステップインジケーターのcssここから*/
	.step-wrapper {
		max-width: 900px;   /* ←お好みで調整 */
		margin: 0 auto;     /* 中央揃え */
		padding: 0 10px;    /* スマホで端が切れないための余白 */
		
	  }
	 
	.step-list {
		display: inline-flex;;
		margin: 0;
		padding: 0;
		gap: 4px;
		justify-content: flex-start;
	  }
	  
	  .step-list__item {	 
	display: flex;
	align-items: center;
	justify-content: center;
	height: 64px;
	padding: 0 28px;
	flex: 0 1 auto;     /* ←画面いっぱいの原因を解消 */
	list-style: none;
	background-color: #e0e0e0;
	text-align: center;
	clip-path: polygon(0% 0%, calc(100% - 28px) 0%, 100% 50%, calc(100% - 28px) 100%, 0% 100%, 28px 50%);
	margin: 0 -14px;
	  }
	  
	  .step-list__item:first-child {
		clip-path: polygon(0% 0%, calc(100% - 28px) 0%, 100% 50%, calc(100% - 28px) 100%, 0% 100% );
		margin-left: 0;
		padding-left: 0;
	  }
	  
	  .step-list__item:last-child {
		 clip-path: polygon(0% 0%, 100% 0%, 100% 100%, 0% 100%, 28px 50% );
		margin-right: 0;
		padding-right: 0;
	  }
	  
	  .step-list__item--current {
		background-color: #f58606;
		color: #fff;
	  }
	  
	  .step-text {
		display: block;
		font-size:12px;
	  }
	  
	  .step-text2 {
		display: block;
		font-size: 14px;
		font-weight: bold;
	  }

	  
/* 現在ステップ */
.step-list__item.is-current {
    background-color: #f58606;
    color: #fff;
}

/* 完了ステップ */
.step-list__item.is-complete {
    background-color: #fff9c1;
    color: #000;
}


/* スマホ表示：横スクロールで無理に縮ませない */
@media (max-width: 600px) {
	.step-list {
	  overflow-x: auto;
	  -webkit-overflow-scrolling: touch;
	  white-space: nowrap;
	}
	.step-list__item {
	  min-width: 140px;
	}
  }
  
  /*ぶんきょうネット　新年度更新画面上部のステップインジケーターのcssここまで*/