@charset "utf-8";
/* CSS Document */

@import url('https://fonts.googleapis.com/css2?family=Noto+Sans+JP:wght@100..900&family=Noto+Serif+JP:wght@200..900&display=swap');


/*
  Josh W. Comeau's Custom CSS Reset
  www.joshwcomeau.com
*/

/* 1. ボックスモデルの修正：余白や境界線が幅を壊さないようにする */
*, *::before, *::after {
  box-sizing: border-box;
}

/* 2. デフォルトの余白を削除 */
* {
  margin: 0;
}

/* 3. 本文の行間を整え、フォントのレンダリングを滑らかにする */
body {
  line-height: 1.5;
  -webkit-font-smoothing: antialiased;
}

/* 4. メディア要素（画像など）がはみ出さないようにし、ブロック要素化する */
img, picture, video, canvas, svg {
  display: block;
  max-width: 100%;
}

/* 5. フォーム要素が親のフォント設定を無視するのを防ぐ */
input, button, textarea, select {
  font: inherit;
}

/* 6. 長い単語が画面からはみ出して横スクロールが出るのを防ぐ */
p, h1, h2, h3, h4, h5, h6 {
  overflow-wrap: break-word;
}

/* 7. ルート（#rootや#__nextなど）にスタック文脈を作成する（Reactなどのフレームワーク用） */
#root, #__next {
  isolation: isolate;
}

/* resetここまで */

html { 
	font-size: 62.5%;
	scroll-behavior: smooth;
  scroll-padding-top: 115px;
}

body {
	inline-size: 100%;
	-webkit-text-size-adjust: 100%;
	margin: 0;
	color: #000;
	font-size: 16px;
	font-optical-sizing: auto;
	font-family: "Noto Sans JP", sans-serif;
	font-style: normal;
	font-weight: 500;
	line-height: 1.8;
	background: #fff;
}

img {
  display: inline-block;
  max-width: 100%;
  vertical-align: top;
}

* {box-sizing: border-box;}

h1, h2, h3, h4 {
	text-wrap: inherit;
	line-height: 1.2;
}

p {margin-top: 1em;}

a {transition : all 0.5s ease 0s;}

.noto-sans {
  font-family: "Noto Sans JP", sans-serif;
  font-optical-sizing: auto;
}

.noto-serif {
  font-family: "Noto Serif JP", serif;
  font-optical-sizing: auto;
}

.pc {display: block !important;}
.sp {display: none !important;}

@media screen and (max-width:768px) {
	
body {
	font-size: 4.5vw;
}	
	
.pc {display: none !important;}
.sp {display: block !important;}

}


/*--------------------

header

--------------------*/
header {
  position: fixed;
  left: 0;
  top: 0;
  z-index: 1000;
  width: 100%;
  background: #fff;
}

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

header .inner .logo a {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  text-decoration: none;
}

header .inner .logo a span {
  color: #000;
  font-size: 24px;
  font-weight: 700;
  font-family: "Noto Serif JP", serif;
}

header .inner ul {
  display: flex;
  flex-wrap: wrap;
  justify-content: flex-end;
  list-style: none;
  margin: 0;
  padding: 0;
}

header .inner li {
  padding: 8px 6px;
}

header .inner li:last-child {
  padding-right: 0;
}

header .inner li a {
  color: #000;
  font-size: 18px;
  text-align: center;
  text-decoration: none;
  border-bottom: 4px solid #fff;
}

header .inner li a:hover {
  border-bottom: 4px solid #ff0000;
}

header .inner .contact_btn a {
  padding: 0.5em 1.5em 0.5em 3.5em;
  color: #ff0000;
  text-decoration: none;
  background: url("../images/icon_mail_r.svg") no-repeat left 1.5em center / auto 1em, #fff;
  border: 1px solid #ff0000;
  border-radius: 2em;
}

header .inner .contact_btn:hover a {
  color: #fff;
  background: url("../images/icon_mail_w.svg") no-repeat left 1.5em center / auto 1em, #ff0000;
  border-bottom: 1px solid #ff0000;
}

header .inner .mypage_btn a {
  padding: 0.5em 1.5em 0.5em 2.5em;
  color: #000;
  text-decoration: none;
  background: url("../images/icon_mypage_b.svg") no-repeat left 1.5em center / auto 1em, #fff;
  border: 1px solid #000;
  border-radius: 2em;
}

header .inner .mypage_btn:hover a {
  color: #fff;
  background: url("../images/icon_mypage_w.svg") no-repeat left 1.5em center / auto 1em, #000;
  border-bottom: 1px solid #000;
}

header .inner .menu {
  display: none;
}

