@charset "UTF-8";
/* CSS Document Rev.201906 */

/*--------------------
FONT
--------------------*/
@font-face {
	font-family: 'Noto Sans Japanese';
	font-style: normal;
	font-weight: normal;
	src: url(../font/NotoSansJP-Regular.woff2) format('woff2'),
		url(../font/NotoSansJP-Regular.woff) format('woff'),
		url(../font/NotoSansJP-Regular.otf) format('opentype');
	font-display: swap;}

@font-face {
	font-family: 'Noto Sans Japanese';
	font-style: normal;
	font-weight: bold;
	src: url(../font/NotoSansJP-Bold.woff2) format('woff2'),
		url(../font/NotoSansJP-Bold.woff) format('woff'),
		url(../font/NotoSansJP-Bold.otf) format('opentype');
	font-display: swap;}

/*--------------------
COMMON
--------------------*/
* {
	margin: 0;
	padding: 0;
	font-style: normal;
	border: 0;
	zoom: 1;
	-webkit-box-sizing: border-box;
	box-sizing: border-box;}

html {
	height: 100%;}

html>/**/body {
	overflow: -moz-scrollbars-vertical;}

html:first-child body {
	min-height: 100%;}

body {
	margin: 0;
	padding: 0;
	border: 0;
	/**/
	background: #fff;
	color: #231815;
	font-size: medium;
	font-family: "Noto Sans Japanese", Hiragino Sans, "ヒラギノ角ゴシック", Hiragino Kaku Gothic ProN, "ヒラギノ角ゴ ProN W3", Meiryo, "メイリオ", Verdana, "ＭＳ Ｐゴシック", sans-serif;}

strong {
	font-weight: bold;}

img {
	max-width: 100%;
	height:auto;}

a {
	text-decoration: none;
	/**/
	color: #c84e89;
	-webkit-transition: .5s;
	transition: .5s;}

a:hover {
	/**/
	opacity: 0.7;
	-webkit-transition: .5s;
	transition: .5s;}

p {
	/**/
	margin-bottom: 1.2em;
	line-height:1.7;}

/*--------------------
BUTTON
--------------------*/
.btn {
	text-align: center;
	/**/
	margin: 0 auto 30px;}

