@charset "utf-8";
/* reset */
* {
margin: 0;
padding: 0;
box-sizing: border-box;
word-break: break-all;
word-wrap: break-word;
}
html {
font-family: sans-serif;
line-height: 1.15;
-ms-text-size-adjust: 100%;
-webkit-text-size-adjust: 100%;
font-size: 62.5%;
line-height: 1.3;
}
body {
padding: 0;
margin: 0;
background: #fff;
color: #000;
font-size: 1.6rem;
font-family: 'メイリオ','ヒラギノ角ゴ Pro W3','Hiragino Kaku Gothic Pro','ＭＳ Ｐゴシック';
font-family: "Zen Maru Gothic", sans-serif;
font-weight: normal;
width: 100%;
height: 100%;
}
li{
list-style: none;
}
ul::before,
ul::after,
ol::before,
ol::after,
dl::before,
dl::after {
display: none;
}
img {
max-width: 100%;
vertical-align: top;
}
a {
color: #000;
text-decoration: none;
transition: .3s;
}
a:hover {
opacity: 0.7;
}
/* reset end */




/* wrap */
#wrap {
min-width: 320px;
overflow: hidden;
line-height: 1.7;
}
#header {
min-width: 320px;
}
#wrap * {
box-sizing: border-box;
}
#wrap img {
vertical-align: top;
height: auto;
}
	@media screen and (max-width: 768px) {
	html {

	}
	#wrap {
	}
	}
/* wrap end */

/* area */
.area {
position: relative;
padding: 70px 20px;
box-sizing: border-box;
}
.inner {
position: relative;
z-index: 2;
width: 100%;
max-width: 1020px;
margin: 0 auto;
box-sizing: border-box;
}
.pc {
display: block;
}
.sp {
display: none;
}
	@media screen and (max-width: 768px) {
	.area {
	padding: 30px 20px;
	}
	.inner {
	max-width: 100%;
	}
	.pc {
	display: none;
	}
	.sp {
	display: block;
	}
	}
/* area end */

/* header
-------------------------------------------------------*/
#header {
font-family: "Noto Sans JP", sans-serif;
background: #fff;
padding: 5px 10px;
height: 80px;
display: flex;
align-items: center;
}
#header .pr {
text-align: center;
font-size: 1.2rem;
line-height: 1;
}
.branding {
display: flex;
justify-content: center;
align-items: center;
}
.branding > * {
display: flex;
align-items: center;
}
#header .logo01 > * {
display: flex;
}
#header .logo01 img {
max-width: 246px;
width: 100%;
}
#header .closs img {
max-width: 40px;
width: 100%;
}
#header .logo02 img {
max-width: 340px;
width: 100%;
}
	@media screen and (max-width: 768px) {
	#header {
	padding: 0;
	}
	#header {
	height: 70px;
	}
	#header .logo02 a {
	display: flex;
	}
	#header .pr {
	font-size: 1rem;
	}
	}

