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

body {
	font-family: sans-serif;
	font-size: 90%;
}
.ly_pc { display: none; }

@media screen and (max-width: 374px) {
	body {
		font-size: 76%;
	}
}

/* header
--------------------------------------------------- */
header p {
	padding: 1em 0;
	text-align: center;
}
nav {
	background: #419988;
}
nav ul li a {
	position: relative;
	display: block;
	box-sizing: border-box;
	width: 100%;
	padding: 0 1em 0 2.3em;
	border-bottom: solid 1px #fff;
	text-decoration: none;
	color: #fff;
}
nav ul li a:before {
	content: "";
	position: absolute;
	display: inline-block;
	left: 1em;
	top: 1.3em;
	width: 0;
	height: 0;
	border-style: solid;
	border-width: 6px 0 6px 10px;
	border-color: transparent transparent transparent #ffffff;
}
nav ul li a span {
	display: table-cell;
	height: 3.6em;
	vertical-align: middle;
	line-height: 1.2;
	font-size: 93.75%;
}

/* .sec01_head
--------------------------------------------------- */
.sec01_head .title {
	position: relative;
	margin: 1em 0;
}
.sec01_head .title span img {
	width: 100%;
}
.sec01_head .title > img {
	position: absolute;
	left: 0;
	top: 3em;
	width: 100%;
	opacity: 0;
	transition: 0.5s;
}
.sec01_head .title img.ttl01 { transition-delay: 0.6s; }
.sec01_head .title img.ttl02 { transition-delay: 0.7s; }
.sec01_head .title img.ttl03 { transition-delay: 0.8s; }
.sec01_head .title img.ttl04 { transition-delay: 0.9s; }
.sec01_head .title img.ttl05 { transition-delay: 1.0s; }
.sec01_head .title img.ttl06 { transition-delay: 1.1s; }
.sec01_head .title img.ttl07 { transition-delay: 1.2s; }
.sec01_head .title img.ttl08 { transition-delay: 1.3s; }
.sec01_head .title img.ttl09 { transition-delay: 1.4s; }
.sec01_head .title img.ttl10 { transition-delay: 1.5s; }
.sec01_head .title img.ttl11 { transition-delay: 1.6s; }
.sec01_head .title img.ttl12 { transition-delay: 1.7s; }
.sec01_head .title img.ttl13 { transition-delay: 1.8s; }
.sec01_head .title img.ttl14 { transition-delay: 1.9s; }
.sec01_head .title img.ttl15 { transition-delay: 2.0s; }
.sec01_head .title img.ttl16 { transition-delay: 2.1s; }
.sec01_head .title img.ttl17 { transition-delay: 2.2s; }
.sec01_head .title.on > img {
	top: 0;
	opacity: 1;
}
.sec01_head .lead {
	margin: 0 5%;
	font-size: 112.5%;
	font-weight: bold;
	color: #C6343F;
}

/* .sec01
--------------------------------------------------- */
.sec01 {
	margin: 0 5%;
}
.sec01 .subttl {
	margin-top: 1em;
	font-size: 200%;
	font-weight: bold;
	color: #419988;
}
.sec01 .subttl span {
}
.sec01 .text {
	margin-top: 1em;
}
.graph01_sp {
	margin-top: 0.5em;
	text-align: center;
	opacity: 0;
	transition: 1.5s;
	transition-delay: 1s;
}
.graph01_sp.on {
	opacity: 1;
}

/* .sec02
--------------------------------------------------- */
.sec02 {
	margin: 0 5%;
}
.sec02 .subttl {
	margin-top: 1em;
	font-size: 200%;
	font-weight: bold;
	color: #419988;
}
.sec02 .text {
	margin-top: 1em;
}
.graph02_sp p {
	margin-top: 1em;
	text-align: center;
	opacity: 0;
	transition: 1s;
}
.graph02_sp p.on {
	opacity: 1;
	transition-delay: 1s;
}

