@charset "UTF-8";
/*--------------------------------------------------
  reset
--------------------------------------------------*/
html, body, div, span, applet, object, iframe, h1, h2, h3, h4, h5, h6, p, blockquote, pre, a, abbr, acronym, address, big, cite, code, del, dfn, em, img, ins, kbd, q, s, samp, small, strike, strong, sub, sup, tt, var, b, u, i, center, dl, dt, dd, ol, ul, li, fieldset, form, label, legend, table, caption, tbody, tfoot, thead, tr, th, td, article, aside, canvas, details, embed, figure, figcaption, footer, header, hgroup, menu, nav, output, ruby, section, summary, time, mark, audio, video {
  margin: 0;
  padding: 0;
  border: 0;
  font-size: 100%;
  font: inherit;
  font-weight:normal;/* Yutaka added */
  vertical-align: baseline;
}
body {
  line-height:1;
}
/* HTML5 display-role reset for older browsers */
article, aside, details, figcaption, figure, footer, header, hgroup, menu, nav, section {
  display: block;
}
ol, ul {
  list-style: none;
}
blockquote, q {
  quotes: none;
}
blockquote:before, blockquote:after, q:before, q:after {
  content: '';
  content: none;
}
table {
  border-collapse: collapse;
  border-spacing: 0;
}
/* Yutaka added */
table, tr, th, td, caption {
  vertical-align: middle;
  text-align:left;
}
img {
  vertical-align: top;
  font-size:0;
  line-height: 0;
}
.clearfix:after {
  content: "";
  clear: both;
  display: block;
}
.pc-only {
	display: block !important;
}
.sp-only {
	display: none !important;
}

/*--------------------------------------------------
  body
--------------------------------------------------*/
body {
	width: 100%;
	min-width: 1100px;
  color: #111;
	font-size: 16px;
	font-family: "ヒラギノ角ゴ Pro", "Hiragino Kaku Gothic Pro", "メイリオ", Meiryo, Osaka, "ＭＳ Ｐゴシック", "MS PGothic", "sans-serif";
	margin: auto;
}
a {
  text-decoration: none;
	display: block;
}
a:hover {
  opacity: 0.8;
}
body .inner {
	width: 1100px;
	margin: auto;
}
.c-01 {
	color: #fff;
}
.c-02 {
	color: #fba104;
}
.f-bold {
	font-weight: bold;
}
.fl01 {
	display: flex;
	align-items: flex-end;
}
.fl02 {
	display: flex;
	justify-content: space-between;
	flex-wrap: wrap;
}
.fl03 {
  display: flex;
	justify-content: space-between;
  align-items: center;
}

/*--------------------------------------------------
  page link 調整
--------------------------------------------------*/
#top .anchor01 {
	display: block;
	padding-top: 85px;
	margin-top: -85px;
	/* entry */
}
#top .anchor02 {
	display: block;
	padding-top: 85px;
	margin-top: -85px;
	/* sec03 */
}

/*--------------------------------------------------
  header
--------------------------------------------------*/
header {
	width: 100%;
	min-width: 1100px;
	height: 85px;
	background: #fff;
	padding: 0 10px 0 30px;
	box-sizing: border-box;
	position: fixed;
	top:0;
	z-index: 999;
}
header ul li+li {
	border-left: 2px solid #fdce00;
}
header .h_inner{
	margin: auto;
}
header h1 {
  padding: 20px 0 0 0;
	box-sizing: border-box;
	float: left;
}
header h1 img {
  width: 205px;
  height: 55px;
}

/*---------- .g-nav ----------*/
header .nav {
  margin: 0 0 0 0;
  position: relative;
  float: right;
}
header .g-nav ul {
  width: 100%;
	text-align: center !important;
	white-space: nowrap; /* 自動で折り返ししない */
	letter-spacing: -1em; /* 文字間を詰める */
	margin: 23px 0 0 0;
	display: table;
}
header .g-nav ul li {
	display: table-cell;
	vertical-align: middle;
	letter-spacing: normal; /* 文字間を元に戻す */
  white-space: normal; /* 自動で折り返し(元に戻す) */
	font-size: 18px;
	padding: 0 35px 0 35px;
	box-sizing: border-box;
}
header .g-nav ul li span {
	display: block;
	color: #fba104;
	font-size: 12px;
	font-weight: bold;
	margin: 10px 0 0 0;
}
header .g-nav li a {
	height: 100%;
	color: #111;
	font-size: 18px;
	font-weight: bold;
	line-height: 1;
  margin: auto;
}