@media screen and (max-width:1430px) {
header .inner .menu {
  display: flex;
  flex-wrap: wrap;
  justify-content: flex-end;
  align-items: center;
  gap: 20px;
}

header .inner .menu_btn {
  display: flex !important;
  flex-wrap: wrap;
  justify-content: center;
  align-items: center;
  z-index: 1000;
  width: 40px;
  height: 40px;
  text-align: center;
  cursor: pointer;
}

header .inner .menu_btn span {
  display: block;
  width: 40px;
  height: 2px;
  background: #000;
}

header .inner nav {
  z-index: 99999;
  position: fixed;
  top: 0;
  left: 0;
  width: 100vw;
  height: 100vh;
  display: none;
  overflow: scroll;
  padding: 0;
	background: #595959;
  box-sizing: border-box;
}

header .inner nav ul {
	display: flex;
	flex-wrap: wrap;
  justify-content: flex-start;
	width: 100%;
	margin: 0;
	padding: 120px 0 0 0;
	list-style: none;
}

header .inner nav li {
	width: 100%;
	margin: 0;
	padding: 0;
}
	
header .inner nav li:first-child {
	width: 100%;
}

header .inner nav li a {
	display: block;
	padding: 16px 40px;
	color: #fff;
	font-size: 22px;
  text-align: left;
  text-decoration: none;
  border: none;
}

header .inner nav li a:hover {
	color: #00ff00;
  border: none;
}

header .inner nav .closebtn {
  display: block;
  position: absolute;
  top: 30px;
  right: 16px;
  z-index: 1000;
  width: 40px;
  height: 40px;
  text-align: center;
  cursor: pointer;
}

header .inner nav .closebtn span {
	position: absolute;
	top: 0;
	bottom: 0;
	left: 0;
	right: 0;
	margin: auto;
  display: block;
  width: 40px;
  height: 2px;
  background: #00ff00;
}

header .inner nav span:first-child {
	transform:rotate(45deg); 
}

header .inner nav span:last-child {
	transform:rotate(-45deg); 
}

header .inner nav .contact_btn {
  width: 320px;
  padding: 60px 0 20px 40px;
}

header .inner nav .mypage_btn {
  width: 300px;
  padding: 60px 0 20px;
}

header .inner nav .contact_btn a {
  display: inline-block;
  color: #fff;
  background: url("../images/icon_mail_w.svg") no-repeat left 1.5em center / auto 1em, #ff0000;
  border: none;
}

header .inner nav .mypage_btn a {
  display: inline-block;
  color: #fff;
  background: url("../images/icon_mypage_w.svg") no-repeat left 1.5em center / auto 1em, #000;
  border: none;
}

header .inner nav .contact_btn:hover a {
  border: none;
}

header .inner nav .mypage_btn:hover a {
  border: none;
}

header .inner nav .contact_btn a:hover {
  display: inline-block;
  color: #ff0000;
  background: url("../images/icon_mail_r.svg") no-repeat left 1.5em center / auto 1em, #fff;
  border: none;
}

header .inner nav .mypage_btn a:hover {
  display: inline-block;
  color: #000;
  background: url("../images/icon_mypage_b.svg") no-repeat left 1.5em center / auto 1em, #fff;
  border: none;
}

}

@media screen and (max-width:800px) {
header .logo img {
  height: 60px;
}

header .inner .logo a span {
  font-size: 3vw;
}
}

@media screen and (max-width:768px) {
header .inner {
  padding: 3vw 5vw;
}

header .logo {
  line-height: 1;
}

header .logo img {
  height: 60px;
}

header .inner .logo a span {
  font-size: min(20px, 25vw);
}

header .inner .menu .contact_btn,
header .inner .menu .mypage_btn {
  display: none;
}

header .inner nav ul {
	padding: calc(60px + 6vw) 0 0 0;
	list-style: none;
}

header .inner nav li {
	width: 100%;
	margin: 0;
	padding: 0;
}
	
header .inner nav li:first-child {
	width: 100%;
}

header .inner nav li a {
	padding: 3vw 5vw;
	font-size: 4.5vw;
}

header .inner nav .contact_btn {
  width: 100%;
  padding: 10vw 5vw 5vw 5vw;
  text-align: center;
}

header .inner nav .mypage_btn {
  width: 100%;
  padding: 10vw 5vw 10vw 5vw;
  text-align: center;
}

header .inner nav .contact_btn a {
  width: 14em;
  padding: 0.5em 1.5em;
  text-align: center;
}

header .inner nav .mypage_btn a {
  width: 14em;
  padding: 0.5em 1.5em;
  text-align: center;
  background: url(../images/icon_mypage_w.svg) no-repeat left 2em center / auto 1em, #000;
}

header .inner nav .closebtn {
  top: 5vw;
  right: 5vw;
}



}

/*--------------------

main

--------------------*/
main {
  display: block;
}

.inner {
  width: 100%;
  max-width: 1440px;
  margin: auto;
  padding: 1em;
}