/* visual
-------------------------------------------------------* /
#visual {
background: url(../img/visual_bg.png)no-repeat center/auto 100%, linear-gradient(to bottom,#6cc2ef,#62b9e8,#3792c9);
position: relative;
}
#visual .inner {
max-width: 1400px;
}
#visual .cont {
z-index: 2;
text-align: center;
}
#visual .visual_img {
position: absolute;
left: 50%;
top: 50%;
z-index: 3;
width: 100%;
transform: translate(-50%,-50%);
text-align: center;
}
#visual .visual_img img {
max-width: 1400px;
width: 100%;
}
#visual .visual_ttl01 {
font-size: 4rem;
color: #044b71;
letter-spacing: 0.05em;
margin-bottom: 20px;
font-weight: 700;
line-height: 1.4;
}
#visual .visual_logo {
margin-bottom: 30px;
}
#visual .visual_logo img {
max-width: 412px;
width: 100%;
}
#visual .visual_txt01 {
background: rgba(21,123,177,0.3);
max-width: 600px;
margin: 0 auto 20px;
padding: 20px;
color: #fff;
font-weight: 700;
font-size: 1.8rem;
line-height: 1.4;
}
#visual .visual_txt02 {
color: #fff;
font-size: 1.4rem;
font-weight: 500;
line-height: 1.4;
margin-bottom: 20px;
}
#visual .btn01 {
z-index: 5;
position: relative;
}
	@media screen and (max-width: 768px) {
	#visual {
	position: relative;
	}
	#visual .visual_ttl01 {
	font-size: 2rem;
	}
	#visual .visual_logo {
	margin-bottom: 20px;
	}
	#visual .visual_logo img {
	max-width: 250px;
	}
	#visual .visual_img_sp {
	margin-bottom: 30px;
	}
	#visual .visual_txt01 {
	font-size: 1.4rem;
	}
	#visual .visual_txt02 {
	font-size: 1.2rem;
	}
	#visual .btm_img {
	position: absolute;
	right: 0;
	bottom: 0;
	text-align: right;
	}
	#visual .btm_img img {
	max-width: 70%;
	}
	}
*/
/* visual */
#visual {
position: relative;
width: 100%;
height: auto;
padding: 0!important;
background: url("../img/visual_bg.jpg") no-repeat center / auto 100%;
}
#visual .inner {
justify-content: center;
background: url("../img/visual_img.png") no-repeat center / 100% auto;
height: 800px;
height: 630px;
width: 1200px;
max-width: 1200px;
padding: 0;
}
#visual .btn01 {
position: absolute;
left: 50%;
bottom: 40px;
transform: translate(-50%,0);
width: 100%;
z-index: 10;
}
#visual .inner img {
opacity: 0;
height: 630px;
width: 1200px;
}
	@media screen and (min-width: 1400px) {
	#visual .inner {
	background-image: url("../img/visual_img_1400x640.png");
	height: 640px;
	}
	#visual .inner,
	#visual .inner img {
	width: 100%;
	max-width: 1400px;
	height: 640px;
	}
	}
	@media screen and (min-width: 768px) and (max-width: 1400px) {
	#visual .inner,
	#visual .inner img {
	width: 100%;
	max-width: 100%;
	width: auto;
	height: calc(100vw * (630 / 1200));
	}
	}
	@media screen and (min-width: 768px) and (max-width: 900px) {
	#visual .btn01 {
	bottom: 20px;
	}
	}
	@media screen and (max-width: 768px) {
	#visual {
	background: linear-gradient(to bottom, #6CC2EF, #6CC2EF , #3691C8, #3691C8);
	}
	#visual .inner {
	background-image: url("../img/visual_img_sp.png");
	height: calc(100vw * (800 / 800));
	}
	#visual .inner,
	#visual .inner img {
	width: 100%;
	max-width: 100%;
	height: calc(100vw * (800 / 800));
	}
	#visual .inner img {
	opacity: 0;
	}
	#visual .btn01 {
	position: relative;
	left: inherit;
	bottom: inherit;
	transform: translate(0,0);
	width: 100%;
	padding: 20px;
	background: #3691C8;
}
	}
/* visual end */


/* nav
-------------------------------------------------------*/
#nav .inner {
max-width: 1200px;
}
.nav_list {
display: flex;
flex-flow: row nowrap;
align-items: stretch;
justify-content: space-between;
}
.nav_list li {
width: 24%;
}
.nav_list li a {
background: #0061a2;
color: #fff;
text-align: center;
font-size: 1.8rem;
font-weight: 700;
height: 70px;
line-height: 1.2;
display: flex;
align-items: center;
justify-content: center;
position: relative;
}
.nav_list li a span {
position: relative;
z-index: 2;
}
.nav_list li a::before,.nav_list li a::after {
position: absolute;
display: block;
content: "";
}
.nav_list li a::before {
background: url(../img/triangle.png)no-repeat left top/70px 70px;
width: 70px;
height: 70px;
left: 0;
top: 0;
z-index: 1;
}
.nav_list li a::after {
background: url(../img/nav_arrow.png)no-repeat right center/14px 9px;
width: 14px;
height: 9px;
right: 20px;
top: 50%;
transform: translate(0,-50%);
}
	@media screen and (max-width: 768px) {
	.nav_list {
	flex-flow: row wrap;
	}
	.nav_list li {
	width: 48%;
	}
	.nav_list li:nth-child(-n+2) {
	margin-bottom: 10px;
	}
	.nav_list li a {
	font-size: 1.3rem;
	height: 50px;
	}
	.nav_list li a::before {
	background: url(../img/triangle.png)no-repeat left top/50px 50px;
	width: 50px;
	height: 50px;
	}
	.nav_list li a::after {
	background: url(../img/nav_arrow.png)no-repeat right center/9px 6px;
	width: 9px;
	height: 6px;
	right: 10px;
	}
	}