/*--------------------------------------------------
  ttl-box
--------------------------------------------------*/
#top .ttl-box {
	text-align: center;
}
#top .ttl-box01 {
	margin: 0 0 40px;
}
#top .ttl-box02 {
	margin: 0 0 60px;
}
#top .ttl-box03 {
	margin: 0 0 90px;
}
#top .ttl-box .img-box img {
	width: 35px;
	height: 25px;
	margin: 0 0 10px;
}
#top .ttl-box p {
	color: #fba104;
	font-size: 14px;
	line-height: 1;
	margin: 0 0 20px;
}
#top .ttl-box h3 {
	font-size: 32px;
	line-height: 1;
}
#top .ttl-box h3 span {
	color: #fba104;
}

/*--------------------------------------------------
  mv
--------------------------------------------------*/
#top .mv {
  width: 100%;
  height: 500px;
  background: url("../images/mv-bg.jpg") center center no-repeat;
  background-size: cover;
	margin: 85px auto 150px;
	position: relative;
}
#top .mv .mv-inner {
	content: "";
	display: block;
	position: absolute;
	width: 890px;
	height: 220px;
	/* -45度斜めから25%、50%、75%、100%とボーダーが交互に色違いとなるように指定 */
  background: linear-gradient(
    -45deg,
    #fbf1de 22%,
    #f9ebd0 22%, #f9ebd0 50%,
    #fbf1de 50%, #fbf1de 72%,
    #f9ebd0 72%, #f9ebd0
  );
	background-size: 20px 20px;
	border-radius: 12px;
	margin: auto;
	bottom: -120px;
	left: 0;
	right: 0;
}
#top .mv .mv-txt {
	position: relative;
}
#top .mv .mv-img {
	content: "";
	display: block;
	position: absolute;
	width: 283px;
	height: 278px;
	background: url("../images/mv-txt.png") center center no-repeat;
  background-size: 90% auto;
	top: -52px;
	left: 80px;
}
#top .mv .mv-txt p {
	content: "";
	display: block;
	position: absolute;
	font-size: 20px;
	line-height: 1.8em;
	top: 40px;
	right: 90px;
}
#top .mv .mv-doco {
	position: relative;
}
#top .mv .mv-doco::before {
	content: "";
	display: block;
	position: absolute;
	width: 85px;
	height: 72px;
	background: url("../images/mv-doco01.png") center center no-repeat;
  background-size: 100% auto;
	bottom: -235px;
	left: -35px;
}
#top .mv .mv-doco::after {
	content: "";
	display: block;
	position: absolute;
	width: 128px;
	height: 125px;
	background: url("../images/mv-doco02.png") center center no-repeat;
  background-size: 100% auto;
	top: -25px;
	right: -35px;
}

/*------------------------------------------------------------
 sec01
------------------------------------------------------------*/
#top .sec01 {
	padding: 60px 0 90px;
	box-sizing: border-box;
}
#top .sec01 .txt-box {
	text-align: center;
}
#top .sec01 .txt-box .txt01 {
	font-size: 16px;
	text-align: center;
	line-height: 2.0em;
	margin: 0 0 30px;
}
#top .sec01 .txt-box .name {
	font-size: 20px;
	line-height: 1;
	margin: 0 0 90px;
}

/*----- video -----*/
/*#top .sec01 video {
	margin: 0 auto 110px;
	display: block;
}*/
#top .sec01 video {
	width: 550px;
	height: 540px;
	background: url("../images/sec01-bg.jpg") center center no-repeat;
	background-size: 100% auto;
}

/*----- history -----*/
#top .sec01 .history .img-box {
	width: 550px;
	height: 540px;
}
#top .sec01 .history .img-box img {
	width: 550px;
	height: 540px;
}
#top .sec01 .history .h-txt {
	width: 550px;
	height: 540px;
	background: #f3f3f3;
	padding: 90px 60px 0;
	box-sizing: border-box;
	position: relative;
}
#top .sec01 .history .h-txt:before {
	content: "";
	display: block;
	position: absolute;
	width: 90px;
	height: 90px;
	background: url("../images/sec01-icon.png") center center no-repeat;
	background-size: 100% auto;
	margin: auto;
	top: -45px;
	left: 0;
	right: 0;
}
#top .sec01 .history .h-txt h3 {
	font-size: 25px;
	text-align: center;
	margin: 0 0 40px;
	position: relative;
}
#top .sec01 .history .h-txt .ttl h3:before,
#top .sec01 .history .h-txt .ttl h3:after {
	content: "";
	display: block;
	position: absolute;
	width: 120px;
	height: 2px;
	background: #412110;
}
#top .sec01 .history .h-txt .ttl h3:before {
	bottom: 12px;
	left: 0;
}
#top .sec01 .history .h-txt .ttl h3:after {
	bottom: 12px;
	right: 0;
}
#top .sec01 .history .h-txt .txt01 {
	margin: 0 0 40px;
}
#top .sec01 .history .h-txt .txt01 li,
#top .sec01 .history .h-txt .txt02 li {
	font-size: 16px;
	line-height: 1.8em;
	padding: 0 0 0 20px;
	box-sizing: border-box;
	position: relative;
}
#top .sec01 .history .h-txt .txt01 li:before {
	content: "";
	display: block;
	position: absolute;
	width: 4px;
	height: 4px;
	background: #111;
	border-radius: 100px;
	top: 11px;
	left: 0;
}
#top .sec01 .history .h-txt .txt02 li:before {
	content: "";
	display: block;
	position: absolute;
	width: 6px;
	height: 6px;
	background: #111;
	transform: translateY(-50%) rotate(45deg);
	top: 13px;
	left: 0;
}

