@charset "utf-8";

/*============================================
全般的なスタイル
============================================*/
* {
	margin:0; padding:0; 		/*全要素のマージン・パディングをリセット*/
}

body {
	background-color:#cccccc;		/*ページ全体の背景色*/
	background-size:contain;
	background: url(images/background-image.jpg) center center / cover no-repeat fixed;
	font-size:95%;
	font-family: "メイリオ",sans-serif;
	line-height:1.5;
	color:#333333;
}

div#footer{
	width:950px; margin:0 auto;
}

div#pagebody {
	width:1000px; margin:0 auto;	/*内容全体をセンタリング*/
	background-color:#ffffff;		/*内容全体の背景色*/
	background-image:url("images/bg_pagebody.png");	/*コンテンツ全体の背景画像*/
	background-repeat:repeat-y;			/*背景画像を縦方向に繰り返す*/
}

img {border:0;} 				/*画像のボーダーを0にする*/

/*============================================
ヘッダ
============================================*/
div#headoya{
	display:flex;
}

div#header {
	height:150px;				/*ヘッダ部分の高さ*/
}

div#header h1 {
	padding:10px 0px 5px 20px;		/*見出しの位置調整*/
	font-size:18px;				/*フォントのサイズ*/
	font-family:Arial, Helvetica, sans-serif;	/*フォントの種類*/
}

div#header h1 a {text-decoration:none;} 	/*リンクの下線を無くす*/

#head2{
	margin:10px 0px 0px 10px;
}

/*============================================
メインメニュー
============================================*/
ul#menu {
	width:960px; height:65px; 	/*メインメニュー部分の幅と高さ*/
	margin:0px 20px; 		/*上下マージン0px、左右マージン20px*/
}

#menu li {
	list-style-type:none;		/*リストマーカー無しにする*/
	display:inline;		/*リスト項目をインライン表示にする*/
	float:left;			/*リスト項目を横に並べる*/
}

#menu li a {
	background-color:#fef4f4;	/*背景色*/
	color:#000000;		/*文字色*/
	display:block;		/*リンク部分をブロック表示にする*/
	width:137px; height:50px;	/*幅と高さ*/
	padding:15px 0px 0px 0px;	/*上パディング*/
	text-align:center;		/*テキストをセンター揃えにする*/
	text-decoration:none;		/*リンク部分を下線無しにする*/
}

#menu li a:hover {
	border-bottom: medium solid #ff00ff;
}

/*============================================
ヘッダ画像
============================================*/
#img_index {
	width:960px; height:360px;	/*トップページのヘッダ画像の表示サイズを指定*/
	margin:5px 20px;		/*マージン*/
}
#img_index2 {
	width:960px; height:120px;	/*トップページのヘッダ画像の表示サイズを指定*/
	margin:5px 20px;		/*マージン*/
}

h2 {
	margin:0px 0px 20px 20px; 		/*上下マージン0px、左右マージン20px*/
	border-radius: 5px;
	list-style-type:none;		/*リストマーカー無しにする*/
	display:inline;			/*リスト項目をインライン表示にする*/
	float:left;			/*リスト項目を横に並べる*/
	background-color:lightblue;	/*背景色*/
	color:#darkgray;		/*文字色*/
	width:960px; height:30px;	/*幅と高さ*/
	padding:6px 0px 0px 0px;	/*上パディング*/
	text-align:left;		/*テキストをセンター揃えにする*/
	background-image:url(images/bg_menu3.png);	/*背景画像を指定*/
}

h3 {
	width:960px;
	margin:10px 0px 10px 0px;
	border-bottom: medium solid #ff00ff;
}
 
#newbox{
	margin:10px 20px;
}

#aisatu{
	width:960px;
	margin:10px 20px 20px 20px;
	display: flex;
	flex-wrap : wrap;
}
#aisatu1{
	width:600px;
	margin:0px 10px 20px 0px;
}
#aisatu2{
	width:30%;
}

#syoukai1left{
	width:300px;
}

#syoukai1right{
	width:600px;
	margin:0px 0px 20px 20px;
}

#syoukai1right h3 {
	width:600px;
	border-bottom: medium solid #ff00ff;
}

#voice1 {
	margin:0px 0px 20px 20px;
	width:960px;
	font-size: large; 
}

#voice{
	width:600px;
	margin:0px 0px 20px 20px;
}

#voice ul li{
	margin:0px 0px 20px 20px;
}

#voice h3 {
	width:600px;
	border-bottom: medium solid #ff00ff;
}

#faq {
	width:960px;
	margin:0px 0px 20px 40px;
}
#faq h3 {
	width:650px;
	border-bottom: medium solid #ff00ff;
}

#bloglink {
	width:960px;
	margin:0px 0px 20px 20px;
}

#kk2{
	margin:0px 0px 20px 20px;
}

#goriyoumaeni{
	margin:0px 0px 20px 20px;
}

#goriyoumaeni ul{
	margin:0px 0px 30px 20px;
}
#goriyoumaeni ol{
	margin:0px 0px 30px 20px;
}

#toiawase {
	clear:both;
	margin:0px 0px 20px 20px;
}

/*ポップアップここから*/
.popup_wrap input {
  display: none;
}

.popup_overlay {
  display: flex;
  justify-content: center;
  overflow: auto;
  position: fixed;
  top: 0;
  left: 0;
  z-index: 9999;
  width: 100%;
  height: 100%;
  background: rgba(0, 0, 0, 0.7);
  opacity: 0;
  transition: opacity 0.5s, transform 0s 0.5s;
  transform: scale(0);
}

.popup_trigger {
  position: absolute;
  width: 100%;
  height: 100%;
}

.popup_content {
  position: relative;
  align-self: center;
  width: 90%;
  max-width: 800px;
  padding: 30px 30px 15px;
  box-sizing: border-box;
  background: #fff;
  line-height: 1.4em;
  transition: 0.5s;
}

.close_btn {
  position: absolute;
  top: 14px;
  right: 16px;
  font-size: 30px;
  cursor: pointer;
}

.popup_wrap input:checked ~ .popup_overlay {
  opacity: 1;
  transform: scale(1);
  transition: opacity 0.5s;
}

.open_btn {
  position: relative;
  top: 0;
  right: 0;
  bottom: 0;
  left: 0;
  display: flex;
  justify-content: center;
  align-items: center;
  width: 200px;
  height: 30px;
  margin:10px auto;
  padding: 8px 16px;
  color: #fff;
  background:#0c0d62;
  font-weight: bold;
  box-shadow: 0 1px 3px rgba(0, 0, 0, 0.6);
  border-radius: 3px;
  cursor: pointer;
  transition: .3s ease;

}
.open_btn:hover{
    background:#000;
    color:#fff;
    transition: .3s ease;
}
/*ポップアップココまで*/