.btn a {
	position: relative;
	display: inline-block;
	/**/
	padding: 6px 2em 20px;
	color: #231815;
	border: solid 1px #e684b3;}

.btn a:after{
    position: absolute;
    top: 0;
    bottom: 0;
    left: 0;
    right:0;
    margin:auto auto 10px;
    content: "";
    vertical-align: middle;
    width: 28px;
    height: 6px;
    border-bottom: 1px solid #e684b3;
    border-right: 1px solid #e684b3;
 	transform:skewX(40deg);
 	transition:.5s;}

.btn a:hover {
	opacity: 1;
	/**/
	color: #fff;
	background: #e684b3;}

.btn a:hover:after{
    border-bottom: 1px solid #fff;
    border-right: 2px solid #fff;
 	transition:.5s;}

/*--------------------
A:BEFORE
--------------------*/
.arrow:before,
.blank:before,
.pdf:before {
	display: inline-block;
	font-family: "Font Awesome 5 Free";
	font-weight: 900;
	vertical-align: baseline;
	padding-right: 5px;}

.blank:before {
	/**/
	content: "\f35d";}

.arrow:before {
	/**/
	content: "\f105";}

.pdf:before {
	/**/
	content: "\f15c";}

/*--------------------
GRID
--------------------*/
.grid,
.flex2,
.flex2-2,
.flex3,
.flex4,
.flex5 {
	display: -webkit-box;
	display: -ms-flexbox;
	display: flex;
	-webkit-box-pack: justify;
	-ms-flex-pack: justify;
	justify-content: space-between;/* Safari etc. */
	-ms-align-items: stretch;/* IE10 */
	-webkit-box-align: stretch;
	-ms-flex-align: stretch;
	align-items: stretch;/* Safari6.1以降 */
	-ms-flex-wrap: wrap;/*IE10*/
	flex-wrap: wrap;
}

/* 最終行の間隔調整 */
.flex4:before,
.flex5:before {
	content: "";
	display: block;
	-webkit-box-ordinal-group: 2;
	-ms-flex-order: 1;
	order: 1;}

.flex3:after,
.flex4:after,
.flex5:after {
	content: "";
	display: block;}

.grid3-2 {
	width: 65.667%;}

.grid4-3 {
	width: 74.25%;}

.grid4-2,
.flex2>*,
.flex2-2>* {
	width: 48.5%;}

.grid3-1,
.flex3>*,
.flex3:after {
	width: 31.333%;}

.grid4-1,
.flex4>*,
.flex4:before,
.flex4:after {
	width: 22.75%;}

.flex5>*,
.flex5:before,
.flex5:after {
	width: 17.6%;}

.grid>*,
.flex2>*,
.flex2-2>*,
.flex3>*,
.flex4>*,
.flex5>* {
	margin-bottom: 30px;}


/*--------------------
HEADER
--------------------*/
.head,
.head nav,
.foot {
	display: -webkit-box;
	display: -ms-flexbox;
	display: flex;/* Safari6.1以降 */
	-ms-flex-wrap: wrap;/*IE10*/
	flex-wrap: wrap;
	-webkit-box-pack: justify;
	-ms-flex-pack: justify;
	justify-content: space-between;/* Safari etc. */
	-ms-align-items: center;/*  IE10  */
	-webkit-box-align: center;
	-ms-flex-align: center;
	align-items: center;}

header {
	width: 100%;
	/**/
	position:relative;}

.head {
	width: 100%;
	/**/
	padding: 20px 25px;}

.head h1 {
	display: block;
	height: 100%;
	text-indent: -9999px;
	margin-bottom: 0;
	/**/
	width: 200px;}

.head h1 a {
	display: block;
	width: 100%;
	height: 100%;
	background: url("../img/logo.png") no-repeat center left /contain;}

header nav {
	/**/
	width: 100%;
	background-color: #e684b3;
	display: -webkit-box;
	display: -ms-flexbox;
	display: flex;
	-webkit-box-pack: center;
	-ms-flex-pack: center;
	justify-content: center;}

header nav ul {
	display: -webkit-box;
	display: -ms-flexbox;
	display: flex;
	-webkit-box-pack: center;
	-ms-flex-pack: center;
	justify-content: center;
	padding: 0;
	max-width:800px;
	width:100%;
	border-left:solid 1px #fff;}

header nav li {
	display:block;
	width:25%;
	text-align:center;
	border-right:solid 1px #fff;}

header nav a {
	display: block;
	width:100%;
	height:100%;
	padding: 16px 0;
	color:#fff;
	font-size:90%;}

header nav a:hover {
	background:#fff;
	color:#e684b3;
	opacity:.85;}

#spnav {
	display: none;}

#eyecatch {
	display: block;
	width: 100%;}

/* slider用css */
#eyecatch img {
	width: 100%;}
/* slider用css ここまで */

/*--------------------
CONTENTS
--------------------*/
#contents,
aside {
	width: 100%;}

article {
	margin: 0 auto;
	/**/
	padding: 50px 0;}

aside {
	/**/
	padding: 50px 0 10px;
	text-align: center;}

section {
	/**/
	margin-bottom: 80px;}

section:last-child,
section> :last-child {
	margin-bottom: 0;}

/*--------------------
FOOTER
--------------------*/
footer {
	/**/
	background: #e684b3;
	padding: 40px 0 30px;
	font-size: 90%;}

footer,footer a{
	color:#fff;}

.foot {
	/**/
	margin: 0 auto 20px;
	width: 90%;
	max-width: 900px;}

footer nav {
	/**/
	margin: 0 auto;}

footer ul {
	display: -webkit-box;
	display: -ms-flexbox;
	display: flex;
	-ms-flex-wrap: wrap;
	flex-wrap: wrap;
	-webkit-box-pack: center;
	-ms-flex-pack: center;
	justify-content: center;
	width: 100%;
	padding:0;}

footer li {
	display: inline-block;
	/**/
	margin-bottom: .8em;}

footer li a {
	display:block;
	/**/
	padding: .1em .8em;
	border-left: 1px solid #fff;}

footer li:first-of-type a {
	/**/
	border-left: none;}

footer small {
	display: block;
	text-align: center;}

#pagetop {
	position: fixed;
	z-index: 30;
	cursor: pointer;
	/**/
	width: 50px;
	height: 50px;
	bottom: 10px;
	right: 0px;
	line-height: 50px;
	background: rgb(191, 149, 121);
	color: #fff;
	font-size: 30px;
	-webkit-transition: .3s;
	transition: .3s;}

#pagetop:before {
	display: inline-block;
	width: 100%;
	text-align: center;
	font-family: "Font Awesome 5 Free";
	font-weight: 900;
	vertical-align: baseline;
	/**/
	content: "\f106";}

#pagetop:hover {
	/**/
	line-height: 30px;}

/*--------------------
TITLE
--------------------*/
h1 {
	/**/
	text-align: center;
	font-size: 160%;
	letter-spacing:0.05em;
	font-weight:normal;}

h2 {
	/**/
	margin:0 auto 2em;
	font-size: 150%;
	font-weight:normal;
	text-align:center;}

h2 span {
	/**/
	position: relative;
	display: inline-block;}

	h2 span:before {
		content: '';
		position: absolute;
		bottom: -0.5em;
		display: inline-block;
		width: 40px;
		height: 4px;
		left: 50%;
		-webkit-transform: translateX(-50%);
		transform: translateX(-50%);
		background-color: #e684b3;
		border-radius: 2px;	}

h3 {
	/**/
	margin-bottom: 0.5em;
	font-size: 125%;
	font-weight:normal;
	color:#e684b3;
	margin-top:2em;}