section {
  margin: 50px 0;
}

@media screen and (max-width:768px) {
.inner {
  padding: 3vw 5vw;
}

section {
  margin: 10vw 0;
}
}

/*--------------------
配置
--------------------*/
.tac {text-align: center;}
.tar {text-align: right;}
.tal {text-align: left;}

.dip_ib {display: inline-block;}

.column {
  display: flex;
  flex-wrap: wrap;
}

.column_2 {
  display: flex;
  flex-wrap: wrap;
}

/*--------------------
余白
--------------------*/
/* margin */
.m_0 {margin: 0;}
.mtb_01 {margin: 1em 0;}

/*padding */
.p_01 {padding: 1em;}


/*--------------------
背景
--------------------*/
.bg_01 {background: #ebebff;}
.bg_02 {background: #fff;}

/*--------------------
文字
--------------------*/
.fc_01 {color: #ff0000;}
.fc_02 {color: #0000ff;}
.fc_03 {color: #00ff00;}

/*--------------------
見出し
--------------------*/
/* .page_tit */
.page_tit {
  padding-top: 115px;
  background: #595959;
}

.page_tit .inner {
  position: relative;
}

.page_tit .inner::before {
  content: "";
  position: absolute;
  left: 0;
  bottom: 0;
  width: 80px;
  height: 5px;
  background: #ff0000;
}

.page_tit .inner::after {
  content: "";
  position: absolute;
  left: 80px;
  bottom: 0;
  width: 80px;
  height: 5px;
  background: #00ff00;
}

.page_tit .inner .title::after {
  content: "";
  position: absolute;
  left: 160px;
  bottom: 0;
  width: 80px;
  height: 5px;
  background: #0000ff;
}

.page_tit .title {
  margin: 1em 0;
  color: #fff;
  font-size: 36px;
  font-weight: 500;
  font-family: "Noto Serif JP", serif;
}

/* .headline_01 */
.headline_01 {
  margin-bottom: 60px;
  text-align: center;
}

.headline_01 .en {
  position: relative;
  display: block;
  margin-bottom: 15px;
  padding-bottom: 15px;
  font-size: 24px;
  font-weight: 400;
}

.headline_01 .en::after {
  content: "";
  position: absolute;
  left: 0;
  right: 0;
  bottom: 0;
  margin: auto;
  width: 60px;
  height: 2px;
  background: #000;
}

.headline_01 .jp {
  display: block;
  font-size: 36px;
  font-weight: 500;
  font-family: "Noto Serif JP", serif;
}

/* .headline_02 */
.headline_02 {
  position: relative;
  margin-bottom: 1em;
  padding: 0.5em;
  font-size: 30px;
}

.headline_02::before {
  content: "";
  position: absolute;
  left: 0;
  bottom: 0;
  width: 100%;
  height: 3px;
  background: #999999;
}

.headline_02::after {
  content: "";
  position: absolute;
  left: 0;
  bottom: 0;
  width: 200px;
  height: 3px;
  background: #0000ff;
  transition : all 0.5s ease 0s;
}

/* .headline_03 */
.headline_03 {
  margin0: 1em 0 0.5em;
  padding: 1em 0 0;
  font-size: 28px;
}

.headline_03::before {
  content: "■";
  color: #FF0000;
}

/* .headline_04 */
.headline_04 {
  margin0: 1em 0 0.5em;
  color: #0000FF;
  padding: 1em 0 0;
  font-size: 24px;
  font-weight: 700;
}

.headline_04 .line {
  display: inline-block;
  margin-bottom: 0.2em;
  padding: 0.2em;
  border-bottom: 1px solid #000;
}

/* .headline_05 */
.headline_05 {
  position: relative;
  margin-bottom: 1em;
  padding: 0.5em 0.5em 0.5em 1.3em;
  color: #fff;
  font-size: 26px;
  font-weight: 500;
  background: #595959;
}

.headline_05::before {
  content: "";
  position: absolute;
  left: 0.5em;
  top: 0;
  bottom: 0;
  margin: auto;
  height: 60%;
  width: 0.3em;
  background: #00ff00;
}

@media screen and (max-width:768px) {
/* .page_tit */
.page_tit {
  padding-top: calc(60px + 6vw);
}

.page_tit .title {
  font-size: 7vw;
}

/* .headline_01 */
.headline_01 {
  margin-bottom: 8vw;
}

.headline_01 .en {
  margin-bottom: 2vw;
  padding-bottom: 2vw;
  font-size: 4.5vw;
}

.headline_01 .en::after {
  width: 7vw;
}

.headline_01 .jp {
  font-size: 7vw;
}

/* .headline_02 */
.headline_02 {
  font-size: 6.5vw;
}

/* .headline_03 */
.headline_03 {
  font-size: 6vw;
}

/* .headline_04 */
.headline_04 {
  font-size: 5.5vw;
}

/* .headline_05 */
.headline_05 {
  font-size: 5.8vw;
}
}

/*--------------------
ボタン
--------------------*/
.btn_c {
  text-align: center;
}

/* .btn_entry  */
.btn_entry {
  display: inline-block;
  margin: 0.5em 0;
  padding: 0.5em 3em;
  color: #fff;
  font-size: 30px;
  text-decoration: none;
  background: linear-gradient(0deg, #007f00 20%, #00ff00);
  border: 2px solid #00ff00;
  border-radius: 3em;
}

.btn_entry:hover {
  background: linear-gradient(0deg, #00ff00 20%, #007f00);
}

/* .btn_mypage  */
.btn_mypage {
  display: inline-block;
  margin-top: 1em;
  padding: 0.5em 3.5em 0.5em 4.5em;
  color: #ff0000;
  font-size: 26px;
  text-decoration: none;
  background: url("../images/icon_mypage_r.svg") no-repeat left 3.5em center / auto 1em;
  border: 1px solid #ff0000;
  border-radius: 2em;
}

.btn_mypage:hover {
  color: #fff;
  background: url("../images/icon_mypage_w.svg") no-repeat left 3.5em center / auto 1em, #ff0000;
}

/* .btn_news  */
.btn_news {
  display: inline-block;
  margin-top: 1em;
  padding: 0.5em 3.5em;
  color: #00ff00;
  font-size: 26px;
  text-decoration: none;
  background: #595959;
  border: 1px solid #00ff00;
  border-radius: 2em;
}

.btn_news:hover {
  color: #00ff00;
  background: #000;
}

@media screen and (max-width:768px) {
/* .btn_entry  */
.btn_entry {
  font-size: 4.5vw;
}

/* .btn_mypage  */
.btn_mypage {
  font-size: 4vw;
}

/* .btn_news  */
.btn_news {
  font-size: 4vw;
}

}

/*--------------------
リスト
--------------------*/
/* .list_link */
.list_link {
  margin: 1em;
  padding: 0;
  list-style: none;
}

.list_link li {
  position: relative;
  padding: 0.5em 2em;
  transition : all 0.5s ease 0s;
}

.list_link li::after {
  content: "";
  position: absolute;
  left: 0.8em;
  top: 0;
  bottom: 0;
  margin: auto;
  width:0;
  height:0;
  border-style:solid;
  border-width: 5px 0 5px 10px;
  border-color: transparent transparent transparent #FF0000;
}

.list_link.anchor li::after {
  border-width: 10px 5px 0 5px;
  border-color: #FF0000 transparent transparent transparent;
}

.list_link li a {
  color: #000;
  text-decoration: none;
}

.list_link li a:hover {
  color: #ff0000;
  text-decoration: underline;
}

/* .list_btn */
.list_btn {
  margin: 1em 0;
  padding: 0;
  list-style: none;
}

.list_btn li {
  padding: 0.5em;
}

.list_btn li a {
  position: relative;
  display: inline-block;
  min-width: 250px;
  padding: 0.5em 3em 0.5em 2em;
  background: linear-gradient(0deg, #007f00 20%, #00ff00);
  border: 2px solid #00ff00;
  border-radius: 3em;
  color: #fff;
  font-size: 18px;
  text-decoration: none;
  transition : all 0.5s ease 0s;
}

.list_btn li a::after {
  content: "";
  position: absolute;
  right: 0.8em;
  top: 0;
  bottom: 0;
  margin: auto;
  width:0;
  height:0;
  border-style:solid;
  border-width: 5px 0 5px 10px;
  border-color: transparent transparent transparent #fff;
  transition : all 0.5s ease 0s;
}

.list_btn li a:hover {
  background: linear-gradient(0deg, #00ff00 20%, #007f00);
}

/*--------------------
表組
--------------------*/
/* .table_01 */
.table_01 {
  margin: 1em 0;
  border-collapse: collapse;
}

.table_01 th,
.table_01 td {
  padding: 1em;
  border: 1px solid #595959;
}

.table_01 th {
  background: #eee;
}

@media screen and (max-width:768px) {
.table_01 th,
.table_01 td {
  display: block;
  width: 100%;
  max-width: 100%;
  padding: 0.5em;
}

}

/*--------------------

#top（TOPページ）

--------------------*/
/*--------------------
#sec_mv
--------------------*/
#sec_mv {
  padding: 115px 0 0;
  margin: 0;
  min-height: 100vh;
  background: url("../images/mv.jpg") no-repeat top center, #000;
}

#sec_mv .inner {
  position: relative;
}

#sec_mv .text {
  margin: 240px 0 350px;
}

#sec_mv .text p {
  margin-bottom: 1em;
  color: #fff;
  font-size: 48px;
  font-weight: 500;
  font-family: "Noto Serif JP", serif;
  line-height: 1.5;
}

#sec_mv .text p span {
  font-size: 60px;
}

#sec_mv .info_box {
  position: absolute;
  right: 16px;
  bottom: 0;
  display: inline-block;
  color: #fff;
  text-align: center;
  border: 1px solid #fff;
  background: rgba(0,0,0,0.5);
}

#sec_mv .info_box h2 {
  padding: 15px;
  font-size: 30px;
  font-family: "Noto Serif JP", serif;
  background: rgba(0,0,255,0.3);
}

#sec_mv .info_box .info_text {
  margin-left: auto;
  padding: 15px;
}

#sec_mv .info_box .info_text p {
  margin: 0;
  font-size: 24px;
  font-weight: 700;
  line-height: 1.4;
}