/* common 
-------------------------------------------------------*/
.ttl01 {
text-align: center;
color: #0061a2;
font-size: 3rem;
font-weight: 700;
margin-bottom: 50px;
}
.ttl_bd {
border-bottom: 4px solid #0061a2;
}
.ttl_icon {
font-size: 4rem;
padding: 0 5px;
position: relative;
}
.ttl_icon::before {
position: absolute;
display: block;
content: "";
background: url(../img/icon_ttl.png)no-repeat center top/46px 22px;
width: 46px;
height: 22px;
right: 50%;
top: -20px;
transform: translate(50%,0);
}
.btn01 a {
display: block;
background: #fff7b1;
max-width: 350px;
width: 100%;
height: 70px;
text-align: center;
border-radius: 100px;
margin: 0 auto;
display: flex;
align-items: center;
justify-content: center;
color: #0061a2;
font-size: 2.4rem;
font-weight: 700;
position: relative;
}
.btn01.blue a {
background:#0061a2;
color: #fff7b1;
}
.btn01 a::after {
position: absolute;
display: block;
content: "";
background: url(../img/btn_arrow.png)no-repeat right center/14px 20px;
width: 14px;
height: 20px;
right: 20px;
}
.btn01.blue a::after {
background: url(../img/btn_arrow02.png)no-repeat right center/14px 20px;
}
.btn02 a {
display: block;
background: #0061a2;
max-width: 215px;
width: 100%;
height: 40px;
text-align: center;
border-radius: 100px;
margin: 0 auto;
display: flex;
align-items: center;
justify-content: center;
color: #fffcc8;
font-weight: 700;
position: relative;
}
.btn02 a::after {
position: absolute;
display: block;
content: "";
background: url(../img/btn02_arrow.png)no-repeat right center/10px 13px;
width: 10px;
height: 13px;
right: 20px;
}
	@media screen and (max-width: 768px) {
	.ttl01 {
	font-size: 2rem;
	margin-bottom: 30px;
	}
	.ttl_bd {
	border-bottom: 3px solid #0061a2;
	}
	.ttl_icon {
	font-size: 3rem;
	}
	.ttl_icon::before {
	background: url(../img/icon_ttl.png)no-repeat center top/36px 17px;
	width: 36px;
	height: 17px;
	top: -15px;
	}
	.btn01 a {
	height: 50px;
	font-size: 2rem;
	}
	.btn01 a::after {
	background: url(../img/btn_arrow.png)no-repeat right center/11px 16px;
	width: 11px;
	height: 16px;
	}
	.btn01.blue a::after {
	background: url(../img/btn_arrow02.png)no-repeat right center/11px 16px;
	}
	.btn02 a::after {
	background: url(../img/btn02_arrow.png)no-repeat right center/10px 10px;
	width: 8px;
	height: 10px;
	right: 15px;
	}
	}

/* area01
-------------------------------------------------------*/
#area01 {
background: url(../img/bg01.png)no-repeat center/cover;
}
	@media screen and (max-width: 768px) {

	}

