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

body {
  font-family: "Zen Kaku Gothic New", sans-serif;
  font-weight: 400;
  font-style: normal;
line-height: 1.8rem;
}


.top_img {
	text-align: center;
	padding-top: 20%;
	padding-bottom: 28%;
	background-image: url("../images/top_img_back.jpg");
	background-repeat: no-repeat;
	background-position: center bottom;
	background-size: contain;
}

.top_img img {
	width: 210px;
}

div.row.vision {
	margin-top: 0;
}

div.row.mission {
	margin-top: 10px;
}

.vision_misstion {
	margin-top: 40px;
	padding-bottom: 60px;
}

.vision_misstion h2,
.policy h2,
.member h2,
.domain h2,
.works h2,
.access h2,
.contact h2 {
	text-align: center;
	font-size: 30px;
	font-weight: 300;
}

.vision_misstion p.title_text,
.policy p.title_text {
	text-align: center;
	margin-bottom: 10px;
}

.member p.title_text,
.domain p.title_text,
.access p.title_text,
.works p.title_text,
.contact p.title_text {
	text-align: center;
	margin-bottom: 50px;
}

.vision_misstion .vision h3 {
	position: relative;
	text-align: center;
	padding: 3rem 0;
	font-size: 22px;
	font-weight: 300;
}

.vision_misstion .vision h3::before {
	position: absolute;
    width: 120px;
    height: 120px;
    top: 50%;
    left: 50%;
    border-radius: 50%;
    background: #c6db83;
    transform: translate(-50%, -50%);
    content: '';
    z-index: -1;
}

.vision_misstion .mission h3 {
	position: relative;
	text-align: center;
	padding: 3rem 0;
	font-size: 22px;
	font-weight: 300;
}

.vision_misstion .mission h3::before {
	position: absolute;
    width: 100px;
    height: 100px;
    top: 50%;
    left: 50%;
    border-radius: 50%;
    background: #f4bdbd;
    transform: translate(-50%, -50%);
    content: '';
    z-index: -1;
}


.vision_misstion .vision p{
	text-align: left;
	font-size: 3.4vw;
	font-weight: 300;
	line-height: 1.5em;
}

.vision_misstion .mission p{
	text-align: right;
	font-size: 3.4vw;
	font-weight: 300;
	line-height: 1.5em;
}

.vision_misstion .vision p span {
	border-bottom: 3px solid #89b91b;
	padding-bottom: 12px;
}

.vision_misstion .mission p span {
	border-bottom: 3px solid #f4bdbd;
	padding-bottom: 32px;
}

.photo_box {
	margin-top: 60px;
}

.policy {
	margin-top: 50px;
	padding-bottom: 60px;
}

.policy h3 {
	text-align: center;
	color: #eb7189;
	position: relative;
	font-size: 28px;
	padding: 4.6rem 0;
	margin-bottom: 20px;
	margin-top: 40px;
}

.policy h3::before {
	position: absolute;
    width: 200px;
    height: 200px;
    top: 50%;
    left: 50%;
    border-radius: 50%;
    background: #fff;
	border: 1px solid #eb7189;
    transform: translate(-50%, -50%);
    content: '';
    z-index: -1;
}

.policy p {
	width: 86%;
	margin-left: auto;
	margin-right: auto;
}

.member {
	margin-top: 50px;
	padding-bottom: 60px;
}

.member h5 {
	font-size:20px;
	font-weight: normal;
}

.member ul {
	margin: 0;
	padding: 0;
}

.member ul li {
	list-style: none;
	margin-bottom: 15px;
}

.member ul li dl {
	margin: 0;
	padding: 0;
}

.member ul li dl dt {
	font-weight: normal;
	width:70px;
	float: left;
}

.member ul li dl dd {
	margin-left: 85px;
}

.member p {
	font-size: 18px;
	margin-bottom: 35px;
}

.member p span {
	font-size: 14px;
	margin-left: 16px;
}

.member .member_02 {
	margin-top: 60px;
}

.domain {
	margin-top: 50px;
	padding-bottom: 60px;
	background-image: url("../images/domain_back.jpg");
	background-repeat: no-repeat;
	background-size: cover;
	background-position: center bottom;
}

.domain ul {
	margin: 0;
	padding-left: 70px;
}

.domain ul li {
	list-style: none;
	position: relative;
	margin-bottom: 50px;
}

.domain ul li::before {
	position: absolute;
    width: 50px;
    height: 50px;
    top: 24%;
    left: -40px;
    border-radius: 50%;
    transform: translate(-50%, -50%);
    content: '';
}

