@charset "utf-8";
/* CSS Document */
body{
	font-family: 'Noto Serif JP', serif;
font-family: 'Playfair Display', serif;
	letter-spacing: 5px;
line-height:1.5;
	margin: 0 auto;
	text-align: center;
}
#loader-bg {
  display: none;
  position: fixed;
  width: 100%;
  height: 100%;
  top: 0px;
  left: 0px;
  background: #000;
  z-index: 1;
}
#loader {
  display: none;
  position: fixed;
  top: 50%;
  left: 50%;
  width: 200px;
  height: 200px;
  margin-top: -100px;
  margin-left: -100px;
  text-align: center;
  color: #fff;
  z-index: 2;
}
#wape{
    text-align: center;
    color: #3261AB;
    line-height: 1.5;
}
h1{
		padding: 10px auto;
	}
	 h1 img{
		margin:45px auto;
		 padding-top: 40px;
		
	}
#sabu h1 img{margin: 20px auto;
padding-top: 15px;
width: 20%;height: 35vh;}
#bg_2{
	background-image: url("../image/3700437_m.jpg");
	background-repeat: no-repeat;
	background-size: cover;
height: 70vh;
}
.border_1{
	border: 5px dotted #fff;
	border-radius: 40px;
	width: 20%;
	padding: 2%;
	margin: 0 auto;
}
.border_1 a{padding: 25%;
color: #55CAFF;}
.border_1 a:hover{color: #fff;}
main{margin: auto 3%;}
#bg{
	background-image: url("../image/3700437_m.jpg");
	background-size: cover;
height: 135vh;}

h2,h3{
    font-size: 40px;
    margin: 2%;
	padding-top: 20px;
    font-weight: bold;
}
nav li a {
  text-decoration: none;
  color: #fff;
  font-weight: bold;
}
nav li a:hover {
  text-decoration: none;
  color: #2948FF;
  font-weight: bold;
}

.basic3 {
	box-shadow: 0 10px 25px 0 rgba(60, 194, 235, 0.5);}
		#fade{
			display: none;
		}
.news{
	margin: 50px auto;
	width: 90%;margin-top: 50px;
	background:linear-gradient(90deg, rgba(22, 135, 237, 0.3), rgba(20, 55, 90, 0.4)), url("../image/1393890.jpg");
	background-size: cover;
	border-radius:15px;
	color: #fff;
	}
.news tr,td{
    width: 80%;
    height: 10vh;
    vertical-align : middle;
}
.kari tr td{
	
	width: 25%;
	height: 15vh;
}
.border_bottom{ border-bottom: 3px dashed rgba(250,250,250,0.7);
height: 25vh;}

/*フォントサイズ*/
li,a,p,tr,td{
	font-size: 25px;
}
p{ letter-spacing: 0;
	margin: 10px auto;
}
figcaption{font-size: 28px;} 
/*テーブル用フォント*/
.emphasis{
	font-family: 'Noto Serif JP', serif;
	font-size: 20px;}
/*フッター関連*/
.flex{display: flex;}

.sns .flex{
justify-content: space-between;
flex-wrap: wrap;}
.sns{
	width: 60%;
	margin: 0 auto;
	padding: 50px;}