#sec_mv .info_box .info_text p .day {
  font-size: 48px;
}

#sec_mv .info_box .info_text p .period {
  font-size: 20px;
}

#sec_mv .info_box .info_text .btn_mypage {
  display: inline-block;
  margin-top: 1em;
  padding: 0.5em 1.5em 0.5em 2.5em;
  color: #fff;
  font-size: 24px;
  text-decoration: none;
  background: url("../images/icon_mypage_w.svg") no-repeat left 1.5em center / auto 1em;
  border: 1px solid #fff;
  border-radius: 2em;
}

#sec_mv .info_box .info_text .btn_mypage:hover {
  color: #000;
  background: url("../images/icon_mypage_b.svg") no-repeat left 1.5em center / auto 1em, #fff;
}

@media screen and (max-width:768px) {
#sec_mv {
  padding-top: calc(60px + 6vw);
  min-height: 100vh;
  background: url("../images/mv.jpg") no-repeat top center / auto 100%, #000;
}

#sec_mv .text {
  margin: 10vw 0 70vw;
}

#sec_mv .text p {
  font-size: 6.25vw;
}

#sec_mv .text p span {
  font-size: 7.81vw;
}

#sec_mv .info_box {
  right: 0;
  left: 0;
  width: 90vw;
  margin: auto;
}

