@charset "UTF-8";
/*----- common ---------------------------------------------------------------*/
html{
	margin:0; padding:0;
	font-family: "游ゴシック体", "Yu Gothic", YuGothic, "ヒラギノ角ゴ Pro W3", "Hiragino Kaku Gothic Pro", "メイリオ", Meiryo, Osaka, "ＭＳ Ｐゴシック", "MS P Gothic", sans-serif;
}
body{
	background-image: url('/img/bg2_compressed.png'), url('/img/bg3u.jpg');
	background-repeat: no-repeat, no-repeat;
	background-attachment: fixed, fixed;
	background-size: 100% auto,  100% auto;
	background-position: center bottom, center top;
}

article, aside, details, figcaption, figure, footer, header, hgroup, menu, nav, section { display: block; }

ol, ul{ list-style:none; }
table{ border-collapse: collapse; border-spacing:0; }
ul{width:94%; margin:0 auto;padding:0;}
li{width:100%; padding:5px 0; border-bottom:#333 dotted 1px;}

a{color:#222;}
//a { text-decoration: none; }
//a:focus { outline:none; }

.cf:before,
.cf:after { content: " "; display: table; }
.cf:after { clear: both; }

.img100{width:100%;}


/*----- layout ---------------------------------------------------------------*/
#wrapper{  }
#contents{ width:94%; margin: 20px auto; padding: 20px 0;
	background-color:rgba(255,255,255,0.7);
 }
header {
  padding:10px;
  background: #ccc;
}
.box94{ width:94%; margin: 0 auto; font-size:1.25rem;}


/*----- burger menu ----------------------------------------------------------*/
#nav-drawer {
  position: relative;
}

/*チェックボックス等は非表示に*/
.nav-unshown {
  display:none;
}

/*アイコンのスペース*/
#nav-open {
  display: inline-block;
  width: 30px;
  height: 22px;
  vertical-align: middle;
}

/*ハンバーガーの形をCSSで表現*/
#nav-open span, #nav-open span:before, #nav-open span:after {
  position: absolute;
  height: 3px;/*線の太さ*/
  width: 25px;/*長さ*/
  border-radius: 3px;
  background: #555;
  display: block;
  content: '';
  cursor: pointer;
}
#nav-open span:before {
  bottom: -8px;
}
#nav-open span:after {
  bottom: -16px;
}

/*閉じる用の薄黒箇所*/
#nav-close {
  display: none;
  position: fixed;
  z-index: 99;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  background: black;
  opacity: 0;
  transition: .3s ease-in-out;
}

/*メニューの中身*/
#nav-content {
  overflow: auto;
  position: fixed;
  top: 0;
  left: 0;
  z-index: 9999;
  width: 90%;
  max-width: 330px;/*最大幅（お好みで調整を）*/
  height: 100%;
  background: #fff;
  transition: .3s ease-in-out;
  -webkit-transform: translateX(-105%);
  transform: translateX(-105%);
}

/*チェックがついたら表示させる*/
#nav-input:checked ~ #nav-close {
  display: block;
  opacity: .5;
}

#nav-input:checked ~ #nav-content {
  -webkit-transform: translateX(0%);
  transform: translateX(0%);
  box-shadow: 6px 0 25px rgba(0,0,0,.15);
}
#nav-content ul li a{
	display:inline-block;
	width:90%;
	padding:10px 5%;
}
.header-logo-menu{
 display: flex;
 display: -moz-flex;
 display: -o-flex;
 display: -webkit-flex;
 display: -ms-flex;
 flex-direction: row;
 -moz-flex-direction: row;
 -o-flex-direction: row;
 -webkit-flex-direction: row;
 -ms-flex-direction: row;
}

/*ロゴやサイトタイトルをセンタリング*/
.logo-area{text-align:center;margin:auto;}

/*モバイル（スマホ/タブレット）だけで表示*/
@media screen and (min-width:767px) {
   
//     display:none;
   }
}


/*----- accordion ------------------------------------------------------------*/
.accordion-container {
  position: relative;
  width: 100%;
  border: 1px solid #005b3e;
  border-top: none;
  outline: 0;
  cursor: pointer
}

.accordion-container .accordion-title {
  display: block;
  position: relative;
  margin: 0;
  padding: 2px 0.2em 2px 2em;
  font-size: 1.0em;
  font-weight: normal;
  color: #fff;
  background: #005b3e;
  cursor: pointer;
}

.accordion-container .accordion-title:hover,
.accordion-container .accordion-title:active,
.accordion-container .content-entry.open .accordion-title {
  background-color: #00aaa7;
  color: white;
}

.accordion-container .accordion-title:hover i:before,
.accordion-container .accordion-title:hover i:active,
.accordion-container .content-entry.open i {
  color: white;
}

.accordion-title{
  position: relative;
}

