@charset "UTF-8";

/*----------------------------------------

	- content
	- pc（1181px?）
	- sp（?767px）

-----------------------------------------*/

html,
body,
#wrapper {
  height: 100%;
}

#content {
  padding: 0;
}

/*	header
-----------------------------------------*/

header {
  background: none;
  border: none;
}

header h1 a:link,
header h1 a:visited {
  background: url(../common/img/common_logo01_top_pc.png) no-repeat left top;
}

header div ul#gnav li:nth-child(1) a:link,
header div ul#gnav li:nth-child(1) a:visited {
  background: url(../common/img/common_gnav01_top.png) no-repeat left top;
}

header div ul#gnav li:nth-child(2) a:link,
header div ul#gnav li:nth-child(2) a:visited {
  background: url(../common/img/common_gnav06_top.png) no-repeat left top;
}

header div ul#gnav li:nth-child(3) a:link,
header div ul#gnav li:nth-child(3) a:visited {
  background: url(../common/img/common_gnav02_top.png) no-repeat left top;
}

header div ul#gnav li:nth-child(4) a:link,
header div ul#gnav li:nth-child(4) a:visited {
  background: url(../common/img/common_gnav03_top.png) no-repeat left top;
}

header div ul#gnav li:nth-child(5) a:link,
header div ul#gnav li:nth-child(5) a:visited {
  background: url(../common/img/common_gnav07_top.png) no-repeat left top;
}

header div ul#gnav li:nth-child(6) a:link,
header div ul#gnav li:nth-child(6) a:visited {
  background: url(../common/img/common_gnav04_top.png) no-repeat left top;
}

header.common_header {
  background: #ffffff;
  border-bottom: solid 1px #e3e3e3;
}

header.common_header h1 a:link,
header.common_header h1 a:visited {
  background: url(../common/img/common_logo01.png) no-repeat left top;
}

header.common_header div ul#gnav li:nth-child(1) a:link,
header.common_header div ul#gnav li:nth-child(1) a:visited {
  background: url(../common/img/common_gnav01.png) no-repeat left top;
}

header.common_header div ul#gnav li:nth-child(2) a:link,
header.common_header div ul#gnav li:nth-child(2) a:visited {
  background: url(../common/img/common_gnav06.png) no-repeat left top;
}

header.common_header div ul#gnav li:nth-child(3) a:link,
header.common_header div ul#gnav li:nth-child(3) a:visited {
  background: url(../common/img/common_gnav02.png) no-repeat left top;
}

header.common_header div ul#gnav li:nth-child(4) a:link,
header.common_header div ul#gnav li:nth-child(4) a:visited {
  background: url(../common/img/common_gnav03.png) no-repeat left top;
}

header.common_header div ul#gnav li:nth-child(5) a:link,
header.common_header div ul#gnav li:nth-child(5) a:visited {
  background: url(../common/img/common_gnav07.png) no-repeat left top;
}

header.common_header div ul#gnav li:nth-child(6) a:link,
header.common_header div ul#gnav li:nth-child(6) a:visited {
  background: url(../common/img/common_gnav04.png) no-repeat left top;
}

header div ul#gnav li:hover ul li a:link,
header div ul#gnav li:hover ul li a:visited {
  background: #ffffff !important;
}

/*	main
-----------------------------------------*/

#main {
  width: 100%;
  height: 100%;
  position: relative;
}

#main section {
  position: absolute;
  top: 0;
  right: 0;
  bottom: 0;
  left: 0;
  margin: auto;
  width: 800px;
  height: 470px;
}

#main h2 {
  display: block;
  width: 334px;
  margin: 0 auto;
}

#main p {
  padding-top: 22px;
  font-weight: 400;
  line-height: 2.6;
  color: #ffffff;
  text-align: center;
}

/*	box00
-----------------------------------------*/

#box00 {
  width: 100%;
  background: #ffffff;
}

#box00 section {
  padding: 80px 0;
}

#box00 h3 {
  display: block;
  width: 186px;
  margin: 0 auto;
  padding-bottom: 30px;
}

#box00 p {
  display: block;
  width: 590px;
  margin: 0 auto;
}

#box00 p span {
  display: block;
  padding-top: 10px;
  font-size: 18px;
  font-size: 1.8rem;
  text-align: center;
}

#box00 p a:link,
#box00 p a:visited {
  transition: 0.5s;
}

#box00 p a:hover,
#box00 p a:active {
  opacity: 0.5;
}