#sec_mv .info_box h2 {
  padding: 3vw;
  font-size: 5vw;
}

#sec_mv .info_box .info_text {
  padding: 3vw;
}

#sec_mv .info_box .info_text p {
  font-size: 4.5vw;
}

#sec_mv .info_box .info_text p .day {
  font-size: 8vw;
}

#sec_mv .info_box .info_text p .period {
  font-size: 3.5vw;
}

#sec_mv .info_box .info_text .btn_mypage {
  font-size: 4.5vw;
}

}

/*--------------------
#sec_about
--------------------*/
#sec_about {
  margin: 0;
  padding: 100px 0;
}

#sec_about .headline_01 .en::after {
  background: #ff0000;
}

#sec_about ul {
  display: flex;
  flex-wrap: wrap;
  justify-content: space-between;
  margin: 0;
  padding: 0;
  list-style: none;
}

#sec_about li {
  margin-bottom: 40px;
  width: 32%;
  min-height: 180px;
  background: #ffd9d9;
  border: 1px solid #fff;
  border-radius: 16px;
  box-shadow: 5px 5px 0px 0px rgba(0,0,0,0.15);
}

#sec_about li:hover {
  position: relative;
  top: 5px;
  left: 5px;
  box-shadow: none;
}

#sec_about li a {
  display: flex;
  flex-wrap: wrap;
  justify-content: center;
  align-items: center;
  align-content: center;
  height: 100%;
  padding: 20px 20px 20px 170px;
  color: #000;
  font-size: 24px;
  text-align: center;
  text-decoration: none;
  line-height: 1.4;
}

#sec_about li:first-child {
  width: 32%;
  margin: 0 34% 40px;
}

#sec_about li:nth-child(1) a {background: url("../images/icon_01.svg") no-repeat left 16px center / 150px auto;}
#sec_about li:nth-child(2) a {background: url("../images/icon_02.svg") no-repeat left 16px center / 150px auto;}
#sec_about li:nth-child(3) a {background: url("../images/icon_03.svg") no-repeat left 16px center / 150px auto;}
#sec_about li:nth-child(4) a {background: url("../images/icon_04.svg") no-repeat left 16px center / 150px auto;}
#sec_about li:nth-child(5) a {background: url("../images/icon_05.svg") no-repeat left 16px center / 150px auto;}
#sec_about li:nth-child(6) a {background: url("../images/icon_06.svg") no-repeat left 16px center / 150px auto;}
#sec_about li:nth-child(7) a {background: url("../images/icon_07.svg") no-repeat left 16px center / 150px auto;}

@media screen and (min-width:768px) and (max-width:1250px) {
#sec_about li a {
  padding: 130px 20px 20px 20px;
}