/* area02
-------------------------------------------------------*/
#area02 {
position: relative;
background: #6cc2ef url(../img/bg02.jpg) repeat-y center top/ 100% auto;
}
.list_product {
display: flex;
flex-flow: row wrap;
align-items: stretch;
justify-content: center;
}
.list_product li {
width: 48%;
background: #fff;
margin-bottom: 60px;
padding: 40px 20px;
box-sizing: border-box;
position: relative;
box-shadow: 5px 5px 0px 2px #56afe0;
position: relative;
display: grid;
grid-template-rows: auto 1fr;
}
.list_product li::after {
position: absolute;
display: block;
content: "";
background: url(../img/list_triangle.png)no-repeat center bottom/59px 63px;
width: 59px;
height: 63px;
right: 50%;
bottom: -33px;
transform: translate(50%,0);
}
.list_product li:nth-child(2n) {
margin-left: 4%;
}
.list_product .main_ttl {
display: flex;
flex-flow: row nowrap;
align-items: center;
justify-content: flex-start;
margin-bottom: 20px;
border-bottom: 2px solid #cccccc;
padding-bottom: 20px;
}
.list_product .main_ttl span {
font-size: 2.2rem;
font-weight: 700;
line-height: 1.2;
}
.list_product .main_ttl .num {
background: #fff7b1;
width: 60px;
min-width: 60px;
height: 60px;
font-size: 3.4rem;
color: #0061a2;
display: flex;
align-items: center;
justify-content: center;
margin-right: 20px;
}
.list_product .pro_box {
max-width: 300px;
margin: 0 auto;
width: 100%;
grid-template-rows: auto auto 1fr auto;
display: grid;
}
.list_product .pro_area {
display: grid;
}
.list_product .row {
display: flex;
flex-flow: row nowrap;
align-items: inherit;
justify-content: space-between;
}
.list_product .row .pro_box {
width: 47%;
margin: 0;
}
.list_product .img {
text-align: center;
margin-bottom: 20px;
}
.list_product .img img {
max-width: 195px;
width: 100%;
}
.list_product .ttl {
text-align: center;
font-size: 1.8rem;
font-weight: 700;
line-height: 1.2;
margin-bottom: 10px;
}
.list_product .txt {
font-size: 1.4rem;
line-height: 1.4;
margin-bottom: 30px;
font-family: "Noto Sans JP", sans-serif;
}
#area02 .info_box {
background: #fff;
max-width: 800px;
margin: 0 auto;
border: 5px solid #65bcea;
padding: 50px 30px 30px;
text-align: center;
font-weight: 700;
line-height: 1;
}
#area02 .info_box .txt01 {
margin-bottom: 10px;
}
#area02 .info_box .txt01 .ttl_icon {
font-size: 2rem;
}
#area02 .info_box .txt02 {
font-size: 3rem;
margin-bottom: 20px;
}
#area02 .info_box .txt02 img {
max-width: 120px;
margin-right: 5px;
}
	@media screen and (max-width: 768px) {
	#area02.area {
	padding: 40px 20px;
	}
	.list_product {
	flex-flow: column;
	align-items: center;
	justify-content: center;
	}
	.list_product li {
	width: 100%;
	margin-bottom: 50px;
	padding: 30px 20px;
	}
	.list_product li:nth-child(2n) {
	margin-left: 0;
	}
	.list_product .main_ttl span {
	font-size: 1.6rem;
	}
	.list_product .main_ttl .num {
	min-width: 40px;
	width: 40px;
	height: 40px;
	font-size: 2.2rem;
	margin-right: 15px;
	}
	.list_product .pro_box {
	max-width: 100%;
	}
	.list_product .row {
	flex-flow: column;
	align-items: center;
	justify-content: center;
	}
	.list_product .row .pro_box {
	width: 100%;
	margin: 0;
	}
	.list_product .row .pro_box:first-child {
	margin-bottom: 30px;
	}
	.list_product .ttl {
	font-size: 1.6rem;
	}
	#area02 .info_box {
	padding: 40px 20px 20px;
	}
	#area02 .info_box .txt01 .ttl_icon {
	font-size: 1.8rem;
	}
	#area02 .info_box .txt02 {
	font-size: 2.6rem;
	line-height: 1.2;
	}
	}
	@media screen and (max-width: 420px) {
	.list_product .pro_box,
	.list_product .row .pro_box {
	width: 100%;
	}
	}