.domain ul li.domain_01::before {
    background: #c6db83;
	border: 1px solid #c6db83;
}

.domain ul li.domain_02::before {
    background: #f4bdbd;
	border: 1px solid #f4bdbd;
}

.domain ul li.domain_03::before {
    background: #f29b56;
	border: 1px solid #f29b56;
}

.domain ul li.domain_04::before {
    background: #f4e36d;
	border: 1px solid #f4e36d;
}


.domain ul li dl {
	margin: 0;
	padding: 0;
}

.domain ul li dl dt {
	font-size: 22px;
	padding-bottom: 10px;
	border-bottom: 3px solid #eb7189;
	font-weight: normal;
}

.domain ul li dl dd {
	margin-top: 10px;
}

.works {
	margin-top: 50px;
	padding-bottom: 60px;
}

.access {
	padding-top: 70px;
	margin-bottom: 60px;
	background: #eae9e3;
}

.access .gmap {
	text-align: right;
	margin-top: 20px;
}


.access .link {
	text-align: center;
	margin-top: 40px;
	margin-bottom: 50px;
}

.access .link a {
	display: inline-block;
	padding: 15px 60px 15px 30px;
	background:#fff;
	border-radius: 8px;
	border:1px solid #eb7189;
	color: #eb7189;
	transition: .5s;
}

.access .link a i {
	font-style: normal;
	position: relative;
}

.access .link a i::before {
	display: block;
	position: absolute;
	content: '';
	width: 0;
	height: 0;
	top: 41%;
	right: -30px;
	box-sizing: border-box;
	border: 4px solid transparent;
	border-left: 10px solid #eb7189;
	transition: .5s;
}

.access .link a:hover {
	text-decoration: none;
	color: #fff;
	background: #eb7189
}

.access .link a:hover i::before {
	box-sizing: border-box;
	border: 4px solid transparent;
	border-left: 10px solid #fff;
}


.footer {
	margin-top: 80px;
	text-align: center;
}

.footer img {
	width: 200px;
}

.footer p.address {
	margin-top: 50px;
	margin-bottom: 30px;
}

.footer .copyright {
	background: #d2ea96;
}

.footer .copyright p {
	margin-bottom: 8px;
	margin-top: 8px;
	font-size: 14px;
}

.note {
	margin-top:40px;
	margin-bottom:80px;
}

.note .swiper-slide a h4 {
	font-size:14px;
	margin-top:5px;
	color:#eb7189;
	transition:.5s;
}

.note .swiper-slide a:hover {
	text-decoration:none;
	color:#000;
}

.note .swiper-slide a:hover h4 {
	color:#000;
}

.note .swiper-slide a img {
	transition:.5s;
}

.note .swiper-slide a:hover img {
	opacity:.7;
}

.note .swiper-slide p.date {
	font-size:14px;
	text-align:right;
}

.note p.link {
		text-align:center;
		margin-top:0;
		margin-bottom:0;
}

.note p.link a {
	display: inline-block;
	padding: 10px 60px 10px 30px;
	background:#eb7189;
	border-radius: 8px;
	border:1px solid #eb7189;
	color: #fff;
	transition: .5s;
}

.note p.link a i {
	font-style: normal;
	position: relative;
}

.note p.link a i::before {
	display: block;
	position: absolute;
	content: '';
	width: 0;
	height: 0;
	top: 41%;
	right: -30px;
	box-sizing: border-box;
	border: 4px solid transparent;
	border-left: 10px solid #fff;
	transition: .5s;
}

.note p.link a:hover {
	text-decoration: none;
	color: #eb7189;
	background: #fff;
	border:1px solid #eb7189;
}

.note p.link a:hover i::before {
	box-sizing: border-box;
	border: 4px solid transparent;
	border-left: 10px solid #eb7189;
}

.swiper-button-next::after, .swiper-button-prev::after {
	color: #eb7189;
	font-size:30px;
}

.swiper-button-next, .swiper-button-prev {
    top: var(--swiper-navigation-top-offset, 20%);
}


.contact_img {
	text-align: center;
	padding-top: 18px;
	padding-bottom: 40px;
	background-image: url("../images/contact_img_back.jpg");
	background-repeat: no-repeat;
	background-position: center bottom;
	background-size: contain;
}

.contact_img img {
	width: 210px;
}

.contact {
	margin-top:40px;
}