#sec_about li:nth-child(1) a {background: url("../images/icon_01.svg") no-repeat top 16px center / auto 100px;}
#sec_about li:nth-child(2) a {background: url("../images/icon_02.svg") no-repeat top 16px center / auto 100px;}
#sec_about li:nth-child(3) a {background: url("../images/icon_03.svg") no-repeat top 16px center / auto 100px;}
#sec_about li:nth-child(4) a {background: url("../images/icon_04.svg") no-repeat top 16px center / auto 100px;}
#sec_about li:nth-child(5) a {background: url("../images/icon_05.svg") no-repeat top 16px center / auto 100px;}
#sec_about li:nth-child(6) a {background: url("../images/icon_06.svg") no-repeat top 16px center / auto 100px;}
#sec_about li:nth-child(7) a {background: url("../images/icon_07.svg") no-repeat top 16px center / auto 100px;}
}

@media screen and (max-width:768px) {
#sec_about {
  padding: 15vw 0;
}

#sec_about li {
  margin-bottom: 5vw;
  width: 48%;
  min-height: inherit;
  background: #ffd9d9;
  border: 1px solid #fff;
  border-radius: 16px;
  box-shadow: 5px 5px 0px 0px rgba(0,0,0,0.15);
}

#sec_about li:hover {
  position: relative;
  top: 5px;
  left: 5px;
  box-shadow: none;
}

#sec_about li a {
  padding: 28vw 5vw 3vw 5vw;
  color: #000;
  font-size: 4.5vw;
  text-align: center;
  text-decoration: none;
  line-height: 1.4;
}

#sec_about li:first-child {
  width: 100%;
  margin: 0 0 5vw;
}

#sec_about li:nth-child(1) a {background: url("../images/icon_01.svg") no-repeat top 5vw center / auto 20vw;}
#sec_about li:nth-child(2) a {background: url("../images/icon_02.svg") no-repeat top 5vw center / auto 20vw;}
#sec_about li:nth-child(3) a {background: url("../images/icon_03.svg") no-repeat top 5vw center / auto 20vw;}
#sec_about li:nth-child(4) a {background: url("../images/icon_04.svg") no-repeat top 5vw center / auto 20vw;}
#sec_about li:nth-child(5) a {background: url("../images/icon_05.svg") no-repeat top 5vw center / auto 20vw;}
#sec_about li:nth-child(6) a {background: url("../images/icon_06.svg") no-repeat top 5vw center / auto 20vw;}
#sec_about li:nth-child(7) a {background: url("../images/icon_07.svg") no-repeat top 5vw center / auto 20vw;}

}

/*--------------------
#sec_course
--------------------*/
#sec_course {
  margin: 0;
  padding: 100px 0;
  background: #ebebff;
}

#sec_course .headline_01 .en::after {
  background: #0000ff;
}

#sec_course .item {
  margin-top: 60px;
}

#sec_course .item .inbox {
  display: flex;
  flex-wrap: wrap;
  color: #000;
  text-decoration: none;
}

#sec_course .item .img {
  width: min(400px, 31.25vw);
}

#sec_course .item .img img {
  border: 1px solid #fff;
  border-radius: 16px;
  box-shadow: 5px 5px 0px 0px rgba(0,0,0,0.15);
}

#sec_course .item a:hover .img img {
  position: relative;
  top: 5px;
  left: 5px;
  box-shadow: none;
}

#sec_course .item .text {
  flex: 1;
  padding-left: 40px;
}

#sec_course .item .text .headline_02 {
  padding: 20px 60px 20px 20px;
  transition : all 0.5s ease 0s;
}

#sec_course .item a:hover .text .headline_02 {
  color: #0000ff;
}

#sec_course .item .text .headline_02::after {
  transition : all 0.5s ease 0s;
}

#sec_course .item a:hover .text .headline_02::after {
  width: 100%;
}

#sec_course .item .text .headline_02 .icon {
  position: absolute;
  right: 20px;
  top: 20px;
  display: inline-block;
  width: 40px;
  height: 40px;
}

#sec_course .item .text .headline_02 .icon img {
  width: 100%;
  height: 100%;
}

#sec_course .item .text p {
  padding: 20px;
  font-size: 20px;
}

@media screen and (max-width:768px) {
#sec_course {
  padding: 15vw 0;
}

#sec_course .item {
  margin-top: 10vw;
}

#sec_course .item a {
  flex-direction: column-reverse;
}

#sec_course .item .img {
  width: 100%;
}

#sec_course .item .text {
  flex: none;
  width: 100%;
  padding-left: 0;
}

#sec_course .item .text .headline_02 {
  position: relative;
  padding: 3vw 10vw 3vw 5vw;
  font-size: 5.2vw;
}

#sec_course .item:hover .text .headline_02 {
  color: #0000ff;
}