/*------------------------------------------------------------
 sec01 extra
------------------------------------------------------------*/
#top .sec01e {
	width: 100%;
	height: auto;	
	/* -45度斜めから25%、50%、75%、100%とボーダーが交互に色違いとなるように指定 */
  background: linear-gradient(
    -45deg,
    #fbf1de 22%,
    #f9ebd0 22%, #f9ebd0 50%,
    #fbf1de 50%, #fbf1de 72%,
    #f9ebd0 72%, #f9ebd0
  );
  background-size: 20px 20px;
  margin: 0;
	padding: 40px 0;
	box-sizing: border-box;
}
#top .sec01e .txt-box {
	text-align: center;
}
#top .sec01e .txt-box .txt01 {
	font-size: 16px;
	text-align: center;
	line-height: 2.0em;
	margin: 0 30px;
}
#top .sec01e .txt-box .name {
	font-size: 20px;
	line-height: 1;
	margin: 0 90px;
}

/*------------------------------------------------------------
 sec02
------------------------------------------------------------*/
#top .sec02 {
	width: 100%;
	height: auto;	
	/* -45度斜めから25%、50%、75%、100%とボーダーが交互に色違いとなるように指定 */
  background: linear-gradient(
    -45deg,
    #fbf1de 22%,
    #f9ebd0 22%, #f9ebd0 50%,
    #fbf1de 50%, #fbf1de 72%,
    #f9ebd0 72%, #f9ebd0
  );
  background-size: 20px 20px;
	padding: 80px 0 90px;
	box-sizing: border-box;
}

/*----- block -----*/
#top .sec02 .block {
	width: 340px;
	height: 600px;
	background: #fff;
	border: 4px solid #412110;
	border-radius: 10px;
	box-shadow: 10px 10px #412110;
	text-align: center;
	padding: 40px 0 0;
	box-sizing: border-box;
}
#top .sec02 .block .img-box img.img01 {
	width: 140px;
	height: 140px;
	margin: 0 0 30px;
}
#top .sec02 .block .img-box img.img02 {
	width: 260px;
	height: 160px;
	margin: 0 auto 60px;
}
#top .sec02 .block03 .img-box img.img02 {
	margin: 0 auto 30px;
}
#top .sec02 .block .txt-box p {
	font-size: 16px;
	line-height: 1.8em;
}
#top .sec02 .block03 .txt-box {
	padding: 0 40px;
	box-sizing: border-box;
}
#top .sec02 .block .txt-box li {
	color: #412110;
	font-size: 16px;
	text-align: left;
	margin: 0 0 10px;
}
#top .sec02 .block .txt-box li span {
	color: #f23026;
}

/*------------------------------------------------------------
 sec03
------------------------------------------------------------*/
#top .sec03 {
	padding: 80px 0 60px;
	box-sizing: border-box;
}

/*----- block -----*/
#top .sec03 .block {
	margin: 0 0 80px;
}
#top .sec03 .block:nth-child(n+3) {
	margin: 0 0 0;
}
#top .sec03 .block .img-box {
	width: 520px;
	height: 400px;
	position: relative;
	z-index: -10;
}
#top .sec03 .block .img-box img {
	width: 520px;
	height: 400px;
}
#top .sec03 .block .img-box h3::before {
	content: "";
	display: block;
  position: absolute;
	width: 270px;
	height: 64px;
	font-size: 28px;
	text-align: center;
	line-height: 60px;
	margin: auto;
	top: -30px;
	left: 0;
	right: 0;
}
#top .sec03 .block .img-box01 h3::before {
	background: url("../images/sec03-sub01.png") center center no-repeat;
	background-size: 100% auto;
}
#top .sec03 .block .img-box02 h3::before {
	background: url("../images/sec03-sub02.png") center center no-repeat;
	background-size: 100% auto;
}
#top .sec03 .block .img-box03 h3::before {
	background: url("../images/sec03-sub03.png") center center no-repeat;
	background-size: 100% auto;
}
#top .sec03 .block .img-box04 h3::before {
	background: url("../images/sec03-sub04.png") center center no-repeat;
	background-size: 100% auto;
}
#top .sec03 .block .img-box h3 {
	overflow: hidden;
  text-indent: 100%;
  white-space: nowrap;
}