.sns li{
	list-style-type: none;
}
.footer_nav ul {margin: 20px auto;
	padding: 25px 8%;
	 list-style: none;
  overflow: hidden;
}
footer{background-color: #99CFE5;}

/*背景*/
 .bg_1{background-image:  url(../image/796723.png),url(../image/star.png),url("../image/starornament.png");
  background-position: left bottom,left top,right top;
  background-repeat: no-repeat;
	 padding-top:5%;
	 padding-bottom: 20%;
	
	
	/*background-image: url("../image/bg_1_s.png");
	background-size:cover;
	background-position: left top;
	background-repeat: no-repeat;*/
	
}
.bg_1 h2{ padding:60px 5% 10px;}
.bg_1 p{margin: 40px auto;
width: 700px;}

.title_bg h2{padding: 120px 5% 20px;}
.title_bg .title_haba section{
	width: 70%;
	margin: 0 auto;
	border: 3px dashed #2399EA;
	padding-top: 10px;
	border-radius: 30px;
	padding-bottom: 10px;
	margin-top: 20px;
	margin-bottom: 20px;
}
.title_bg .title_haba{padding-bottom: 50px;
margin-bottom: 20px;}
.title_bg .title_haba p{width: 50%;
	margin: 0 auto;
}
.title_bg .title_haba h3{width: 80%;margin: 0 auto;}
.bg_2{
	
	background-image: url("../image/bg_3.png");
	background-size: contain;
	background-repeat: no-repeat;
	padding-top: 13%;
	padding-bottom: 30%;
		
}
.bg_2 h2{
	padding: 50px 5% 25px;
}
.bg_2 p{
	width: 550px;
	margin: 0 auto 20px;
}
.btn,
a.btn,
button.btn {
  font-size: 1.3rem;
  font-weight: 500;
  line-height: 1.5;
  position: relative;
  display: inline-block;
  padding: 10px 2%;
  cursor: pointer;
  -webkit-user-select: none;
  -moz-user-select: none;
  -ms-user-select: none;
  user-select: none;
  -webkit-transition: all 0.3s;
  transition: all 0.3s;
  text-align: center;
  vertical-align: middle;
  text-decoration: none;
  letter-spacing: 0.1em;
  color: #212529;
  border-radius: 0.5rem;
}
.btn--orange,
a.btn--orange {
  color: #fff;
  background-color: #eb6100;
}
.btn--orange:hover,
a.btn--orange:hover {
  color: #fff;
  background: #f56500;
}
a.btn--radius {
  border-radius: 90vh;
}
.bg_3{
	margin-top: 50px;
}

/*フルード*/

.fruid{/*親要素とセットでフルードイメージ化。祖先要素の＃width: 100%;が画像の幅をコントロールしている形になっている*/
	width: 100%;
}
.fruid img{
	width: 50%;
}

.sns ul li a:hover{opacity: 0.6;}
/*TOPへボタン*/
#tope {
    position: fixed;
    bottom: 5px;
    right: 5px;
	width:40px;
	height: 40px;
    background-image: url(../image/2006649.svg);
}
#tope a{
	position: relative;
	display: block;
	width: 45px;
	height: 40px;
	text-decoration: underline;
	color: #FFF152;
}
#tope a::before{
  font-family: 'Font Awesome 5 Free';
  font-weight: 900;
  content: '\f062';
  font-size: 20px;
  color: #0077FF;
  position: absolute;
  width: 30px;
  height: 40px;
  top: 2px;
  bottom: 0;
  right: 0;
  left: 0px;
  margin: auto;
  text-align: center;
}
/*アニメーション*/

/* 画面外にいる状態 */
.fadein {
	opacity : 0.1;
	transform : translate(0, 50px);
	transition : all 800ms;
	}

/* 画面内に入った状態 */
.fadein.scrollin {
	opacity : 1;
	transform : translate(0, 0);
	}

/**
 * 共通スタイル
 */
.l-wrapper {
  padding-bottom: 50px;
}

.c-container {
  position: relative;
  margin-left: auto;
  margin-right: auto;
  max-width: 1000px;
  padding: 0 15px;
}

.l-header-inner {
  display: flex;
  justify-content: space-between;
  padding-top: 10px;
  padding-bottom: 10px;
}