#area02.area {
padding: 250px 20px 100px;
width: 100%;
overflow: hidden;
}
#area02.area .inner {
position: relative;
z-index: 2;
max-width: 1090px;
}
#area02 .illust > span {
position: absolute;
z-index: 1;
display: block;
}
#area02 .illust > span img {
width: auto;
height: auto;
}
#area02 .illust > span.i01 {
right: calc((100vw - 1020px) / 4);
top: 30px;
}
#area02 .illust > span.i02 {
left: calc((100vw - 1020px) / 2);
transform: translate(-100%,0);
top: 40%;
}
#area02 .illust > span.i03 {
right: calc((100vw - 1020px) / 2);
transform: translate(100%,0);
top: 60%;
}
#area02 .illust > span.i04 {
left: 0;
bottom: 30px;
}
#area02 .illust {
}
	@media screen and (max-width: 1200px) {
	#area02.area {
	padding: calc(100vw * (200 / 800)) 20px calc(100vw * (250 / 800));
	}
	}
	@media screen and (max-width: 768px) {
	#area02.area {
	padding: calc(100vw * (200 / 800)) 20px calc(100vw * (300 / 800));
	}
	#area02 .illust > span img {
	width: 100%;
	height: auto;
	}
	#area02 .illust > span.i01 {
	top: 10px;
	width: 80%;
	}
	#area02 .illust > span.i04 {
	width: 60%;
	bottom: 10px;
	}
	}
	@media screen and (max-width: 600px) {
	#area02.area {
	padding: calc(100vw * (200 / 800)) 20px calc(100vw * (300 / 800));
	}
	#area02 .illust > span img {
	width: 100%;
	height: auto;
	}
	#area02 .illust > span.i01 {
	right: 50%;
	transform: translate(50%,0);
	width: 90%;
	}
	#area02 .illust > span.i04 {
	left: 50%;
	transform: translate(-50%,0);
	}
	}

/* area03
-------------------------------------------------------*/
#area03 {
padding: 70px 20px 100px;
background: url(../img/bg03.jpg) repeat-y center top/ 100% auto;
}
.list_case {
display: flex;
flex-flow: row nowrap;
align-items: stretch;
justify-content: space-between;
margin-bottom: 50px;
}
.list_case li {
width: 48%;
border: 4px solid #65bcea;
padding: 20px;
box-sizing: border-box;
position: relative;
line-height: 1.4;
background: #fff;
}
.list_case li .tag {
position: absolute;
left: 0;
top: 0;
background: #65bcea;
text-align: center;
color: #fff;
font-size: 1.4rem;
padding: 6px 10px 10px;
line-height: 1;
font-weight: 500;
}
.list_case li .img {
margin-bottom: 15px;
text-align: center;
}
.list_case li .company {
font-weight: 700;
color: #0061a2;
margin-bottom: 5px;
font-size: 1.8rem;
}
.list_case li .txt {
font-weight: 500;
margin-bottom: 20px;
font-family: "Noto Sans JP", sans-serif;
}
.ttl01.mb20 {
margin-bottom: 20px;
}
	@media screen and (max-width: 768px) {
	#area03 {
	padding: 40px 20px;
	}
	.list_case {
	flex-flow: column;
	align-items: center;
	justify-content: center;
	margin-bottom: 40px;
	}
	.list_case li {
	width: 100%;
	}
	.list_case li:not(:last-child) {
	margin-bottom: 30px;
	}
	.list_case li .company {
	font-size: 1.6rem;
	}
	.list_case li .txt {
	font-size: 1.4rem;
	}
	}
#area03.area .inner {
position: relative;
z-index: 2;
}
#area03 .illust > span {
position: absolute;
z-index: 1;
display: block;
}
#area03 .illust > span img {
width: auto;
height: auto;
}
#area03 .illust > span.i01 {
right: calc((100vw - 1020px) / 2);
transform: translate(70%,0);
top: 10px;
}
#area03 .illust > span.i02 {
left: calc((100vw - 1020px) / 2);
transform: translate(-50%,0);
bottom: 0;
}
#area03 .illust {
}
	@media screen and (max-width: 1200px) {
	#area02.area {
	padding: calc(100vw * (200 / 800)) 20px calc(100vw * (250 / 800));
	}
	#area03 .illust > span.i01 {
	transform: translate(20%,0);
	width: 40%;
	top: 10px;
	}
	#area03 .illust > span.i02 {
	transform: translate(-30%,0);
	width: 50%;
	}
	}
	@media screen and (max-width: 768px) {
	#area03.area {
	padding: 50px 20px calc(100vw * (300 / 800));
	}
	#area03 .illust > span.i01 {
	display: none;
	}
	#area03 .illust > span.i02 {
	width: 60%;
	left: 50%;
	transform: translate(-50%,0);
	}
	}
	@media screen and (max-width: 600px) {
	#area02.area {
	padding: calc(100vw * (200 / 800)) 20px calc(100vw * (300 / 800));
	}
	#area02 .illust > span img {
	width: 100%;
	height: auto;
	}
	#area02 .illust > span.i01 {
	right: 50%;
	transform: translate(50%,0);
	width: 90%;
	}
	#area02 .illust > span.i04 {
	left: 50%;
	transform: translate(-50%,0);
	}
	}
