@charset "UTF-8";

body {
	background:#e2f0f5; /* 背景 */
	color:#000; /* 文字色 */
	font-family: "YuMincho", "Yu Mincho", "Noto Serif", serif;
	font-size: 14px;
	letter-spacing: 0.05em;
	line-height: 2.0;
}


/* -------------------------------------------------------------
link
------------------------------------------------------------- */
a {
	color: #000; /* カラー */
    text-decoration: none;
    -webkit-transition: 0.3s ease-in-out;  
    -moz-transition: 0.3s ease-in-out;  
    -o-transition: 0.3s ease-in-out;  
    transition: 0.3s ease-in-out; 
}
a:hover {
    opacity: 0.4;  
    filter: alpha(opacity=60);  
} 
@media screen and (min-width: 768px) {
    a[href^="tel:"] {
        pointer-events: none; /* TEL無効 */
    }
}


/* -------------------------------------------------------------
page-top
------------------------------------------------------------- */
#page-top {
    line-height: 1;
    position: fixed;
}
#page-top a {
	color: #b59d5e; /* ページトップリンクカラー */
	z-index: 999;
}
@media screen and (min-width: 768px) {
    #page-top {
        bottom: 20px;
        right: 15px;	
        font-size: 40px;
    }
}
@media screen and (max-width: 767px) {
    #page-top {
        bottom: 15px;
        right: 10px;	
        font-size: 32px;
    }   
}


/* -------------------------------------------------------------
header
------------------------------------------------------------- */
@media screen and (min-width: 768px) {
    header {
		width: 100%;
		margin: 0 auto 40px auto;
		display: flex;
		align-items:flex-end;
		justify-content: space-between;
		padding-left: 5%;
    }
    header h1 img {
        width: 300px;
        height: auto;
    }
}
@media screen and (max-width: 767px) {
    button { 
        margin:0;
    } 
    button span {
        color: #fff;
    } 
    header h1 {
        padding: 20px 0;
        text-align: center;
        line-height: 1;
    }
    header h1 img {
        width: auto;
        height: 20px;
    }
}


/* -------------------------------------------------------------
footer
------------------------------------------------------------- */
footer {
	padding: 40px 0 40px 0;
	background: 
		url(../img/bg_deco6.png)no-repeat left 20px bottom 20px,
		url(../img/bg_deco7.png)no-repeat right 20px bottom 20px;
	background-size: 130px auto;
	background-color: #fff;
}
footer small {
    display: block;
    font-size: 12px;
	text-align: center;
}
@media screen and (min-width: 768px) {
    footer ul {
		display: flex;
    }
	footer ul li:not(:first-child) {
		margin-left: 30px;
    }
	footer ul a::before {
		content: "";
		display: inline-block;
		background: url(../img/ico_nav.png);
		background-size: 22px 10px;
		width: 22px;
		height: 10px;
		margin-right: 6px;
	}
	
    .footer_inner {
		width: 80%;
		margin: 0 auto;
        display: flex;
        justify-content: space-between;
        align-items: center;
		padding-bottom: 20px;
    }
    footer .logo {
        
    }
    footer .logo img {
        width: 300px;
		height: auto;
    }
}
@media screen and (max-width: 767px) {
	footer {
		background: 
			url(../img/bg_deco6.png)no-repeat left 10px bottom 10px,
			url(../img/bg_deco7.png)no-repeat right 10px bottom 10px;
		background-size: 20vw auto;
		background-color: #fff;
	}	
    footer .logo {
        text-align: center;
        margin-bottom: 30px;
    }
    footer .logo img {
        width: 50vw;
    }
    footer small {
        text-align: center;
    }
}


/* -------------------------------------------------------------
detail
------------------------------------------------------------- */
dl.detail dd {
    border-bottom: solid 1px rgba(0,0,0,0.2);
}
dl.detail dt:last-of-type,
dl.detail dd:last-of-type {
    border-bottom: none;
}
@media screen and (min-width: 768px) {
    dl.detail dt {
        border-bottom: solid 1px rgba(0,0,0,0.2);
    }    
    dl.detail {
        display: flex;
        flex-wrap: wrap;
    }
    dl.detail dt {
        font-weight: bold;
        padding: 15px;
        width: 30%;
        box-sizing: border-box;
    }
    dl.detail dd {
        padding: 15px;
        width: 70%;
        box-sizing: border-box;
    }
}
@media screen and (max-width: 767px) {
    dl.detail dt {
        font-weight: bold;
        padding: 15px 15px 0 15px
    }
    dl.detail dd {
        padding: 0 15px 15px 15px
    }
}


