/*------------------------------------
汎用
------------------------------------*/
html {width: 100%; min-width: 1280px;}
body {width: 100%; min-width: 1280px; min-height: 100%;}
main {min-height: 100vh; position: relative;}

/*pc限定*/
.sp {display: none!important;}

/*clearfix*/
.clearfix {}
.clearfix:after {content: ""; display: block; clear: both; visibility: hidden;}

/*コンティナ*/
.container {display: block; width: 1060px; margin: 0 auto;}

/*汎用flex*/
.flex-box {display: flex; flex-wrap: wrap;}

/*パンくずリスト*/
#breadcrumbs {width: 1060px; margin: 0 auto 30px;}
#breadcrumbs ul {display: flex; justify-content: flex-end; align-items: center; margin: 0 auto;}
#breadcrumbs ul li {display: inline-block; font-size: .85em; line-height: 1; padding: 20px 0.5rem;}
#breadcrumbs ul li:first-child {padding-left: 0;}
#breadcrumbs ul li a {display: inline-block; color: #333; vertical-align: middle;}
#breadcrumbs ul li a i {display: inline-block;}
#breadcrumbs ul li a i.fa-home {color: #2bb9ac; font-size: 1.5em;}

/*ページネーション*/
.pagination {display: flex; justify-content: center; line-height: 2; text-align: center; margin: 60px auto;}
.pagination span, .pagination a {line-height: 1; padding: 18px 16px; width: auto; background: #fff;}
.pagination a {display: inline-block; color: #2bb9ac;}
.pagination a:hover {color: #fff; background: #2bb9ac; opacity: 1;}
.pagination .current {background: #2bb9ac; color: #fff; opacity: 1;}

/*上のアレ*/
.page-visual {text-align: center; background: linear-gradient(to right, #7864cf 0%, #3483d7 53%, #2bb9ac 100%); margin: 0!important; padding: 160px 0 150px;}
.page-visual span {display: block; color: #fff; line-height: 1.25;}
.page-visual span.en {font-family: 'Lato', sans-serif; font-size: 56px;}
.page-visual span.jp {font-size: 20px;}

/*オレンジ*/
.orange {color: #ff931e!important; font: inherit;}

/*グラデ見出し*/
.gradation {text-align: center;}
.gradation span {
	display: inline-block;
	font-size: 3em;
	line-height: 1.5;
	font-weight: 700;
	text-align: center;
	color: #3483d7;
	background: linear-gradient(to right, #7864cf 0%, #3483d7 53%, #2bb9ac 100%);
	-webkit-background-clip: text;
	-webkit-text-fill-color: transparent;
}
@media all and (-ms-high-contrast:none){.gradation span {background: none;}}

/*ボーダー（円付き）*/
.border-c {padding: 0 0 10px;}
.border-c span {display: block;}
.border-c .text {margin: 0 6px 6px;}
.border-c .btm {position: relative; width: 100%; height: 1px; background: linear-gradient(to right, #7864cf 0%, #3483d7 53%, #2bb9ac 100%);}
.border-c .btm:before {bottom: -3px; left: -3px; width: 7px; height: 7px; background: #7864cf;}
.border-c .btm:after {bottom: -6px; left: -6px; width: 11px; height: 11px; border: 1px solid #7864cf;}
.border-c .btm:before,.border-c .btm:after {content: ""; display: block; position: absolute; border-radius: 50%;}
.border-c.white .btm {background: #fff;}
.border-c.white .btm:before {background: #fff;}
.border-c.white .btm:after {border: 1px solid #fff;}

/*白背景*/
.back-white {width: 800px; background: #fff; margin: 40px auto; padding: 48px; border-radius: 20px; box-shadow: 0 0 24px 8px rgba(0,0,0, .1);}

/*固定背景*/
.head_img {width: 100%; height: 420px; background: center/100% auto no-repeat; background-attachment: fixed;}
/*--------------------------------------------------------------------------
ヘッダー
--------------------------------------------------------------------------*/
header {width: 100%; position: fixed; top:0; left:0; background: transparent; z-index: 100; transition: .3s all ease;}
header .container {width: calc(100% - 120px); height: 100px; align-items: center; padding: 0 60px;}
header .logo {margin-right: auto;}
header .logo .icon {margin-right: 25px;}
header .navi {align-items: center;}
header .navi nav {margin-right: 40px;}
header .navi nav li {line-height: 1; padding: 0 20px; border-right: 1px solid #fff;}
header .navi nav li:last-child {padding: 0 0 0 20px; border-right: none;}
header .navi nav li a {color: #fff;}
header .navi .sns li {display: block; margin-right: 10px;}
header .navi .sns li:last-child {margin-right: 0;}
header .navi .sns li a img {width: 36px; height: 36px; border-radius: 50%;}

header.conversion {background: #fff;}
header.conversion .navi nav li {border-right: 1px solid #4d4d4d;}
header.conversion .navi nav li:last-child {border-right: none;}
header.conversion .navi nav li a {color: #4d4d4d;}
/*--------------------------------------------------------------------------
----------------------------------------------------------------------------
----------------------------------------------------------------------------
トップページ
----------------------------------------------------------------------------
----------------------------------------------------------------------------
--------------------------------------------------------------------------*/
#front {}

#front .top {position: relative; width: 100%; height: 100vh;}
#front .top .cont {position: absolute; top:50%; left: 50%; transform: translate(-50%,-50%); width: 100%; text-align: center; z-index: 1;}
#front .top .cont h1 {color: #fff; font-size: 3.2em; font-weight: 700; letter-spacing: 4px;}
#front .top .cont p {font-family: 'Lato', sans-serif; color: #d4d4d4; font-size: 1.75em; line-height: 1.5; letter-spacing: 2px;}
#front .top .link {position: absolute; bottom: 60px; left: 50%; transform: translate(-50%,0); z-index: 1; text-align: center;}
#front .top .link span {display: block; color: #26d3ba; font-size: 1.6em; font-weight: 700; margin-bottom: 20px;}
#front .top .link i {color: #26d3ba; font-size: 2.4em;}

/*--------------------------------------------------------------------------
sec01
--------------------------------------------------------------------------*/
#front .sec01 {width: 100%; position: relative; padding-top: 80px;}
#front .sec01 .cont a {display: block; position: relative; width: 720px; height: 68px; margin: 0 auto 70px;}
#front .sec01 .cont a span {
	position: absolute;
	top: 0;
	left: 0;
	display: block;
	width: 100%;
	height: 24px;
	padding: 22px 0;
	line-height: 1;
}
#front .sec01 .cont a span.shadow {
	background: transparent;
	box-shadow: -14px 14px 14px rgba(0,0,0, .5);
	transform: skew(30deg);
	z-index: 1;
}
#front .sec01 .cont a span.back {
	background: #7864cf;
	background: linear-gradient(to right, #7864cf 0%, #3483d7 53%, #2bb9ac 100%);
	transform: skew(30deg);
	transition: all .2s ease;
	z-index: 2;
}
#front .sec01 .cont a span.text:before,#front .sec01 .cont a span.text:after {content: ""; display: block; position: absolute; background: #fff;}
#front .sec01 .cont a span.text:before {top: 50%; right: 30px; width: 148px; height: 2px;}
#front .sec01 .cont a span.text:after {top: 0; right: 38px; width: 2.5px; height: 36px; transform: skew(30deg);}
#front .sec01 .cont a span.text {
	color: #fff;
	font-size: 1.6em;
	font-weight: 700;
	text-align: center;
	margin: 0;
	background: transparent;
	transition: all .2s ease;
	z-index: 3;
}
#front .sec01 .cont a:active span.back,#front .sec01 .cont a:active span.text {top: 5px;}
#front .sec01 .information {position: relative; margin: 0 auto -340px; z-index: 1;}
#front .sec01 .information .market_price {justify-content: space-between; margin-bottom: 40px;}
#front .sec01 .information .market_price h2 {width: 100%; color: #666; font-size: 1.25em; font-weight: 700; margin-bottom: 6px; padding: .5em .75em;}
#front .sec01 .information .market_price h2 i {font-size: 1em; margin-right: 6px;}
#front .sec01 .information .market_price li {
	position: relative;
	width: calc(22% - 44px);
	background: #fff;
	padding: 10px 12px;
	border: 12px solid #dbdcdc;
	overflow: hidden;
	box-shadow: 8px 8px 8px 2px rgba(0,0,0, .1);
}
#front .sec01 .information .market_price li .text {position: relative; flex-wrap: nowrap; align-items: right; z-index: 1;}
#front .sec01 .information .market_price li .text h3 {text-align: right; font-size: 1.4em; font-weight: 700; line-height: 1.5;}
#front .sec01 .information .market_price li .text p {position: relative; text-align: right; font-size: 1.7em; font-weight: 700; line-height: 1.25; margin: 36px 0 5px;}
#front .sec01 .information .market_price li .text p:after {content: ""; position: absolute; bottom: -5px; display: block; width: 100%; height: 2px; background:#333;}
#front .sec01 .information .market_price li img {position: absolute; top: -12px; left: -28px; width: 136px; height: 136px; z-index: 0; opacity: .6;}
#front .sec01 .information .news_list {border: 4px solid #006fff; background: #fff;}
#front .sec01 .information .news_list h2 {
	position: relative;
	display: inline-block;
	font-size: 1.1em;
	color: #fff;
	font-weight: 700;
	background: #006fff;
	padding: 2px 40px 4px 20px;
}
#front .sec01 .information .news_list h2:after {
	content: "";
	position: absolute;
	display: inline-block;
	top: 0;
	right: -25px;
	width: 0;
	height: 0;
	border-style: solid;
	border-width: 0px 0 35px 25px;
	border-color: transparent transparent transparent #006fff;
}
#front .sec01 .information .news_list ul {padding: 32px;}
#front .sec01 .information .news_list ul li {margin-bottom: 32px;}
#front .sec01 .information .news_list ul li:last-child {margin-bottom: 0;}
#front .sec01 .information .news_list ul li a {flex-wrap: nowrap;}
#front .sec01 .information .news_list ul li a .img {min-width: 260px; max-width: 260px; height: 200px;}
#front .sec01 .information .news_list ul li a .img img {
	width: 100%;
	height: 100%;
	object-fit: cover;
	object-position: 50%;
	font-family: 'object-fit: cover; object-position: 50%;';
}
#front .sec01 .information .news_list ul li a .text {margin-left: 32px;}
#front .sec01 .information .news_list ul li a .cat {display: inline-block; background: #888; color: #fff; font-size: .95em; padding: 1px 10px 0; border-radius: 4px;}
#front .sec01 .information .news_list ul li a .cat.oshirase {background: #ff931e;}
#front .sec01 .information .news_list ul li a .cat.news {background: #3fa9f5;}
#front .sec01 .information .news_list ul li a .date {margin-left: .75em; font-size: 1.1em;}
#front .sec01 .information .news_list ul li a h3 {font-size: 1.2em; font-weight: 700; margin: 10px 0;}
#front .sec01 .information .news_list ul li a p i {color: #006fff; margin-left: .35em;}
#front .sec01 .information .news_list .link {display: block; width: 280px; color: #fff; text-align: center; background: #006fff; margin: 0 32px 32px auto; padding: 12px 0;}
#front .sec01 .information .news_list .link i {color: #ffffa1; margin-left: .35em;}

/*--------------------------------------------------------------------------
sec02
--------------------------------------------------------------------------*/
#front .sec02 {}
#front .sec02 .main {
	position: relative;
	width: 100%;
	height: 100%;
	padding: 550px 0 250px;
	background-image: radial-gradient(circle at 50% 50%, #00ecfc 0%, #00aeea 25%, #00489f 50%, #000c5c 72.333%, #000b57 72.333%, #000345 100%);
	/*background-image: radial-gradient(circle at 50% 50%, #00a1fc 0%, #0077eb 25%, #00329f 50%, #000c5c 72.333%, #000b57 72.333%, #000345 100%);*/
	background-position: center center;
	background-repeat: no-repeat;
}
#front .sec02 .main .back {
	position: absolute;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
	background-image: url(../img/sec02/sec02_map.png);
	background-position: center center;
	background-repeat: no-repeat;
	opacity: .4;
	z-index: 0;
}
#front .sec02 .main .cont {position: relative; z-index: 1;}
#front .sec02 .main .cont h2 {color: #fff; font-size: 3.5em; font-weight: 700; text-align: center; line-height: 1.75; filter: drop-shadow(0 0 4px rgba(0,0,0, .8));}
#front .sec02 .main .cont p {color: #fff; font-size: 1.3em; line-height: 2; margin: 50px auto 0; width: 84%; filter: drop-shadow(0 0 4px rgba(0,0,0, .8));}
#front .sec02 .img_list img {
	width: 25%;
	height: 30vw;
	max-height: 350px;
	object-fit: cover;
	object-position: 50%;
	font-family: 'object-fit: cover; object-position: 50%;';
}
#front .sec02 .characteristic {text-align: center; padding: 120px 0;}
#front .sec02 .characteristic p {font-size: 1.75em; font-weight: 700; margin: 16px 0 100px;}
#front .sec02 .characteristic .rireki {
	justify-content: space-between;
	align-items: center;
	background: linear-gradient(to right, #7864cf 0%, #3483d7 53%, #2bb9ac 100%);
	margin-bottom: 80px;
	padding: 30px;
	border-radius: 10px;
}
#front .sec02 .characteristic .notes {
	width: 80%;
	height: 100%;
	color: #4d4d4d;
	font-size: 1.1em;
	font-weight: 400;
	padding: 1px;
	background: linear-gradient(to right, #7864cf 0%, #3483d7 53%, #2bb9ac 100%);
	margin: 0 auto;
}
#front .sec02 .characteristic .notes span {
	display: block;
	position: relative;
	top: 0;
	left: 0;
	background: #fff;
	padding: 12px 0;
}
/*--------------------------------------------------------------------------
sec03
--------------------------------------------------------------------------*/
#front .sec03 {
	position: relative;
	padding: 120px 0;
	background-image: url(../img/sec03/sec03_back.png), radial-gradient(ellipse at 54.8% 100%, #2ae2b0 0%, #00a69d 100%);
	background-position: center center;
	background-repeat: no-repeat;
}
#front .sec03 .head_img {
	content: "";
	position: absolute;
	top: 0;
	left: 0;
	width: 100%;
	height: 700px;
	background-image: url(../img/sec03/sec03_back_machine.jpg);
	z-index: 1;
	overflow: hidden;
	clip-path: polygon(0 0, 100% 0, 100% 58%, 0 100%);
}
#front .sec03 .back-white {position: relative; z-index: 2;}
#front .sec03 h2 {
	font-family:"游明朝", YuMincho, "ヒラギノ明朝 ProN W3", "Hiragino Mincho ProN", "HG明朝E", "ＭＳ Ｐ明朝", "ＭＳ 明朝", serif;
	font-size: 2.6em; font-weight: 700; line-height: 1.25; background: url(../img/sec03/sec03_h2.jpg) right center/ auto 100% no-repeat; margin: -48px -48px 40px; padding: 84px 48px;
	border-radius: 20px 20px 0 0/20px 20px 0 0;
}
#front .sec03 p {line-height: 2.2; margin-bottom: 80px;}
#front .sec03 .inner {width: 620px; margin: 0 0 80px 12px;}
#front .sec03 .inner p {margin-bottom: 40px;}
#front .sec03 .border-c {padding: 0 0 12px;}
#front .sec03 .border-c .text {font-size: 2em; font-weight: 700; margin: 0 0 0 12px;}
#front .sec03 .border-c .btm {height: 2px; padding: 0 0 0 48px;}

#front .sec03 .graph_space01 {position: relative; margin: 40px auto 80px; padding: 10px 10px 70px; background-color: #fff; background-image: repeating-linear-gradient(0deg, transparent, transparent 19px, #e6e6e6 1px, #e6e6e6 20px), repeating-linear-gradient(90deg, transparent, transparent 19px, #e6e6e6 1px, #e6e6e6 20px);}
#front .sec03 .graph_space01 h4 {position: relative; color: #4d4d4d; font-size: 1.7em; font-weight: 700; margin-bottom: 20px; padding-left: 66px; background: url(../img/sec03/sec03_graph_icon.png) left center/auto no-repeat;}
#front .sec03 .graph_space01 .graph_canvas {}
#front .sec03 .graph_space01 .graph_canvas .main {display: flex;}
#front .sec03 .graph_space01 .graph_canvas .main .legend {width: 25%;}
#front .sec03 .graph_space01 .graph_canvas .main .legend li {font-size: 1.25em; line-height: 50px; text-align: center; margin: 24px 0;}
#front .sec03 .graph_space01 .graph_canvas .main .legend li.mining {color: #f00; font-weight: 700;}
#front .sec03 .graph_space01 .graph_canvas .main .bar {width: calc(75% - 1em); margin: 0 .7em 0 .3em; border-bottom: 1px solid #333; border-left: 1px solid #333;}
#front .sec03 .graph_space01 .graph_canvas .main .bar li {position: relative; margin: 24px 0;}
#front .sec03 .graph_space01 .graph_canvas .main .bar li span {position: absolute; top: 0; left: 12px; display: inline-flex; align-items: center; color: #fff; height: 50px; margin: 0;}
#front .sec03 .graph_space01 .graph_canvas .main .bar li.estate span {left: 26%;}
#front .sec03 .graph_space01 .graph_canvas .main .bar li.solar span {left: 14.5%;}
#front .sec03 .graph_space01 .graph_canvas .main .bar li.mining span {left: 18.5%; color: #333; font-weight: 700;}
#front .sec03 .graph_space01 .graph_canvas .main .bar li span strong {font-size: 2em; color: #fff; line-height: 1; margin: 0 6px 3px;}
#front .sec03 .graph_space01 .graph_canvas .main .bar li.mining span strong {color: #f00; font-weight: 700;}
#front .sec03 .graph_space01 .graph_canvas .main .bar li div {width: 100%; height: 50px; margin-left: -1px; background: #888; box-shadow: 8px 8px 0 0 #f2f2f2;}
#front .sec03 .graph_space01 .graph_canvas .main .bar li.estate div {width: 80%; background: linear-gradient(to right, #3fa9f5 75%,#6cbdf7 75%,#6cbdf7 100%);}
#front .sec03 .graph_space01 .graph_canvas .main .bar li.solar div {width: 50%; background: #fbb03b;}
#front .sec03 .graph_space01 .graph_canvas .main .bar li.mining div {width: 15%; background: linear-gradient(to right, #f00 66%,#ff5c5c 66%,#ff5c5c 100%);}
#front .sec03 .graph_space01 .graph_canvas .mass {display: flex;}
#front .sec03 .graph_space01 .graph_canvas .mass span {width: 25%; font-size: .9em; text-align: center;}
#front .sec03 .graph_space01 .graph_canvas .mass ul {display: flex; justify-content: space-between; width: 75%;}
#front .sec03 .graph_space01 .graph_canvas .mass ul li {font-size: .9em;}
#front .sec03 .graph_space01 .yield {
	position: relative;
	display: inline-block;
	top: 10px;
	left: calc(50% - 73px);
	color: #ffffa7;
	font-size: 1.35em;
	line-height: 22px;
	background: #000;
	padding: 14px 20px;
}
#front .sec03 .graph_space01 .yield:before {
	content: "";
	display: block;
	position: absolute;
	top: -69px;
	left: -60px;
	width: 60px;
	height: 120px;
	background: url(../img/sec03/sec03_tri.png);
}
#front .sec03 .graph_space01 .note {position: absolute; bottom: 4px; right: 8px;}
#front .sec03 .graph_space01 .note span {color: #f00;}

#front .sec03 .graph_space02 {margin: 40px auto 80px; padding: 10px; background-color: #fff; background-image: repeating-linear-gradient(0deg, transparent, transparent 19px, #e6e6e6 1px, #e6e6e6 20px), repeating-linear-gradient(90deg, transparent, transparent 19px, #e6e6e6 1px, #e6e6e6 20px);}
#front .sec03 .graph_space02 .graph_canvas {width: 90%; margin: 10px auto;}
#front .sec03 .graph_space02 .graph_canvas .bar {display: flex; justify-content: center; align-items: center; width: 100%; height: 72px;}
#front .sec03 .graph_space02 .graph_canvas .bar span {color: #fff; font-size: 1.1em; font-weight: 700;}
#front .sec03 .graph_space02 .graph_canvas .up .bar {background: #dd3030;}
#front .sec03 .graph_space02 .graph_canvas .middle {position: relative; width: 100%; height: 128px;}
#front .sec03 .graph_space02 .graph_canvas .middle span {position: absolute; top: 10px; left: 50%; transform: translate(-50%,0); color: #808080; font-size: 1.1em; font-weight: 700;}
#front .sec03 .graph_space02 .graph_canvas .middle .arrow {content: ""; position: absolute; top: 50px; left: 50%; transform: translate(-50%,0); width: 36px; height: 20px; background: #ff931e;}
#front .sec03 .graph_space02 .graph_canvas .middle .arrow:after {content: ""; position: absolute; bottom: -36px; left: 50%; transform: translate(-50%,0); width: 0; height: 0; border-style: solid; border-width: 36px 32px 0 32px; border-color: #ff931e transparent transparent transparent;}
#front .sec03 .graph_space02 .graph_canvas .middle .border {content: ""; position: absolute; top: 0; width: 3px; height: 128px; background: linear-gradient(to bottom, #000 4px, transparent 1px, transparent 1px) top center/3px 8px repeat-y;}
#front .sec03 .graph_space02 .graph_canvas .middle .border.l {left: 0;}
#front .sec03 .graph_space02 .graph_canvas .middle .border.r {top: 4px; right: 0; height: 295px; transform:rotate(65deg); transform-origin: top right;}
#front .sec03 .graph_space02 .graph_canvas .bottom > div {width: 50%; text-align: center;}
#front .sec03 .graph_space02 .graph_canvas .bottom .bar.red {background: #b61d25;}
#front .sec03 .graph_space02 .graph_canvas .bottom .bar.blue {background: #3fa9f5;}
#front .sec03 .graph_space02 .graph_canvas .ashuku {display: inline-block; position: relative; font-size: 1.1em; font-weight: 700; background: #fff; margin: 24px 0 0; padding: 0 8px; border: 2px solid #333;}
#front .sec03 .graph_space02 .graph_canvas .ashuku:before,#front .sec03 .graph_space02 .graph_canvas .ashuku:after {content: ""; position: absolute; left: 50%; transform: translate(-50%,0); width: 0; height: 0; border-style: solid;}
#front .sec03 .graph_space02 .graph_canvas .ashuku:before {top: -20px; border-width: 0 12px 20px 12px; border-color: transparent transparent #333 transparent;}
#front .sec03 .graph_space02 .graph_canvas .ashuku:after {top: -16px; border-width: 0 10px 16px 10px; border-color: transparent transparent #fff transparent;}

#front .sec03 .more {
	display: block;
	width: 450px;
	margin: 0 auto 40px;
	padding: 4px;
	border-radius: 48px;
	background:linear-gradient(60deg, #fff, #ddd);
	box-shadow: 4px 4px 12px 2px rgba(0,0,0, .3);
}
#front .sec03 .more span {
	display: block;
	width: 450px;
	color: #fff;
	font-size: 1.65em;
	font-weight: 700;
	text-align: center;
	line-height: 1;
	margin: 0 auto;
	padding: 20px 0;
	background: #7864cf;
	background: linear-gradient(to right, #7864cf 0%, #3483d7 53%, #2bb9ac 100%);
	border-radius: 48px;
}
#front .sec03 .more span i {color: #ffff8e; font-size: .95em; margin-left: 8px;}
/*--------------------------------------------------------------------------
sec04
--------------------------------------------------------------------------*/
#front .sec04 {}
#front .sec04 .sec_head {position: relative; width: 100%; height: 480px;}
#front .sec04 .sec_head h2 {
	display: flex;
	flex-direction: column;
	justify-content: center;
	align-items: center;
	position: absolute;
	top: 50%;
	left: 32.5%;
	transform: translate(-50%,-50%);
	z-index: 2;
}
#front .sec04 .sec_head h2 img {width: 134px; height: 49px; margin: 0 auto; filter: drop-shadow(0 0 16px #fff);}
#front .sec04 .sec_head h2 span {font-weight: 700; line-height: 1.4; letter-spacing: 0;}
#front .sec04 .sec_head h2 .up {font-size: 2.4em; color: #808080; margin: 24px 0 0; filter: drop-shadow(0 0 16px #fff);}
#front .sec04 .sec_head h2 .bottom {font-size: 5em; filter: drop-shadow(0 0 16px #fff);}
#front .sec04 .sec_head h2 .bottom span {font-size: inherit;}
#front .sec04 .sec_head .back {
	content: "";
	position: absolute;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
	background-image: url(../img/sec04/sec04_head.png),url(../img/sec04/sec04_head_op.png),linear-gradient(to right, #fff, #a8c4d2);
	background-position: calc(50% + 347px) center, left bottom, right top;
	background-size: auto, auto, auto;
	background-repeat: no-repeat, repeat-x, no-repeat;
	filter: opacity(.5);
	z-index: 1;
}
@media all and (-ms-high-contrast:none) {#front .sec04 .sec_head .back {opacity: .5;}}

#front .sec04 .feature {background: #ffe500; border-top: 10px solid #ffef66; padding-bottom: 50px;}
#front .sec04 .feature ul {margin: 40px auto;}
#front .sec04 .feature ul li {width: calc(50% - 140px); margin: 30px 40px 30px 0; padding: 70px 50px 50px; background: #fff; border-radius: 24px;}
#front .sec04 .feature ul li:nth-child(2n) {margin: 30px 0;}
#front .sec04 .feature ul li .head {position: relative; display: flex; align-items: center; margin-bottom: 30px;}
#front .sec04 .feature ul li .head img {width: 100px; height: 100px;}
#front .sec04 .feature ul li .head h3 {position: relative; font-size: 1.75em; line-height: 1.5; font-weight: 700; margin-left: 20px; z-index: 2;}
#front .sec04 .feature ul li .head .num {position: absolute; top: -74px; right: -42px; font-size: 10em; color: #f2f2f2; line-height: 1; z-index: 1;}
#front .sec04 .feature ul li .img {width: 100%; height: 275px; margin-bottom: 30px; object-fit: cover; object-position: 50%; font-family: 'object-fit: cover; object-position: 50%;';}
#front .sec04 .feature ul li p {font-size: 1.1em;}
#front .sec04 .feature ul li.wide {width: calc(100% - 100px);}
#front .sec04 .feature ul li.wide .head {margin-bottom: 50px;}
#front .sec04 .feature ul li.wide .flex-box {flex-wrap: nowrap; justify-content: space-between;}
#front .sec04 .feature ul li.wide .img {width: 420px; height: 275px; margin: 0 40px 0 0;}
#front .sec04 .feature ul li.wide p {font-size: 1.1em; margin-bottom: 30px;}
#front .sec04 .feature ul li.wide p:last-child {margin: 0;}
/*--------------------------------------------------------------------------
sec05
--------------------------------------------------------------------------*/
#front .sec05 {}

#front .sec05 .head_img {background-image: url(../img/sec05/sec05_head.jpg);}
#front .sec06 .head_img {background-image: url(../img/sec06/sec06_head.jpg);}
#front .sec05 .back-white {margin: 160px auto; padding: 48px 96px;}

#front .sec05 .head {background: url(../img/sec05/sec05_h2_01.png) right top/auto auto no-repeat; margin:-40px -96px 80px 0; padding-top: 100px;}
#front .sec05 .head h2 {color: #666; font-size: 2.75em; font-weight: 700; margin-bottom: 20px; padding-bottom: 6px; border-bottom: 4px double #b3b3b3;}
#front .sec05  p {font-size: 1.2em; margin-bottom: 40px;}
#front .sec05  p.big {font-size: 1.4em;}
#front .sec05  strong {font-size: 1.4em; font-weight: 700;}
#front .sec05  p span {font-size: inherit;}
#front .sec05  p span.red {color: #ff1d25;}

#front .sec05 .graph_space03 {width: 100%; justify-content: space-between; align-items: center; margin-bottom: 80px;}
#front .sec05 .graph_space03 h3 {display: flex; justify-content: center; align-items: center; flex-direction: column; width: 140px; height: 140px; margin: 0 auto; border: 1px solid #ff931e; border-radius: 100%;}
#front .sec05 .graph_space03 h3 .big {font-size: 1.5em; line-height: 1.4;}
#front .sec05 .graph_space03 .graph_canvas {display: flex; align-items: flex-end; width: calc(100% - 200px);}
#front .sec05 .graph_space03 .graph_canvas .legend {width: 36%; padding-bottom: 26px;}
#front .sec05 .graph_space03 .graph_canvas .legend li {display: flex; align-items: center; font-size: 1.1em; font-weight: 700; line-height: 37px; text-align: center; margin: 5px 0;}
#front .sec05 .graph_space03 .graph_canvas .legend li span {font-size: 1.3em;  font-weight: 700; line-height: 1; margin-right: 4px;}
#front .sec05 .graph_space03 .graph_canvas .legend li span:first-child {margin-right: 1em;}
#front .sec05 .graph_space03 .graph_canvas .legend li.orange span {color: #ff931e;}
#front .sec05 .graph_space03 .graph_canvas .main {width: calc(64% - 3em);}
#front .sec05 .graph_space03 .graph_canvas .main .bar {width: calc(100% - 1em); margin: 0 .7em 0 .3em; border-bottom: 1px solid #333; border-left: 1px solid #333;}
#front .sec05 .graph_space03 .graph_canvas .main .bar li {display: flex; align-items: center; position: relative; height: 37px; margin: 5px 0;}
#front .sec05 .graph_space03 .graph_canvas .main .bar li div {width: 100%; height: 30px; margin: auto -1px auto 0; background: #999;}
#front .sec05 .graph_space03 .graph_canvas .main .bar li.hokkaido div {width: 94%; background: linear-gradient(to right, #999 88%,#b7b7b7 88%,#b7b7b7 100%);}
#front .sec05 .graph_space03 .graph_canvas .main .bar li.tohoku div {width: 80%; background: linear-gradient(to right, #999 86%,#b7b7b7 86%,#b7b7b7 100%);}
#front .sec05 .graph_space03 .graph_canvas .main .bar li.tokyo div {width: 86%; background: linear-gradient(to right, #999 87%,#b7b7b7 87%,#b7b7b7 100%);}
#front .sec05 .graph_space03 .graph_canvas .main .bar li.osaka div {width: 80%; background: linear-gradient(to right, #999 89%,#b7b7b7 89%,#b7b7b7 100%);}
#front .sec05 .graph_space03 .graph_canvas .main .bar li.fukuoka div {width: 71%; background: linear-gradient(to right, #ff931e 88%,#ffb25e 88%,#ffb25e 100%);}
#front .sec05 .graph_space03 .graph_canvas .main .mass {display: flex; justify-content: space-between;}
#front .sec05 .graph_space03 .graph_canvas .main .mass ul li {font-size: .9em;}
#front .sec05 .graph_space03 .graph_canvas .main .mass span {font-size: .9em; text-align: center;}
#front .sec05 .graph_space03 .graph_canvas .unit {width: 3em; text-align: right;}

#front .sec05 .risk {width: 90%; margin: 80px auto; box-shadow: 0 0 24px 8px rgba(0,0,0, .2); border-radius: 12px;}
#front .sec05 .risk h3 {width: 100%; color: #fff; font-size: 1.6em; text-align: center; background: #00a69d; padding: 8px 0; border-radius: 12px 12px 0 0/12px 12px 0 0;}
#front .sec05 .risk ul {margin: 0 auto; padding: 20px 128px;}
#front .sec05 .risk ul li {font-size: 1.9em; font-weight: 700; line-height: 1; margin: 20px 0;}
#front .sec05 .risk ul li:before{
	content: "";
	display: inline-block;
	position: relative;
	top: 2px;
	left: 0;
	width: 26px;
	height: 26px;
	background: url(../img/sec05/check.svg) 100%/auto no-repeat;
	margin-right: 20px;
}
#front .sec05 .cubicle {margin: 40px auto; text-align: center;}
#front .sec05 .cubicle > div {display: inline-block; position: relative;}
#front .sec05 .cubicle span {position: absolute; right: 0; bottom: -4px; font-size: .9em;}
#front .sec05 .perkw {display: flex; justify-content: center; align-items: flex-end; margin: 60px auto;}
#front .sec05 .perkw h3 {margin-right: 26px; font-size: 2.75em; line-height: 1; text-align: center;}
#front .sec05 .perkw h3 span {font-size: 1.75em; line-height: 1.25;}
#front .sec05 .owari {display: flex; justify-content: center; align-items: flex-end; margin: 40px auto;}
#front .sec05 .owari h3 {position: relative; width: 410px; height: 290px; background: url(../img/sec05/sec05_blackboard.jpg) 0 0/100% auto no-repeat; z-index: 1;}
#front .sec05 .owari h3 > span {position: absolute; top: 50%; left: 50%; transform: translate(-50%,-50%); width: 100%; text-align: center;}
#front .sec05 .owari h3 span > span {display: block; color: #fff; font-size: 2.8em; font-weight: 700; line-height: 1.2; letter-spacing: 0;}
#front .sec05 .owari h3 span > span.big {font-size: 3.9em;}
#front .sec05 .owari img {margin-left: -40px; z-index: 2;}
#front .sec05 .maint_img {width: 100% height: 240px; margin: 80px -96px 40px;}
#front .sec05 .maint_img img {width: 100%; height: 100%; object-fit: cover; object-position: 50%; font-family: 'object-fit: cover; object-position: 50%;';}
#front .sec05 .maint {align-items: center; margin: 0 -32px;}
#front .sec05 .maint p {font-size: 1.75em; margin: 0 0 0 40px;}
/*--------------------------------------------------------------------------
sec06
--------------------------------------------------------------------------*/
#front .sec06 {padding-bottom: 80px;}
#front .sec06.ivory {background: #f6f6eb;}
#front .sec06 .container {width: 960px;}

#front .sec06 h2 {margin-bottom: 24px; padding: 80px 0 16px; border-bottom: 1px solid #666;}
#front .sec06 h2 span {font-size: 3.5em; color: #666; font-weight: 700; line-height: 1.5;}
#front .sec06 h2 span > span {font-size: inherit;}

#front .sec06 .head {width: 100%; justify-content: space-between; margin-top: 24px;}
#front .sec06 .head h3 {width: 100%; font-size: 2.25em; color: #4d4d4d;  font-weight: 700; line-height: 1; margin-bottom: 24px;}
#front .sec06 .head > div {width: calc(100% - 360px);}
#front .sec06 .head p {font-size: 1.2em;}
#front .sec06 .head ul {margin: 8px 0;}
#front .sec06 .head ul li {font-size: 1.5em; font-weight: 700; margin-left: 1.5em; list-style: disc;}
#front .sec06 .head img {width: 330px; height: 250px; object-fit: cover; object-position: 50%; font-family: 'object-fit: cover; object-position: 50%;';}

#front .sec06 .plan {margin-bottom: 80px;}
#front .sec06 .plan .plan_list {justify-content: space-between; margin: 80px auto;}
#front .sec06 .plan .plan_list li {width: 31%; box-shadow: 0 0 24px 8px rgba(0,0,0, .2);}
#front .sec06 .plan .plan_list li .tower {font-size: 1.8em; text-align: center; color: #ffe500; background: #113a56; padding: 6px 0;}
#front .sec06 .plan .plan_list li h3 {background: #ffe500; margin: 0; text-align: center; font-size: 1em; padding: 6px 0;}
#front .sec06 .plan .plan_list li h3 span {color: #113a56; font-size: 1.8em; font-weight: 700;}
#front .sec06 .plan .plan_list li h3 span.small {font-size: 1.2em;}
#front .sec06 .plan .plan_list .star {justify-content: center; align-items: center; margin: 24px 0;}
#front .sec06 .plan .plan_list .star img {margin: 0 4px;}
#front .sec06 .plan .plan_list .spec {text-align: center;}
#front .sec06 .plan .plan_list .spec span {display: block; color: #113a56; font-size: 2.4em; font-weight: 700; line-height: 1.3;}
#front .sec06 .plan .plan_list .price {text-align: center; margin: 12px 0 32px;}
#front .sec06 .plan .plan_list .price span {color: #ff931e; font-size: 3em; font-weight: 700; line-height: 1.3;}
#front .sec06 .plan .plan_list .price span.small {font-size: 2.4em; margin-left: 8px;}
#front .sec06 .plan .plan_list .note {display: block; margin: 20px 0 0 auto;}
#front .sec06 .detail {margin-bottom: 20px;}
#front .sec06 .detail p {font-size: 2.3em; padding-left: 50px; background: url(../img/sec06/sec06_ster_half.png) left center/auto auto no-repeat;}
#front .sec06 .detail small {font-size: 1.2em; margin-left: 54px;}
#front .sec06 .plan .more {display: block; width: 240px; color: #fff; font-size: 1.2em; text-align: center; letter-spacing: 0; margin: 0 auto; padding: 10px 0; background: linear-gradient(to bottom, #ffbb71 ,#ff931e); border-radius: 10px; box-shadow: 0 0 4px 2px rgba(0,0,0, .2);}

#front .sec06 .boiler h3 {
	position: relative;
	display: inline-block;
	font-size: 1.1em;
	color: #113a56;
	font-weight: 700;
	background: #ffe500;
	padding: 2px 40px;
}
#front .sec06 .boiler h3:after {
	content: "";
	position: absolute;
	display: inline-block;
	top: 0;
	right: -25px;
	width: 0;
	height: 0;
	border-style: solid;
	border-width: 0 25px 33px 0px;
	border-color: transparent transparent #ffe500 transparent;
}
#front .sec06 .boiler > ul {border: 1px solid #ccc;}
#front .sec06 .boiler > ul > li {justify-content: space-between; margin: 45px;}
#front .sec06 .boiler > ul > li .img {width: 23%;}
#front .sec06 .boiler > ul > li .img img {margin: auto;}
#front .sec06 .boiler > ul > li .text {width: 72%;}
#front .sec06 .boiler > ul > li .text h4 {color: #fff; font-size: 1.35em; background: #113a56; padding: 2px 12px;}
#front .sec06 .boiler > ul > li .text ul {display: flex; flex-wrap: wrap; margin-top: 12px;}
#front .sec06 .boiler > ul > li .text ul li {margin: 0 1.5em; list-style-type: disc;}

#front .sec06 .kanri {
	justify-content: space-between;
	align-items: center;
	background: linear-gradient(to right, #7864cf 0%, #3483d7 53%, #2bb9ac 100%);
	margin: 40px 0 0;
	padding: 30px;
	border-radius: 10px;
}
/*--------------------------------------------------------------------------
sec07
--------------------------------------------------------------------------*/
#front .sec07 h2 {font-size: 3.5em; font-weight: 700; text-align: center; padding: 80px 0;}
#front .sec07 .float {width: 500px; margin: 0 auto 80px;}
#front .sec07 .float li .flex-box {align-items: center;}
#front .sec07 .float li .img {display: flex; justify-content: center; align-items: center; width: 120px; height: 120px; background: #eee; border-radius: 50%;}
#front .sec07 .float li .img img {width: 80px;}
#front .sec07 .float li .text {margin-left: 40px;}
#front .sec07 .float li .text h3 {font-size: 2.4em; font-weight: 700; line-height: 1.5;}
#front .sec07 .float li .text span {font-size: 1.2em;}
#front .sec07 .float li .arrow {
	content: "";
	display: block;
	margin: 0 auto;
	width: 0;
	height: 0;
	border-style: solid;
	border-width: 20px 20px 0 20px;
	border-color: #ff931e transparent transparent transparent;	
}
#front .sec07 .tri {position: relative; width: 100%; height: 100px; z-index: 1;}
#front .sec07 .tri:before,#front .sec07 .tri:after {content: ""; position: absolute; display: block; width: 100%; height: 280px;}
#front .sec07 .tri:before {left: -25%; transform: rotate(15deg)}
#front .sec07 .tri:after {right: -25%; transform: rotate(-15deg)}
#front .sec07 .tri.up:before,#front .sec07 .tri.up:after {top: 0; background: #ffe800;}
#front .sec07 .tri.bottom:before,#front .sec07 .tri.bottom:after {top: -40px; background: #ff0;}

#front .sec07 .result {position: relative; background: #ff0; padding-bottom: 80px; z-index: 2;}
#front .sec07 .result .img {justify-content: center; align-items: center;}
#front .sec07 .result .img img:nth-child(2) {width: 48px; margin: 0 36px;}
#front .sec07 .result .text {width: 700px; margin: 40px auto 0; padding: 24px 36px; background: #fff; border-radius: 24px;}
#front .sec07 .result .text h3 {text-align: center;}
#front .sec07 .result .text h3 span {display: block; font-size: 1.75em; font-weight: 700; line-height: 1.5;}
#front .sec07 .result .text h3 span.big {font-size: 4em;}
#front .sec07 .result .text h3 span.big > span {display: inline-block; font-size: 1.25em; margin: 0 10px; line-height: 1.25;}
#front .sec07 .result .text p {font-size: 1.4em;}
/*--------------------------------------------------------------------------
sec08
--------------------------------------------------------------------------*/
#front .sec08 .cont {padding: 80px 0;}
#front .sec08 .cont .gradation {font-size: 1.3em;}
#front .sec08 .cont p {font-size: 1.3em; font-weight: 700; line-height: 2.2; text-align: center; margin: 30px auto 0;}
#front .sec08 .contact {width: 100%; padding: 100px 0; background: url(../img/sec08/sec08_back.jpg) center/100% auto no-repeat;}
#front .sec08 .contact ul li {display: flex; align-items: center; background: #fff;  margin-bottom: 64px; padding: 20px; border-radius: 10px;}
#front .sec08 .contact ul li.message {display: block;}
#front .sec08 .contact ul li p {font-size: 1.5em; white-space: nowrap; margin-right: 1em;}
#front .sec08 .contact ul li p span {display: inline-block; color: #f15a24; padding-left: 8px;}
#front .sec08 .contact ul li div {width: 100%;}
#front .sec08 .contact ul li div input,#front .sec08 .contact ul li div textarea {
	display: block;
	width: calc(100% - 2em);
	font-size: 1.2em!important;
	padding: 1em;
	border: none;
	background: #f8f8f8!important;
	box-shadow: none;
	border-radius: 5px;
}
#front .sec08 .contact ul li div textarea {resize: vertical; margin-top: 1em;}
#front .sec08 .contact input[type="submit"] {
	display: block;
	width: 532px;
	color: #fff;
	font-size: 2em;
	font-weight: 700;
	text-align: center;
	line-height: 1;
	letter-spacing: 2px;
	background: #7864cf;
	background: linear-gradient(to right, #7864cf 0%, #3483d7 53%, #2bb9ac 100%);
	margin: 64px auto 0;
	padding: 25px 0;
	border-radius: 48px;
	transition: all .3s ease;
}
#front .sec08 .contact input[type="submit"]:hover {opacity: .8;}
.wpcf7-response-output {border: 1px solid #fff!important; color: #fff!important; background: rgba(0,0,0, .3)!important;}
/*------------------------------------
フッター
------------------------------------*/
.googlemap {position: relative; width: 100%; height: 75vh; overflow: hidden;}
.googlemap iframe,.googlemap object,.googlemap embed {position: absolute; top: 0; left: 0; width: 100%; height: 100%;}

footer {background: linear-gradient(to right, #7864cf 0%, #3483d7 53%, #2bb9ac 100%);}
footer .cont {padding: 30px 0; text-align: center;}
footer .cont .access span {display: inline-block; color: #fff; font-size: .9em;}
footer .cont .access span.midashi {border: 1px solid #fff; margin: 0 1em 8px 0; padding: 2px 12px;}
footer .cont .logo {display: inline-block; margin: 40px 0 50px;}
footer .cont .company {justify-content: center; text-align: left;}
footer .cont .company li {margin: 0 60px;}
footer .cont .company li h2 {}
footer .cont .company li h2 span.text {font-family: sans-serif; color: #fff; font-size: 2em; line-height: 1.5;}
footer .cont .company li h2 span.btm {padding-right: 60px;}
footer .cont .company li address {margin: 0 6px;}
footer .cont .company li address span {font-family: 'Lato', sans-serif; display: block; color: #fff; font-size: 1.1em; letter-spacing: 6px;}

footer .cont .info {justify-content: center; align-items: baseline; margin-top: 40px;}
footer .cont .info li {font-family: 'Lato', sans-serif; color: #fff; font-size: 1.5em; line-height: 1.5; margin: 0 20px;}
footer .cont .info li a {color: #fff;}
footer .cont .info li i {color: #fff; font-size: 1em; vertical-align: middle; margin-right: 8px; line-height: 1.5;}
footer .cont .info li.tel {font-size: 2.25em;}
footer .cont .info li.tel i {font-size: .65em; margin-top: -6px;}

footer .copyright {text-align: center; background: #333; padding: 10px 0;}
footer .copyright span {color: #fff; font-size: .85em;}

#scroll {display: block; position: fixed; bottom: 20px; right: 20px; z-index: 99; opacity: .8;}
#scroll a {display: flex; justify-content: center; align-items: center; width: 56px; height: 56px; background: rgba(0,0,0, .3);}
#scroll a i {font-size: 1em; color: #fff;}
/*--------------------------------------------------------------------------
----------------------------------------------------------------------------
----------------------------------------------------------------------------
下層ページ
----------------------------------------------------------------------------
----------------------------------------------------------------------------
--------------------------------------------------------------------------*/
/*------------------------------------
投稿ページ・固定ページ (single.php,page.php)
------------------------------------*/
#single .container {margin: 60px auto;}
#single .state {display: flex;}
#single .state .cat {display: inline-block; background: #888; color: #fff; font-size: .95em; padding: 1px 10px 0; border-radius: 4px;}
#single .state .cat.oshirase {background: #ff931e;}
#single .state .cat.news {background: #3fa9f5;}
#single .state .date {margin-left: .75em; font-size: 1.1em;}
#single p {word-break: break-all; line-height: 2; margin: 30px 0;}
#single img {margin: 30px 20px 30px 0;}
#single h1 {font-size: 1.7em; font-weight: 700; line-height: 1.5; margin: 60px 0 30px;}
#single h1.post {margin: 80px 0 70px;}
#single h2 {
	position: relative;
	font-size: 1.5em;
	line-height: 1.5;
	margin: 60px 0 30px;
	padding: 8px 4px;
	border-bottom: 4px solid #ebecec;
}
#single h2:before {
	content: "";
	display: block;
	position: absolute;
	bottom: -4px;
	left: 0;
	width: 100px;
	height: 4px;
	background: #2bb9ac;
}
#single h3 {
	font-size: 1.4em;
	line-height: 1.5;
	margin: 50px 0 30px;
	padding: 8px 4px;
	border-bottom: 2px solid #2bb9ac;
}
#single h4 {
	font-size: 1.3em;
	line-height: 1.5;
	margin: 40px 0 34px;
	padding-left: 10px;
	border-left: 5px solid #2bb9ac;
}
#single h5 {
	position: relative;
	font-size: 1.2em;
	line-height: 1.5;
	margin: 30px 0;
	padding-left: 1.2em;
}
#single h5:before {
	content: "";
	display: block;
	position: absolute;
	top: 4px;
	left: 0;
	width: .8em;
	height: .8em;
	background: #2bb9ac;
}
#single h6 {
	font-size: 1.1em;
	font-weight: 700;
	margin: 30px 0;
}

#single a * {color: #3483d7;}
#single a:after {font-family: "Font Awesome 5 Free"; content: "\f35d"; font-weight: 900; margin-left: 8px; color: #3483d7;}
#single em {font-style: italic;}
#single strong {font-weight: 800;}
#single blockquote {position: relative; margin: 30px; padding: 20px 30px; background: #f3f3f3;}
#single blockquote:before,
#single blockquote:after {position: absolute; display: block; font-family: "Font Awesome 5 Free"; font-weight: 900; color: #c8c8c8;}
#single blockquote:before {top: 20px; left: 20px; content: "\f10e";}
#single blockquote:after {bottom: 20px; right: 20px; content: "\f10d";}
#single sup, #single sub {font-size: .5em;}
#single sup {vertical-align: top;}
#single sub {vertical-align: bottom;}
#single pre {margin: 30px 0;}
#single code {display: block; color: #fff; margin: 30px 0; padding: 20px; background: #364549;}

#single ul, #single ol {margin: 30px 0;}
#single ul li, #single ol li {margin-left: 1.5em; line-height: 2.5;}
#single ul > li {list-style-type: disc;}
#single ol > li {list-style-type: decimal;}
#single li > ul, #single li > ol {margin-bottom: 0;}

#single table {border-collapse: collapse; text-align: left; line-height: 1.5; margin: 30px 0; border: 1px solid #c8c8c8;}
#single table thead th, #single table thead td,
#single table tfoot th, #single table tfoot td {background: #e0e0e0;font-weight: 700;}
#single table thead th, #single table thead td {padding: 0.75rem 0.5rem;}
#single table th, #single table td {padding: 0.5rem; border: 1px solid #c8c8c8;}
#single table th {background: #f2f2f2;}

#single .aligncenter {display: block; margin: 0 auto;}
#single .alignright {float: right;}
#single .alignleft {float: left;}
/*------------------------------------
アーカイブページ (archive.php)
------------------------------------*/
#archive .container {margin: 60px auto;}
#archive .entry {width: 48%; margin: 0 4% 4% 0;}
#archive .entry:nth-child(2n) {margin-right: 0;}
#archive .entry .img {width: 100%; height: 300px;}
#archive .entry .img img {
	width: 100%;
	height: 100%;
	object-fit: cover;
	object-position: 50%;
	font-family: 'object-fit: cover; object-position: 50%;';	
}
#archive .entry .state {display: flex; margin: 16px 0 0;}
#archive .entry .state .cat {display: inline-block; background: #888; color: #fff; font-size: .95em; padding: 1px 10px 0; border-radius: 4px;}
#archive .entry .state .cat.oshirase {background: #ff931e;}
#archive .entry .state .cat.news {background: #3fa9f5;}
#archive .entry .state .date {margin-left: .75em; font-size: 1.1em;}
#archive .entry .text h2 {font-size: 1.2em; font-weight: 700; line-height: 1.5; margin: 12px 0;}
#archive .entry .text p i {color: #006fff; margin-left: .35em;}
/*------------------------------------
404.php
------------------------------------*/
#notfound {position: relative; width: 100vw; height: 100vh; background: linear-gradient(to right, #7864cf 0%, #3483d7 53%, #2bb9ac 100%);}
#notfound h1 {position: absolute; top: 50%; left: 50%; transform: translate(-50%,-50%);}
#notfound h1 span{display: block; font-family: 'Lato', sans-serif; font-size: 2em; color: #fff; text-align: center; line-height: 1.5; white-space: nowrap;}
#notfound h1 span.big {font-size: 5em;}
#notfound .link {position: absolute; top: 70%; left: 50%; transform: translate(-50%,-50%); color: #fff; font-size: 1.2em; font-weight: 700; padding: 20px 40px; border: 1px solid #fff;}
/*------------------------------------
ローディング
------------------------------------*/
#loader {
	position: fixed;
	background: #fff;
	width: 100vw;
	height: 100vh;
	left: 0;
	top: 0;
	z-index: 9999;
	overflow: hidden;
}
.spinner {
	position: fixed;
	top: 50%;
	left: 50%;
	transform: translate(-50%,-50%);
	width: 56px;
	height: 50px;
}
.spinner > div {
	display: inline-block;
	height: 100%;
	width: 6px;
	background: #7864cf;
	background: linear-gradient(to top, #7864cf 0%, #3483d7 53%, #2bb9ac 100%);
	animation: sk-stretchdelay 1.2s infinite ease-in-out;
}
.spinner .rect2 {animation-delay: -1.1s;}
.spinner .rect3 {animation-delay: -1.0s;}
.spinner .rect4 {animation-delay: -0.9s;}
.spinner .rect5 {animation-delay: -0.8s;}
@keyframes sk-stretchdelay {0%, 40%, 100% {transform: scaleY(0.4);} 20% {transform: scaleY(1.0);}}