.contact form ul {
	margin:0;
	padding:0;
}

.contact form ul li {
	list-style:none;
	margin-bottom:18px;
}

.contact form ul li dl {
	margin:0;
	padding:0;
}

.contact form ul li dl dt {
	font-weight:normal;
	margin-bottom:4px;
}

.contact form ul li dl dt span {
	color:#eb7189;
}

.contact form ul li dl dd p.sample {
	font-size:14px;
	color:#999;
}

.contact form ul li dl dd p.error{
	color:#e63659;
}

.contact form ul li dl dd input {
	width:100%;
	border:1px solid #dfdfdf;
	padding:4px 6px;
}

.contact form ul li dl dd textarea {
	border:1px solid #dfdfdf;
	width:100%;
	padding:4px 6px;
}

.contact form ul li dl dd input:focus,
.contact form ul li dl dd textarea:focus {
	border:1px solid #eb7189;
	outline: none;
}

.contact div button.submit {
	border:none;
	background:#eb7189;
	padding:15px 40px 15px 20px;
	border-radius:8px;
	color:#fff;
	text-align:center;
	transition:.5s;
	border:1px solid #eb7189;
}

.contact div button.submit:hover {
	text-decoration: none;
	color: #eb7189;
	background: #fff;
	border:1px solid #eb7189;
}

.contact div button.submit i {
	font-style: normal;
	position: relative;
}

.contact div button.submit i::before {
	display: block;
	position: absolute;
	content: '';
	width: 0;
	height: 0;
	top: 41%;
	right: -26px;
	box-sizing: border-box;
	border: 4px solid transparent;
	border-left: 10px solid #fff;
	transition: .5s;
}

.contact div button.submit:hover i::before {
	border: 4px solid transparent;
	border-left: 10px solid #eb7189;
}

.contact div button.back_button {
	border:none;
	background:#fff;
	padding:10px 20px 10px 40px;
	border-radius:8px;
	color:#eb7189;
	text-align:center;
	transition:.5s;
	border:1px solid #eb7189;
	margin-top:30px;
}

.contact div button.back_button i {
	font-style: normal;
	position: relative;
}

.contact div button.back_button i::before {
	display: block;
	position: absolute;
	content: '';
	width: 0;
	height: 0;
	top: 41%;
	left: -26px;
	box-sizing: border-box;
	border: 4px solid transparent;
	border-right: 10px solid #eb7189;
	transition: .5s;
}

.contact div button.back_button:hover {
	text-decoration: none;
	color: #eb7189;
	background: #ffdde4;
	border:1px solid #eb7189;
}


.contact form ul.confirm li {
	border-bottom:1px solid #efefef;
	padding-bottom:8px;
}

.contact .errors {
	border:1px solid #e63659;
	padding:15px;
	color:#e63659;
	margin-bottom:40px;
}

@media (min-width: 576px) {
	
	div.row.vision {
		margin-top: 40px;
	}

	div.row.mission {
		margin-top: 10px;
	}

	.vision_misstion .vision h3 {
		position: relative;
		text-align: center;
		padding: 5rem 0;
		font-size: 22px;
	}

	.vision_misstion .vision h3::before {
		position: absolute;
		width: 180px;
		height: 180px;
	}

	.vision_misstion .mission h3 {
		position: relative;
		text-align: center;
		padding: 5rem 0;
		font-size: 22px;
	}

	.vision_misstion .mission h3::before {
		position: absolute;
		width: 150px;
		height: 150px;
	}


	.vision_misstion .vision p{
		text-align: left;
		font-size: 18px;
		margin-left: 6px;
	}

	.vision_misstion .mission p{
		text-align: right;
		font-size: 18px;
	}

	.vision_misstion .vision p span {
		border-bottom: 3px solid #89b91b;
		padding-bottom: 12px;
	}

	.vision_misstion .mission p span {
		border-bottom: 3px solid #f4bdbd;
		padding-bottom: 2.1em;
	}

}

