@charset "UTF-8";
/* CSS Document */

@media screen and (min-width: 641px) {
/* common
------------------------------------------------------------------------*/
header .headerIn nav ul li.nav4.ov {
  background: url(../../common/images/nav_04.png) no-repeat center #3eacc0;
  border-left: none;
    border-right: none;
    font-size: 0;
}
.title_inner {
  margin: 0 auto;
  min-width: 1000px;
  max-width: 1280px;
  position: relative;
}
.main_inner {
  margin: 0 auto;
  width: 1000px;
  position: relative;
}
a {
  color: #000;
}

/* details
------------------------------------------------------------------------*/

/*
 * background
 */
/* contents_01 */

.connection_01 {
  position: relative;
  background:url("../images/contents_connection_01.png") repeat-x bottom center;
  height: 16px;
  width: 100%;
  z-index: 10;
  overflow: hidden;
  margin-top: -1px;
}
.connection_02 {
  position: relative;
  background:url("../images/contents_connection_02.png") repeat-x bottom center;
  height: 19px;
  width: 100%;
  z-index: 10;
  margin-top: -21px;
  overflow: hidden;
}

/* contents_02 */
.contents_02 {
  position: relative;
	height: 540px;
  background:url("../../images/contents_bg_01.png") repeat;
  padding: 71px 0 0 0;
	box-sizing:border-box;
}
/* contents_03 */
.contents_03 {
  position: relative;
	padding-bottom:120px;
  background:url("../images/contents_bg_04.png") repeat bottom;
  width: 100%;
  margin-top:-1px;
}

/* mainTitle
------------------------------------------------------------------------*/

.mainTitle {
  position: relative;
  height: 212px;
  background: url(../../images/contents_bg_02.png) repeat;
}
.mainTitle .txt_inner {
  width: 922px;
  position: absolute;
  left: 50%;
  margin-left: -461px;
}
.mainTitle h2 {
	width:922px;
	height:57px;
	margin:23px auto 0;
	background:url(../images/heading.png) no-repeat;
	text-indent: 100%;
	white-space: nowrap;
	overflow: hidden;
}
.mainTitle h3 {
  margin-top: 18px;
  text-align: center;
}

/* Bread Crumb */
.mainTitle .breadcrumb ul {
  padding-top: 20px;
  margin-left: 33px;
}
.mainTitle .breadcrumb ul li {
  display: inline-block;
  padding-right: 8px;
}
.mainTitle .breadcrumb ul li a {
  text-decoration: none;
}
.mainTitle .breadcrumb ul li a:hover {
  opacity: 0.7;
  filter: alpha(opacity=70);        /* ie lt 8 */
  -ms-filter: "alpha(opacity=70)";  /* ie 8 */
  -moz-opacity: 0.7;                /* FF lt 1.5, Netscape */
  -khtml-opacity: 0.7;
}


/* contents
------------------------------------------------------------------------*/

.wrap .inner {
	position:relative;
  width: 924px;
  margin: 0 auto;
}
.wrap .contents .inner {
  width: 980px;
}
.inner .text {
  text-align: center;
}
.inner .text p {
  margin-bottom: 40px;
}
.contents_02 .inner .text p {
  width: 400px;
  color: #ffffff;
  font-size: 18px;
  line-height: 1.9;
  text-align: left;
}
.contents_03 .inner .text p {
  width: 464px;
  color: #ffffff;
  font-size: 18px;
  line-height: 1.9;
  text-align: left;
}
.contents_04 .inner .text p {
  width: 411px;
  color: #ffffff;
  font-size: 18px;
  line-height: 1.9;
  text-align: left;
}
.wrap .contents .inner .text p {
  width: 432px;
}

/* 01 */
.contents_02 .inner .image {
  position:absolute;
	top:0;
	left:0;
	width:425px;
	height:395px;
	background:url(../images/figure_01.png) no-repeat center;
	text-indent: 100%;
	white-space: nowrap;
	overflow: hidden;
}
.contents_02 .inner .text {
  float: right;
	margin:40px 0 0 0;
}
.contents_02 .inner .text .img {
	width:289px;
	height:35px;
	margin:0 auto 40px;
	background:url(../images/caption_01.png) no-repeat center;
	text-indent: 100%;
	white-space: nowrap;
	overflow: hidden;
}
/* 02 */
.contents_03 .inner .image {
	position:absolute;
	top:61px;
	right:0;
	width:375px;
	height:450px;
	background:url(../images/figure_02.png) no-repeat center;
	text-indent: 100%;
	white-space: nowrap;
	overflow: hidden;
}
.contents_03 .inner .text {
  float: left;
  margin-top: 136px;
}
.contents_03 .inner .text .img {
	width:338px;
	height:91px;
	margin:0 auto 40px;
	background:url(../images/caption_02.png) no-repeat center;
	text-indent: 100%;
	white-space: nowrap;
	overflow: hidden;
}
/* 03 */
.wrap .contents {
  position: relative;
  background:url(../../images/contents_bg.png) repeat;
  background-size: 16px 16px;
  margin-top: -14px;
  padding-bottom: 88px;
}
.wrap .contents .inner .image {
  position: absolute;
	left: 0;
	top: 121px;
	width:468px;
	height:211px;
	background:url(../images/figure_03.png) no-repeat center;
	text-indent: 100%;
	white-space: nowrap;
	overflow: hidden;
}
.wrap .contents .inner .text {
  float: right;
  margin-top: 80px;
}
.wrap .contents .inner .text .img {
	width:431px;
	height:36px;
	margin:0 auto 40px;
	background:url(../images/caption_03.png) no-repeat center;
	text-indent: 100%;
	white-space: nowrap;
	overflow: hidden;
}
/* 04 */
.wrap .contents.contents_04 {
	padding:0 0 78px 0;
}
.wrap .contents.contents_05 {
	margin-top:0;
	padding:0 0 110px 0;
}
.schematic {
  position: relative;
  width: 994px;
  height: 250px;
	margin: 0 auto;
  padding-top: 55px;
  background:url(../images/bg_dot_gray.png) repeat;
  border: solid 3px #2b2b2b;
  box-sizing:border-box;
}
.schematic p img {
  position: absolute; top: -28px; left: 50%;
  margin-left: -198px;
}
.schematic p + p {
	width: 366px;
	height: 16px;
	margin:0 auto;
	background:url(../images/schematic_txt.png) no-repeat center;
	text-indent: 100%;
	white-space: nowrap;
	overflow: hidden;
}
.schematic div {
  float: left;
  width: 488px;
  padding-top: 28px;
}
.schematic div .schema_01 {
	width:353px;
	height:117px;
	margin:0 auto;
	background:url(../images/schematic_01.png) no-repeat center;
	text-indent: 100%;
	white-space: nowrap;
	overflow: hidden;
}
.schematic div .schema_02 {
	width:351px;
	height:117px;
	margin:0 auto;
	background:url(../images/schematic_02.png) no-repeat center;
	text-indent: 100%;
	white-space: nowrap;
	overflow: hidden;
}
/* 共通バナーエリアの非表示 */
	/*footer .footerIn { padding:0; }
	footer .top { border-top:none; }*/
}