.l-header-logo,
.l-header-logo a { font-size: 2.0rem; text-decoration: none; }
.l-header-logo a:hover { text-decoration: underline; color: #2196f3; }


@media (max-width: 768px){


}
@media (min-width: 768px){
	.midasi_clor h1 {
    font-size: 30px;
    
    font-weight: bold;	background-color: #99CFE5}
	
	
	.none2{display: none}
	header,nav,main,footer,img {
		overflow: hidden;
    
}
	
	body{
		margin: 0 auto;
		
	}
	.header_nav nav {
	margin: 0.1% 5%;
  list-style: none;
  overflow: hidden;
}
nav li {
  width: 25%;
  text-align: center;
  background-color: #99CFE5;
  float: left;
}
 

	
	/*nav li{margin: 0 20px;;
		width: 340px;}
	nav .footer_nav li{
		width: 200px;*/
	.text_left{
		
		text-align: start;
		word-break: break-all;
		
	}
}
@media (max-width: 500px){
	.none1{display: none}
	.none {display:none}
	#wape{width: 100%;
		text-align: center;
	}
	.border_2{
	border: 5px dotted #fff;
	border-radius: 40px;
	width: 35%;
	padding: 1%;
	margin: 0 auto;
}
	.border_2 a{padding: 15%;
color: #55CAFF;}
	
	.header_collar{background-color:#99CFE5;
	widows: 100%;
	height: 40px;}
	.header_collar p{margin: 0 auto;
					padding: 8px 0;				}
	.header_collar h1{margin: 0 auto;
					padding: 8px 0;				}
	 h1 img{
		margin:45px auto;
		 padding-top: 40px;
		width: 35%;
		height: 25vh;
	}
	#sabu h1 img{margin: 20px auto;
padding-top: 15px;
width: 30%;height: 20vh;}
	#bg_2{
	background-image: url("../image/3700437_m.jpg");
	background-repeat: no-repeat;
	background-size: cover;
height: 45vh;
}
	h2,h3{
    font-size: 20px;
    margin: 2%;
	padding-top: 20px;
    font-weight: bold;
}
	li,a,p,tr,td{
	font-size: 16px;
}
	
	.bg_1 p{width:  250px;}
	.fruid img{
	width: 90%;
}
	/*ドロワーメニュー*/
nav.NavMenu{
			position: fixed;	/*表示位置を固定*/
			z-index: 2;		/*重ね順を変更*/
			top: 0;		/*表示位置を指定*/		
			left: 0;	/*表示位置を指定*/
			background: #fff;/*背景を白にする*/
			color: #000;	/*文字色を黒にする*/
			text-align: center;		/*テキストを中央揃え*/
			width: 100%;	/*全幅表示*/
			transform: translateY(-100%);	/*ナビを上に隠す*/
			transition: all 0.6s;	/*アニメーションの時間を指定*/
			
		}

		nav.NavMenu ul{
			background: #99CFE5;	/*背景をグレーにする*/

			width: 100%;	
			margin: 0 auto;
			padding: 0;
		}

		nav.NavMenu ul li{
			font-size: 1.1em;
			list-style-type: none;
			padding: 0;
			width: 100%;
			border-bottom:3px dotted #FFF500;		
		}

		nav.NavMenu ul li:last-child{
			padding-bottom: 0;
			border-bottom: 2px solid #FFF500;	/*最後のメニュー項目のみ下線を消す*/
		}

		nav.NavMenu ul li a{
			display: block;		/*クリックできる領域を広げる*/
			color: #FFFFFF;
			padding: 1em 0;
		}
		
		nav.NavMenu.none2.active{
			transform: translateY(0%);		/*ナビを表示する*/
		}

		.Toggle {
		    display: block;
		    position: fixed;    /* bodyに対しての絶対位置指定 */
		    right: 10px;
		    top: 3px;
		    width: 42px;
		    height: 42px;
		    cursor: pointer;
		    z-index: 3;
		}
		 
		.Toggle span {
		    display: block;
		    position: absolute;
		    width: 30px;
		    border-bottom: solid 3px #21C7D5;
		    -webkit-transition: .35s ease-in-out;	/*変化の速度を指定*/
		    -moz-transition: .35s ease-in-out;		/*変化の速度を指定*/
		    transition: .35s ease-in-out;			/*変化の速度を指定*/
		    left: 6px;
		}
		 
		.Toggle span:nth-child(1) {
		    top: 9px;
		}
		 
		.Toggle span:nth-child(2) {
		    top: 18px;
		}
		 
		.Toggle span:nth-child(3) {
		    top: 27px;
		}
		 
		/* 最初のspanをマイナス45度に */
		.Toggle.active span:nth-child(1) {
		    top: 18px;
		    left: 6px;
		    -webkit-transform: rotate(-45deg);
		    -moz-transform: rotate(-45deg);
		    transform: rotate(-45deg);
		}
		 
		/* 2番目と3番目のspanを45度に */
		.Toggle.active span:nth-child(2),
		.Toggle.active span:nth-child(3) {
		    top: 18px;
		    -webkit-transform: rotate(45deg);
		    -moz-transform: rotate(45deg);
		    transform: rotate(45deg);
		}



	h2,h3{line-height:1;
		margin: 0 auto;
	width: 200px;
	}
	.bg_1{background-image: url("../image/bg_1_tsmh.png");
	background-size:cover;
   margin: 5px auto;
    padding-top: 75px;
		padding-bottom: 135px;
   
}
	.bg_1 h2{ padding:0 5% 10px;}
	.bg_1 p{margin: 10px auto;}
	
	
	.title_bg h2{padding: 45px 5% 20px;}
	.bg_2{
	background-image: url("../image/bg_3_smh.png");
	background-size: cover;
		background-repeat: no-repeat;
		margin: 0 auto;
	padding-top: 55px;
	padding-bottom: 55px;
		
}
	.bg_2 h2{width: 250px;
	padding: 35px 0 20px}
 p{width: 80%;}
	.bg_2 p{width: 250px;}
}