/* .sec03
--------------------------------------------------- */
.sec03 {
	margin-top: 2em;
	padding: 2em 5%;
	background: #F7F5F2;
}
.sec03 .title {
	padding-left: 0.5em;
	border-left: solid 6px #C6343F;
	line-height: 1.2;
	font-size: 180%;
	font-weight: bold;
	color: #C6343F;
}
.sec03 .lead {
	margin-top: 1.5em;
	font-size: 112.5%;
	font-weight: bold;
}
.sec03 .inbox {
	position: relative;
	box-sizing: border-box;
	margin-top: 3em;
	padding: 90px 5% 5%;
	border: solid 2px #C6343F;
	border-radius: 10px;
}
.sec03 .inbox h3 {
	position: absolute;
	left: 50%;
	top: -30px;
	margin-left: -51px;
}
.sec03 .inbox h4 {
	font-size: 140%;
	font-weight: bold;
	color: #C6343F;
}
.sec03 .inbox .text {
	margin-top: 0.75em;
}
.sec03 .inbox .subttl {
	margin-top: 1em;
}
.graph03_sp {
	margin-top: 1em;
	text-align: center;
	opacity: 0;
	transition: 1s;
	transition-delay: 1s;
}
.graph03_sp.on {
	opacity: 1;
}
.sec03_02_img01 {
	margin-top: 1em;
	text-align: center;
	opacity: 0;
	transition: 1s;
	transition-delay: 1s;
}
.sec03_02_img01.on {
	opacity: 1;
}
.sec03 .sec03_02 .text {
	padding-top: 0.5em;
}

/* .sec04
--------------------------------------------------- */
.sec04 {
	margin: 0 5%;
	padding: 2em 0;
}
.sec04 .title {
	padding-left: 0.5em;
	border-left: solid 6px #419988;
	line-height: 1.2;
	font-size: 180%;
	font-weight: bold;
	color: #419988;
}
.sec04 .subttl {
	position: relative;
	margin: 1.5em 0 0;
	padding-left: 1em;
	font-size: 125%;
	font-weight: bold;
	color: #419988;
}
.sec04 .subttl:before {
	content: "";
	position: absolute;
	display: inline-block;
	left: 0;
	top: 0.4em;
	width: 0;
	height: 0;
	border-style: solid;
	border-width: 7px 0 7px 10px;
	border-color: transparent transparent transparent #419987;
}
.sec04 .img01 {
	text-align: center;
}
.sec04 .img01 li {
	display: inline-block;
	width: 32%;
	margin-top: 1em;
	vertical-align: bottom;
}
.sec04 .img01 li img {
	opacity: 0;
	transform: rotate(20deg) scale(0.7, 0.7);
	transition: 1.1s;
}
.sec04 .img01 li.on img {
	opacity: 1;
	transform: rotate(0deg) scale(1, 1);
}
.sec04 .img01 li .cap {
	display: block;
	height: 3em;
	margin-top: 1em;
	line-height: 1.4;
	font-size: 90%;
	font-weight: bold;
	color: #419988;
	opacity: 0;
	transition: 2s;
}
.sec04 .img01.on li .cap {
	opacity: 1;
}
.sec04 .img02 {
	text-align: center;
}
.sec04 .img02 li {
	position: relative;
	display: inline-block;
	box-sizing: border-box;
	width: 30%;
	margin-top: 1em;
	background: url(../images/sec04/sec04_img06.png) no-repeat;
	background-size: 100% auto;
	text-align: center;
	opacity: 0;
	transform: scale(0,0);
	transition: 1s;
}
.sec04 .img02 li.on {
	background: none;
	transform: scale(1,1);
	opacity: 1;
}
.sec04 .img02 li span {
	position: absolute;
	display: table;
	left: 0;
	top: 0;
	width: 100%;
	height: 6.5em;
	vertical-align: middle;
	line-height: 1.2;
	font-size: 110%;
	font-weight: bold;
	color: #419988;
}
.sec04 .img02 li span em {
	display: table-cell;
	vertical-align: middle;
}

