@charset "UTF-8";
@import url(https://fonts.googleapis.com/css?family=Open+Sans);

/*================================================
 *  CSSリセット
 ================================================*/
html,body,div,span,object,iframe,h1,h2,h3,h4,h5,h6,p,blockquote,pre,abbr,address,cite,code,del,dfn,em,img,ins,kbd,q,samp,small,strong,sub,sup,var,b,i,dl,dt,dd,ol,ul,li,fieldset,form,label,legend,table,caption,tbody,tfoot,thead,tr,th,td,article,aside,canvas,details,figcaption,figure,footer,header,hgroup,main,menu,nav,section,summary,time,mark,audio,video{margin:0;padding:0;border:0;outline:0;font-size:100%;vertical-align:baseline;background:transparent;font-weight:normal;}body{line-height:1}article,aside,details,figcaption,figure,footer,header,hgroup,menu,nav,section{display:block}ul{list-style:none}blockquote,q{quotes:none}blockquote:before,blockquote:after,q:before,q:after{content:none}a{margin:0;padding:0;font-size:100%;vertical-align:baseline;background:transparent}del{text-decoration:line-through}abbr[title],dfn[title]{border-bottom:1px dotted;cursor:help}table{border-collapse:collapse;border-spacing:0}hr{display:block;height:1px;border:0;border-top:1px solid #ccc;margin:1em 0;padding:0}input,select{vertical-align:middle}

/*================================================
 *  一般・共通設定
 ================================================*/
body {
	font-size:14px;
	font-family:"メイリオ",Meiryo,"ヒラギノ角ゴ Pro W3","Hiragino Kaku Gothic Pro",Osaka,"ＭＳ Ｐゴシック","MS PGothic",sans-serif;
	line-height:1.6;
}

fieldset {
  border: none;
  padding: 0;
  margin: 0;
  text-align: center;
}

header {
	width:100%;
	height:400px;
}

#contents {
	width:980px;
	margin:0 auto;
}

a {
	color:#043771;
}
a:hover {
	color:#144d8d;
}

h1 {
	font-size:28px;
}

h2 {
	margin-top:50px;
	margin-bottom:0.5em;
	font-size:30px;
	color:#333;
	text-align:center;
}

h3 {
	margin-bottom:0.25em;
	font-size:16px;
}

h4 {
	margin-bottom:0.25em;
	font-size:16px;
}

h5 {
	margin-bottom:0.25em;
	padding-left:25px;
	font-size:16px;
	background:url('../images/bg_arrow_black.png') 0 50% no-repeat;
}

h6 {
	margin-bottom:0.25em;
	padding-left:5px;
	font-size:16px;
	font-weight:bold;
}

h7 {
	margin-top:50px;
	font-size:30px;
	color:#333;
	text-align:center;
}

h8 {
    color: #505050;/*文字色*/
    padding: 0.5em;/*文字周りの余白*/
    display: inline-block;/*おまじない*/
    line-height: 1.3;/*行高*/
    background: #dbebf8;/*背景色*/
    vertical-align: middle;
    border-radius: 25px 0px 0px 25px;/*左側の角を丸く*/
}

h8:before {
    content: '●';
    color: white;
    margin-right: 8px;
}

p {
	margin:0 0 1em 0;
}

img {
	vertical-align:bottom;
}

em {
	font-weight:bold;
}

strong {
	font-weight:bold;
	color:#ff0000;
}

pre {
	margin:1em 0;
	padding:1em;
}

blockquote {
	margin-bottom:1em;
	padding:1em;
	border:1px dotted #ddd;
	border-left:5px solid #ddd;
}

/*
ul,ol,dl {
	margin:0 0 1em 0;
}
ul li {
	list-style:disc;
}
ol li {
	list-style:decimal;
}
li {
	margin-left:2em;
}
*/

dt {
	margin-bottom:0.5em;
	border-bottom:1px dotted #ddd;
}
dd {
	margin-bottom:1em;
}

table {
	width:100%;
	margin-bottom:1em;
	border-collapse:collapse;
	border:1px solid #ddd;
}
th {
	padding:10px;
	text-align:center;
	vertical-align:middle;
	border:1px solid #ddd;
	background:#f1f1f1;
}
td {
	padding:10px;
	text-align:left;
	border:1px solid #ddd;
}
input[type="text"] {
  width: 100%;
  height: 36px;
  background: #FFF;
  border: 1px solid #bebebe;
  font-size: 1em;
  text-indent: 0.7em;
}
input[type="text"]:focus {
  background: #edf4ff;
  border: 1px solid #4881d9;
}
input[type="email"] {
  width: 100%;
  height: 36px;
  background: #FFF;
  border: 1px solid #bebebe;
  font-size: 1em;
  text-indent: 0.7em;
}
input[type="email"]:focus {
  background: #edf4ff;
  border: 1px solid #4881d9;
}
input[type="password"] {
  width: 100%;
  height: 36px;
  background: #FFF;
  border: 1px solid #bebebe;
  font-size: 1em;
  text-indent: 0.7em;
}
input[type="password"]:focus {
  background: #edf4ff;
  border: 1px solid #4881d9;
}
input[type="date"] {
  width: 215px;
  height: 36px;
  background: #FFF;
  border: 1px solid #bebebe;
  font-size: 1em;
  text-indent: 0.7em;
}
input[type="date"]:focus {
  background: #edf4ff;
  border: 1px solid #4881d9;
}
input[type="radio"]{
  display: none;
}

input#submit_button {
    padding: 15px 40px;
    font-size: 1.2em;
    // 背景色を黒に指定
    background-color: #04B404;
    // 文字色を白に指定
    color: #fff;
    // submitボタンのを枠を非表示にする
    border-style: none;
}
.select-box01 select {
	width: 100%;
	padding: 10px;
	-webkit-appearance: none;
	-moz-appearance: none;
	appearance: none;
	border: 1px solid #999;
	background: #eee;
	background: url(arrow01.png) right 50% no-repeat, -webkit-linear-gradient(top, #fff 0%,#efebe1 100%);
	background: url(arrow01.png) right 50% no-repeat, linear-gradient(to bottom, #fff 0%,#efebe1 100%);
	background-size: 20px, 100%;
}
input[type="checkbox"] {
  display: none;
}
label {
  position: relative;
  display: inline-block;
  padding: 3px 3px 3px 22px;
  cursor: pointer;
}
label::before {
  position: absolute;
  content: '';
  top: 50%;
  left: 0;
  width: 14px;
  height: 14px;
  margin-top: -8px;
  background: #eee;
  border: 1px solid #bebebe;
}
input[type="checkbox"]:checked + label::after {
  position: absolute;
  content: '';
  top: 5px;
  left: 3px;
  width: 13px;
  height: 5px;
  border-left: 2px solid #3498db;
  border-bottom: 2px solid #3498db;
  -webkit-transform: rotate(-45deg);
  transform: rotate(-45deg);
}
.midashi{
    position: relative;
    background: #dfefff;
    box-shadow: 0px 0px 0px 5px #dfefff;
    border: dashed 2px white;
    padding: 0.2em 0.5em;
    color: #454545;
}
.midashi:after{
    position: absolute;
    content: '';
    left: -7px;
    top: -7px;
    border-width: 0 0 15px 15px;
    border-style: solid;
    border-color: #fff #fff #a8d4ff;
    box-shadow: 1px 1px 1px rgba(0, 0, 0, 0.15);
}
/*================================================
 *  汎用クラス
 ================================================*/
/* 写真中央寄せ */
.imgC {
	clear:both;
	overflow:hidden;
	margin-bottom:50px;
	text-align:center;
}
.imgC img {
	border-radius:5px;
	margin-bottom:0.5em;
}

/* 写真左寄せ */
.imgL {
	clear:both;
	overflow:hidden;
	margin-bottom:50px;
    background-color:#FFF;
    border: solid 1px #777;
}
.imgL img {
	float:left;
	margin:0 1em 0.5em 0;
	border-radius:5px;
}
.imgL p {
	float:right;
	margin:1em 1em 0.5em 0em;
	border-radius:5px;
}
.imgL p1 {
	float:right;
	margin:0.5em 1em 0.5em 0em;
	border-radius:5px;
}

/* 写真右寄せ */
.imgR {
	clear:both;
	overflow:hidden;
	margin-bottom:50px;
    background-color:#FFF;
}
.imgR img {
	float:right;
	margin:0 0 1em 0.5em;
	border-radius:5px;
}

/* 2カラム（スマートフォンでは1カラム) */
.twoCol {
	overflow:hidden;
	margin-bottom:50px;
}
.twoColInner {
	overflow:hidden;
	margin-right:-2%;
    text-align: center;
}
.twoColInner div {
	width:48%;
	float:left;
	margin-right:1.5%;
    margin-bottom:1%;
    border: solid 1px #848484;
}
.twoColInner div:nth-child(2n+1) {
	clear:both;
}
.twoColInner img {
	height: 300px;
    margin-top:0.5em;
	margin-bottom:0.5em;
}

/* 2カラム バージョン2（スマートフォンでは1カラム) */
.twoCol2 {
	overflow:hidden;
	margin-bottom:50px;
}
.twoCol2Inner {
	overflow:hidden;
	margin-right:-2%;
    	text-align: center;
}
.twoCol2Inner div {
	width:48%;
	float:left;
	margin-right:1.5%;
    	margin-bottom:1%;
    	border: solid 1px #FFFFFF;
}
.twoCol2Inner div:nth-child(2n+1) {
	clear:both;
}
.twoCol2Inner img {
	height: 200px;
      margin-top:0.5em;
	margin-bottom:0.5em;
}

/* 3カラム（スマートフォンでは1カラム) */
.threeCol {
	overflow:hidden;
	margin-bottom:50px;
}
.threeColInner {
	overflow:hidden;
	margin-right: -2%;
    text-align: center;
}
.threeColInner div {
	width:31%;
	float:left;
	margin-right:2%;
    margin-bottom:1%;
    border: solid 1px #848484;
}
.threeColInner div:nth-child(3n+1) {
    clear:both;
}
.threeColInner img {
    height: 200px;
    margin-top:0.5em;
	margin-bottom:0.5em;
	/*border-radius:5px;*/
}

/* 3カラム バージョン2（スマートフォンでは1カラム) */
.threeCol2 {
	overflow:hidden;
	margin-bottom:50px;
}
.threeCol2Inner {
	overflow:hidden;
	margin-right: -2%;
    text-align: center;
}
.threeCol2Inner div {
	width:31%;
	float:left;
	margin-right:2%;
    margin-bottom:1%;
    border: solid 0px #848484;
}
.threeCol2Inner div:nth-child(3n+1) {
    clear:both;
}
.threeCol2Inner img {
   	width: 300px;
   	margin-top:0.5em;
	margin-bottom:0.5em;
	/*border-radius:5px;*/
}
/* スクール表示 */
.imgSchool {
	clear:both;
	overflow:hidden;
	margin-bottom:20px;
    background-color:#FFF;
    border: solid 1px #777;
}
/* ボタン（タイプ1） */
.btn01 a {
	display:block;
	padding:2% 2% 2% 50px;
	color:#fff;
	text-decoration:none;
    text-align:center;
	border-radius:5px;
	background:#04B404 url('../images/bg_arrow_white.png') 20px 50% no-repeat;
	transition:all 0.2s ease 0s;
}
.btn01 a:hover {
	background:#01DF01 url('../images/bg_arrow_white.png') 20px 50% no-repeat;
	transition:all 0.2s ease 0s;
}

/* ボタン（タイプ2） */
.btn02 a {
	display:block;
	padding:2%;
	color:#1b1b1b;
	text-decoration:none;
	border-radius:5px;
	border:1px solid #1b1b1b;
	background:#fff;
	transition:all 0.2s ease 0s;
}
.btn02 a:hover {
	color:#fff;
	background:#1b1b1b;
	transition:all 0.2s ease 0s;
}

/* ボタン（タイプ3） */
.btn03 a {
	display:block;
	padding:2% 2% 2% 50px;
	color:#fff;
	text-decoration:none;
	border-radius:5px;
	background:#2E64FE url('../images/bg_arrow_white.png') 20px 50% no-repeat;
	transition:all 0.2s ease 0s;
}
.btn03 a:hover {
	background:#819FF7 url('../images/bg_arrow_white.png') 20px 50% no-repeat;
	transition:all 0.2s ease 0s;
}

/* ボタン（タイプ4） */
.btn04 a {
	display:block;
    width: 150px;
    height: 22px;
	color:#fff;
	text-decoration:none;
    text-align:center;
	border-radius:5px;
	background:#2E64FE;
	transition:all 0.2s ease 0s;
    padding: 15px 0px;
}
.btn04 a:hover {
	background:#819FF7 20px 50% no-repeat;
	transition:all 0.2s ease 0s;
}

/* ボタン（タイプ5） */
.btn05 a {
	display:block;
    width: 350px;
    height: 22px;
	color:#fff;
	text-decoration:none;
    text-align:center;
	border-radius:5px;
	background:#4c4c4c;
	transition:all 0.2s ease 0s;
    padding: 15px 0px;
}
.btn05 a:hover {
	background:#7f7f7f 20px 50% no-repeat;
	transition:all 0.2s ease 0s;
}

/* ボタン（タイプ6） */
.btn06 a {
	display:block;
    width: 350px;
    height: 22px;
	color:#fff;
	text-decoration:none;
    text-align:center;
	border-radius:5px;
	background:#04B404;
	transition:all 0.2s ease 0s;
    padding: 15px 0px;
}
.btn06 a:hover {
	background:#01DF01 20px 50% no-repeat;
	transition:all 0.2s ease 0s;
}

/* ボタン（タイプ7） */
.btn07 a {
	display:block;
	padding:2%;
	color:#1b1b1b;
	text-decoration:none;
	border-radius:5px;
	border:1px solid #1b1b1b;
	background:#F6CECE;
	transition:all 0.2s ease 0s;
    margin-left: 0.5em;
    margin-right: 0.5em;
}
.btn07 a:hover {
	color:#fff;
	background:#F8E0E0;
	transition:all 0.2s ease 0s;
}

/* ボタン（タイプ8） */
.btn08 a {
	display:block;
	padding:2%;
	color:#1b1b1b;
	text-decoration:none;
	border-radius:5px;
	border:1px solid #1b1b1b;
	background:#fff;
	transition:all 0.2s ease 0s;
    margin-left: 0.5em;
    margin-right: 0.5em;
}
.btn08 a:hover {
	color:#fff;
	background:#FA5858;
	transition:all 0.2s ease 0s;
}

/* ボタン（タイプ9） */
.btn09 a {
	display:block;
    width: 200px;
    height: 20px;
	color:#fff;
	text-decoration:none;
    text-align:center;
	border-radius:1px;
	background:#04B404;
	transition:all 0.2s ease 0s;
    padding: 15px 0px;
}
.btn09 a:hover {
	background:#01DF01 20px 50% no-repeat;
	transition:all 0.2s ease 0s;
}

/* ボタン（タイプ10） */
.btn10 a {
	display:block;
    width: 200px;
    height: 20px;
	color:#fff;
	text-decoration:none;
    text-align:center;
	border-radius:1px;
	background:#2E64FE;
	transition:all 0.2s ease 0s;
    padding: 15px 0px;
}
.btn10 a:hover {
	background:#819FF7 20px 50% no-repeat;
	transition:all 0.2s ease 0s;
}

/*================================================
 *  ヘッダー
 ================================================*/
header {
	position:relative;
}
header h1 {
	position:absolute;
	top:0;
	left:0;
	right:0;
	bottom:0;
	margin:auto;
	width:200px;
	height:200px;
	z-index:10;
}

/*================================================
 *  グローバルナビゲーション
 ================================================*/
nav {
	width:100%;
	position:fixed;
	top:0;
	left:0;
	padding:10px 0;
	opacity:0.8;
	background:#000;
	z-index:10;
}
nav ul {
	position:relative;
	float:left;
	left:50%;
	margin:0;
}
nav li {
	position:relative;
	left:-50%;
	float:left;
	list-style:none;
	margin:0;
	padding:0 20px;
}
nav li a {
	color:#fff;
	text-decoration:none;
}
nav li a:hover {
	color:#dfdfdf;
	text-decoration:underline;
}

/*================================================
 *  メイン
 ================================================*/
main {
	width:100%;
}

section {
	margin-bottom:10%;
}

/*================================================
 *  フッター
 ================================================*/
footer {
	clear:both;
	padding:7px 0;
	font-size:11px;
	text-align:center;
    background-color:darkblue;
    color:white;
}

/*================================================
 *  ページトップへの戻り
 ================================================*/
.totop {
	position:fixed;
	bottom:15px;
	right:15px;
}
.totop a {
	display:block;
	text-decoration:none;
}
.totop img {
	background:#000;
}
.totop img:hover {
	background:#333;
}

/*================================================
 *  スライドショー
 ================================================*/
.slide {
	overflow:hidden;
	position:relative;
}
.slideInner {
	list-style:none;
	margin:0;
	padding:0;
}
.slideInner li {
	position:absolute;
	width:100%;
	margin:0;
	padding:0;
	background-color:#fff;
	background-position:50% 0;
	background-repeat:no-repeat;
}

/*================================================
 *  タブレット向けデザイン
 ================================================*/
/* スクロールバーを考慮して20px大きいサイズで切り替え */
@media screen and (max-width:979px) {
	#contents {
		box-sizing:border-box;
		width:100%;
		padding:0 10px;
	}
}

/*================================================
 *  スマートフォン向けデザイン
 ================================================*/
@media screen and (max-width:767px) {
	h2 {
		margin-top:30px;
	}

	.imgC {
		margin-bottom:30px;
	}
	.imgC img {
		max-width:100%;
	}

	.imgL {
		margin-bottom:30px;
	}
	.imgL img {
		float:none;
		max-width:100%;
		margin-right:0;
	}

	.imgR {
		margin-bottom:30px;
	}
	.imgR img {
		float:none;
		max-width:100%;
		margin-left:0;
	}

	.twoCol {
		margin-right:0;
		margin-bottom:30px;
	}
	.twoColInner {
		margin-right:0;
	}
	.twoColInner div {
		float:none;
		width:100%;
	}

	.threeCol {
		margin-bottom:30px;
	}

	.threeColInner {
		margin-right:0;
	}
	.threeColInner div {
		float:none;
		width:100%;
	}
}

/*================================================
 *  ラジオボタンデザイン
 ================================================*/
.radio {
	display: none;
}

.radio + .radio_image {
	border: 3px #ffffff solid;
	background-color: #ffffff;
}
.radio:checked + .radio_image {
	border: 3px #ff0000 solid;
	background-color: #ffeeee;
}


/*================================================
 *  メニューリストデザイン
 ================================================*/
.msr_newslist01 {
  border-top: 1px solid #AAAAAA;
  width: 100%;
}
.msr_newslist01 li {
  border-bottom: 1px solid #AAAAAA;
  font-size: 14px;
}
.msr_newslist01 li a {
  box-sizing: border-box;
  color: #000000;
  display: table;
  padding: 10px;
  text-decoration: none;
  transition: 0.2s ease-in-out;
  -o-transition: 0.2s ease-in-out;
  -moz-transition: 0.2s ease-in-out;
  -webkit-transition: 0.2s ease-in-out;
  width: 100%;
}
.msr_newslist01 li a:hover {
  background: #EEEEEE;
  text-decoration: none;
}
.msr_newslist01 li div {
  display: table-cell;
  width: 230px;
}
.msr_newslist01 li p {
  display: table-cell;
  padding-left: 20px;
  vertical-align: middle;
}

/* 時間の設定 */
.msr_newslist01 li time {
  display: table-cell;
  vertical-align: top;
  width: 150px;
}

/* カテゴリの設定 */
.msr_newslist01 li .cat01,
.msr_newslist01 li .cat02,
.msr_newslist01 li .cat03,
.msr_newslist01 li .cat04,
.msr_newslist01 li .cat05,
.msr_newslist01 li .cat06 {
  background-color: #FF0000;
  border-radius: 7px;
  color: #FFFFFF;
  font-size: 9px;
  font-weight:bold;
  padding: 0 2px;
  text-align: center;
  width: 110px;
}
.msr_newslist01 li .cat02 {
  background-color: #0000FF;
}
.msr_newslist01 li .cat03 {
  background-color: #808000;
}
.msr_newslist01 li .cat04 {
  background-color: #800080;
}
.msr_newslist01 li .cat05 {
  background-color: #008000;
}
.msr_newslist01 li .cat06 {
  background-color: #808080;
}



/** Custom Select **/
.custom-select-wrapper {
  position: relative;
  display: inline-block;
  user-select: none;
}
  .custom-select-wrapper select {
    display: none;
  }
  .custom-select {
    position: relative;
    display: inline-block;
  }
    .custom-select-trigger {
      position: relative;
      display: block;
      width: 130px;
      padding: 0 84px 0 22px;
      font-size: 22px;
      font-weight: 300;
      color: #fff;
      line-height: 60px;
      background: #5c9cd8;
      border-radius: 4px;
      cursor: pointer;
    }
      .custom-select-trigger:after {
        position: absolute;
        display: block;
        content: '';
        width: 10px; height: 10px;
        top: 50%; right: 25px;
        margin-top: -3px;
        border-bottom: 1px solid #fff;
        border-right: 1px solid #fff;
        transform: rotate(45deg) translateY(-50%);
        transition: all .4s ease-in-out;
        transform-origin: 50% 0;
      }
      .custom-select.opened .custom-select-trigger:after {
        margin-top: 3px;
        transform: rotate(-135deg) translateY(-50%);
      }
  .custom-options {
    position: absolute;
    display: block;
    top: 100%; left: 0; right: 0;
    min-width: 100%;
    margin: 15px 0;
    border: 1px solid #b5b5b5;
    border-radius: 4px;
    box-sizing: border-box;
    box-shadow: 0 2px 1px rgba(0,0,0,.07);
    background: #fff;
    transition: all .4s ease-in-out;
    
    opacity: 0;
    visibility: hidden;
    pointer-events: none;
    transform: translateY(-15px);
  }
  .custom-select.opened .custom-options {
    opacity: 1;
    visibility: visible;
    pointer-events: all;
    transform: translateY(0);
  }
    .custom-options:before {
      position: absolute;
      display: block;
      content: '';
      bottom: 100%; right: 25px;
      width: 7px; height: 7px;
      margin-bottom: -4px;
      border-top: 1px solid #b5b5b5;
      border-left: 1px solid #b5b5b5;
      background: #fff;
      transform: rotate(45deg);
      transition: all .4s ease-in-out;
    }
    .option-hover:before {
      background: #f9f9f9;
    }
    .custom-option {
      position: relative;
      display: block;
      padding: 0 22px;
      border-bottom: 1px solid #b5b5b5;
      font-size: 18px;
      font-weight: 600;
      color: #b5b5b5;
      line-height: 47px;
      cursor: pointer;
      transition: all .4s ease-in-out;
    }
    .custom-option:first-of-type {
      border-radius: 4px 4px 0 0;
    }
    .custom-option:last-of-type {
      border-bottom: 0;
      border-radius: 0 0 4px 4px;
    }
    .custom-option:hover,
    .custom-option.selection {
      background: #f9f9f9;
    }