#box00 .slider01 {
  display: block;
  width: 590px;
  height: auto;
  margin: 0 auto;
  box-sizing: border-box;
  border-top: solid 10px #d72a1a;
  border-right: solid 10px #1f6abd;
  border-bottom: solid 10px #1f6abd;
  border-left: solid 10px #d72a1a;
}

#box00 .video{
  position:relative;
  width:100%;
  padding-top:56.25%;
}
 .video iframe{
  padding-top: 30px;
  position:absolute;
  top:0;
  right:0;
  width:100%;
  height:100%;
}

/*	common
-----------------------------------------*/

.layout01 .layout01_inner {
  width: 100%;
  height: 700px;
  position: relative;
  z-index: 0;
}

.layout01 .layout01_inner h3 {
  width: 186px;
  padding-bottom: 30px;
  line-height: 0;
  position: absolute;
  z-index: 1;
}

.layout01 .layout01_inner p.lead01 {
  display: block;
  line-height: 2.0;
  position: absolute;
  z-index: 1;
}

.layout01 .layout01_inner p.btn01 {
  width: 240px;
  position: absolute;
  z-index: 1;
}

.layout01 .layout01_inner p.caption01 {
  padding-top: 10px;
  font-size: 12px;
  font-size: 1.2rem;
  text-align: center;
}

#box01 .layout01_inner p.caption01,
#box03 .layout01_inner p.caption01,
#box05 .layout01_inner p.caption01 {
  color: #ffffff;
}

/*	box01
-----------------------------------------*/

#box01 {
  width: 100%;
  background: #474747 url(../img/index_bg01.jpg) no-repeat left top;
  -webkit-background-size: cover;
  -moz-background-size: cover;
  -ms-background-size: cover;
  background-size: cover;
}

#box01 .layout01_inner {
  width: 900px;
  margin: 0 auto;
}

#box01 h3 {
  top: 80px;
}

#box01 p.lead01 {
  width: 430px;
  color: #ffffff;
  top: 180px;
}

#box01 p.btn01 {
  top: 270px;
}

/*	box02
-----------------------------------------*/

#box02 {
  width: 100%;
  background: url(../img/index_bg02.jpg) no-repeat left top;
  -webkit-background-size: cover;
  -moz-background-size: cover;
  -ms-background-size: cover;
  background-size: cover;
}

#box02 .layout01_inner {
  width: 610px;
  margin: 0 auto;
}

#box02 h3 {
  top: 200px;
  left: 310px;
}

#box02 p.lead01 {
  width: 300px;
  top: 300px;
  left: 310px;
}

#box02 p.btn01 {
  top: 100px;
  left: 310px;
}

/*	box03
-----------------------------------------*/

#box03 {
  width: 100%;
  background: url(../img/index_bg03.jpg) no-repeat left top;
  -webkit-background-size: cover;
  -moz-background-size: cover;
  -ms-background-size: cover;
  background-size: cover;
}

#box03 .layout01_inner {
  width: 900px;
  margin: 0 auto;
}

#box03 h3 {
  top: 80px;
  left: 460px;
}

#box03 p.lead01 {
  width: 430px;
  color: #ffffff;
  top: 180px;
  left: 460px;
}

#box03 p.btn01 {
  top: 270px;
  left: 460px;
}

/*	box04
-----------------------------------------*/

#box04 {
  width: 100%;
  background: url(../img/index_bg04.jpg) no-repeat left top;
  -webkit-background-size: cover;
  -moz-background-size: cover;
  -ms-background-size: cover;
  background-size: cover;
}

#box04 .layout01_inner {
  width: 900px;
  margin: 0 auto;
}

#box04 h3 {
  display: block;
  margin: 0 auto;
  top: 80px;
  left: 357px;
}

#box04 p.lead01 {
  display: block;
  width: 480px;
  top: 180px;
  left: 210px;
  text-align: center;
}

#box04 p.btn01 {
  top: 580px;
  left: 330px;
}

/*	box05
-----------------------------------------*/

#box05 {
  width: 100%;
  background: url(../img/index_bg05.jpg) no-repeat left top;
  -webkit-background-size: cover;
  -moz-background-size: cover;
  -ms-background-size: cover;
  background-size: cover;
}

#box05 .layout01_inner {
  width: 610px;
  margin: 0 auto;
}

#box05 h3 {
  top: 200px;
}

#box05 p.lead01 {
  width: 300px;
  color: #ffffff;
  top: 300px;
}

