﻿@charset "utf-8";


/*----------------------------------------------
	Overall settings
-----------------------------------------------*/

body{ min-width: 1200px; font-family: "Zen Kaku Gothic Antique", serif; color: #243325; text-align: center; background: url("../img/bg-wall.jpg") center top / 100% auto repeat;}
body.ovh{ position: fixed; left: 0; top: 0; width: 100%; height: 100vh;}
a{ color: #243325; text-decoration:none; -webkit-transition: all .2s; transition: all .2s;}
a:hover{ opacity: .5; text-decoration:none;}
.underline{ text-decoration: underline;}
/* font */
.zenkaku{ font-family: "Zen Kaku Gothic Antique", serif;}
.spectral{ font-family: "Spectral", serif;}
/* bg */
.bg-white{ background: #fff;}
.bg-cream,
.bg-beige,
.bg-green,
.bg-wall,
.bg-wallgreen{
	padding-top: 80px;
	padding-bottom: 120px;
	background: #FCFBF7;
	border-radius: 60px 60px 0 0;
	position: relative;
}
.bg-beige{ background: #F7F4EF;}
.bg-green{ background: #1a5d1f;}
.bg-wall{ background: url("../img/bg-wall.jpg") center top / 100% auto repeat;}
.bg-wallgreen{ background: url("../img/bg-wall-green.jpg") center top / 100% auto repeat;}
.notfirst{ margin-top: -60px;}
.last{ padding-bottom: 200px;}
/* color */
.f-white{ color: #fff;}
.f-red{ color: #c00;}
.f-green{ color: #1A5D1F;}

/*------------------------------ responsive ------------------------------*/
@media screen and (max-width: 540px) {
	body{ min-width: inherit; font-size: 4vw; background-size: 1366px auto;}
	a:hover{ opacity: 1;}
	/* bg */
	.bg-cream,
	.bg-beige,
	.bg-green,
	.bg-wall,
	.bg-wallgreen{
		padding-top: 15vw;
		padding-bottom: 30vw;
		border-radius: 40px 40px 0 0;
	}
	.notfirst{ margin-top: -15vw;}
	.last{ padding-bottom: 30vw;}
}
@media screen and (max-width: 350px) {
	html{ font-size: 50%;}
}



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

header{
	position: fixed;
	left: 0;
	top: 0;
	width: 100%;
	display: flex;
	justify-content: space-between;
	padding: 20px 5% 0;
	z-index: 999;
}
header.scrolled{ backdrop-filter: blur(10px);}
header h1{
	padding: 4px 0 8px;
	width: 136px;
	mix-blend-mode: multiply;
	position: relative;
	z-index: 9999;
}
header h1 a:hover{ opacity: 1;}
header ul{
	display: flex;
}
header ul li{
	margin-left: 40px;
	font-weight: bold;
	line-height: 50px;
}
header ul li a.btn{
	display: inline-block;
	padding: 0 1.5em;
	color: #fff;
	background: #1A5D1F;
	border-radius: 50%;
}
.spmenu{
	display: none;
}

/*------------------------------ responsive ------------------------------*/
@media screen and (max-width: 540px) {
	header{
		display: block;
		padding: 0 5%;
	}
	header h1{
		padding: 13px 0 10px;
		width: 128px;
	}
	header nav{
		display: none;
		position: fixed;
		left: 0;
		right: 0;
		top: 0;
		width: 100%;
		padding: 20vw 0 10vw;
		background: #eee;
		box-shadow: 0px 0px 16px -6px rgba(0,0,0,.6);
	}
	header ul{
		display: block;
	}
	header ul li{
		margin-left: 0;
		line-height: 3;
	}
	header ul li a.btn{
		margin-top: .5em;
	}
	.spmenu{
		display: block;
		position: absolute;
		right: 0;
		top: 0;
		width: 60px;
		height: 60px;
		cursor: pointer;
		z-index: 9999;
	}
	.spmenu span{
		display: inline-block;
		position: absolute;
		left: 20px;
		width: 33px;
		height: 1px;
		background: #1A5D1F;
		transform: translateX(-50%);
		transition: all .5s;
	}
	.spmenu span{
		display: inline-block;
		transition: all .5s;
	}
	.spmenu span:nth-of-type(1) { top: 33px;}
	.spmenu span:nth-of-type(2) { top: 43px;}
	.spmenu span:nth-of-type(3) { bottom: 23px;}
	.spmenu.active span:nth-of-type(1){
		transform: translate(-15px, 6px) rotate(-315deg)
	}
	.spmenu.active span:nth-of-type(2) {
		transform: translate(-15px, -4px) rotate(315deg)
	}
}



/*----------------------------------------------
	section
-----------------------------------------------*/

section{ padding-top: 107px;}
.wrap{ clear: both; box-sizing: content-box; max-width: 1160px; margin-left: auto; margin-right: auto; padding-left: 5%; padding-right: 5%;}
/* ttl */
.pagettl{
	padding-top: 60px;
	padding-bottom: 100px;
	position: relative;
}
.pagettl .pnav{
	position: absolute;
	right: 5%;
	bottom: 30px;
	display: flex;
	font-size: 13px;
}
.pagettl .pnav li:not(:last-child):after{
	content: "-";
	margin: 0 .5em;
}
.catettl{
	position: absolute;
	right: 10px;
	top: 0;
	font-size: 170px;
	letter-spacing: -.04em;
	color: rgba(172,172,155,.08);
	line-height: 1.4;
}
.ttl1{
	padding-bottom: 30px;
	font-size: 81px;
	font-weight: 500;
	line-height: 1;
	text-align: left;
	position: relative;
}
@keyframes ttl1anim{
	0%{ width: 0;}
	100%{ width: 320px;}
}
@keyframes ttl1anim-sp{
	0%{ width: 0;}
	100%{ width: 90vw;}
}
.ttl1:after{
	display: block;
	content: "";
	position: absolute;
	left: 0;
	bottom: 0;
	height: 23px;
	background: url("../img/line1.svg") left 5px bottom no-repeat;
	animation: ttl1anim 1s forwards ease;
}
.ttl1 span{
	display: block;
	padding-top: .2em;
	padding-left: .5em;
	font-size: 12px;
}
.ttl2{
	padding-left: 1em;
	font-size: 18px;
	font-weight: bold;
	position: relative;
}
.ttl2:before{
	display: inline-block;
	content: "";
	position: absolute;
	left: 0;
	top: .8em;
	width: 6px;
	height: 6px;
	background: #004E07;
	border-radius: 50%;
}
.ttl3{
	padding-left: .4em;
	font-size: 50px;
	font-weight: 500;
	line-height: 1.2;
	letter-spacing: -.04em;
	position: relative;
}
.ttl3:before{
	display: inline-block;
	content: "";
	position: absolute;
	left: 0;
	top: .5em;
	width: 7px;
	height: 7px;
	background: #243325;
	border-radius: 50%;
}
.ttl3 span{
	display: block;
	font-size: 22px;
	letter-spacing: 0;
}
/* btn */
.btn1{
	display: inline-block;
	width: 130px;
	line-height: 60px;
	font-weight: bold;
	text-align: center;
	border-radius: 50%;
	border: 1px solid #243325;
}
.btn1.f-white{
	color: #fff;
	border-color: #fff;
}
.btn1[target="_blank"]:after{
	display: inline-block;
	content: "";
	width: 14px;
	height: 14px;
	margin-left: .2em;
	background: url("../img/ic-target.svg") no-repeat;
}
.btn2{
	display: inline-block;
	width: 12em;
	color: #fff;
	font-weight: bold;
	line-height: 2.8;
	background: #1a5d1f;
	box-shadow: 0 0 5px rgba(0,0,0,.5);
	border-radius: 10px;
}
.btn3{
	display: inline-block;
	width: 12em;
	color: #fff;
	font-weight: bold;
	line-height: 2.8;
	background: #666;
	box-shadow: 0 0 5px rgba(0,0,0,.5);
	border-radius: 10px;
}
.btn4{
	display: inline-block;
	padding: .8em 1em;
	width: 100%;
	max-width: 22em;
	text-align: center;
	border: 1px solid #000;
	border-radius: 100px;
}
.btn4:hover{
	opacity: 1;
	color: #fff;
	background: #1a5d1f;
	border-color: #1a5d1f;
}
/* inner */
.inner{
	padding-top: 40px;
	padding-left: 200px;
}
/* table */
.table1{
	width: 100%;
}
.table1 th{
	width: 280px;
	padding: 1em 0;
	border-bottom: 1px solid #1A5D1F;
}
.table1 td{
	padding: 1em 1.5em;
	border-bottom: 1px solid #D6DEC3;
}
.table1 td .shozai{
	display: flex;
}
.table1 td .shozai dt{
	width: 5em;
}
.table1 td .shozai dd{
	flex: 1;
}

/*------------------------------ responsive ------------------------------*/
@media screen and (max-width: 540px) {
	section{ padding-top: 70px;}
	/* ttl */
	.pagettl{
		padding-top: 2em;
		padding-bottom: 2.5em;
	}
	.pagettl .pnav{
		bottom: 1em;
		font-size: 3.2vw;
	}
	.catettl{
		right: 1vw;
		top: 1.3em;
		font-size: 21vw;
		line-height: .8;
		text-align: right;
	}
	.ttl1{
		padding-bottom: .5em;
		font-size: 12.26vw;
		line-height: .8;
	}
	.ttl1 span{
		padding-top: 1em;
		font-size: 2.66vw;
	}
	.ttl1:after{
		height: .5em;
		background: url("../img/line1.svg") left bottom / 60vw auto no-repeat;
		animation: ttl1anim-sp 1s forwards ease;
	}
	.ttl2{
		font-size: 4.8vw;
	}
	.ttl3{
		font-size: 8.53vw;
	}
	.ttl3:before{
		width: 1.33vw;
		height: 1.33vw;
	}
	.ttl3 span{
		font-size: 3.2vw;
	}
	/* btn */
	.btn1{
		width: 7em;
		line-height: 3;
	}
	/* inner */
	.inner{
		padding-top: 15vw;
		padding-left: 0;
	}
	/* table */
	.table1 th{
		display: block;
		width: auto;
		padding: 1em 0 0;
		border-bottom: none;
	}
	.table1 tr:first-child th{
		padding: 0;
	}
	.table1 td{
		display: block;
		padding: 0 0 1em;
		position: relative;
	}
	.table1 td:after{
		display: block;
		content: "";
		position: absolute;
		left: 0;
		top: 100%;
		width: 5em;
		height: 1px;
		background: #1A5D1F;
	}
}



/*----------------------------------------------
	footer
-----------------------------------------------*/

footer{
	margin-top: -100px;
	padding-right: 8%;
	position: relative;
}
footer .pagetop{
	position: absolute;
	right: 0;
	bottom: 80px;
	width: 8%;
	cursor: pointer;
}
footer .fcont{
	background: url("../img/bg-footer.png") center top / 195px auto repeat;
	border-radius: 0 60px 0 0;
}
footer .fcontwrap{
	margin-left: calc(50% - 580px);
	padding: 70px 5%;
	display: flex;
	justify-content: space-between;
	font-size: 15px;
	text-align: left;
}
footer .fcontwrap .add dt{
	width: 191px;
	mix-blend-mode: multiply;
	margin-bottom: 1.5em;
}
footer .fcontwrap .fnav{
	display: flex;
	justify-content: space-between;
	width: 640px;
}
footer .fcontwrap .fnav dt{
	font-weight: bold;
}
footer .fcontwrap .fnav dd{
	padding-left: 1em;
	font-size: 13px;
	position: relative;
}
footer .fcontwrap .fnav dd:before{
	display: inline-block;
	content: "";
	position: absolute;
	left: 0;
	top: 1em;
	width: 7px;
	height: 1px;
	background: #243325;
}

/*------------------------------ responsive ------------------------------*/
@media screen and (max-width: 540px) {
	footer{
		margin-top: -15vw;
	}
	footer .pagetop{
		bottom: auto;
		top: 20vw;
	}
	footer .pagetop img{
		width: 3.46vw;
	}
	footer .fcont{
		background-size: 97px auto;
	}
	footer .fcontwrap{
		margin-left: 0;
		padding: 15vw 5%;
		display: block;
		font-size: 3.2vw;
	}
	footer .fcontwrap .add{
		margin-bottom: 2em;
		line-height: 1.6;
	}
	footer .fcontwrap .add dt{
		width: 37vw;
	}
	footer .fcontwrap .fnav{
		display: block;
		width: auto;
		position: relative;
	}
	footer .fcontwrap .fnav dl:last-child{
		position: absolute;
		right: 0;
		top: 0;
	}
	footer .fcontwrap .fnav dt.mb1em{
		margin-bottom: .5em;
	}
	footer .fcontwrap .fnav dd{
		font-size: 2.66vw;
	}
	footer .fcontwrap .fnav dd:before{
		width: 1.86vw;
	}
}



















































/*--------------------------------------------------------------------------------------------
	Sub-page settings
----------------------------------------------------------------------------------------------*/
/*----------------------------------------------
	/
-----------------------------------------------*/

.top1{
	min-width: 1200px;
	position: relative;
	padding: 0 5%;
	margin-bottom: 60px;
	aspect-ratio: 1160 / 610;
}
.top1 li{
	position: absolute;
	border-radius: 1.5vw;
	overflow: hidden;
}
@keyframes top1img1{
	0%{ height: 0;}
	100%{ height: 16.32vw;}
}
.top1 li.img1{
	left: 12vw;
	top: 8vw;
	width: 22vw;
	animation: top1img1 2s forwards ease;
}
@keyframes top1img2{
	0%{ height: 0;}
	100%{ height: 18.3vw;}
}
.top1 li.img2{
	right: 5vw;
	bottom: 33vw;
	width: 35vw;
	animation: top1img2 2s forwards ease;
}
@keyframes top1img3{
	0%{ height: 0;}
	100%{ height: 16.32vw;}
}
.top1 li.img3{
	left: 8vw;
	bottom: 5vw;
	width: 31vw;
	animation: top1img3 2s forwards ease;
}
@keyframes top1img4{
	0%{ height: 0;}
	100%{ height: 19.91vw;}
}
.top1 li.img4{
	right: 10vw;
	top: 23vw;
	width: 27vw;
	animation: top1img4 2s forwards ease;
}
@keyframes top1img{
	0%{ transform: scale(1.5);}
	100%{ transform: scale(1);}
}
.top1 li img{
	animation: top1img 2s forwards ease;
}
.top1 h1{
	position: absolute;
	left: 30vw;
	top: 9%;
	font-size: 11.56vw;
	font-weight: 500;
	line-height: 1;
	text-align: left;
}
.top1 h1 span{
	display: block;
	overflow: hidden;
}
@keyframes top1h1span{
	100%{ margin-top: -.2em;}
}
.top1 h1 span:nth-child(2){
	margin-top: .3em;
	animation: top1h1span 1.5s forwards ease;
}
.top1 h1 span:nth-child(3){
	margin-top: .6em;
	animation: top1h1span 1.5s forwards ease;
}
@keyframes top1h1strong{
	to { transform: translateY(0px);}
}
.top1 h1 span strong{
	display: block;
	font-weight: 500;
	letter-spacing: -.02em;
	animation: top1h1strong 1.5s forwards ease;
    transform: translateY(100%);
}
.top1 h1 span strong::first-letter{
	font-size: 13.61vw;
}
.top1 .scroll{
	position: absolute;
	left: 2%;
	bottom: -30px;
	background: url("../img/top1-scrollbg.svg") center / cover no-repeat;
}
@keyframes top1scroll{
	0%{ transform: rotate(0deg);}
	100%{ transform: rotate(360deg);}
}
.top1 .scroll img{ animation: top1scroll 12s linear infinite;}
.top2{
	margin-bottom: 110px;
	background: url("../img/top2-bg.svg") left 32% top 430px no-repeat;
}
.top2 .box1{
	display: flex;
	margin-bottom: 35px;
}
.top2 .box1 div{
	flex: 1;
	padding-top: 50px;
	margin-left: calc(50% - 550px);
	text-align: left;
}
.top2 .box1 div h2{
	margin-bottom: 40px;
}
.top2 .box1 div h2.ttl1:after{
	animation: none;
}
.top2 .box1 div.move-active h2.ttl1:after{
	animation: ttl1anim 1s forwards ease;
}
.top2 .box1 div .txt{
	font-size: 17px;
	margin-bottom: 2em;
}
.top2 .box1 figure{
	width: 58%;
	height: 492px;
	background: url("../img/top2-img1.jpg") center / cover no-repeat;
	border-radius: 20px 0 0 20px;
}
.top2 .img2{
	float: left;
	width: 22.1%;
}
.top2 .img2 img{
	border-radius: 0 20px 20px 0;
}
.top2 .img3{
	clear: none;
	padding-top: 100px;
	text-align: right;
}
.top2 .img3 img{
	margin-right: 10%;
	width: 37.6%;
	border-radius: 20px;
}
.topbg{
	background: #CFD7C5;
	border-radius: 60px 60px 0 0;
}
.top3{
	padding-top: 100px;
	padding-bottom: 30px;
}
.top3 h2{
	margin-bottom: 50px;
	padding-bottom: 30px;
	font-size: 81px;
	font-weight: 500;
	line-height: .9;
	background: url("../img/line2.svg") center bottom no-repeat;
}
.top3 h2 span{
	display: block;
	font-size: 12px;
}
.top3 article{
	display: flex;
	justify-content: space-between;
	margin-bottom: 120px;
}
.top3 article:nth-child(odd){
	flex-direction: row-reverse;
}
.top3 article div{
	width: 41%;
	text-align: left;
	position: relative;
}
.top3 article div h3{
	margin-bottom: .5em;
	font-size: 30px;
	font-weight: 500;
	line-height: 1.5;
	position: relative;
}
.top3 article div h3 span{
	display: block;
	font-size: 18px;
}
.top3 article div h3 img{
	position: absolute;
	right: 0;
	bottom: .3em;
}
.top3 article div .ill{
	position: absolute;
	bottom: -50px;
}
.top3 article.box1 div .ill{
	left: 120px;
	width: 496px;
}
.top3 article.box2 div .ill{
	right: 65px;
	width: 586px;
}
.top3 article.box3 div .ill{
	left: 115px;
	width: 433px;
}
.top3 article.box4 div .ill{
	right: 70px;
	width: 459px;
}
.top3 article.box5 div .ill{
	left: 102px;
	width: 438px;
}
.top3 article.box6 div .ill{
	right: 113px;
	width: 450px;
}
.top3 article div .txt{
	margin-bottom: 1.5em;
}
.top3 article div a{
	position: relative;
}
.top3 article figure{
	width: 54.7%;
}
.top3 article figure img{
	border-radius: 20px;
}
.top4{
	padding: 90px 5% 210px;
	color: #fff;
	background: url(../img/top4-bg.jpg) center / cover no-repeat;
}
.top4 h2{
	padding: 45px .5em 45px 0;
	margin-bottom: .2em;
	font-size: 81px;
	letter-spacing: -.04em;
	font-weight: 500;
	line-height: 1;
	background: url("../img/line3.svg") center top no-repeat;
}
.top4 h2 span{
	display: block;
	font-size: 12px;
	letter-spacing: 0;
}
.top4 .txt{
	margin-bottom: 3em;
}
@keyframes top1img1-sp{
	0%{ height: 0;}
	100%{ height: 28vw;}
}
@keyframes top1img2-sp{
	0%{ height: 0;}
	100%{ height: 40vw;}
}
@keyframes top1img3-sp{
	0%{ height: 0;}
	100%{ height: 37.6vw;}
}
@keyframes top1img4-sp{
	0%{ height: 0;}
	100%{ height: 30.9vw;}
}

/*------------------------------ responsive ------------------------------*/
@media screen and (max-width: 540px) {
	.top1{
		min-width: inherit;
		padding: 0 3%;
		margin-bottom: 10vw;
		aspect-ratio: 375 / 576;
	}
	.top1 li{
		border-radius: 6vw;
	}
	.top1 li.img1{
		left: 3vw;
		top: 16vw;
		width: 34.5vw;
		animation: top1img1-sp 2s forwards ease;
	}
	.top1 li.img2{
		right: 3vw;
		bottom: 116vw;
		width: 56.5vw;
		animation: top1img2-sp 2s forwards ease;
	}
	.top1 li.img3{
		left: 3vw;
		bottom: 26vw;
		width: 53vw;
		animation: top1img3-sp 2s forwards ease;
	}
	.top1 li.img4{
		right: 3vw;
		top: 108vw;
		width: 38vw;
		animation: top1img4-sp 2s forwards ease;
	}
	.top1 h1{
		left: 18vw;
		top: 40vw;
		font-size: 18.4vw;
	}
	.top1 h1 span strong::first-letter{
		font-size: 21.86vw;
	}
	.top1 .scroll{
		left: 5%;
		bottom: 6vw;
		width: 30.93vw;
	}
	
	.top2{
		margin-bottom: 15vw;
		background: url("../img/top2-bg.svg") left 8% top 100vw / 50% auto no-repeat;
	}
	.top2 .box1{
		display: block;
		margin-bottom: 5vw;
	}
	.top2 .box1 div{
		flex: 1;
		padding: 0 5%;
		margin-left: auto;
	}
	.top2 .box1 div h2{
		margin-bottom: .5em;
	}
	.top2 .box1 div .txt{
		font-size: 4vw;
	}
	.top2 .box1 figure{
		width: 53%;
		height: auto;
		margin-left: 47%;
		aspect-ratio: 199 / 224;
	}
	.top2 .img2{
		float: left;
		width: 35.46vw;
	}
	.top2 .img3{
		clear: none;
		padding: 10vw 0 0;
	}
	.top2 .img3 img{
		margin-right: 0;
		width: 58.66vw;
		border-radius: 20px 0 0 20px;
	}
	.topbg{
		border-radius: 40px 40px 0 0;
	}
	.top3{
		padding-top: 20vw;
		padding-bottom: 30px;
	}
	.top3 h2{
		margin-bottom: 1em;
		padding-bottom: 5vw;
		font-size: 12.26vw;
		background: url("../img/line2.svg") center bottom / 60% auto no-repeat;
	}
	.top3 h2 span{
		font-size: 2.66vw;
	}
	.top3 article{
		display: block;
		margin-bottom: 10vw;
	}
	.top3 article div{
		width: auto;
	}
	.top3 article div h3{
		font-size: 6.4vw;
	}
	.top3 article div h3 span{
		font-size: 3.2vw;
	}
	.top3 article div h3 img{
		position: static;
		width: 30%
	}
	.top3 article figure{
		width: auto;
	}
	.top3 article div .ill{
		position: static;
		width: 100%!important;
	}
	.top3 article.box1 div .ill{
		margin: -5vw -5vw 5vw 0;
		width: calc(100% + 5vw)!important;
	}
	.top3 article.box2 div .ill{
		margin: -10vw 0 5vw;
	}
	.top3 article.box3 div .ill{
		margin: -3vw -5vw 5vw 0;
		width: calc(100% + 5vw)!important;
	}
	.top3 article.box4 div .ill{
		margin: -3vw -5vw 5vw 0;
		width: calc(100% + 5vw)!important;
	}
	.top3 article.box5 div .ill{
		margin: 2vw 0 5vw;
	}
	.top3 article.box6 div .ill{
		margin: -5vw -5vw 5vw 0;
		width: calc(100% + 5vw)!important;
	}
	.top3 article div .ill img{
		width: 100%;
	}
	.top3 article div .btn{
		text-align: right;
	}
	.top4{
		padding: 15vw 5% 35vw;
	}
	.top4 h2{
		margin-bottom: .5em;
		padding: .6em .5em .6em 0;
		font-size: 12.26vw;
		background: url("../img/line3.svg") center top / 80% auto no-repeat;
	}
	.top4 h2 span{
		font-size: 2.66vw;
	}
	.top4 .txt{
		margin-bottom: 1em;
		text-align: left;
	}
}



/*----------------------------------------------
	business/
-----------------------------------------------*/

.business1{
	display: flex;
	padding-bottom: 100px;
}
.business1.row-reverse{
	flex-direction: row-reverse;
}
.business1 div{
	flex: 1;
	padding-right: 50px;
	position: relative;
}
.business1.row-reverse div{
	padding-right: 0;
	padding-left: 50px;
}
.business1 div h3{
	margin-bottom: 1em;
	font-size: 30px;
	font-weight: 500;
	line-height: 1.4;
}
.business1 div .txt{
	margin-bottom: 2em;
}
.business1 div .ill{
	position: absolute;
	bottom: -160px;
	right: 0;
}
.business1 div.box1 .ill{
	width: 379px;
}
.business1 div.box2 .ill{
	right: -12%;
	bottom: -130px;
	width: 511px;
}
.business1 div.box3 .ill{
	right: -5%;
	bottom: -130px;
	width: 459px;
}
.business1 div.box4 .ill{
	right: -12%;
	width: 454px;
}
.business1 div.box5 .ill{
	right: -27%;
	width: 525px;
}
.business1 div.box6 .ill{
	right: -12%;
	width: 548px;
}
.business1 div a{
	position: relative;
}
.business1 figure{
	width: 56.8%;
	position: relative;
}
.business1 figure img{
	border-radius: 30px;
}

/*------------------------------ responsive ------------------------------*/
@media screen and (max-width: 540px) {
	.business1{
		display: block;
		padding-bottom: 0;
	}
	.business1 div{
		padding-right: 0;
	}
	.business1.row-reverse div{
		padding-right: 0;
		padding-left: 0;
	}
	.business1 div h3{
		font-size: 5.33vw;
	}
	.business1 figure{
		width: auto;
		position: static;
		margin-bottom: 1em;
	}
	.business1 figure img{
		border-radius: 5.33vw;
	}
	.business1 div .txt{
		margin-bottom: 1em;
	}
	.business1 div .ill{
		position: absolute;
		bottom: -15vw;
		right: 0;
		width: 100%!important;
	}
	.business1 div.box1{ padding-bottom: 10vw;}
	.business1 div.box1 .ill{
		right: -3%;
		width: 75%;
	}
	.business1 div.box2{ padding-bottom: 15vw;}
	.business1 div.box2 .ill{
		right: 0;
		bottom: -12vw;
	}
	.business1 div.box3{ padding-bottom: 20vw;}
	.business1 div.box3 .ill{
		right: 0;
		bottom: -8vw;
		width: 107%;
	}
	.business1 div.box4{ padding-bottom: 23vw;}
	.business1 div.box4 .ill{
		right: -3%;
		bottom: -10vw;
	}
	.business1 div.box5{ padding-bottom: 35vw;}
	.business1 div.box5 .ill{
		right: 0;
		bottom: -10vw;
	}
	.business1 div.box6{ padding-bottom: 15vw;}
	.business1 div.box6 .ill{
		right: 0;
		bottom: -10vw;
		width: 110%;
	}
	.business1 div.box4 a{
		position: relative;
	}
}



/*----------------------------------------------
	business/architecture/
-----------------------------------------------*/

.architecture1{
	display: flex;
	flex-direction: row-reverse;
}
.architecture1 figure{
	width: 50%;
}
.architecture1 div{
	flex: 1;
	margin-left: calc(50% - 580px);
	padding-right: 50px;
	text-align: left;
}
.architecture1 div .ill{
	width: 120%;
	margin: 0 -10%;
}
.architecture2 h3{
	margin-bottom: 1em;
	color: #fff;
	font-size: 35px;
	font-weight: bold;
	line-height: 1;
}
.architecture2 .list{
	display: flex;
	flex-wrap: wrap;
	justify-content: space-between;
	margin-bottom: 30px;
}
.architecture2 .list figure{
	width: 46.5%;
	margin-bottom: 50px;
	transition: all .2s;
	cursor: pointer;
}
.architecture2 .list figure:hover{
	opacity: .7;
}
.architecture2 .list figcaption{
	display: flex;
	align-items: center;
	justify-content: center;
	margin: -2em auto 0;
	width: 240px;
	height: 65px;
	font-size: 15px;
	line-height: 1.4;
	text-align: center;
	background: #fff;
	position: relative;
}
.architecture2 .popbg{
	display: none;
	position: fixed;
	left: 0;
	top: 0;
	width: 100%;
	height: 100vh;
	background: rgba(0,0,0,.5);
	z-index: 9999;
}
.architecture2 .pop{
	position: fixed;
	left: 50%;
	top: calc(50% + 15px);
	width: 100%;
	max-width: 850px;
	padding: 50px 90px 30px;
	text-align: center;
	background: #fff;
	transform: translate(-50%, -50%);
	border-radius: 30px;
	z-index: 99999;
}
.architecture2 .pop.vishidden{
	visibility: hidden;
	pointer-events: none;
}
.architecture2 .pop h4{
	position: absolute;
	left: 50%;
	top: -1em;
	transform: translateX(-50%);
	display: inline-block;
	padding: 0 1.5em;
	color: #fff;
	font-size: 36px;
	font-weight: 500;
	background: #1a5d1f;
	border-radius: 10px;
}
.architecture2 .pop h5{
	margin-bottom: .5em;
	font-size: 24px;
	font-weight: 500;
}
.architecture2 .pop .slider{
	margin-bottom: 30px;
}
.architecture2 .pop .slider .slick-prev,
.architecture2 .pop .slider .slick-next{
	position: absolute;
	top: 50%;
	width: 63px;
	height: 63px;
	z-index: 99999;
	cursor: pointer;
}
.architecture2 .pop .slider .slick-prev{
	left: 0;
	transform: translate(-50%,-50%);
	background: url("../img/ic-left.png") center / cover no-repeat;
}
.architecture2 .pop .slider .slick-next{
	right: 0;
	transform: translate(50%,-50%);
	background: url("../img/ic-right.png") center / cover no-repeat;
}
.architecture2 .pop .thumb{
	margin-bottom: 30px;
}
.architecture2 .pop .thumb .slick-track{
	display: flex;
	justify-content: center;
	width: 100%!important;
}
.architecture2 .pop .thumb .slick-slide{
	width: 100px!important;
	margin: 0 15px;
}
.architecture2 .pop .thumb .slick-slide img{
	cursor: pointer;
}
.architecture2 .pop .thumb .slick-slide.slick-current img{
	opacity: .5;
}

/*------------------------------ responsive ------------------------------*/
@media screen and (max-width: 540px) {
	.architecture1{
		display: block;
	}
	.architecture1 figure{
		width: auto;
		margin-left: 10%;
		margin-bottom: 5vw;
	}
	.architecture1 div{
		margin-left: 5%;
		padding-right: 5%;
	}
	.architecture1 div .ill{
		width: 100%;
		margin: 0;
	}
	.architecture2 h3{
		font-size: 4.56vw;
		padding: 0 10%;
	}
	.architecture2 .list{
		display: block;
		padding: 0 10%;
		margin-bottom: 0;
	}
	.architecture2 .list figure{
		width: auto;
		margin-bottom: 10vw;
	}
	.architecture2 .list figure:last-child{
		margin-bottom: 0;
	}
	.architecture2 .list figcaption{
		width: 16em;
		height: 4em;
		font-size: 2vw;
	}
	.architecture2 .popbg{
		display: none;
		position: fixed;
		left: 0;
		top: 0;
		width: 100%;
		height: 100vh;
		background: rgba(0,0,0,.5);
		z-index: 9999;
	}
	.architecture2 .pop{
		top: calc(50% + 15px);
		padding: 2em 5%;
		border-radius: 20px;
	}
	.architecture2 .pop h4{
		font-size: 5.33vw;
	}
	.architecture2 .pop h5{
		margin-bottom: .5em;
		font-size: 4vw;
	}
	.architecture2 .pop .slider{
		margin-bottom: 1em;
	}
	.architecture2 .pop .slider .slick-prev,
	.architecture2 .pop .slider .slick-next{
		width: 8.53vw;
		height: 8.53vw;
	}
	.architecture2 .pop .thumb{
		margin-bottom: 1em;
	}
	.architecture2 .pop .thumb .slick-slide{
		width: 22%!important;
		margin: 0;
	}
	.architecture2 .pop .thumb .slick-slide:not(:nth-child(4n)){
		margin-right: 4%;
	}
	.architecture2 .pop .txt{
		font-size: 3.46vw
	}
}



/*----------------------------------------------
	business/education/
-----------------------------------------------*/

.education1{
	display: flex;
	justify-content: space-between;
}
.education1 .snav{
	width: 24.13%;
	margin-left: calc(50% - 580px);
}
.education1 .snav li a{
	display: block;
	margin-bottom: .5em;
	padding: .5em 2em .5em 1em;
	color: #fff;
	font-size: 15px;
	text-align: left;
	background: url("../img/arrow-right.png") right 1em center / 7.5px auto no-repeat #1a5d1f;
	border-radius: 10px;
}
.education1 .boxwrap{
	width: 67%;
}
.education1 .boxwrap .mv{
	padding: 0 7% 60px 13%;
	position: relative;
}
.education1 .boxwrap .mv figcaption{
	position: absolute;
	left: 4%;
	top: -60px;
	width: 486px;
}
.education1 .boxwrap .box{
	padding: 50px 5% 120px;
	text-align: left;
	position: relative;
}
.education1 .boxwrap .box .anchor{
	position: absolute;
	top: -100px;
}
.education1 .boxwrap .box h3{
	font-size: 30px;
	font-weight: 500;
	margin-bottom: .5em;
}
.education1 .boxwrap .box .txt{
	margin-bottom: 3em;
}
.education1 .boxwrap .box .contactbox{
	margin-bottom: 15px;
	overflow: hidden;
	position: relative;
	z-index: 1;
}
.education1 .boxwrap .box .contactbox a{
	display: block;
	max-width: 400px;
	margin-bottom: 15px;
	padding-left: 100px;
	color: #fff;
	font-size: 27px;
	font-weight: 500;
	line-height: 80px;
	text-align: left;
}
.education1 .boxwrap .box .contactbox a.tel{
	font-size: 38px;
	background: url(../img/ic-tel.png) left 40px center / 45px no-repeat #1a5d1f;
}
.education1 .boxwrap .box .contactbox a.mail{
	background: url(../img/ic-mail.png) left 40px center / 45px no-repeat #1a5d1f;
}
.education1 .boxwrap .box1wrap{
	padding-bottom: 180px;
}
.education1 .boxwrap .box1wrap .ill{
	position: absolute;
	right: 5%;
	top: 160px;
	width: 45%;
}
.education1 .boxwrap .box2wrap .ill{
	position: absolute;
	right: 5%;
	top: 160px;
	width: 42%;
}
.education1 .boxwrap .box2wrap .txt{
	max-width: 440px;
}
.education1 .boxwrap .box3wrap .ill{
	position: absolute;
	right: 5%;
	top: 160px;
	width: 42%;
}
.education1 .boxwrap .box3wrap{
	padding-left: 50%;
}
.education1 .boxwrap .box3wrap .ill{
	position: absolute;
	left: 5%;
	top: 60px;
	width: 42%;
}
.education1 .boxwrap .box9wrap{
	padding-bottom: 200px;
}
.education1 .boxwrap .box9wrap .ill{
	position: absolute;
	right: 5%;
	bottom: 130px;
	width: 47%;
}
.education1 .boxwrap .staff-slider .slick-prev,
.education1 .boxwrap .staff-slider .slick-next{
	position: absolute;
	top: 50%;
	width: 50px;
	height: 50px;
	z-index: 99999;
	cursor: pointer;
}
.education1 .boxwrap .staff-slider .slick-prev{
	left: 20px;
	transform: translate(-50%,-50%);
	background: url("../img/ic-left2.png") center / 15px auto no-repeat;
}
.education1 .boxwrap .staff-slider .slick-next{
	right: 20px;
	transform: translate(50%,-50%);
	background: url("../img/ic-right2.png") center / 15px auto no-repeat;
}
.education1 .boxwrap .staff-slider img{
	border-radius: 30px;
	margin-bottom: 40px;
}
.education1 .boxwrap .staff-thumb{
	margin: 0 -15px -30px;
}
.education1 .boxwrap .staff-thumb .slick-slide{
	padding: 0 15px;
}
.education1 .boxwrap .staff-thumb img{
	border-radius: 35px;
	cursor: pointer;
}
.education1 .boxwrap .staffbox2wrap{
	padding-left: 50%;
	padding-bottom: 220px;
}
.education1 .boxwrap .staffbox2wrap .ill{
	position: absolute;
	left: 8%;
	top: 60px;
	width: 42%;
}
.education1 .boxwrap .staffbox3wrap{
	padding-bottom: 200px;
}
.education1 .boxwrap .staffbox3wrap .ill{
	position: absolute;
	right: 5%;
	top: 80px;
	width: 42%;
}
.education1 .boxwrap .staffbox3wrap .txt{
	max-width: 440px;
}
.education1 .boxwrap .staffbox5wrap{
	padding: 50px 15% 120px;
}
.education1 .boxwrap .staffbox5wrap .achieve{
	display: flex;
	justify-content: space-between;
	margin-bottom: 50px;
}
.education1 .boxwrap .staffbox5wrap .achieve figure{
	width: 45%;
}
.education1 .boxwrap .staffbox5wrap .achieve figure img{
	border-radius: 20px;
}

/*------------------------------ responsive ------------------------------*/
@media screen and (max-width: 540px) {
	.education1{
		display: block;
	}
	.education1 .boxwrap{
		width: auto;
	}
	.education1 .boxwrap .mv{
		padding: 0 5% 20vw;
		margin-top: -10vw;
	}
	.education1 .boxwrap .mv figcaption{
		left: 7%;
		top: auto;
		bottom: 5vw;
		width: 75%;
	}
	.education1 .boxwrap .box{
		padding: 10vw 5% 28vw;
		text-align: left;
		position: relative;
	}
	.education1 .boxwrap .box .anchor{
		position: absolute;
		top: -70px;
	}
	.education1 .boxwrap .box h3{
		font-size: 5.33vw;
	}
	.education1 .boxwrap .box .txt{
		margin-bottom: 2em;
	}
	.education1 .boxwrap .box .contactbox{
		margin-bottom: 3vw;
	}
	.education1 .boxwrap .box .contactbox a{
		max-width: inherit;
		margin-bottom: 3vw;
		padding-left: 25vw;
		font-size: 6vw;
		line-height: 18vw;
	}
	.education1 .boxwrap .box .contactbox a.tel{
		font-size: 8.69vw;
		background: url(../img/ic-tel.png) left 10vw center / 10vw no-repeat #1a5d1f;
	}
	.education1 .boxwrap .box .contactbox a.mail{
		background: url(../img/ic-mail.png) left 10vw center / 10vw no-repeat #1a5d1f;
	}
	.education1 .boxwrap .box1wrap .ill{
		position: static;
		width: 60%;
		margin: -5vw 0 5vw 40%;
	}
	.education1 .boxwrap .box2wrap .ill{
		position: static;
		width: 60%;
		margin: -5vw 0 5vw 40%;
	}
	.education1 .boxwrap .box2wrap .txt{
		max-width: inherit;
	}
	.education1 .boxwrap .box3wrap .ill{
		position: static;
		width: 60%;
		margin: -5vw 0 5vw 40%;
	}
	.education1 .boxwrap .box3wrap{
		padding-left: 5%;
	}
	.education1 .boxwrap .box3wrap .ill{
		position: static;
		width: 60%;
		margin: -5vw 0 5vw 40%;
	}
	.education1 .boxwrap .box9wrap{
		padding-bottom: 20vw;
	}
	.education1 .boxwrap .box9wrap .ill{
		position: static;
		width: 80%;
		margin: 3vw 10% 0;
	}
	.education1 .boxwrap .staff-slider img{
		border-radius: 20px;
		margin-bottom: 5vw;
	}
	.education1 .boxwrap .staff-thumb{
		margin: 0 -2vw;
	}
	.education1 .boxwrap .staff-thumb .slick-slide{
		padding: 0 2vw;
	}
	.education1 .boxwrap .staff-thumb img{
		border-radius: 15px;
	}
	.education1 .boxwrap .staffbox2wrap{
		padding-left: 5%;
		padding-bottom: 20vw;
	}
	.education1 .boxwrap .staffbox2wrap .ill{
		position: static;
		width: 60%;
		margin: 0 0 5vw 20%;
	}
	.education1 .boxwrap .staffbox3wrap{
		padding-bottom: 20vw;
	}
	.education1 .boxwrap .staffbox3wrap .ill{
		position: static;
		width: 60%;
		margin: 0 0 5vw 20%;
	}
	.education1 .boxwrap .staffbox3wrap .txt{
		max-width: inherit;
	}
	.education1 .boxwrap .staffbox5wrap{
		padding: 50px 5% 120px;
	}
	.education1 .boxwrap .staffbox5wrap .achieve{
		display: block;
		margin-bottom: 0;
	}
	.education1 .boxwrap .staffbox5wrap .achieve figure{
		width: auto;
		margin-bottom: 5vw;
	}
	.education1 .boxwrap .staffbox5wrap .achieve figure img{
		border-radius: 20px;
	}
}



/*----------------------------------------------
	business/aquarium/
-----------------------------------------------*/

.aquarium1 img{
	border-radius: 30px;
}
.aquarium2{
	text-align: left;
	position: relative;
	padding-bottom: 150px;
}
.aquarium2 h3{
	font-size: 30px;
	font-weight: 500;
	margin-bottom: .5em;
}
.aquarium2 .txt{
	max-width: 520px;
}
.aquarium2 figure{
	position: absolute;
	right: 5%;
	top: 50px;
	width: 80%
}
.aquarium3{
	text-align: left;
}
.aquarium3 h3{
	font-size: 30px;
	font-weight: 500;
	margin-bottom: .5em;
}
.aquarium3 .box1{
	margin-bottom: 60px;
	padding: 50px 100px;
	background: #fefcef;
	border-radius: 30px;
}
.aquarium3 .box2{
	position: relative;
	margin-bottom: 120px;
}
.aquarium3 .box2 p{
	max-width: 560px;
	padding: 2em;
	background: #fff;
	border-radius: 20px;
}
.aquarium3 .box2 figure{
	position: absolute;
	right: 5%;
	top: 0;
	width: 46%;
}
.aquarium3 .box3{
	position: relative;
}
.aquarium3 .box3 .img{
	position: absolute;
	right: 0;
	top: 0;
	width: 636px;
}
.aquarium3 .box3 p{
	padding-right: 650px;
}
.aquarium3 .box3 .ill{
	width: 490px;
}

/*------------------------------ responsive ------------------------------*/
@media screen and (max-width: 540px) {
	.aquarium1 img{
		margin: -10vw 0;
		border-radius: 5vw;
	}
	.aquarium2{
		padding-bottom: 0;
	}
	.aquarium2 h3{
		font-size: 5.33vw;
	}
	.aquarium2 .txt{
		max-width: inherit;
		margin-bottom: 1em;
	}
	.aquarium2 figure{
		position: static;
		width: auto;
	}
	.aquarium3 h3{
		font-size: 5.33vw;
	}
	.aquarium3 .box1{
		margin: 0 -5vw 15vw;
		padding: 5vw;
		border-radius: 0;
	}
	.aquarium3 .box2{
		margin-bottom: 10vw;
	}
	.aquarium3 .box2 h3{
		white-space: nowrap;
	}
	.aquarium3 .box2 p{
		max-width: 560px;
		padding: 1.5em 0 1.5em 1em;
		background: #fff;
		border-radius: 20px;
	}
	.aquarium3 .box2 figure{
		position: static;
		width: auto;
		padding: 2vw 5vw 0;
	}
	.aquarium3 .box3 .img{
		position: static;
		width: auto;
		margin-bottom: 1.5em;
	}
	.aquarium3 .box3 p{
		padding-right: 0;
		margin-bottom: .5em;
	}
	.aquarium3 .box3 .ill{
		width: auto;
		padding: 0 10%;
	}
}



/*----------------------------------------------
	recruit/
-----------------------------------------------*/

.recruit1 .box1{
	display: flex;
	justify-content: space-between;
	margin-bottom: 60px;
}
.recruit1 .box1 p{
	flex: 1;
	margin-left: calc(50% - 580px);
	text-align: left;
}
.recruit1 .box1 figure{
	width: 50%;
	position: relative;
}
.recruit1 .box1 figure figcaption{
	position: absolute;
	right: 95%;
	top: 33%;
	width: 449px;
}
.recruit1 .box2 h3{
	font-size: 30px;
	font-weight: 500;
	margin-bottom: 1em;
}
.recruit1 .box2 ul{
	display: flex;
	justify-content: space-between;
	flex-wrap: wrap;
}
.recruit1 .box2 li{
	width: 21.5%;
	margin-bottom: 1em;
}
.recruit1 .box2 li a{
	display: block;
	margin-bottom: .5em;
	padding: .5em 2em .5em 1em;
	color: #fff;
	font-size: 15px;
	text-align: left;
	background: url("../img/arrow-right.png") right 1em center / 7.5px auto no-repeat #1a5d1f;
	border-radius: 10px;
}
.recruit2{
	position: relative;
	margin-bottom: 60px;
}
.recruit2 .anchor{
	position: absolute;
	top: -100px;
}
.recruit2 h3{
	font-size: 30px;
	font-weight: 500;
	margin-bottom: .5em;
}
.recruit2 figure{
	position: absolute;
	right: 0;
	top: 0;
	width: 35%;
}
.recruit2 .txt{
	margin-bottom: 1em;
	width: 60%;
	text-align: left;
}
.recruit2 .txt.mb3em{
	margin-bottom: 3em;
}
.recruit2 dl{
	display: flex;
	line-height: 1.4;
}
.recruit2 dl dt{
	padding: 0 .5em .1em;
	margin-right: 1em;
	color: #fff;
	background: #1a5d1f;
	border-radius: 10px;
}
.recruit2 dl dd{
	flex: 1;
}

/*------------------------------ responsive ------------------------------*/
@media screen and (max-width: 540px) {
	.recruit1 .box1{
		display: block;
		margin: -10vw 0 0;
		padding: 0 5%;
	}
	.recruit1 .box1 p{
		margin-left: 0;
	}
	.recruit1 .box1 figure{
		width: auto;
		margin-bottom: 25vw;
	}
	.recruit1 .box1 figure figcaption{
		right: 25%;
		top: 90%;
		width: 75%;
	}
	.recruit1 .box2{
		display: none;
	}
	.recruit2{
		margin-bottom: 0;
	}
	.recruit2 .anchor{
		top: -70px;
	}
	.recruit2 h3{
		font-size: 5.33vw;
	}
	.recruit2 figure{
		position: static;
		width: 60%;
		margin-left: 40%;
		margin-bottom: -2em;
	}
	.recruit2 .txt{
		margin-bottom: 1em!important;
		width: auto;
	}
	.recruit2 dl{
		display: block;
		line-height: 2;
		margin-bottom: 0!important;
	}
	.recruit2 dl dt{
		display: inline-block;
		margin-bottom: .5em;
	}
}



/*----------------------------------------------
	company/
-----------------------------------------------*/

.company1{
	position: relative;
	padding: .5em 0;
}
.company1:before{
	display: block;
	content: "";
	position: absolute;
	left: 160px;
	top: 0;
	width: 3px;
	height: 100%;
	background: #D6DEC3;
}
.company1 li{
	position: relative;
}
.company1 li:before{
	display: block;
	content: "";
	position: absolute;
	left: 158px;
	top: .5em;
	width: 8px;
	height: 8px;
	background: #1A5D1F;
	border-radius: 50%;
}
.company1 li dl{
	display: flex;
	margin-bottom: 1em;
}
.company1 li dl dt{
	width: 160px;
	font-size: 20px;
	line-height: 1.6;
}
.company1 li dl dd{
	flex: 1;
	padding-left: 2.5em;
}
.company2 iframe{
	width: 100%;
	height: 470px;
}

/*------------------------------ responsive ------------------------------*/
@media screen and (max-width: 540px) {
	.company1{
		padding: .5em 0;
		line-height: 1.6;
	}
	.company1:before{
		left: 7em;
	}
	.company1 li:before{
		left: calc(7em - 1vw);
		top: .7em;
		width: 2.13vw;
		height: 2.13vw;
	}
	.company1 li dl dt{
		width: 7em;
		font-size: 4.26vw;
	}
	.company1 li dl dd{
		padding-left: 1em;
	}
	.company2 iframe{
		height: 387px;
	}
}



/*----------------------------------------------
	contact/
-----------------------------------------------*/

.contact1{
	max-width: 580px;
	margin: 0 auto;
	padding-top: 40px;
}
.contact1 ol{
	display: flex;
	justify-content: space-between;
	margin-bottom: 50px;
	position: relative;
}
.contact1 ol:before{
	display: block;
	content: "";
	position: absolute;
	left: .5em;
	top: .7em;
	width: calc(100% - 1em);
	height: 3px;
	background: #1a5d1f;
}
.contact1 ol li{
	padding: 2em 0;
	width: 28px;
	position: relative;
}
.contact1 ol li:before{
	display: block;
	content: "";
	position: absolute;
	left: 50%;
	top: 0;
	transform: translateX(-50%);
	width: 28px;
	height: 28px;
	background: #FCFBF7;
	border: 2px solid #1a5d1f;
	border-radius: 50%;
}
.contact1 ol li.active:before{
	background: #1a5d1f;
}
.contact1 ol li span{
	position: absolute;
	left: 50%;
	bottom: 0;
	transform: translateX(-50%);
	color: #1a5d1f;
	font-size: 15px;
	text-align: center;
	white-space: nowrap;
}
.contact1 p{
	font-size: 15px;
}
.contact1 p.done{
	padding: 1.5em;
	margin: 0 4em 3em;
	color: #1a5d1f;
	font-weight: bold;
	text-align: center;
	border: 2px solid #1a5d1f;
	border-radius: 20px;
}
.contact2 table{
	width: 100%;
	margin-bottom: 60px;
}
.contact2 table th{
	padding: 2em 0;
	width: 340px;
	font-weight: bold;
	vertical-align: middle;
	border-bottom: 2px solid #e6e8dd;
}
.contact2 table th em{
	display: inline-block;
	padding: 0 1em;
	color: #fff;
	font-weight: bold;
	line-height: 1.5;
	background: #1a5d1f;
	border-radius: 2px;
}
.contact2 table td{
	padding: 2em 0;
	border-bottom: 2px solid #e6e8dd;
}
.contact2 table td ul{
	display: inline-block;
	vertical-align: top;
	min-width: 40%;
}
.contact2 table td .postwrap{
	display: flex;
	justify-content: space-between;
	align-items: center;
}
.contact2 table td .postwrap input{
	width: 80%;
}
.contact2 table td .postwrap button{
	width: 17%;
	color: #fff;
	font-weight: bold;
	line-height: 37px;
	background: #1a5d1f;
	border-radius: 10px;
	box-shadow: 0 0 5px rgba(0,0,0,.5);
}
.contact2 .agree{
	text-align: center;
	margin-bottom: 50px;
}
.contact2 .btn{
	display: flex;
	justify-content: center;
}
.contact2 .btn button{
	margin: 0 10px;
}
.contact3{
	margin-left: 230px;
}

/*------------------------------ responsive ------------------------------*/
@media screen and (max-width: 540px) {
	.contact1{
		padding-top: 5em;
	}
	.contact1 ol{
		margin: 0 5vw 2em;
	}
	.contact1 ol:before{
		top: .5em;
	}
	.contact1 ol li{
		padding: 2em 0 1em;
		width: 1em;
	}
	.contact1 ol li:before{
		width: 1.2em;
		height: 1.2em;
		border-width: 1px;
	}
	.contact1 ol li span{
		font-size: 3.2vw;
	}
	.contact1 p{
		font-size: 4vw;
	}
	.contact1 p.done{
		padding: 1em;
		margin: 0 0 2em;
	}
	.contact2 table{
		margin-bottom: 10vw;
	}
	.contact2 table th{
		display: block;
		padding: 1em 0 .5em;
		width: auto;
		border-bottom: none;
	}
	.contact2 table td{
		display: block;
		padding: 0 0 1.5em;
	}
	.contact2 table td input[type="text"], .contact2 table td input[type="email"], .contact2 table td input[type="tel"]{
		height: 2.5em;
		line-height: 2.5;
		border-width: 1px;
		border-radius: 10px;
	}
	.contact2 table td ul{
		min-width: inherit;
		margin-right: 1em;
	}
	.contact2 table td .postwrap input{
		width: calc(100% - 6em);
	}
	.contact2 table td .postwrap button{
		width: 5em;
		font-size: 16px;
		line-height: 1.8;
	}
	.contact2 table td textarea{
		height: 120px;
	}
	.contact2 .agree{
		margin-bottom: 2em;
	}
	.contact2 .btn{
		display: block;
		text-align: center;
	}
	.contact2 .btn button{
		display: block;
		margin: 0 auto 5vw;
	}
	.contact2 .btn button.btn3{
		font-size: 3.2vw;
	}
	.contact3{
		margin-left: 0;
	}
}



/*----------------------------------------------
	privacy/
-----------------------------------------------*/

.privacy1{
	padding-top: 80px;
	text-align: left;
	line-height: 1.6;
}

/*------------------------------ responsive ------------------------------*/
@media screen and (max-width: 540px) {
	.privacy1{
		padding-top: 15vw;
	}
}



/*----------------------------------------------
	sitemap/
-----------------------------------------------*/

.sitemap1{
	margin-bottom: 100px;
	padding-top: 80px;
	text-align: left;
}
.sitemap1 dt a{
	display: block;
	padding: .5em 4em;
	font-weight: 500;
	background: #cfdbcc;
	position: relative;
}
.sitemap1 dt a:before{
	display: block;
	content: "";
	position: absolute;
	left: 1em;
	top: 50%;
	transform: translateY(-50%);
	width: 24px;
	height: 24px;
	background: #1a5d1f;
	border: 5px solid #fff;
}
.sitemap1 dt a:after{
	display: block;
	content: "▶";
	position: absolute;
	right: 1em;
	top: 50%;
	transform: translateY(-50%);
}
.sitemap1 dd a{
	display: inline-block;
	margin-left: 6.5em;
	margin-bottom: 1em;
	font-weight: 500;
	position: relative;
}
.sitemap1 dd a:before{
	display: block;
	content: "";
	position: absolute;
	left: -2.5em;
	top: 50%;
	transform: translateY(-50%);
	width: 24px;
	height: 24px;
	background: #1a5d1f;
	border: 5px solid #cfdbcc;
}
.sitemap1 dd a:after{
	content: "▶";
	margin-left: 1em;
}

/*------------------------------ responsive ------------------------------*/
@media screen and (max-width: 540px) {
	.sitemap1{
		margin-bottom: 15vw;
		padding-top: 15vw;
	}
	.sitemap1 dt{
		margin-bottom: 1.5em;
	}
	.sitemap1 dt a{
		padding: .2em 2.5em;
	}
	.sitemap1 dt a:before{
		width: 1em;
		height: 1em;
		border-width: .3em;
	}
	.sitemap1 dt a:after{
		right: .5em;
	}
	.sitemap1 dd a{
		margin-left: 4em;
		margin-bottom: .5em;
	}
	.sitemap1 dd a:before{
		left: -1.5em;
		width: 1em;
		height: 1em;
		border-width: .3em;
	}
	.sitemap1 dd a:after{
		content: "▶";
		margin-left: 1em;
	}
}