@media screen and (max-width: 640px) {
	.breadcrumb {
		display: none;
	}
  header .headerIn nav ul li.nav4.ov {
    max-width: 100%;
    height: 0;
    margin:0 auto 7% auto;
    padding-bottom:5.625%;
    background:url(../../common/images/sp/nav_04_ov.png) no-repeat center;
    background-size:contain;
  }
	.wrap .mainTitle {
	position: relative;
	width: 100%;
	height: 0;
  margin-top: 13.906%;
	padding: 0 0 42.812%;
	box-sizing: border-box;
	background: url(../images/sp/contents_bg.png) repeat-x;
  background-size: contain;
}
.wrap .mainTitle h2 {
	width: 74.531%;
	height: 0;
	margin: 0 auto 3.437% auto;
	padding: 0 0 17.5% 0;
	background:url(../images/sp/heading.png) no-repeat;
	background-size:contain;
	text-indent: 100%;
	white-space: nowrap;
	overflow: hidden;
}
.wrap .mainTitle h3 {
	max-width:242px;
	width: 37.812%;
	margin: 0 auto;
}
.wrap .mainTitle .txt_inner {
	padding:8.75% 0 0 0;
}
.wrap .mainTitle .img_inner {
	position: absolute;
	bottom: 0;
	right: 0;
	width: 22.343%;
	padding: 0 9.843% 5.937% 0;
}
.wrap .mainTitle .img_inner span {
	max-width: 143px;
}

/* details
------------------------------------------------------------------------*/

/*
 * background
 */
/* contents_01 */

.connection_01 {
  position: relative;
  background:url("../images/contents_connection_01.png") repeat;
  height: 17px;
  width: 100%;
  z-index: 10;
}
.connection_02 {
  position: relative;
  background:url("../images/contents_connection_02.png") repeat;
  height: 19px;
  width: 100%;
  z-index: 10;
  margin-top: -19px;
}

/* contents_02 */
.contents_02 {
  position: relative;
	padding:0 4.687% 14.482%;
  background:url("../../images/contents_bg_01.png") repeat;
	box-sizing:border-box;
}
/* contents_03 */
.contents_03 {
  position: relative;
	padding:0 4.687% 17.968%;
  background:url("../images/contents_bg_04.png") repeat bottom;
	box-sizing:border-box;
}


/* contents
------------------------------------------------------------------------*/

.wrap .inner {
	position:relative;
	padding:10.172% 0 0 0;
  margin: 0 auto;
}
.wrap .contents .inner {
}
.inner .text {
  text-align: center;
}
.inner .text img {
  margin-bottom: 40px;
}
.inner .text p {
  color: #ffffff;
  font-size: 4.07vw;
  font-size:160%;/* for android 4.2,4.3 */
  line-height: 1.9;
  text-align: left;
}
.wrap .contents .inner .text p {
}

/* 01 */
.contents_02 .inner .text .img {
	max-width:289px;
	width:49.827%;
	height:0;
	margin:0 auto 12.586%;
	padding-bottom:6.034%;
	background:url(../images/sp/caption_01.png) no-repeat center;
	background-size:contain;
	text-indent: 100%;
	white-space: nowrap;
	overflow: hidden;
}
.contents_02 .inner .image {
	max-width:574px;
	width:98.965%;
	height:0;
	margin:0 auto 13.275%;
	padding-bottom:92.931%;
	background:url(../images/sp/figure_01.png) no-repeat center;
	background-size:contain;
	text-indent: 100%;
	white-space: nowrap;
	overflow: hidden;
}
.contents_02 .inner .text {
  float: none;
}
/* 02 */
.contents_03 .inner {
	padding:12.241% 0 0 0;
}
.contents_03 .inner .text .img {
	max-width:574px;
	width:98.965%;
	height:0;
	margin:0 auto 12.586%;
	padding-bottom:6.206%;
	background:url(../images/sp/caption_02.png) no-repeat center;
	background-size:contain;
	text-indent: 100%;
	white-space: nowrap;
	overflow: hidden;
}
.contents_03 .inner .image {
	max-width:579px;
	width:99.827%;
	height:0;
	margin:0 auto 12.586%;
	padding-bottom:100%;
	background:url(../images/sp/figure_02.png) no-repeat center;
	background-size:contain;
	text-indent: 100%;
	white-space: nowrap;
	overflow: hidden;
}
.contents_03 .inner .text {
  float: none;
}
/* 03 */
.wrap .contents {
  position: relative;
  background:url(../../images/contents_bg.png) repeat;
  background-size: 16px 16px;
  margin-top: -17px;
	box-sizing:border-box;
}
.wrap .contents .inner .text .img {
	max-width:416px;
	width:71.724%;
	height:0;
	margin:0 auto 12.586%;
	padding-bottom:6.209%;
	background:url(../images/sp/caption_03.png) no-repeat center;
	background-size:contain;
	text-indent: 100%;
	white-space: nowrap;
	overflow: hidden;
}
.wrap .contents .inner .image {
	max-width:574px;
	width:98.965%;
	height:0;
	margin:0 auto 13.275%;
	padding-bottom:45.517%;
	background:url(../images/sp/figure_03.png) no-repeat center;
	background-size:contain;
	text-indent: 100%;
	white-space: nowrap;
	overflow: hidden;
}
.wrap .contents .inner .text {
  float: none;
}
/* 04 */
.wrap .contents.contents_04 {
	padding:0 4.687% 13.75%;
}
.wrap .contents.contents_04 .inner {
	padding-top:16.896%;
}
.wrap .contents.contents_05 {
	margin-top:0;
	padding:0 4.687% 27.343%;
}
.schematic {
  position: relative;
	margin: 0 auto;
	padding:0 0 10.278%;
  background:url(../images/bg_dot_gray.png) repeat;
  border: solid 3px #2b2b2b;
  box-sizing:border-box;
}
.schematic .img {
	max-width: 462px;
	width: 80.487%;
	margin:-6% auto 8.536%;
}
.schematic p img {
}
.schematic p + p {
	max-width:515px;
	width:89.721%;
	height:0;
	margin:0 auto;
	padding-bottom:3.658%;
	background:url(../images/sp/schematic_txt.png) no-repeat center;
	background-size:contain;
	text-indent: 100%;
	white-space: nowrap;
	overflow: hidden;
}
.schematic div {
  float: none;
  padding-top: 28px;
}
.schematic div > p {
	max-width:520px;
	width:90.592%;
	height:0;
	margin:0 auto;
	padding-bottom:29.965%;
	text-indent: 100%;
	white-space: nowrap;
	overflow: hidden;
}
.schematic div .schema_01 {
	background:url(../images/sp/schematic_01.png) no-repeat center;
	background-size:contain;
}
.schematic div .schema_02 {
	background:url(../images/sp/schematic_02.png) no-repeat center;
	background-size:contain;
}
}