/* area04
-------------------------------------------------------*/
#area04 {
background: url(../img/bg04.jpg) repeat-y center top/100% auto;
}
#area04.area {
padding: 70px 20px 100px;
}
.list_reason {
display: flex;
flex-flow: row nowrap;
align-items: stretch;
justify-content: space-between;
}
.list_reason li {
width: 31%;
background: #fff;
box-shadow: 5px 5px 0px 1px rgba(0,97,162,0.2);
position: relative;
padding: 60px 20px 40px;
}
.list_reason li .num {
position: absolute;
display: block;
content: "";
right: 50%;
top: -30px;
transform: translate(50%,0);
}
.list_reason li .num img {
max-width: 70px;
}
.list_reason li .img {
text-align: center;
margin-bottom: 20px;
}
.list_reason li .img img {
max-width: 112px;
}
.list_reason li .ttl {
text-align: center;
border-bottom: 2px solid #cccccc;
margin-bottom: 20px;
padding-bottom: 20px;
font-size: 2.4rem;
color: #0061a2;
font-weight: 700;
line-height: 1.4;
}
.list_reason li .txt {
font-family: "Noto Sans JP", sans-serif;
}
	@media screen and (max-width: 768px) {
	#area04.area {
	padding: 40px 20px;
	}
	#area04 .ttl01 {
	margin-bottom: 50px;
	}
	.list_reason {
	flex-flow: column;
	align-items: center;
	justify-content: center;
	}
	.list_reason li {
	width: 100%;
	padding: 40px 20px 30px;
	}
	.list_reason li:not(:last-child) {
	margin-bottom: 40px;
	}
	.list_reason li .num {
	top: -25px;
	}
	.list_reason li .num img {
	max-width: 50px;
	}
	.list_reason li .img img {
	max-width: 90px;
	}
	.list_reason li .ttl {
	font-size: 2rem;
	}
	.list_reason li .txt {
	font-size: 1.4rem;
	}
	}

/* area05
-------------------------------------------------------*/
#area05 {
background: url(../img/bg05.jpg) repeat-y center top/100% auto;
}
.white {
color: #fff;
}
#area05 .ttl01 {
font-size: 3.4rem;
margin-bottom: 30px;
}
#area05 .top_txt {
font-family: "Noto Sans JP", sans-serif;
text-align: center;
margin-bottom: 40px;
}
#area05 .btn01 {
margin-bottom: 40px;
}
.list_contact {
display: flex;
flex-flow: row nowrap;
align-items: stretch;
justify-content: space-between;
}
.list_contact li {
background: #fff;
width: 31%;
padding: 20px;
font-family: "Noto Sans JP", sans-serif;
line-height: 1.4;
}
.list_contact li .icon {
text-align: center;
margin-bottom: 20px;
}
.list_contact li .icon img {
max-width: 58px;
}
.list_contact li .ttl {
text-align: center;
font-weight: 700;
font-size: 1.8rem;
margin-bottom: 20px;
font-family: "Zen Maru Gothic", sans-serif;
}
.list_contact li .txt {
margin-bottom: 20px;
}
.list_contact li .tel_box {
margin-bottom: 20px;
}
.list_contact li dl {
display: flex;
flex-flow: row nowrap;
align-items: center;
justify-content: center;
margin-bottom: 5px;
font-weight: 700;
}
.list_contact li dl dt {
background: #0061a2;
color: #fff;
width: 46px;
height: 20px;
display: flex;
align-items: center;
justify-content: center;
margin-right: 5px;
}
.list_contact li dl dt.fax {
background: #fff;
border: 2px solid #0061a2;
color: #0061a2;
}
.list_contact li dl dd {
font-size: 2.4rem;
}
.list_contact li dl dd {
font-family: "Zen Maru Gothic", sans-serif;
}
.list_contact li .qr {
text-align: center;
}
.list_contact li .qr img {
max-width: 132px;
}
.list_contact li .txt_s {
font-size: 1.4rem;
}
.list_contact li .txt_ss {
font-size: 1.2rem;
margin-top: 20px;
}
.list_contact li a {
text-align: right;
display: block;
position: relative;
padding-right: 25px;
}
.list_contact li a::after {
position: absolute;
display: block;
content: "";
background: url(../img/btn_arrow.png)no-repeat right center/11px 16px;
width: 11px;
height: 16px;
right: 0;
top: 50%;
transform: translate(0,-50%);
}
	@media screen and (max-width: 768px) {
	#area05 .ttl01 {
	font-size: 2.4rem;
	}
	#area05 .top_txt {
	margin-bottom: 30px;
	font-size: 1.4rem;
	}
	#area05 .btn01 {
	margin-bottom: 40px;
	}
	.list_contact {
	flex-flow: column;
	align-items: center;
	justify-content: center;
	}
	.list_contact li {
	width: 100%;
	padding: 20px;
	}
	.list_contact li:not(:last-child) {
	margin-bottom: 20px;
	}
	}