/* .sec05
--------------------------------------------------- */
.sec05 {
	padding: 2em 5%;
	background: #F7F5F2;
}
.sec05 .title {
	padding-left: 0.5em;
	border-left: solid 6px #C6343F;
	line-height: 1.2;
	font-size: 180%;
	font-weight: bold;
	color: #C6343F;
}
.sec05 .inbox {
	position: relative;
	margin-top: 1.5em;
	padding: 1em 5%;
	border-radius: 10px;
	background: #fff;
}
.sec05 .inbox .subttl {
	text-align: center;
	line-height: 1.3;
	font-size: 150%;
	font-weight: bold;
	color: #C6343F;
}
.sec05 .inbox ul {
	display: table;
	width: 100%;
}
.sec05 .inbox ul li {
	float: left;
	display: table;
	width: 48%;
	margin: 1em 0 0 0;
}
.sec05 .inbox ul li:nth-child(even) {
	float: right;
}
.sec05 .inbox ul li:nth-child(5n) {
	margin-right: 0;
}
/*.sec05 .inbox ul li.cat01 span {
	background: #eb758f;
}
.sec05 .inbox ul li.cat02 span {
	background: #7bc13c;
}
.sec05 .inbox ul li.cat03 span {
	background: url(../images/sec05/sec05_bg03.png) center repeat-y;
}*/
.sec05 .inbox ul li span {
	display: table-cell;
	width: 165px;
	height: 6em;
	background: #fff0a7;
	vertical-align: middle;
	text-align: center;
	color: #c73944;
	transform: scale(0,0);
	opacity: 0;
	transition: 1s;
	transition-delay: 0.5s;
}
.sec05 .inbox ul li.on span {
	transform: scale(1,1);
	opacity: 1;
}
.sec05 .inbox .cap {
	margin-top: 1em;
	font-size: 100%;
	font-weight: bold;
}
.sec05 .inbox .cap .cat01 {
	color: #eb758f;
}
.sec05 .inbox .cap .cat02 {
	color: #7bc13c;
}
.sec05 .arw {
	text-align: center;
	opacity: 0;
	transition: 1s;
	transition-delay: 1s;
}
.sec05 .arw img {
	display: block;
	width: 2em;
	margin: 0 auto;
}
.sec05 .arw.on {
	opacity: 1;
}
.sec05 .catch {
	margin-top: 0.3em;
	text-align: center;
	line-height: 1.4;
	font-size: 180%;
	font-weight: bold;
	color: #C6343F;
	opacity: 0;
	transition: 1s;
	transition-delay: 1.5s;
}
.sec05 .catch.on {
	opacity: 1;
}