h4 {
	/**/
	margin-bottom: 0.75em;
	font-size: 110%;
	margin-top:2em;}

h5 {
	/**/
	margin-bottom: 0.5em;
	font-size: 100%;
	margin-top:2em;}

#breadcrumbs {
	display: block;
	width: 100%;
	/**/
	padding: 10px 30px;
	text-align: center;
	/*background: #fff2f6;*/
	font-size: 85%;}

#breadcrumbs a:after {
	display: inline-block;
	font-family: "Font Awesome 5 Free";
	font-weight: 900;
	/**/
	margin: 0 0.7em;
	color: #555;
	content: "\f054";}

/*--------------------
TABLE
--------------------*/
table {
	border-collapse: collapse;
	border-spacing: 0;
	width: 100%;
	/**/
	margin: 0 0 30px;
	border-top: #d1cdc7 1px solid;
	text-align:left;}

th,
td {
	/**/
	padding: 0.75em 15px;
	border-bottom: #d1cdc7 1px solid;
	line-height: 1.4em;}

th {
	white-space: nowrap;
	/**/
	background: #ffe6ed;}

/*--------------------
LIST
--------------------*/
ul,
ol {
	/**/
	padding-left: 1.2em;}


article ul,
article ol {
	/**/
	margin-bottom: 30px;}

.ul_nav {
	padding-left: 0;
	list-style: none;
	text-align: center;
	/**/
	margin-bottom: 30px;}

.ul_nav li {
	display: inline-block;
	/**/
	margin: 0 3px 10px;
	font-size: 90%;}

.ul_nav a {
	display: inline-block;
	width: 100%;
	/**/
	padding: 6px 1em;
	background: #f3adc9;
	color: #ffffff;}

.ul_nav a:before {
	font-family: "Font Awesome 5 Free";
	font-weight: 900;
	/**/
	padding: 0 5px 0 0;
	content: "\f107";}

table :last-child,
ul :last-child,
ol :last-child,
dl :last-child {
	margin-bottom: 0;}

/* ------------------------------------------
for - 640px
------------------------------------------ */
@media screen and (max-width:640px) {

/*--------------------
COMMON - 640px
--------------------*/
body {font-size: 95%;	}

/*--------------------
GRID - 640px
--------------------*/
.grid3-1,
.grid3-2,
.grid4-1,
.grid4-2,
.grid4-3,
.flex2>*,
.flex3>*,
.flex3:after {
	width: 100%;}

.flex2-2>*,
.flex4>*,
.flex4:before,
.flex4:after,
.flex5>*,
.flex5:before,
.flex5:after {
	width: 47%;}

/* ------------------------------------------
TABLE - 640px
------------------------------------------ */
table {
	/**/
	border-top: #d1cdc7 2px solid;}

thead {
	display: none;}

th,
td {
	display: block;
	width: 100%;
	/**/
	padding: 0.5em;}

td:last-child {
	/**/
	border-bottom: #d1cdc7 2px solid;}

/*--------------------
HEADER - 640px
--------------------*/
body{padding-top:80px;}

	.head-contact {
		display: none;}
	
	.head{
		position:fixed;
		padding: 20px 5%;
		top:0;
		left:0;
		height: 80px;
		background:#fff;
		z-index: 100;}
	
	header nav a {
		padding: 10px 0 8px;
		font-size:80%;}

	#spnav {
		display: block;
		position: fixed;
		z-index: 100;
		/**/
		right: 0;
		top: 10px;
		width: 60px;
		height: 60px;}

	#spnav>a {
		display: inline-block;
		width: 100%;
		height: 100%;
		z-index: 10;
		cursor: pointer;
		text-align: center;
		position: relative;
		/**/}

	#spnav>a span:before,
	#spnav>a span:after {
		content: "";
		margin: 0;}

	#spnav>a span {
		/**/}

	#spnav>a span,
	#spnav>a span:before,
	#spnav>a span:after {
		display: block;
		position: absolute;
		/**/
		width: 34px;
		border-bottom: solid 3px #e684b3;}

	#spnav>a span {top: 16px;}
	#spnav>a span:before {top: 12px;}
	#spnav>a span:after {top: 25px;}

	.remodal>div {
		max-height: 75vh;
		overflow-y: scroll;}

/* ------------------------------------------
FOOTER - 640px
------------------------------------------ */
footer {
	/**/}

.foot {
	/**/
	width: 90%;
	margin: 0 auto 20px;
	text-align: center;}

footer nav {
	width: 100%;}

footer ul {
	padding-left: 0;
	-webkit-box-orient: vertical;
	-webkit-box-direction: normal;
	-ms-flex-direction: column;
	flex-direction: column;
	border-top: solid 1px #fff;}

footer li {
	list-style: none;
	margin-bottom: 0;}

footer li a {
	display: inline-block;
	width: 100%;
	/**/
	padding: 0.9em;
	border: 0;
	border-bottom: solid 1px #fff;}

footer li:last-of-type a {
	border-right: 0;}
}