/* 追従ボタン
-------------------------------------------------------*/
.bottom_btn {
position: fixed;
z-index: 999;
right: 0;
bottom: 2%;
display: flex;
flex-flow: column nowrap;
align-items: flex-end;
}
.list_btn img {
max-width: 171px;
}
.list_btn li {
margin-bottom: 10px;
}
	@media screen and (max-width: 768px) {
	.bottom_btn {
	bottom: 0;
	left: 0;
	background: #0061A2;
	flex-flow: row nowrap;
	}
	.list_btn {
	flex: 1 0 0%;
	display: flex;
	justify-content: center;
	align-items: center;
	}
	.list_btn li {
	margin-bottom: 0;
	}
	.list_btn img {
	max-width: 100%;
	}
	}

/* footer
-------------------------------------------------------*/
#footer {
background: #000;
padding: 50px 0;
text-align: center;
font-size: 90%;
color: #fff;
font-family: "Noto Sans JP", sans-serif;
}
#footer ul {
display: flex;
flex-flow: row nowrap;
align-items: center;
justify-content: center;
margin: 0 0 30px;
}
#footer ul li {
margin: 0 10px;
}
#footer ul a {
text-decoration: underline;
color: #fff;
}
#footer .copy {
margin: 0 0 20px;
}
	@media screen and (max-width: 768px) {
	#footer {
	padding: 30px 0 100px;
	}
	}
	@media screen and (max-width: 500px) {
	#footer {
	font-size: 80%;
	}
	}

/* pagetop
-------------------------------------------------------*/
#pagetop {
position: fixed;
right: 0;
bottom: 2%;
transition: all 0.3s linear;
z-index: 100;
cursor: pointer;

flex: 0 1 50px;
position: relative;
right: inherit;
bottom: inherit;
width: 50px;
height: 50px;
}
#pagetop:hover {
opacity: 0.6;
}
#pagetop a{
display: block;
width: 50px;
height: 50px;
background: #0061a2;
text-indent: -9999px;
}
#pagetop a:before {
content: "";
position: absolute;
right: 50%;
top: 50%;
width: 15px;
height: 15px;
margin: -6px -9px 0 0;
border-top: 2px solid #fffbdb;
border-right: 2px solid #fffbdb;
transform: rotate(-45deg);
}
	@media screen and (max-width: 768px) {
	#pagetop {
	width: 40px;
	height: 40px;
	}
	#pagetop.active,
	#pagetop:hover {
	opacity: 0.8;
	}
	#pagetop a {
	width: 40px;
	height: 40px;
	}
	#pagetop a:before {
	width: 10px;
	height: 10px;
	margin: -4px -6px 0 0;
	}
	}
	@media screen and (max-width: 520px) {
	}