/*----- txt-box -----*/
#top .sec03 .txt-wrap {
  padding: 0 20px;
  box-sizing: border-box;
}
#top .sec03 .txt-box {
	width: 480px;
	height: auto;
	background: rgba(255,255,255,0.9);
	border-radius: 8px;
	margin: -50px 0 0 0;
	padding: 30px;
	box-sizing: border-box;
	z-index: 10;
}
#top .sec03 .txt-box p {
	font-size: 16px;
	text-align: justify;
	line-height: 1.8em;
	margin: 0 0 20px;
}
#top .sec03 .txt-box .btn {
	width: 100%;
	height: 60px;
	font-size: 18px;
	text-align: center;
	line-height: 60px;
}
#top .sec03 .txt-box .btn a {
	color: #111;
	font-weight: bold;
	border: 3px solid #111;
	border-radius: 100px;
}
#top .sec03 .txt-box .btn a:hover {
	color: #fff;
	font-weight: bold;
	background: #fba104;
	border: 3px solid #fba104;
	border-radius: 100px;
}

/*------------------------------------------------------------
 entry
------------------------------------------------------------*/
#top .entry {
	width: 100%;
	height: auto;	
	/* -45度斜めから25%、50%、75%、100%とボーダーが交互に色違いとなるように指定 */
  background: linear-gradient(
    -45deg,
    #fbf1de 22%,
    #f9ebd0 22%, #f9ebd0 50%,
    #fbf1de 50%, #fbf1de 72%,
    #f9ebd0 72%, #f9ebd0);
  background-size: 20px 20px;
	padding: 80px 0 80px;
	box-sizing: border-box;
}
#top .entry .txt-wrap {
	background: #fff;
	text-align: center;
	padding: 80px 0 80px;
	box-sizing: border-box;
}
#top .entry .txt-box p {
	font-size: 16px;
	line-height: 1.5em;
	margin: 0 0 40px;
}
#top .entry .btn {
	width:420px;
	height: 70px;
	font-size: 18px;
	text-align: center;
	line-height: 70px;
	margin: auto;
}
#top .entry .btn a {
	color: #fff;
	font-weight: bold;
	background: #ef3300;
	border-radius: 100px;
}

/*------------------------------------------------------------
 sec04
------------------------------------------------------------*/
#top .sec04 {
	width: 100%;
	height: auto;
	background: url("../images/sec04-bg.jpg") center center no-repeat;
	background-size: cover;
	text-align: center;
	padding: 80px 0 80px;
	box-sizing: border-box;
}
#top .sec04 h3 {
	font-size: 32px;
	margin: 0 0 40px;
}
#top .sec04 p {
	font-size: 16px;
	line-height: 1.8em;
	margin: 0 0 40px;
}
#top .sec04 .btn {
	width:420px;
	height: 70px;
	font-size: 18px;
	text-align: center;
	line-height: 70px;
	margin: auto;
}
#top .sec04 .btn a {
	color: #fff;
	font-weight: bold;
	border: 3px solid #fff;
	border-radius: 100px;
}
#top .sec04 .btn a:hover {
	color: #fff;
	font-weight: bold;
	background: #fba104;
	border: 3px solid #fba104;
	border-radius: 100px;
}

/*------------------------------------------------------------
 sec05
------------------------------------------------------------*/
#top .sec05 {
	width: 100%;
	height: auto;	
	/* -45度斜めから25%、50%、75%、100%とボーダーが交互に色違いとなるように指定 */
  background: linear-gradient(
    -45deg,
    #ffffff 25%,
    #f6efe3 25%, #f6efe3 50%,
    #ffffff 50%, #ffffff 75%,
    #f6efe3 75%, #f6efe3);
  background-size: 10px 10px;
	padding: 80px 0 80px;
	box-sizing: border-box;
}
#top .sec05 .txt-box .txt {
  display: -webkit-flex;
  display: flex;
  -webkit-align-items: center;
  align-items: center;
	margin: 0 0 35px 0;
	padding: 0 0 0 200px;
	box-sizing: border-box;
}
#top .sec05 .txt-box .txt:last-child {
	margin: 0 0 0 0;
}
#top .sec05 .txt-box h4 {
	width: 180px;
	height: 35px;
	font-size: 16px;
	background: #fba104;
	border-radius: 100px;
	text-align: center;
	line-height: 35px;
	margin: 0 50px 0 0;
}
#top .sec05 .txt-box p {
	font-size: 16px;
}
#top .sec05 .txt-box p span {
	font-size: 12px;
}

/*------------------------------------------------------------
 copy
------------------------------------------------------------*/
.copy {
	width: 100%;
	height: 60px;
	font-size: 12px;
	background: #412110;
	text-align: center;
	line-height: 60px;
}