/* .sec06
--------------------------------------------------- */
.sec06 {
	margin: 0 5%;
	padding: 2em 0;
}
.sec06 .title {
	text-align: center;
	line-height: 1;
	font-size: 220%;
	font-weight: bold;
	color: #eb758f;
}
.sec06 .title span {
	display: inline-block;
	margin-bottom: -5px;
	padding-bottom: 10px;
	border-bottom: solid 4px #eb758f;
}
.sec06 .title small {
	font-size: 46%;
}
.sec06 .catch {
	margin: 1em 5% 0;
	background: url(../images/sec06/sec06_cth_bg.png) center top no-repeat;
	background-size: contain;
	text-align: center;
	opacity: 0;
	transition: 1s;
	transition-delay: 1s;
}
.sec06 .catch.on {
	opacity: 1;
}
.sec06 .catch img {
	opacity: 0;
	transition: 1s;
	transition-delay: 1.5s;
}
.sec06 .catch.on img {
	top: 0;
	opacity: 1;
}
.sec06 .inbox {
	margin-top: 1.5em;
}
.sec06 .inbox.pht {
	text-align: center;
}
.sec06 .inbox .subindex {
	width: 10em;
	padding: 0.3em 0;
	border-radius: 5px;
	background: #eb758f;
	line-height: 28px;
	text-align: center;
	font-size: 150%;
	color: #fff;
}
.sec06 .inbox .subindex span {
	display: inline-block;
	margin-left: 0.3em;
}
.sec06 .inbox .subttl {
	margin-top: 0.5em;
	line-height: 1.4;
	font-size: 150%;
	font-weight: bold;
	color: #eb758f;
}
.sec06 .inbox .sublead {
	margin-top: 0.75em;
	padding-left: 1em;
	text-indent: -1em;
	font-size: 120%;
	font-weight: bold;
	color: #969696;
}
.sec06 .inbox .text {
	margin-top: 0.75em;
	line-height: 1.6;
}
.sec06 .inbox_graph {
	margin-top: 2em;
}
.sec06 .inbox_graph .subttl {
	position: relative;
	margin-bottom: 0.5em;
	padding-left: 0.75em;
	line-height: 1.3;
	text-align: left;
	font-size: 150%;
	font-weight: bold;
	color: #eb758f;
}
.sec06 .inbox_graph .subttl:before {
	content: "";
	position: absolute;
	display: inline-block;
	left: 0;
	top: 0.3em;
	width: 0;
	height: 0;
	border-style: solid;
	border-width: 6px 0 6px 8px;
	border-color: transparent transparent transparent #eb758f;
}
.graph0405_sp {
	position: relative;
	margin: 0 5%;
}
.graph0405_sp img.base {
	position: absolute;
	left: 0;
	top: 0;
	opacity: 0;
	transition: 1s;
	transition-delay: 0.5s;
}
.graph0405_sp.on img.base {
	opacity: 1;
}
.graph0405_sp img.text {
	position: relative;
	left: 0;
	top: 20px;
	opacity: 0;
	transition: 1s;
	transition-delay: 0.8s;
}
.graph0405_sp.on img.text {
	top: 0;
	opacity: 1;
}

/* .sec07
--------------------------------------------------- */
.sec07 {
	margin: 0 5%;
	padding: 2em 0;
}
.sec07 .title {
	text-align: center;
	line-height: 1.2;
	font-size: 220%;
	font-weight: bold;
	color: #7bc13c;
}
.sec07 .title span {
	display: inline-block;
	margin-bottom: -5px;
	padding-bottom: 10px;
	border-bottom: solid 5px #7bc13c;
}
.sec07 .title small {
	font-size: 46%;
}
.sec07 .catch {
	margin: 1em 5% 0;
	background: url(../images/sec07/sec07_cth_bg.png) center top no-repeat;
	background-size: contain;
	text-align: center;
	opacity: 0;
	transition: 1s;
	transition-delay: 1s;
}
.sec07 .catch.on {
	opacity: 1;
}
.sec07 .catch img {
	opacity: 0;
	transition: 1s;
	transition-delay: 1.5s;
}
.sec07 .catch.on img {
	top: 0;
	opacity: 1;
}
.sec07 .inbox {
	margin-top: 1.5em;
}
.sec07 .inbox.pht {
	text-align: center;
}
.sec07 .inbox .subindex {
	width: 10em;
	padding: 0.3em 0;
	border-radius: 5px;
	background: #7bc13c;
	line-height: 28px;
	text-align: center;
	font-size: 150%;
	color: #fff;
}
.sec07 .inbox .subindex span {
	display: inline-block;
	margin-left: 0.3em;
}
.sec07 .inbox .subttl {
	margin-top: 0.5em;
	line-height: 1.4;
	font-size: 150%;
	font-weight: bold;
	color: #7bc13c;
}
.sec07 .inbox .sublead {
	margin-top: 0.75em;
	padding-left: 1em;
	text-indent: -1em;
	font-size: 120%;
	font-weight: bold;
	color: #969696;
}
.sec07 .inbox .text {
	margin-top: 0.75em;
	line-height: 1.6;
}
.sec07 .inbox_graph {
	margin-top: 2em;
}
.sec07 .inbox_graph .subttl {
	position: relative;
	margin-bottom: 0.5em;
	padding-left: 0.75em;
	line-height: 1.3;
	font-size: 150%;
	font-weight: bold;
	color: #7bc13c;
}
.sec07 .inbox_graph .subttl:before {
	content: "";
	position: absolute;
	display: inline-block;
	left: 0;
	top: 0.3em;
	width: 0;
	height: 0;
	border-style: solid;
	border-width: 6px 0 6px 8px;
	border-color: transparent transparent transparent #7bc13c;
}
.graph0607_sp {
	position: relative;
	margin: 0 5%;
}
.graph0607_sp img.base {
	position: absolute;
	left: 0;
	top: 0;
	opacity: 0;
	transition: 1s;
	transition-delay: 0.5s;
}
.graph0607_sp.on img.base {
	opacity: 1;
}
.graph0607_sp img.text {
	position: relative;
	left: 0;
	top: 20px;
	opacity: 0;
	transition: 1s;
	transition-delay: 0.8s;
}
.graph0607_sp.on img.text {
	top: 0;
	opacity: 1;
}