#sec_course .item .text .headline_02::before {
  content: "";
  position: absolute;
  left: 0;
  bottom: 0;
  width: 100%;
  height: 3px;
  background: #999999;
}

#sec_course .item .text .headline_02::after {
  content: "";
  position: absolute;
  left: 0;
  bottom: 0;
  width: 200px;
  height: 3px;
  background: #0000ff;
  transition : all 0.5s ease 0s;
}

#sec_course .item:hover .text .headline_02::after {
  width: 100%;
}

#sec_course .item .text .headline_02 .icon {
  position: absolute;
  right: 3vw;
  top: 3vw;
  display: inline-block;
  width: 6.5vw;
  height: 6.5vw;
}

#sec_course .item .text .headline_02 .icon img {
  width: 100%;
  height: 100%;
}

#sec_course .item .text p {
  padding: 5vw;
  font-size: 4.2vw;
}

}

/*--------------------
#sec_news
--------------------*/
#sec_news {
  margin: 0;
  padding: 100px 0;
  background: #595959;
}

#sec_news .headline_01 {
  color: #fff;
}

#sec_news .headline_01 .en::after {
  background: #00ff00;
}

#sec_news ul {
  margin: 0 0 60px;
  padding: 35px 30px;
  list-style: none;
  background: #fff;
  border-radius: 16px;
}

#sec_news li {
  display: flex;
  flex-wrap: wrap;
  align-items: flex-start;
  padding: 30px;
  font-size: 18px;
  border-bottom: 2px dotted #acacac;
}

#sec_news li .date {
  display: inline-block;
  width: 5em;
}

#sec_news li .cate {
  display: inline-block;
  width: 7em;
  margin: 0 1em;
  color: #fff;
  font-size: 16px;
  text-align: center;
  background: #000;
}

#sec_news li .tit {
  flex: 1;
  width: min(1050px, 82vw);
}

#sec_news li a {
  position: relative;
  display: inline-block;
  padding-right: 3em;
  color: #000;
  text-decoration: none;
}

#sec_news li a:hover {
  color: #ff0000;
}

#sec_news li a::after {
  content: "";
  position: absolute;
  right: 2em;
  top: 0;
  bottom: 0;
  margin: auto;
  width:0;
  height:0;
  border-style:solid;
  border-width: 5px 0 5px 10px;
  border-color: transparent transparent transparent #FF0000;
  transition : all 0.5s ease 0s;
}

#sec_news li a:hover::after {
  right: 0;
}

@media screen and (max-width:768px) {
#sec_news {
  padding: 15vw 0;
}

#sec_news ul {
  margin: 0 0 10vw;
  padding: 5vw;
}

#sec_news li {
  padding: 5vw;
  font-size: 4.5vw;
}

#sec_news li .date {
  display: inline-block;
  width: 5em;
}

#sec_news li .cate {
  font-size: 4vw;
}

#sec_news li .tit {
  flex: none;
  width: 100%;
  line-height: 1.5;
}

#sec_news li a {
  padding-right: 1em;
}

#sec_news li a::after {
  right: 0;
}
}

/*--------------------

下層ページ

--------------------*/
/* #sec_intro */
#sec_intro {
  margin: 0;
  padding: 50px 0;
}

/* .list_flow */
.list_flow {
  display: flex;
  flex-wrap: wrap;
  flex-direction: column;
  gap: 2em;
  margin: 2em 0;
  padding: 0;
  list-style: none;
}

.list_flow li {
  position: relative;
  display: flex;
  flex-wrap: wrap;
  align-items: flex-start;
  gap: 1em;
}

.list_flow li:not(:last-child)::before {
  content: "";
  position: absolute;
  left: 43px;
  bottom: -1.3em;
  width:0;
  height:0;
  border-style:solid;
  border-width: 0.75em 0.5em 0 0.5em;
  border-color: #ff0000 transparent transparent transparent;
}

.list_flow li .num {
  display: inline-block;
  width: 100px;
  padding: 0.3em 0.5em;
  font-size: 20px;
  color: #fff;
  text-align: center;
  line-height: 1;
  background: #595959;
  border-radius: 2em;
}

.list_flow li .flow {
  flex: 1;
}

#textbook .column_2 {
  align-items: flex-start;
}

#textbook .column_2 .text {
  flex: 1;
  padding: 1em;
}

#textbook .column_2 .img {
  padding: 1em;
}

#textbook .column_2 .bg_01 {
  display: inline-block;
  padding: 1em;
}

#textbook .column figure {
  display: inline-block;
  padding: 1em;
}

#news #sec_news {
  background: #fff;
}

@media screen and (max-width:768px) {
.list_flow li:not(:last-child)::before {
  left: 0;
  right: 0;
  margin: auto;
}

.list_flow li .num {
  margin: auto;
  font-size: 4.5vw;
}

.list_flow li .flow {
  flex: none;
  width: 100%;
}
}