@media (min-width: 1024px) {
  .l-header-logo,
  .l-header-logo a { font-size: 3.2rem; }
}

/**
 * ユーティリティー
 */

.u-fs-10 { font-size: 10px !important; }
.u-fw-b, .bold { font-weight: 700 !important; }
.u-ta-r, .tright, .t-right { text-align: right !important; }
.u-ta-l, .tleft, .t-left { text-align: left !important; }
.u-ta-c, .tcenter, .t-center { text-align: center !important; }

.u-lh-1 { line-height: 1 !important; }
.u-lh-xs { line-height: 1.2 !important; }
.u-lh-sm { line-height: 1.4 !important; }
.u-lh-md { line-height: 1.8 !important; }
.u-lh-lg { line-height: 2.0 !important; }
.u-lh-xl { line-height: 2.2 !important; }

.u-d-n,
.u-d-n-xs { display: none !important; }

.u-d-i,
.u-d-i-xs { display: inline !important; }

.u-d-b,
.u-d-b-xs { display: block !important; }

.u-mt-xs, .s-mt1em { margin-top: 1em !important; }
.u-mb-sm, .u-mb1em { margin-bottom: 1em !important; }
.u-mb-md, .u-mb15em { margin-bottom: 1.5em !important; }
.u-mb-lg, .u-mb2em { margin-bottom: 2.0em !important; }
.u-mb-xl, .u-mb3em { margin-bottom: 3.0em !important; }
.u-mb15 { margin-bottom: 15px !important; }
.u-mb20 { margin-bottom: 20px !important; }
.u-mb30 { margin-bottom: 30px !important; }
.u-mb40 { margin-bottom: 40px !important; }
.u-mb50 { margin-bottom: 50px !important; }

@media (min-width: 544px) {
  .u-d-n-sm { display: none !important; }
  .u-d-i-sm { display: inline !important; }
  .u-d-b-sm { display: block !important; }
}

@media (min-width: 768px) {
  .u-d-n-md { display: none !important; }
  .u-d-i-md { display: inline !important; }
  .u-d-b-md { display: block !important; }
}

@media (min-width: 992px) {
  .u-d-n-lg { display: none !important; }
  .u-d-i-lg { display: inline !important; }
  .u-d-b-lg { display: block !important; }
}

@media (min-width: 1200px) {
  .u-d-n-xl { display: none !important; }
  .u-d-i-xl { display: inline !important; }
  .u-d-b-xl { display: block !important; }
}