.accordion-title:after {
  content: "";
  position: absolute;
  right: 25px;
  top: 38%;
  transition: all 0.2s ease-in-out;
  display: block;
  width: 8px;
  height: 8px;
  border-top: solid 2px #fff;
  border-right: solid 2px #fff;
  -webkit-transform: rotate(135deg);
  transform: rotate(135deg);
}

.accordion-title.open:after {
  -webkit-transform: rotate(-45deg);
  transform: rotate(-45deg);
  top: 45%;
}

.accordion-content {
  display: none;
//  padding-left: 2.3125em;
}

/* CSS for CodePen */
.accordion-container {
  width: 100%;
//  margin: 1.875em auto;
  margin: 0em auto;
}



/*----- h2 -------------------------------------------------------------------*/
/*
h2 {
  position: relative;
  color: #05834f;
  line-height: 1.4;
  -webkit-box-reflect: below -10px -webkit-linear-gradient(top,rgba(0,0,0,0),rgba(0,0,0,0) 10%,rgba(0, 0, 0, 0.6));
}
*/

h2 {
  position: relative;
  font-size:1.5rem;
  margin-bottom:1.2rem;
  padding: 0.2rem 0.5rem;
  background: #05834f;
  color: white;
  font-weight: normal;
 }

h2::before {
  position: absolute;
  content: '';
  top: 100%;
  left: 0;
  border: none;
  border-bottom: solid 15px transparent;
  border-right: solid 20px rgb(149, 158, 155);
}