/* root */
:root {

--prev_arrow: url('data:image/svg+xml,%3Csvg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 100 100" width="100" height="100"%3E%3Cpath d="M65.6 24.57 62.77 21.75 37.32 47.2 34.49 50.03 37.32 52.86 37.32 52.86 62.77 78.31 65.6 75.49 40.14 50.03 65.6 24.57Z" fill="%23cccccc"  /%3E%3C/svg%3E') no-repeat center / contain;
--next_arrow: url('data:image/svg+xml,%3Csvg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 100 100" width="100" height="100"%3E%3Cpath d="M34.44 24.54 37.27 21.72 62.73 47.17 65.56 50 62.73 52.83 62.73 52.83 37.27 78.28 34.44 75.46 59.9 50 34.44 24.54Z" fill="%23cccccc"  /%3E%3C/svg%3E') no-repeat center / contain;
--prev_arrow_w: url('data:image/svg+xml,%3Csvg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 100 100" width="100" height="100"%3E%3Cpath d="M65.6 24.57 62.77 21.75 37.32 47.2 34.49 50.03 37.32 52.86 37.32 52.86 62.77 78.31 65.6 75.49 40.14 50.03 65.6 24.57Z" fill="%23fff"  /%3E%3C/svg%3E') no-repeat center / contain;
--next_arrow_w: url('data:image/svg+xml,%3Csvg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 100 100" width="100" height="100"%3E%3Cpath d="M34.44 24.54 37.27 21.72 62.73 47.17 65.56 50 62.73 52.83 62.73 52.83 37.27 78.28 34.44 75.46 59.9 50 34.44 24.54Z" fill="%23fff"  /%3E%3C/svg%3E') no-repeat center / contain;
--top_arrow_w: url('data:image/svg+xml,%3Csvg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 100 100" width="100" height="100"%3E%3Cpath d="M24.54 65.56 21.72 62.73 47.17 37.27 50 34.44 52.83 37.27 52.83 37.27 78.28 62.73 75.46 65.56 50 40.1 24.54 65.56Z" fill="%23fff"  /%3E%3C/svg%3E') no-repeat center / contain;

--cross_icon: url('data:image/svg+xml,%3Csvg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 100 100" width="100" height="100"%3E%3Cpath d="M70.55 32.35 67.72 29.52 50.04 47.2 32.37 29.52 29.54 32.35 47.22 50.03 29.54 67.71 32.37 70.54 50.04 52.86 67.72 70.54 70.55 67.71 52.87 50.03 70.55 32.35z" fill="%23fff"  /%3E%3C/svg%3E') no-repeat center / contain;
--burger_icon: url('data:image/svg+xml,%3Csvg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 100 100" width="100" height="100"%3E%3Cpath d="M72,32H28v-4h44v4ZM72,48H28v4h44v-4ZM72,68H28v4h44v-4Z" fill="%23ddd"  /%3E%3C/svg%3E') no-repeat center / contain;
--plus_icon: url('data:image/svg+xml,%3Csvg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 100 100" width="100" height="100"%3E%3Cpath d="M75 47.5 52.5 47.5 52.5 25 47.5 25 47.5 47.5 25 47.5 25 52.5 47.5 52.5 47.5 75 52.5 75 52.5 52.5 75 52.5 75 47.5z" fill="%23fff"  /%3E%3C/svg%3E') no-repeat center / contain;

--rbb: url('data:image/svg+xml,%3Csvg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 100 100" width="100" height="100"%3E%3Cpath d="M-.07,99.97h100V-.03C99.93,55.2,55.16,99.97-.07,99.97Z" fill="%23222"  /%3E%3C/svg%3E') no-repeat center bottom / contain;
--lbg: url('data:image/svg+xml,%3Csvg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 100 100" width="100" height="100"%3E%3Cpath d="M-.07-.03v100h100C44.7,99.97-.07,55.2-.07-.03Z" fill="%23f5f5f5"  /%3E%3C/svg%3E') no-repeat center bottom / contain;
--rbw: url('data:image/svg+xml,%3Csvg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 100 100" width="100" height="100"%3E%3Cpath d="M-.07,99.97h100V-.03C99.93,55.2,55.16,99.97-.07,99.97Z" fill="%23fff"  /%3E%3C/svg%3E') no-repeat center bottom / contain;
--lbbu: url('data:image/svg+xml,%3Csvg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 100 100" width="100" height="100"%3E%3Cpath d="M-.07-.03v100h100C44.7,99.97-.07,55.2-.07-.03Z" fill="%23072B55"  /%3E%3C/svg%3E') no-repeat center bottom / contain;


｝
/* root end */

