@charset "UTF-8";
/* ===================================================================
CSS information
 file name  :  sub.css
 style info :  中ページ用cssの定義
=================================================================== */
/* table base */
/****************************************************************/
table { width: 100%; }

th, td { text-align: left; font-weight: normal; padding: 10px; line-height: 1.6; border: 1px solid #eeeeee; }

li {
	list-style-type:none;
}

@media only screen and (max-width: 690px) { th, td { padding: 8px; }
  .table_wrap { overflow-x: scroll; -webkit-overflow-scrolling: touch; }
  .table_wrap table { width: 640px; } }

/* table 01 */
/****************************************************************/
table.tab01 { table-layout: fixed; }

table.tab01 th, table.tab01 td { text-align: center; }

table.tab01 th { background-color: #374252; color: #ffffff; }

/* table 02 */
/****************************************************************/
table.tab02 { table-layout: fixed; }

table.tab02 tr:nth-child(2n) { background-color: #F7FAFB; }

/* table 03 */
/****************************************************************/
table.tab03 { table-layout: fixed; }

table.tab03 tr:nth-child(2n) { background-color: #F7FAFB; }

table.tab03 tr:nth-child(2n) th { background-color: #B40000; }

table.tab03 th { background-color: #374252; color: #ffffff; }

/* table 04 */
/****************************************************************/
table.tab04 { table-layout: fixed; }

table.tab04 th, table.tab04 td { text-align: center; }

table.tab04 th { background-color: #374252; color: #ffffff; }

table.tab04 thead th:nth-child(2n) { background-color: #B40000; }

table.tab04 tbody td:nth-child(2n) { background-color: #F7FAFB; }

/* table 05 */
/****************************************************************/
/* table.tab05 { table-layout: fixed; } */

/* table.tab05 th, table.tab05 td { text-align: center; } */

table.tab05 th { background-color: #374252; color: #ffffff; }

@media only screen and (max-width: 690px) { table.tab05 th, table.tab05 td { display: block; width: 100%; border-top: none; text-align: left; }
  table.tab05 th { border: none; } }

/* table 06 */
/****************************************************************/
table.tab06 { table-layout: fixed; }

table.tab06 th, table.tab06 td { text-align: center; }

table.tab06 th { background-color: #374252; color: #ffffff; }

@media only screen and (max-width: 690px) { table.tab06 thead { display: none; }
  table.tab06 tbody td { display: block; padding: 0 0 10px 0; }
  table.tab06 tbody td:before { background-color: #374252; color: #ffffff; display: block; padding: 5px; margin-bottom: 10px; }
  table.tab06 tbody td:nth-of-type(1):before { content: "表見出し1"; }
  table.tab06 tbody td:nth-of-type(2):before { content: "表見出し2"; }
  table.tab06 tbody td:nth-of-type(3):before { content: "表見出し3"; }
  table.tab06 tbody td:nth-of-type(4):before { content: "表見出し4"; }
  table.tab06 tbody td:nth-of-type(5):before { content: "表見出し5"; }
  table.tab06 tbody td:nth-of-type(6):before { content: "表見出し6"; }
  table.tab06 tbody td:nth-of-type(7):before { content: "表見出し7"; } }

/****************************************************************/
/* media */
/****************************************************************/
.media .media_in { float: left; width: 23.2%; margin-right: 2.4%; background-color: #ffffff; }

@media only screen and (max-width: 979px) { .media .media_in { width: auto; margin-right: .8%; }
  .media .media_in:last-child { margin-right: .8%; } }

@media only screen and (max-width: 691px) { .media .media_in { margin: 0 16px; } }

.media .media_in:last-child { margin-right: 0; }

.media .media_in .catelist { text-align: right; margin-bottom: 8px; }

.media .media_in .catelist a { font-size: 10px; padding: 3px 8px; background-color: #374252; display: inline-block; }

.media .media_in:after { content: ""; display: table; clear: both; }

.media .media_in .media_img { width: 100%; height: 0; padding-bottom: 50%; overflow: hidden; position: relative; }

.media .media_in .media_img img { position: absolute; min-width: 100%; min-height: 100%; width: auto; height: auto; left: 50%; top: 50%; -webkit-transform: translate3d(-50%, -50%, 0); transform: translate3d(-50%, -50%, 0); }

.media .media_in .media_txt { margin-top: -15px; position: relative; z-index: 10; }

.media .media_in .media_txt time { margin-bottom: 5px; }

.media .media_in .media_txt .title06 { line-height: 1.8; }

div[class*="col_bg"] > .inner .media_txt { padding: 5%; }

/*-----------------------------------------------------------------*/
/*　faq QA　よくある質問 */
/*-----------------------------------------------------------------*/
.qa_q:after, .qa_a:after { content: ""; display: table; clear: both; }

.qa_q { color: #fff; padding: 12px 16px; background-color: #f70400; }

.qa_q p, .qa_a p, .qa_click_q p, .qa_click_a p { display: table-cell; vertical-align: top; line-height: 1.6; }

.qa_a { padding: 24px 16px 0 16px; }

.qa .init, .qa_click .init { font-size: 24px; line-height: 1; padding-right: 10px; }

.qa_click_a p, .qa_a p { line-height: 1.8; }

/* click
--------------------------*/
.qa_click_q { padding: 12px 40px 12px 16px; background-color: #f5f5f5; position: relative; cursor: pointer; }

.qa_click_q:before { content: ""; position: absolute; right: 16px; top: 12px; width: 24px; height: 24px; background-color: #f70400; }

.qa_click_q:after { content: ""; position: absolute; right: 23px; top: 18px; width: 8px; height: 8px; border-bottom: 2px solid #fff; border-left: 2px solid #fff; -webkit-transform: rotate(-45deg); transform: rotate(-45deg); }

.qa_click_q.active:after { top: 21px; border-top: 2px solid #fff; border-right: 2px solid #fff; border-bottom: none; border-left: none; }

.qa_click_a { display: none; padding: 24px 16px 0 16px; }

@media only screen and (max-width: 690px) { .qa_q { padding: 8px 10px; }
  .qa_a { padding: 16px 0 0; }
  .qa_click_a { padding: 20px 0 0 0; }
  .qa_click_q { padding: 10px 10px 25px 10px; }
  .qa_click_q:before { display: none; }
  .qa_click_q:after { right: 50%; margin-right: -4px; top: 75%; border-color: #f70400; }
  .qa_click_q.active:after { top: 80%; border-color: #f70400; } }

/*-----------------------------------------------------------------*/
/*　サイトマップ */
/*-----------------------------------------------------------------*/
#sitemap { padding-bottom: 30px; }

#sitemap li { margin: 10px 0; padding: 0; list-style-type: none; }

#sitemap a { color: #333; }

#sitemap ul { padding: 0 0 5px 25px; }

#sitemap ul li { margin: 5px 0; padding: 0; }

#sitemap li::before { font-family: FontAwesome; content: "\f105"; color: #aaaaaa; display: inline-block; font-size: 14px; padding-right: 3px; position: relative; text-decoration: none; }

/*-----------------------------------------------------------------*/
/* リスト */
/*-----------------------------------------------------------------*/
.list_col2 { font-size: 0; }

.list_col2 li { display: inline-block; width: 49%; }

.list_col2 li:not(:last-child) { margin-right: 2%; }

.list_col3 { font-size: 0; }

.list_col3 li { display: inline-block; width: 32%; }

.list_col3 li:not(:last-child) { margin-right: 2%; }

/*-----------------------------------------------------------------*/
/* subnav */
/*-----------------------------------------------------------------*/
#subnav { margin-bottom: 30px; }

#subnav ul li { list-style: none; }

#subnav ul li a { width: 100%; display: block; border-bottom: 1px dotted #bbbbbb; padding: 10px; font-size: .9em; }

#subnav ul li a:hover { color: #045473; background-color: #f9f9f9; text-decoration: none; }

#subnav ul li ul { border-bottom: none; }

#subnav ul li ul li a { padding: 5px 5px 5px 25px; font-size: .8em; }

#subnav ul li.current > a { border-bottom: 1px dotted #bbbbbb; color: #045473; background-color: #f9f9f9; text-decoration: none; }

#subnav ul li.current ul { border-bottom: 1px dotted #bbbbbb; }

#subnav ul li.current ul li a { border-bottom: none; font-size: .8em; }

#subnav_title a { display: block; text-align: center; padding: 8px 5px; background-color: #045574; color: #ffffff; }

#subnav_title a:hover { text-decoration: none; background-color: #378AA9; }


/*-----------------------------------------------------------------*/
/* original */
/*-----------------------------------------------------------------*/
.step {
	display:inline-block;
	padding:5px 10px;
	background:#045574;
	color:#fff;
	margin-bottom:10px;	
}
.flow_arr {
	position:relative;
}
.flow_arr::before {
	content:"";
	position:absolute;
	width: 0;
	height: 0;
	border-style: solid;
	border-width: 50px 100px 0 100px;
	border-color: #045574 transparent transparent transparent;
	bottom:-70px;
	left:0;
	right:0;
	margin-left:auto;
	margin-right:auto;
}


/*search_scenes.html*/
/*-----------------------------------------------------------------*/
.search_scenes_area {
	position: relative;
	margin-left: auto;
    margin-right: auto;
    max-width: 1280px;
	width:100%;
}
.search_scenes_box {
	position: relative;
	min-height: 1140px;
	background:url(../image/search_scenes_bg.jpg) no-repeat center center;
	background-size:cover;
}
.search_btn_area {
	position: absolute;
	top: 0;
	max-width: 900px;
	height: 1140px;
	z-index: 100;
	margin-left: -450px;
	left: 50%;
}
.search_btn_area .search_btn {
	position: absolute;
}
.search_btn_area .search_btn li {
	margin-bottom: 20px;
}
.search_btn_area .search_btn a {
	display: block;
	text-align: center;
	color: #FFF;
	font-size: 15px;
	padding: 15px 30px;
	background-color: #066082;
	border-radius: 8px;
	border: 3px solid #FFF;
	min-width: 210px;
	box-sizing: border-box;
	transition: all 0.3s;
}
	.search_btn_area .search_btn a:hover {
		text-decoration: none;
		color: #066082;
		background-color: #FFF;
		border: 3px solid #066082;
	}

.search_btn_area .search_btn .num {display: none;}

.search_btn_area .search_btn:after {
	content: "";
	display: block;
	position: relative;
	z-index: -1;
}
.search_scene01 {top: 240px; left: 53%;}
.search_scene02 {top: 152px; left: 0;}
.search_scene03 {top: 420px; left: 0;}
.search_scene04 {top: 415px; right: 0;}
.search_scene05 {top: 785px; left: 0;}
.search_scene06 {bottom: -90px;left: 2%;}
.search_scene07 {top: 50px;left: 45%;}

.search_scene01:after {
width: 200px;
height: 100px;
background: url(../image/search_scene01_arr.png)no-repeat;
left: -75px;
top: -26px;
}
.search_scene02::after {
width: 247px;
height: 192px;
background: url(../image/search_scene02_arr.png)no-repeat;
left: 50%;
top: -196px;
}
.search_scene03:after {
width: 105px;
height: 66px;
background: url(../image/search_scene03_arr.png)no-repeat;
left: 195px;
top: -75px;
}
.search_scene04:after {
width: 93px;
height: 203px;
background: url(../image/search_scene04_arr.png)no-repeat;
left: 40px;
top: -115px;
}
.search_scene05:after {
width: 151px;
height: 95px;
background: url(../image/search_scene05_arr.png)no-repeat;
left: 100px;
top: -30px;
}
.search_scene06:after {
width: 66px;
height: 120px;
background: url(../image/search_scene06_arr.png)no-repeat;
left: 50%;
top: -180px;
margin-left: -33px;
}
.search_scene07:after {
width: 66px;
height: 92px;
background: url(../image/search_scene07_arr.png)no-repeat;
left: 50%;
top: -26px;
margin-left: -33px;
}

.search_scenes_box .number {display: none;}
.search_scenes_box .number li {
	position: absolute;
	display: table;
	text-align: center;
	color: #FFF;
	font-size: 15px;
	background-color: #066082;
	border-radius: 100%;
	border: 4px solid #FFF;
	width: 35px;
	height: 35px;
	box-sizing: border-box;
	z-index: 10;
}
.search_scenes_box .number .v_m {
	display: table-cell;
	vertical-align: middle;
}

@media only screen and (max-width: 980px) {
	.search_scenes_box {
	    min-height: 780px;
	    max-width: 640px;
	    width: 100%;
	    margin: 0 auto 30px;
	    background: url(../image/search_scenes_bg02.png) no-repeat center center;
	    background-size: cover;
	}
	.search_btn_area, .search_btn_area .search_btn {
	    position: static;
	}
	.search_btn_area .search_btn::after {
	    display: none;
	}
	.search_btn_area {
	    max-width: none;
	    height: auto;
	    margin-left: auto;
	}
	.search_btn_area .search_btn a {
		font-size: 20px;
		position: relative;
	}
	.search_scenes_box .number {
			display: block;
	}
	.search_btn_area .search_btn .num {
		display: block;
		margin-right: 15px;
		border-right: 1px solid #FFF;
		padding-right: 15px;
		position: absolute;
	}
}
@media only screen and (max-width: 475px) {
	.search_scenes_box {
	    max-width: 320px;
		min-height: 500px;
	}
	.search_btn_area .search_btn a {
	    font-size: 13px;
	    padding: 15px 10px;
	}
	.search_btn_area .search_btn .num {
	    margin-right: 10px;
	    padding-right: 10px;
	}
}
