@import url('https://fonts.googleapis.com/css2?family=Noto+Sans+JP:wght@100;300;400;500;700;900&family=Noto+Serif+JP:wght@500&display=swap');
@import url("https://fonts.googleapis.com/css2?family=Noto+Serif+JP:wght@200;300;400;500;600;700;900&display=swap");
@import url("https://fonts.googleapis.com/css2?family=M+PLUS+Rounded+1c:wght@300;400;500;700;800;900&display=swap");
/*font-family: 'M PLUS Rounded 1c', sans-serif;*/


/* mvArea
----------------------------------------------------------------------------*/
.mvArea {
  width: 100%;
  max-height: 800px;
  background: rgba(140,131,65,0.15);
}
.mvArea .mvArea_inner {
	max-width: 1360px;
	margin: 0 auto;
}

@media screen and (max-width: 768px) {
	.mvArea {
		max-height: 710px;
	}
	.mvArea .mvArea_inner {
		width: 100%;
		max-width: auto;
		max-height: 710px;
	}
}


/* parts
----------------------------------------------------------------------------*/

.pcOnly {
  display: block; }

.spOnly {
  display: none; }

.sp320-Only {
  display: none; }

.note {
  font-size: 12px;
  margin-top: 5px; }

a {
  transition: .3s; }
  a:hover {
    opacity: .5;
    transition: .3s; }

.fixArea {
	width: 100%;
	background: #eeede4;
	box-shadow: 5px 5px 20px rgba(0, 0, 0, 0.3);
	position: fixed;
	left: 0;
	bottom: 0;
	z-index: 10;
	animation-duration: 0.5s;
	animation-name: fade-in;
	-moz-animation-duration: 0.5s;
	-moz-animation-name: fade-in;
	-webkit-animation-duration: 0.5s;
	-webkit-animation-name: fade-in;
	animation-fill-mode: forwards;
	-moz-animation-fill-mode: forwards;
	-webkit-animation-fill-mode: forwards;
}

 .fixArea.-active {
    animation-duration: 0.5s;
    animation-name: fade-out;
    -moz-animation-duration: 0.5s;
    -moz-animation-name: fade-out;
    -webkit-animation-duration: 0.5s;
    -webkit-animation-name: fade-out;
    animation-fill-mode: forwards;
    -moz-animation-fill-mode: forwards;
    -webkit-animation-fill-mode: forwards;
}

.fixArea .breroArea,
.fixArea .sicureArea {
	float: left;
	width: 50%;
	position: relative;
}
.fixArea .breroArea {
	padding-right: 20px;
}
.fixArea .sicureArea {
	padding-left: 20px;
}
.fixArea .breroArea::before {
	content: "";
    position: absolute;
    top: 15px;
    right: 0;
    width: 1px;
    height: 95px;
    background: rgba(140,131,65,.3);
}
 
.fixArea .tit {
	position: absolute;
	width: 295px;
	height: 70px;
	top: -15px;
	left: 50%;
	margin-left: -150px;
}

.fixArea .btnList {
	padding-top: 65px;
}

.fixArea .btnList li {
	width: 240px;
	height: 40px;
	float: left;
}

.fixArea .btnList li:first-child {
	margin-right: 20px;
}


.fixArea .btnList li a {
	color: #cca740;
    font-size: 18px;
    padding: 6px 0;
    background: #fff;
    position: relative;
    display: block;
    text-align: center;
}

.fixArea .btnList li a::before {
	content: "";
	position: absolute;
	width: 0;
	height: 0;
	border-style: solid;
	border-width: 0 0 9px 9px;
	border-color: transparent transparent #cca740 transparent;
	bottom: 5px;
	right: 5px;
}

.fixArea .text {
	text-align: center;
	font-size: 12px;
	padding: 15px 0;
	clear: both;
}



.fixArea #page_top {
	width: 80px;
    height: 80px;
    background: rgb(204 167 64 / .6);
    border-radius: 50%;
    float: right;
    transition: .3s;
    position: absolute;
    top: -40px;
    right: 20px;
}

.fixArea #page_top a {
	display: block;
	width: 80px;
	height: 80px;
	text-decoration: none;
}


.fixArea #page_top a:hover {
	opacity: 1;
}

.fixArea #page_top:hover {
	background: #cca740;
	transition: .3s;
}

@media screen and (max-width: 768px) {
	
	.fixArea .breroArea,
	.fixArea .sicureArea {
		padding: 0 20px;
	}
	
	.fixArea .breroArea::before {
		top: 12px;
		height: 100px;
	}
	
	.fixArea .tit {
		position: absolute;
		width: auto;
		max-width: 160px;
		height: auto;
		top: 5px;
		left: 50%;
		margin-left: -80px;
	}
	
	.fixArea .btnList {
		padding-top: 40px;
	}
	
	.fixArea .btnList li {
		width: 100%;
		height: auto;
		padding: 0 5px;
	}
	
	.fixArea .btnList li:first-child {
		margin-right: 0;
		margin-bottom: 8px;
	}
	
	.fixArea .btnList li a {
		font-size: 14px;
		padding: 3px 0;
	}
	
	.fixArea .btnList li a::before {
		border-width: 0 0 7px 7px;
		bottom: 4px;
		right: 4px;
	}
	
	.fixArea .text {
		padding: 10px 0;
	}
	
	.fixArea #page_top {
		width: 40px;
		height: 40px;
		position: absolute;
		margin: 0;
		top: -50px;
		right: 10px;
	}
	
	.fixArea #page_top a {
		width: 40px;
		height: 40px;
	}
}