/*
h2 {
  display:block;background: linear-gradient(transparent 70%, #05834f 70%);
}
*/
.h2_ttl{width:80%;float:left; padding-top:0.2rem;}
.h2_navi{width:20%;float:right; padding-top:0.1rem;}
.h2_btn{
	background: -moz-linear-gradient(top, #fce897, #fcc800);
	background: -webkit-gradient(linear, left top, left bottom, from(#fce897), to(#fcc800));
	background: -webkit-linear-gradient(top, #fce897, #fcc800);
	background: -o-linear-gradient(top, #fce897, #fcc800);
	background: linear-gradient(to bottom, #fce897, #fcc800);
	background: -ms-linear-gradient(top,  #fce897 0%,#fcc800 100%);
	filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#fce897', endColorstr='#fcc800',GradientType=0 ); /* IE6-9 */
	border-radius:8px;
	padding:6px 12px;
	border:#e6b800 solid 2px;
	font-size:1.1rem;
	color:#662c06 !important;
	text-decoration:none;
//	text-shadow: -1px -1px 1px #ffffff, 1px 1px #662c06;
	font-weight:bold;
	float:right;
}
.h2_btn:hover{
	background-color:#fce897;
	border-radius:8px;
	border:#e6b800 solid 2px;
	font-weight:bold;
	color:#222;
}


/*----- table ----------------------------------------------------------------*/
table{
    border-collapse: collapse;
    border-spacing:0;
}
.tr{border-bottom:#fff solid 3px;}
.th{width:27%; float:left; padding:6px 1.5%; background-color:#d1cdc4;}
.td{width:66%; float:left; padding:6px 1.5%; background-color:#f2f1ec; margin-left:1%;}


/*----- print ----------------------------------------------------------------*/
footer{ width:90%; margin:50px auto 10px; text-align:center; font-size:0.8rem; color:#493117;}
.topfooter{width:100%;text-align:center;color:#c5bfa9;font-size:0.8rem;}

/*----- color ----------------------------------------------------------------*/
.colG1{background-color:#006b3d; color:#fff;}  .colG1:hover{background-color:#006b3d; color:#fff;filter: brightness(150%);} 
.colG3{background-color:#009156; color:#fff;}  .colG3:hover{background-color:#009156; color:#fff;filter: brightness(150%);}
.colG5{background-color:#749900; color:#fff;}  .colG5:hover{background-color:#749900; color:#fff;filter: brightness(150%);}
.colG7{background-color:#80b500; color:#fff;}  .colG7:hover{background-color:#80b500; color:#fff;filter: brightness(150%);}
.colR1{background-color:#b50031; color:#fff;}  .colR1:hover{background-color:#b50031; color:#fff;filter: brightness(150%);}
.colR3{background-color:#d60000; color:#fff;}  .colR3:hover{background-color:#d60000; color:#fff;filter: brightness(150%);}
.colPi1{background-color:#d6008f; color:#fff;} .colPi1:hover{background-color:#d6008f; color:#fff;filter: brightness(150%);}
.colPi3{background-color:#f49df0; color:#fff;} .colPi3:hover{background-color:#f49df0; color:#fff;filter: brightness(150%);}
.colPi5{background-color:#f09a84; color:#fff;} .colPi5:hover{background-color:#f09a84; color:#fff;filter: brightness(120%);}
.colO1{background-color:#e36d4a; color:#fff;}  .colO1:hover{background-color:#e36d4a; color:#fff;filter: brightness(150%);}
.colO3{background-color:#f4aa29; color:#fff;}  .colO3:hover{background-color:#f4aa29; color:#fff;filter: brightness(150%);}
.colO5{background-color:#f2cb2a; color:#000;}  .colO5:hover{background-color:#f2cb2a; color:#000;filter: brightness(150%);}
.colPa1{background-color:#6e0089; color:#fff;} .colPa1:hover{background-color:#6e0089; color:#fff;filter: brightness(150%);}
.colPa3{background-color:#6b38f9; color:#fff;} .colPa3:hover{background-color:#6b38f9; color:#fff;filter: brightness(150%);}
.colPa5{background-color:#8363fc; color:#fff;} .colPa5:hover{background-color:#8363fc; color:#fff;filter: brightness(150%);}
.colB1{background-color:#00468b; color:#fff;}  .colB1:hover{background-color:#00468b; color:#fff;filter: brightness(150%);}
.colB3{background-color:#006ac1; color:#fff;}  .colB3:hover{background-color:#006ac1; color:#fff;filter: brightness(150%);}
.colB5{background-color:#4378b6; color:#fff;}  .colB5:hover{background-color:#4378b6; color:#fff;filter: brightness(150%);}
.colB7{background-color:#43a8b5; color:#fff;}  .colB7:hover{background-color:#43a8b5; color:#fff;filter: brightness(120%);}
.colW1{background-color:#008cff; color:#fff;}  .colW1:hover{background-color:#008cff; color:#fff;filter: brightness(150%);}
.colW3{background-color:#5cabf2; color:#fff;}  .colW3:hover{background-color:#5cabf2; color:#fff;filter: brightness(150%);}
.colW5{background-color:#66d0ed; color:#fff;}  .colW5:hover{background-color:#66d0ed; color:#fff;filter: brightness(150%);}
.colW7{background-color:#8fcfff; color:#000;}  .colW7:hover{background-color:#8fcfff; color:#000;filter: brightness(120%);}
.colK1{background-color:#000000; color:#fff;}  .colK1:hover{background-color:#000000; color:#fff;filter: brightness(150%);}
.colK3{background-color:#4d4d4d; color:#fff;}  .colK3:hover{background-color:#4d4d4d; color:#fff;filter: brightness(150%);}

/*----- page_top scroll btn --------------------------------------------------*/
#page_top{ width: 90px; height: 90px; position: fixed; right: 0; bottom: 0;
  background: #005b3e; opacity: 0.6; border-radius: 50%;
}
#page_top a{ position: relative; display: block; width: 90px; height: 90px; text-decoration: none; }
#page_top a::before{ font-family: 'Font Awesome 5 Free'; font-weight: 900;
  margin: auto; content: '\f102'; font-size: 25px; color: #fff; text-align: center;
  position: absolute; width: 25px; height: 25px; top: -40px; bottom: 0; right: 0; left: 0; 
}
#page_top a::after{
  content: 'PAGE TOP';
  font-size: 13px; color: #fff;
  position: absolute; top: 45px; bottom: 0; right: 0; left: 0;
  margin: auto; text-align: center;
}


/*----- print ----------------------------------------------------------------*/
.printOnly{display:none;}

/*----- list -----------------------------------------------------------------*/
.li_l{width:20%; float:left;padding: 6px 0 8px 0;}
.li_r{width:80%; float:left;padding: 6px 0 8px 0;}

.li_20{width:20%; float:left; padding: 6px 0 8px 0;}
.li_25{width:25%; float:left; padding: 6px 0 8px 0;}
.li_30{width:30%; float:left; padding: 6px 0 8px 0;}
.li_40{width:40%; float:left; padding: 6px 0 8px 0;}
.li_50{width:50%; float:left; padding: 6px 0 8px 0;}
.li_70{width:70%; float:left; padding: 6px 0 8px 0;}
.li_75{width:75%; float:left; padding: 6px 0 8px 0;}
.li_80{width:80%; float:left; padding: 6px 0 8px 0;}


/*----- photo ----------------------------------------------------------------*/
.photo_now{width:200px; float:left;}
.photo_school{width:160px; float:right; margin-top:53px;}

.hissu_mark{display:inline-block; line-height:1.0em;border:#d50002 solid 2px;color:#d50002;margin-right:8px;padding:2px 6px;font-size:1.0rem;font-weight:bold;}

/*----- form -----------------------------------------------------------------*/
.button_o{
	background: -moz-linear-gradient(to bottom,#FFF,#FFC778 30%,#F89174);
	background: -webkit-gradient(linear, left top, left bottom, from(#ffa366), to(#ff700f));
	background: -webkit-linear-gradient(to bottom,#FFF,#FFC778 30%,#F89174);
	background: -o-linear-gradient(top, #ffa366, #ff700f);
	background: linear-gradient(to bottom,#FFF,#FFC778 30%,#F89174);
	background: -ms-linear-gradient(top,  #ffa366 0%,#ff700f 100%);
	filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#ffa366', endColorstr='#ff700f',GradientType=0 ); /* IE6-9 */
	border:#cc590c 1px solid;
	border-radius: 5px;
	-webkit-border-radius: 5px;
	-moz-border-radius: 5px;
	color:#ffffff;
	font-weight:bold;
	text-align:center;
	cursor: pointer;
	text-decoration: none;
}
.button_o:hover{
	opacity:0.9;
}
.button_g{
	background: -moz-linear-gradient(to bottom,#FFF,#efefef 30%,#cccccc);
	background: -webkit-gradient(linear, left top, left bottom, from(#efefef), to(#cccccc));
	background: -webkit-linear-gradient(to bottom,#FFF,#efefef 30%,#cccccc);
	background: -o-linear-gradient(top, #efefef, #cccccc);
	background: linear-gradient(to bottom,#FFF,#efefef 30%,#cccccc);
	background: -ms-linear-gradient(top,  #efefef 0%,#cccccc 100%);
	filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#efefef', endColorstr='#cccccc',GradientType=0 ); /* IE6-9 */
	border:#aaaaaa 1px solid;
	border-radius: 5px;
	-webkit-border-radius: 5px;
	-moz-border-radius: 5px;
	color:#333333;
	font-weight:bold;
	text-align:center;
	cursor: pointer;
	text-decoration: none;
}
.button_g:hover{
	opacity:0.9;
}
.btn_confirm{display:inline-block;margin:0 auto;padding:16px 2em;font-size:1.1rem;}

::placeholder { color: #aaa; }

input[type="text"], input[type="email"], input[type="tel"]{
	display: inline-block;
	margin: 5px 0;
	border-radius: 3px;
	border: 1px solid #adadad;
	padding: 5px;
	box-sizing: border-box;
	appearance: none;
	background: #f8f8f8;
	font-size:1.1rem;
}
select { font-size:1.1rem; }
textarea { font-size:1.1rem; }

.key1{display:inline-block;float:left;width:12%; margin-left:1%; margin-bottom:12px; padding:6px 1%;}
.key3{display:inline-block;float:left;width:29%; margin-left:1%; margin-bottom:12px; padding:6px 1%;}
.key5{display:inline-block;float:left;width:45%; margin-left:1%; padding:6px 1%;}
.inputw94{width:94%;margin:0 auto;}
.inputw47{width:47%;margin:0 auto;}
.inputwsep3{width:20%;margin:0 auto;}
.inputw25{width:25%;margin:0 auto;}
.input_note{font-size:0.95rem;}


/*-----  -----------------------------------------------------------------*/
dl.trigger > dt:hover {
  cursor:pointer;
  opacity: .6;
}

dl.trigger > dd {
  display: none;
}


/*-----  -----------------------------------------------------------------*/
@media screen and ( max-width: 1500px ){
}
@media screen and ( max-width: 1079px ){
	footer { padding-top: 20px; }
	.li_l{width:30%; float:left;padding: 6px 0 8px 0;}
	.li_r{width:70%; float:left; 6px 0 8px 0;}
}
@media screen and ( max-width: 768px ){
	html{ font-size:18px; }
	.h2_ttl{width:75%;float:left;}
	.h2_navi{width:25%;float:right;}
	.h2_btn{ padding:6px 6px; font-size:1.05rem; }
	.li_l{width:100%; float:none; 6px 0 8px 0;}
	.li_r{width:95%; float:none; paddig:  6px 0 8px 5%;}
	.box94{ width:94%; margin: 0 auto; font-size:1.15rem;}
	.th{width:97%; float:none; padding:4px 1.5%; background-color:#d1cdc4;}
	.td{width:97%; float:none; padding:4px 1.5%; background-color:#f2f1ec; margin-left:0%;}
	.inputw94{width:98%;margin:0 auto;}
	.inputw25{width:47%;margin:0 auto;}
	.btn_confirm{ display:block; width:80%; margin:0 auto; }
	.btn_back{ display:block; width:80%; margin:0 auto; }
}
@media screen and ( max-width: 480px ){
	.key1{display:inline-block;float:left;width:20%; margin-left:1%; margin-bottom:12px; padding:6px 1%;}
	.key3{display:inline-block;float:left;width:26%; margin-left:1%; margin-bottom:12px; padding:6px 0;}
	.key5{display:inline-block;float:left;width:45%; margin-left:1%; padding:6px 0.5%;}
	.photo_now{width:35%; float:left;}
	.photo_school{width:30%; float:right;margin-top:20px;}
}

@media print{
	.printOnly{display:block;}
}