/* -------------------------------------------------------------
style
------------------------------------------------------------- */
@media screen and (min-width: 768px) {
	.heading {
		position: relative;
		display: inline-block;
		line-height: 1;
		font-weight: normal;
		margin-bottom: 80px;
	}
	/*.heading:before {
		content: '';
		position: absolute;
		bottom: -25px;
		display: inline-block;
		width: 160px;
		height: 1px;
		left: 50%;
		-webkit-transform: translateX(-50%);
		transform: translateX(-50%);
		background-color: #c7d5da;
	}*/
	.heading span {
		display: block;
		font-family: 'Bodoni Moda', serif;
		font-size: 36px;
		margin-bottom: 10px;	
	}
	.heading::before {
		content: "";
		display: block;
		background: url(../img/bg_deco8.png) no-repeat center;
		background-size: 160px 24px;
		width:160px;
		height:24px;
		margin: 0 auto 15px auto;
	}	
	
	.heading2 {
		font-size: 20px;
		margin-bottom: 20px;
		line-height: 1.6;
		border-bottom: solid 1px #c7d5da;
		padding-bottom: 20px;
		position: relative;
		overflow: visible;
	}
	.heading2::before {
		content: "";
		display: block;
		width: 100%;
		height: 3px;
		background: #c7d5da;
		position: absolute;
		left:0;
		bottom:4px;
	}
}
@media screen and (max-width: 767px) {
	.heading {
		position: relative;
		display: inline-block;
		line-height: 1;
		font-weight: normal;
		margin-bottom: 60px;
	}
	.heading::before {
		content: "";
		display: block;
		background: url(../img/bg_deco8.png) no-repeat center;
		background-size: 160px 24px;
		width:160px;
		height:24px;
		margin: 0 auto 15px auto;
	}	
	.heading span {
		display: block;
		font-family: 'Bodoni Moda', serif;
		font-size:7.5vw;
		margin-bottom: 10px;
	}
	.heading2 {
		font-size: 5vw;
		margin-bottom: 20px;
		line-height: 1.6;
		border-bottom: solid 1px #c7d5da;
		padding-bottom: 20px;
		position: relative;
		overflow: visible;
	}
	.heading2::before {
		content: "";
		display: block;
		width: 100%;
		height: 3px;
		background: #c7d5da;
		position: absolute;
		left:0;
		bottom:4px;
	}
}

.ttl {
	border-bottom: solid 1px rgba(0,0,0,0.15);
	font-size: 16px;
	line-height: 1.6;
	margin-bottom: 20px;
	padding: 10px 0 15px 0;
	position: relative;
}
.ttl:after {
	border-bottom: solid 3px #b59d5e;/*太い下線*/
	bottom: -3px;
	content: " ";
	display: block;
	position: absolute;
	width: 25%;
}


/* -------------------------------------------------------------
btn
------------------------------------------------------------- */
.btn {
	position: relative;
	z-index: 1;	
}
.btn img {
	width: 300px;
	height: auto;
}
@media screen and (max-width: 767px) {
	.btn img {
		width: 60vw;
		height: auto;
	}	
}


/* -------------------------------------------------------------
gallery
------------------------------------------------------------- */
.object-fit-img {
	object-fit: contain;
	font-family: 'object-fit: contain;'
}


/* -------------------------------------------------------------
fade
------------------------------------------------------------- */
@-webkit-keyframes fadeInUp {
    0% {
        opacity: 0;
        -webkit-transform: translateY(30px);
        transform: translateY(30px);
    }
    100% {
        opacity: 1;
        -webkit-transform: translateY(0);
        transform: translateY(0);
    }
}
@-moz-keyframes fadeInUp {
	0% {
        opacity: 0;
        -moz-transform: translateY(30px);
        transform: translateY(30px);
    }
    100% {
        opacity: 1;
        -moz-transform: translateY(0);
        transform: translateY(0);
    }
}
@-ms-keyframes fadeInUp {
	0% {
        opacity: 0;
        -ms-transform: translateY(30px);
        transform: translateY(30px);
    }
    100% {
        opacity: 1;
        -ms-transform: translateY(0);
        transform: translateY(0);
    }
}
@keyframes fadeInUp {
    0% {
        opacity: 0;
        transform: translateY(20px);
    }
    100% {
        opacity: 1;
        transform: translateY(0);
	}
}
.fadeInUp {
    -webkit-animation: fadeInUp 0.6s ease;
    -moz-animation: fadeInUp 0.6s ease;
	-ms-animation: fadeInUp 0.6s ease;
    animation: fadeInUp 0.6s ease;
    -webkit-animation-fill-mode: both;
    -moz-animation-fill-mode: both;
	-ms-animation-fill-mode: both;
    animation-fill-mode: both
}
.fade{
	opacity: 0;
}
.delay1 {
	animation-delay: 0.2s;
	-moz-animation-delay: 0.2s;
	-webkit-animation-delay: 0.2s;
	-o-animation-delay: 0.2s;
}
.delay2 {
	animation-delay: 0.35s;
	-moz-animation-delay: 0.35s;
	-webkit-animation-delay: 0.35s;
	-o-animation-delay: 0.35s;
}
.delay3 {
	animation-delay: 0.5s;
	-moz-animation-delay: 0.5s;
	-webkit-animation-delay: 0.5s;
	-o-animation-delay: 0.5s;
}
.delay4 {
	animation-delay: 0.65s;
	-moz-animation-delay: 0.65s;
	-webkit-animation-delay: 0.65s;
	-o-animation-delay: 0.65s;
}
.delay5 {
	animation-delay: 0.8s;
	-moz-animation-delay: 0.8s;
	-webkit-animation-delay: 0.8s;
	-o-animation-delay: 0.8s;
}
.delay6 {
	animation-delay: 0.95s;
	-moz-animation-delay: 0.95s;
	-webkit-animation-delay: 0.95s;
	-o-animation-delay: 0.95s;
}


/* -------------------------------------------------------------
class
------------------------------------------------------------- */
.ta-center      { text-align: center; }
.fit            { width: 100%; height: auto; }

.mbnone			{ margin-bottom: 0!important; }
.mb10			{ margin-bottom: 10px!important; }
.mb20			{ margin-bottom: 20px!important; }
.mb30			{ margin-bottom: 30px!important; }
.mb40			{ margin-bottom: 40px!important; }
.mb50			{ margin-bottom: 50px!important; }
.mb60			{ margin-bottom: 60px!important; }
.mb70			{ margin-bottom: 70px!important; }
.mb80			{ margin-bottom: 80px!important; }