@keyframes fade-in {
  0% {
    visibility: hidden;
    opacity: 0; }
  100% {
    visibility: visible;
    opacity: 1; } }
@-moz-keyframes fade-in {
  0% {
    visibility: hidden;
    opacity: 0; }
  100% {
    visibility: visible;
    opacity: 1; } }
@-webkit-keyframes fade-in {
  0% {
    visibility: hidden;
    opacity: 0; }
  100% {
    visibility: visible;
    opacity: 1; } }
@keyframes fade-out {
  0% {
    visibility: visible;
    opacity: 1; }
  100% {
    visibility: hidden;
    opacity: 0; } }
@-moz-keyframes fade-out {
  0% {
    visibility: visible;
    opacity: 1; }
  100% {
    visibility: hidden;
    opacity: 0; } }
@-webkit-keyframes fade-out {
  0% {
    visibility: visible;
    opacity: 1; }
  100% {
    visibility: hidden;
    opacity: 0; } }
@media screen and (max-width: 768px) {
  .pcOnly {
    display: none; }

  .spOnly {
    display: block; }

  .sp320-Only {
    display: none; }

  #page_top {
    width: 50px;
    height: 50px;
    right: 20px;
    bottom: 20px; }

  #page_top a {
    width: 50px;
    height: 50px; } }
@media screen and (max-width: 320px) {
  .sp320-Only {
    display: block; } }
.fDAnime {
  -webkit-animation-fill-mode: both;
  -ms-animation-fill-mode: both;
  animation-fill-mode: both;
  -webkit-animation-duration: 1.5s;
  -ms-animation-duration: 1.5s;
  animation-duration: 1.5s;
  -webkit-animation-name: fDAnime;
  -ms-animation-name: fDAnime;
  animation-name: fDAnime;
  visibility: visible !important; }

@-webkit-keyframes fDAnime {
  0% {
    opacity: 0;
    -webkit-transform: translateY(-20px); }
  100% {
    opacity: 1;
    -webkit-transform: translateY(0); } }
@keyframes fDAnime {
  0% {
    opacity: 0;
    -webkit-transform: translateY(-20px);
    -ms-transform: translateY(-20px);
    transform: translateY(-20px); }
  100% {
    opacity: 1;
    -webkit-transform: translateY(0);
    -ms-transform: translateY(0);
    transform: translateY(0); } }



/* sec
----------------------------------------------------------------------------*/

.sec {
	display: block;
	font-family: 'Noto Sans JP', sans-serif;
	font-weight: normal;
	padding: 80px 0;
}

.sec .title {
	font-size: 18px;
	font-weight: normal;
    text-align: center;
	letter-spacing: .1em;
	position: relative;
	margin: 0 0 80px;
}

.sec .title span {
	color: #8c8341;
 	font-size: 28px;
}

.sec .title::before {
	content: "";
	position: absolute;
	width: 50px;
	height: 2px;
	bottom: -40px;
	left: 50%;
	margin-left: -25px;
	background: #8c8341;
}

@media screen and (max-width: 768px) {
	.sec {
		padding: 0;
	}
	
	.secInner {
		padding: 0;
	}
	
	.sec .title {
		font-size: 14px;
		margin: 0 0 60px;
		line-height: 1.6;
	}
	
	.sec .title span {
		font-size: 24px;
	}
	
	.sec .title::before {
		width: 30px;
		bottom: -30px;
		margin-left: -15px;
	}
}



/* sec01
----------------------------------------------------------------------------*/

.sec01 {
	padding-top: 60px;
}

@media screen and (max-width: 768px) {
	.sec01 {
		padding-top: 25px;
	}
}


/* sec02
----------------------------------------------------------------------------*/

.sec02 {
	background: rgba(204,204,204,.1);
}

@media screen and (max-width: 768px) {
	.sec02 {
		background: none;
	}
}




/* linkBox
----------------------------------------------------------------------------*/

.linkBox .linkBox_item {
	width: 480px;
	float: left;
	text-align: center;
}

.linkBox .linkBox_item:first-child {
	margin-right: 80px;
}

.linkBox .linkBox_item .img {
	margin: 0 0 20px;
}

.linkBox .linkBox_item .text {
	margin: 0 0 20px;
}

.linkBox .linkBox_item .text span {
	color: #bf7067;
	font-size: 20px;
}

.linkBox .linkBox_item .link {
	color: #cca740;
	font-size: 18px;
	font-family: 'Noto Serif JP', serif;
	border-bottom: 1px solid #cca740;
}

@media screen and (max-width: 768px) {
	.linkBox .linkBox_item {
		width: auto;
		float: none;
		padding: 40px 35px;
	}
	
	.linkBox .linkBox_item.-first {
		padding-top: 0;
	}
	
	.linkBox .linkBox_item.-bg {
		background: rgba(204,204,204,.1);
	}
	
	.linkBox .linkBox_item:first-child {
		margin-right: 0;
	}
	
	.linkBox .linkBox_item .img {
		margin: 0 0 15px;
	}
	
	.linkBox .linkBox_item .text {
		margin: 0 0 15px;
		line-height: 1.6;
	}
	
	.linkBox .linkBox_item .text span {
		font-size: 18px;
	}
	
	.linkBox .linkBox_item .link {
		font-size: 16px;
	}
}



/* footer
----------------------------------------------------------------------------*/

footer {
	border-top: 1px solid rgba(204,204,204,.5);
}

@media screen and (max-width: 768px) {
	footer {
		border-top: none;
	}
	
	footer .secInner {
		padding: 0 30px;
	}
}