/* .sec08
--------------------------------------------------- */
.sec08 {
	margin: 0 5%;
	padding: 0 0;
}
.sec08 .arrow {
	text-align: center;
	opacity: 0;
	transition: 1s;
	transition-delay: 1s;
}
.sec08 .arrow img {
	display: block;
	width: 3em;
	margin: 0 auto;
}
.sec08 .arrow.on {
	opacity: 1;
}
.sec08 .catch {
	margin-top: 0.5em;
	line-height: 1.6;
	text-align: center;
	font-size: 180%;
	font-weight: bold;
	color: #c6343f;
	opacity: 0;
	transition: 1s;
	transition-delay: 1s;
}
.sec08 .catch.on {
	opacity: 1;
}
.sec08 .bnr {
	margin: 2em 0;
	text-align: center;
}
.sec08 .bnr li {
	margin: 0 5% 1.5em;
}
.sec08 .bnr li span {
	display: block;
	margin: 0 0 0.5em 0.5em;
	text-align: left;
	font-variant-position: 125%;
	font-weight: bold;
}
.sec08 .bnr li:first-of-type span {
	color: #eb758f;
}
.sec08 .bnr li:nth-last-of-type(2) span {
	color: #7bc13c;
}
.sec08 .bnr li:last-of-type span {
	color: #585858;
}

/* footer
--------------------------------------------------- */
footer {
	border-top: solid 3px #c8c8c8;
}
.footer_in {
	margin: 0 5%;
	padding: 2em 0 1.5em;
}
.footer_logo {
}
.footer_nav {
	margin-top: 1.5em;
}
.footer_nav li {
	display: inline-block;
	margin: 0 1em 0.5em 0;
}
.footer_nav li a {
	display: block;
	font-size: 81.25%;
	padding-left: 1.5em;
	background: url(../images/footer_arrow.png) left center no-repeat;
	text-decoration: none;
	color: #656464;
}
.copyright {
	width: 90%;
	padding: 1em 5%;
	border-top: solid 1px #c8c8c8;
	font-size: 68.75%;
	color: #656464;
}

/* pagetop
--------------------------------------------------- */
#pagetop {
	position: fixed;
	right: 5%;
	bottom: 2%;
	opacity: 0.5;
}
#pagetop a {
	position: relative;
	display: block;
	width: 60px;
	height: 60px;
	border-radius: 30px;
	background: #c6343f;
	text-indent: -9999px;
	transition: 0.3s;
}
#pagetop a:before {
	content: "";
	position: absolute;
	display: inline-block;
	top: 50%;
	left: 50%;
	width: 0;
	height: 0;
	margin: -14px 0 0 -13.5px;
	border-style: solid;
	border-width: 0 13.5px 24px 13.5px;
	border-color: transparent transparent #ffffff transparent;
}









