@charset "utf-8";
/*------------------------------------------------------------
【共通】初期設定
------------------------------------------------------------*/
body {
margin: 0 auto;
padding: 0 auto;
font-size: 16px !important;
font-family:メイリオ,Meiryo,-apple-system,BlinkMacSystemFont,"Helvetica Neue","游ゴシック Medium",YuGothic,YuGothicM,"Hiragino Kaku Gothic ProN",sans-serif;
-webkit-text-size-adjust: 100%;
}

div{
margin:0;
padding:0;
}

.clear {
clear:both;
visibility:hidden;
height:0;
}

/*------------------------------------------------------------
ヘッダー
------------------------------------------------------------*/
#main_vis{/*メインビジュアル*/
display:flex;
justify-content:center;
/*margin-top:12px;*/
}

#dataextraction p{
color:#333;
font-weight:bold;
font-size:1.5em;
text-align:center;
margin:0.5em auto;
}
#dataextraction .arrow{
display:flex;
justify-content:space-around;
margin:40px auto 0px;
}


/*------------------------------------------------------------
検索・コンテンツ
------------------------------------------------------------*/
.text{
	margin:20px 0 0 100px;
}

.item_ym{
	width: 960px;
	margin: 25px auto;
	vertical-align: top;
	margin-bottom: 5px;
}

.item_ym .name{
	width: 135px;
	margin-right: 15px;
	display: inline-block;
	vertical-align: top;
	padding: 3px;
	border-radius: 3px;
	background-color: #002448;
	color: white;
	font-size: 20px;
	text-align: center;
}

/*------------------------------------------------------------
フッター
------------------------------------------------------------*/




/*------------------------------------------------------------
★★★【PCモード】ヘッダー
------------------------------------------------------------*/
.head_container h1{
	font-size: 1em;
/*	font-weight: normal;*/
}

.head_container {
	display: grid;
	grid-template-columns: 160px 1fr 1fr;
	grid-template-rows: 24px 24px 1fr;
	gap: 0px 0px;
	grid-auto-flow: row;
	grid-template-areas:
	"head-item1 head-item1 head-item1"
 	"head-item2 head-item3 head-item3"
	"head-item2 head-item4 head-item5";
	align-items
	margin:0 0 12px 0;
}

.head-item1 {
	grid-column: 1/4;
	justify-self: center;
}

.head-item2 {
	grid-row:2/4;
}

.head-item3 {
	grid-column: 2/4;
	grid-row:2/3;
	justify-self: end;
}

.head-item4 {
	grid-column: 2/3;
	grid-row:3/4;
	align-self: center;
	justify-self: center;
}

.head-item5 {
	grid-column: 3/4;
	grid-row:3/4;
	align-self: center;
	justify-self: end;
}



/*------------------------------------------------------------
★★★【PCモード】ヘッダー　ログインボタン
------------------------------------------------------------*/
*,
*:before,
*:after {
  -webkit-box-sizing: inherit;
  box-sizing: inherit;
}

html {
  -webkit-box-sizing: border-box;
  box-sizing: border-box;
  font-size: 62.5%;
}

.btn,
a.btn,
button.btn {
  font-size: 2rem;
  font-weight: 700;
  line-height: 1.5;
  position: relative;
  display: inline-block;
/*  padding: 0.5rem 2rem;*/
  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--new,
a.btn--new {
  color: #fff;
  background-color: #EF416B;
  padding: 0.5rem 2rem;
}

.btn--new:hover,
a.btn--new:hover {
  color: #fff;
  background: #F08AAD;
  padding: 0.5rem 2rem;
}

/* ログイン */
.btn--login,
a.btn--login {
  color: #fff;
  background-color: #2E85DB;
  padding: 0.5rem 4rem;
  margin:0 0 0 10px;
}

.btn--login:hover,
a.btn--login:hover {
  color: #fff;
  background: #75A3DB;
  padding: 0.5rem 4rem;
}

/* 会員画面用 */
.btn--member,
a.btn--member {
  color: #fff;
  background-color: #2E85DB;
  padding: 0.5rem 1rem;
  margin:0 0 0 10px;
  font-size: 1.2rem;
}

.btn--member:hover,
a.btn--member:hover {
  color: #fff;
  background: #75A3DB;
  padding: 0.5rem 1rem;
  font-size: 1.2rem;
}

/*------------------------------------------------------------
★★★【PCモード】G NAVI
------------------------------------------------------------*/
#dbp_gnavi{
	width:100.1%;
	display: flex;
	flex-wrap: wrap;
}