@media (min-width: 768px) {
	.top_img img {
		width: 320px;
	}
	
	div.vision {
		margin-top: 30px;
	}

	div.mission {
		margin-top: 50px;
	}
	
	.vision_misstion h2,
	.policy h2,
	.member h2,
	.domain h2,
	.works h2,
	.access h2 {
		font-size: 30px;
	}
	
	.vision_misstion .vision h3 {
		position: relative;
		text-align: center;
		padding: 5rem 0;
		font-size: 36px;
	}

	.vision_misstion .vision h3::before {
		position: absolute;
		width: 260px;
		height: 260px;
	}

	.vision_misstion .mission h3 {
		position: relative;
		text-align: center;
		padding: 5rem 0;
		font-size: 36px;
	}

	.vision_misstion .mission h3::before {
		position: absolute;
		width: 240px;
		height: 240px;
	}

	.vision_misstion .vision p{
		text-align: left;
		font-size: 24px;
	}

	.vision_misstion .mission p{
		text-align: right;
		font-size: 24px;
	}
	
	.policy p.title_text,
	.member p.title_text,
	.domain p.title_text,
	.works p.title_text,
	.access p.title_text {
		text-align: center;
		margin-bottom: 80px;
	}
	
	.policy h3 {
		font-size: 32px;
		margin-bottom: 40px;
		margin-top: 10px;
	}

	.policy h3::before {
		position: absolute;
		width: 220px;
		height: 220px;
	}
	
	.policy .down_box {
		margin-top: 4rem;
	}
	
	.domain ul li.domain_02,
	.domain ul li.domain_04 {
		margin-left: 150px;
	}
	
	.domain ul li {
		margin-bottom: 100px;
	}
	
	.domain ul li::before {
		width: 100px;
		height: 100px;
		top: 45%;
		left: -70px;
		border-radius: 50%;
		transform: translate(-50%, -50%);
		content: '';
	}
	.note .swiper-slide a h4 {
		font-size:16px;
	}

	.swiper-button-next::after, .swiper-button-prev::after {
		color: #eb7189;
		font-size:50px;
	}

	.swiper-button-next, .swiper-button-prev {
    		top: var(--swiper-navigation-top-offset, 30%);
	}

	.contact form ul li dl dt {
		margin-bottom:0;
		width:200px;
		float:left;
	}

	.contact form ul li dl dd {
		margin-left:210px;
	}
}

@media (min-width: 992px) {
	
	.top_img img {
		width: 460px;
	}
	
	.vision_misstion {
		margin-top: 60px;
		padding-bottom: 90px;
	}
	
	div.row.vision {
		margin-top: 40px;
	}

	div.row.mission {
		margin-top: 80px;
	}
	
	.vision_misstion h2,
	.policy h2,
	.member h2,
	.domain h2,
	.works h2,
	.access h2{
		text-align: center;
		font-size: 44px;
	}
	
	.vision_misstion p.title_text {
		text-align: center;
		margin-bottom: 80px;
		font-size: 18px;
	}
	
	.policy p.title_text,
	.member p.title_text,
	.domain p.title_text,
	.access p.title_text,
	.works p.title_text {
		text-align: center;
		margin-bottom: 80px;
		font-size: 18px;
	}
	
	.vision_misstion .vision h3 {
		position: relative;
		text-align: center;
		padding: 5rem 0;
		font-size: 40px;
	}

	.vision_misstion .vision h3::before {
		position: absolute;
		width: 340px;
		height: 340px;
	}
	
	.vision_misstion .mission h3 {
		position: relative;
		text-align: center;
		padding: 5rem 0;
		font-size: 40px;
	}

	.vision_misstion .mission h3::before {
		position: absolute;
		width: 260px;
		height: 260px;
	}
	
	.vision_misstion .vision p {
		text-align: left;
		font-size: 30px;
		margin-left: 20px;
	}

	.vision_misstion .mission p{
		text-align: right;
		font-size: 30px;
		margin-right: 20px;
	}
	
	.photo_box {
		margin-top: 100px;
	}
	
	.policy h3 {
		font-size: 38px;
		margin-bottom: 40px;
		margin-top: 10px;
	}

	.policy h3::before {
		position: absolute;
		width: 270px;
		height: 270px;
	}
	
	.member h5 {
		font-size:23px;
		font-weight: normal;
	}

	.member ul li {
		list-style: none;
		margin-bottom: 15px;
		font-size: 18px;
	}
	
	.footer .copyright p {
		font-size: 16px;
	}

	.note {
		margin-top:60px;
		margin-bottom:120px;
	}

	form#mail_form dl dt {
		width:37%;
	}

	form#mail_form dl dd {
		width:58%
	}
}

@media (min-width: 1200px) {
	

	
	.vision_misstion .vision p{
		text-align: left;
		font-size: 38px;
		margin-left: 40px;
	}

	.vision_misstion .mission p{
		text-align: right;
		font-size: 38px;
	}
	.photo_box {
		margin-top: 180px;
	}
}