/*--------------------

footer

--------------------*/
footer {
  padding: 80px 0 min(130px, 10.15vw);
  background: #000;
}

footer .inbox {
  display: flex;
  flex-wrap: wrap;
  justify-content: space-between;
  align-items: center;
  gap: 40px;
}

footer .inbox .btn {
  display: flex;
  flex-wrap: wrap;
  justify-content: flex-end;
  align-items: center;
  gap: 20px;
}

footer .inbox .contact_btn a {
  padding: 0.5em 1.5em 0.5em 3.5em;
  color: #fff;
  font-size: 18px;
  text-decoration: none;
  background: url("../images/icon_mail_w.svg") no-repeat left 1.5em center / auto 1em, #ff0000;
  border-radius: 2em;
}

footer .inbox .contact_btn:hover a {
  color: #ff0000;
  background: url("../images/icon_mail_r.svg") no-repeat left 1.5em center / auto 1em, #fff;
}

footer .inbox .mypage_btn a {
  padding: 0.5em 1.5em 0.5em 2.5em;
  color: #fff;
  font-size: 18px;
  text-decoration: none;
  background: url("../images/icon_mypage_w.svg") no-repeat left 1.5em center / auto 1em, #595959;
  border-radius: 2em;
}

footer .inbox .mypage_btn:hover a {
  color: #000;
  background: url("../images/icon_mypage_b.svg") no-repeat left 1.5em center / auto 1em, #fff;
}


footer .logo a {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  text-decoration: none;
}

footer .logo span {
  margin-left: 0.5em;
  color: #fff;
  font-size: 36px;
  font-weight: 500;
  font-family: "Noto Serif JP", serif;
  transition : all 0.5s ease 0s;
}

footer .logo a:hover {
  opacity: 0.75;
}

footer ul {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 1em 2em;
  margin: 50px 0;
  padding: 0;
  list-style: none;
}

footer li a {
  display: inline-block;
  color: #fff;
  font-size: 18px;
  text-decoration: none;
  border-bottom: 4px solid #000;
}

footer li a:hover{
  border-bottom: 4px solid #ff0000;
}


footer small {
  display: block;
  color: #fff;
  font-size: 16px;
  text-align: right;
}

@media screen and (max-width:768px) {
footer {
  padding: 15vw 0 18vw;
}

footer .inbox {
  gap: 2em;
}

footer .logo span {
  font-size: 6vw;
}

footer .logo img {
  width: 18vw;
}

footer .inbox .btn {
  justify-content: flex-start;
  gap: 1em;
}

footer .inbox .contact_btn a {
  font-size: 4vw;
}

footer .inbox .mypage_btn a {
  font-size: 4vw;
}


footer ul {
  gap: 0.5em;
  margin: 10vw 0;
}

footer li {
  width: 100%;
}

footer li a {
  font-size: 4vw;
}

footer small {
  font-size: 3.2vw;
  text-align: center;
}

}

/*--------------------

#footer_cta

--------------------*/
#footer_cta {
  width: 100%;
  position: fixed;
  left: 0;
  bottom: 0;
  z-index: 999;
  opacity: 0;
  visibility: hidden;
  transform: translateY(20px);
  background: #595959;
  transition: opacity 0.4s ease, visibility 0.4s ease, transform 0.4s ease;
}

#footer_cta.is-show {
  opacity: 1;
  visibility: visible;
  transform: translateY(0);
}

#footer_cta .inner {
  display: flex;
  justify-content: space-around;
  align-items: center;
}

#footer_cta .inner .text p {
  margin: 0;
  color: #fff;
  font-size: min(22px, 1.71vw);
  font-weight: 700;
  text-align: center;
  line-height: 1;
}

#footer_cta .inner .text .title {
  font-size: min(28px, 2.18vw);
  font-weight: 700;
  font-family: "Noto Serif JP", serif;
}

#footer_cta .inner .text .day {
  font-size: min(44px, 3.43vw);
}

#footer_cta .inner .text .period {
  display: inline-block;
  margin-top: 0.5em;
  font-size: min(18px, 1.4vw);
  font-weight: 500;
}

#footer_cta .inner .btn_entry {
  margin: 0;
  font-size: min(30px, 2.34vw);
}

@media screen and (max-width:768px) {
#footer_cta .inner {
  padding: 3vw 2vw;
}

#footer_cta .inner .text p {
  font-size: 2.5vw;
}

#footer_cta .inner .text .title {
  font-size: 4vw;
}

#footer_cta .inner .text .day {
  font-size: 4.5vw;
}

#footer_cta .inner .text .period {
  font-size: 2vw;
}

#footer_cta .inner .btn_entry {
  margin: 0;
  padding: 0.5em 1.5em;
  font-size: 3vw;
}

}