#box05 p.btn01 {
  top: 420px;
}

/*	box06
-----------------------------------------*/

#box06 {
  width: 100%;
  background: url(../img/index_bg06.jpg) no-repeat left top;
  -webkit-background-size: cover;
  -moz-background-size: cover;
  -ms-background-size: cover;
  background-size: cover;
}

#box06 .layout01_inner {
  height: 440px;
}

#box06 .layout01_inner {
  width: 610px;
  margin: 0 auto;
}

#box06 h3 {
  top: 80px;
  left: 310px;
}

#box06 p.lead01 {
  width: 300px;
  top: 175px;
  left: 310px;
}

#box06 p.btn01 {
  top: 290px;
  left: 310px;
}

/*----------------------------------------
	pc（768px?）
-----------------------------------------*/
@media only screen and (min-width: 768px) {

/*	common
-----------------------------------------*/

.layout01 .layout01_inner div.slider01,
.layout01 .layout01_inner div.slider02,
.layout01 .layout01_inner div.slider03 {
  position: absolute;
  z-index: 2;
}

/*	box01
-----------------------------------------*/

#box01 .slider01 {
  width: 400px;
  right: 0;
  top: 80px;
}

#box01 .slider02 {
  width: 200px;
  bottom: 80px;
}

/*	box02
-----------------------------------------*/

#box02 .slider01 {
  width: 250px;
  top: 80px;
}

/*	box03
-----------------------------------------*/

#box03 .slider01 {
  width: 400px;
  top: 80px;
}

#box03 .slider02 {
  width: 200px;
  right: 0;
  bottom: 80px;
}

/*	box04
-----------------------------------------*/

#box04 .slider01 {
  width: 250px;
  bottom: 150px;
}

#box04 .slider02 {
  width: 250px;
  bottom: 150px;
  left: 325px;
}

#box04 .slider03 {
  width: 250px;
  bottom: 150px;
  right: 0;
}

/*	box05
-----------------------------------------*/

#box05 .slider01 {
  width: 250px;
  right: 0;
  top: 80px;
}

/*	box06
-----------------------------------------*/

#box06 .slider01 {
  width: 250px;
  top: 80px;
}
}

/*----------------------------------------
	sp（?767px）
-----------------------------------------*/
@media only screen and (max-width: 767px) {

header {
  background: #ffffff;
}

/*	main
-----------------------------------------*/
#main section {
  width: 84%;
  height: 350px;
}

#main h2 {
  width: 68%;
}

#main p {
  font-size: 16px;
  font-size: 1.6rem;
  line-height: 2.2;
}

#main p span {
  display: none;
}

/*	box00
-----------------------------------------*/

#box00 section {
  padding: 40px 0;
}

#box00 h3 {
  width: 40%;
  padding-bottom: 20px;
}

#box00 p {
  width: 100%;
}

#box00 p span {
  padding-top: 10px;
  font-size: 16px;
  font-size: 1.6rem;
}

#box00 .slider01 {
  width: 100% !important;
  height: auto !important;
  box-sizing: border-box;
  border-top: solid 5px #d72a1a;
  border-right: solid 5px #1f6abd;
  border-bottom: solid 5px #1f6abd;
  border-left: solid 5px #d72a1a;
}

/*	common
-----------------------------------------*/

.layout01 .layout01_inner {
  width: 100% !important;
  height: auto !important;
  position: static;
  padding: 40px 0;
}

.layout01 .layout01_inner h3 {
  display: block;
  width: 40%;
  margin: 0 auto;
  padding-bottom: 25px;
  position: static;
}

.layout01 .layout01_inner p.lead01 {
  width: 100% !important;
  line-height: 2.0;
  position: static;
  text-align: left !important;
}

.layout01 .layout01_inner p.btn01 {
  width: 100% !important;
  margin-top: 25px;
  position: static;
}

.layout01 .layout01_inner div.slider01,
.layout01 .layout01_inner div.slider02,
.layout01 .layout01_inner div.slider03 {
  width: 80% !important;
  margin: 0 auto;
  margin-top: 25px;
}

.layout01 .layout01_inner p.caption01 {
  padding-top: 10px;
  font-size: 14px;
  font-size: 1.4rem;
}

#box01,
#box03,
#box05 {
  background: none;
  background: #474747;
}

#box02,
#box04,
#box06 {
  background: none;
  background: #f1f1f1;
}
}