@charset "utf-8";
@import url('https://fonts.googleapis.com/css2?family=Zen+Maru+Gothic:wght@500;700&display=swap');

/*-----------------------------------------
全体
-----------------------------------------*/
:root{
    --color-wdg: #3d9198;
    --color-hmn: #c68297;
    --g-webfont: 'Zen Maru Gothic', sans-serif;
}
.contents {
	font-family:"Yu Gothic Medium", "游ゴシック Medium", YuGothic, "游ゴシック体", "ヒラギノ角ゴ Pro W3", "メイリオ", sans-serif;
    color: #333;
    font-size: 16px;
    line-height: 1.5em;
    background-color: #fff;
}
.contents .inner {
    width: 992px;
    margin: 0 auto;
    position: relative;
}
/*------------------------------------------------
	メインビジュアル
--------------------------------------------------*/
#logo {
    width: 100%;
    background-color: #fff;
    text-align: center;
    padding: 10px 0 20px;
    border-top: solid 1px #efefef;
}
#mv {
    width: 100%;
    height: 700px;
}
/*------------------------------------------------
	施策
--------------------------------------------------*/
#shisaku {
    width: 100%;
    padding: 50px 0;
}
#shisaku a {
    display: block;
}
#shisaku a:hover {
    opacity: 0.8;
    transition: all 0.6s ease;
}
/*------------------------------------------------
	ウェディング / ハネムーン
--------------------------------------------------*/
.conts {
    width: 100%;
    padding: 80px 0;
}
#wdg.conts {
    background: #eef7f8 url("../img/wdg-ttl-ph.jpg") no-repeat top 80px left 50vw;
}
#hmn.conts {
    background: #f6edf0 url("../img/hmn-ttl-ph.jpg") no-repeat top 80px left 50vw;
}

.conts h2 {
    width: 480px;
    height: 500px;
    font-size: 40px;
    line-height: 1.5em;
    font-weight: bold;
    text-align: center;
    padding-top: 165px;
    margin-bottom: 70px;
}
#wdg.conts h2 {
    color: var(--color-wdg);
    background: url("../img/wdg-illust.png") no-repeat bottom 100px center;
}
#hmn.conts h2 {
    color: var(--color-hmn);
    background: url("../img/hmn-illust.png") no-repeat bottom 100px center;
    letter-spacing: 0.1em;
}
#wdg.conts .al {
    position: absolute;
    left: -50px;
    top: 30px;
}
#hmn.conts .al {
    position: absolute;
    left: -50px;
    top: 30px;
}
.conts .point {
    width: 100%;
    display: flex;
    justify-content: space-between;
    margin-bottom: 70px;
}
.conts .point li {
    width: 300px;
    position: relative;
}
.conts .point img {
    width: 100%;
    margin-bottom: 30px;
}
#wdg.conts .point img {
    box-shadow: 5px 5px 0px 0px #cfe5e8;
}
#hmn.conts .point img {
    box-shadow: 5px 5px 0px 0px #edd8df;
}
.conts .point .credit {
    position: absolute;
    top: 296px;
    right: 2px;
    font-size: 12px;
    line-height: 1.0em;
    color: #000;
    text-shadow: 1px 1px 1px #fff;
}
.conts .point .no {
    width: 110px;
    height: 94px;
    margin: 0 auto 15px;
    font-size: 40px;
    line-height: 94px;
    text-align: center;
}
#wdg.conts .point .no {
    color: var(--color-wdg);
    background: url("../img/wdg-no-bg.png") no-repeat;
    background-size: contain;
}
#hmn.conts .point .no {
    color: var(--color-hmn);
    background: url("../img/hmn-no-bg.png") no-repeat;
    background-size: contain;
}
.conts .point h3 {
    font-family: var(--g-webfont);
    font-size: 22px;
    font-weight: 700;
    line-height: 1.5em;
    margin-bottom: 10px;
}
#wdg.conts .point h3 {
    color: var(--color-wdg);
}
#hmn.conts .point h3 {
    color: var(--color-hmn);
}
.conts .point .text {
    font-family: var(--g-webfont);
    font-size: 17px;
    line-height: 1.5em;
    text-align: justify;
}
.conts .point .text i {
    margin-right: 10px;
}
.conts .btn-link {
    width: 580px;
    height: 70px;
    text-align: center;
    margin: 0 auto;
}
.conts .btn-link a {
    display: block;
    color: #fff;
    text-decoration: none;
    font-size: 20px;
    line-height: 70px;
    border-radius: 35px;
}
#wdg.conts .btn-link a {
    background-color: var(--color-wdg);
}
#hmn.conts .btn-link a {
    background-color: var(--color-hmn);
}
.conts .btn-link a:hover {
    opacity: 0.8;
    transition: all 0.6s ease;
}
.conts .btn-link a:after {
    font-family: "Font Awesome 5 Free";
    content: "\f30b";
    font-weight: 900;
    margin-left: 20px;
}

/*------------------------------------------------
	店舗情報
--------------------------------------------------*/
#shopinfo {
    width: 100%;
    background-color: #f5f5f4;
    padding: 70px 0 50px;
}
#shopinfo h2 {
    text-align: center;
    margin-bottom: 20px;
}
#shopinfo h2 img {
    width: 240px;
}
#shopinfo .message {
    font-size: 16px;
    text-align: center;
    font-weight: bold;
    color: #856217;
    margin-bottom: 40px;
}
#shopinfo h3 {
    font-size: 20px;
    letter-spacing: 0.3em;
    text-align: center;
    margin-bottom: 30px;
}
#shopinfo h3:before,
#shopinfo h3:after {
    content: "";
    display: inline-block;
    width: 80px;
    height: 7px;
    border-top: solid 1px #333;
    margin: 0 15px;
}
#shopinfo .info-box {
    display: flex;
    justify-content: space-between;
    align-items: flex-start;
    background-color: #fff;
    padding: 40px;
}
#shopinfo .info-box img {
    width: 34%;
}
#shopinfo .info-box .text {
    width: 60%;
}
#shopinfo h4 {
    font-size: 21px;
    font-weight: bold;
    margin-bottom: 15px;
}
#shopinfo dl {
    width: 100%;
    display: flex;
    flex-wrap: wrap;
}
#shopinfo dl dt {
    width: 20%;
    margin-bottom: 5px;
}
#shopinfo dl dd {
    width: 80%;
    margin-bottom: 5px;
}
#shopinfo dl dd.tel {
    font-size: 32px;
    line-height: 1.0em;
    font-weight: bold;
}
#shopinfo .btn-yoyaku {
    margin-top: 10px;
    display: flex;
    font-size: 15px;
}
#shopinfo .btn-yoyaku li {
    width: 160px;
    margin-right: 10px;
    text-align: center;
}
#shopinfo .btn-yoyaku li a {
    display: block;
    background-color: #c4b087;
    color: #fff;
    text-decoration: none;
    padding: 5px 0;
    border-radius: 20px;
    position: relative;
}
#shopinfo .btn-yoyaku li a:after {
    font-family: "Font Awesome 5 Free";
    content: "\f105";
    font-weight: 900;
    position: absolute;
    right: 10px;
}
#shopinfo .btn-yoyaku li a:hover {
    opacity: 0.8;
    transition: all 0.6s ease;
}
#shopinfo .btn-gmap {
    font-size: 0.8em;
    background-color: #c4b087;
    color: #fff;
    text-decoration: none;
    padding: 5px 20px;
    border-radius: 20px;
}
#shopinfo .btn-gmap:before {
    font-family: "Font Awesome 5 Free";
    content: "\f3c5";
    font-weight: 900;
    margin-right: 7px;
}

/*------------------------------------------------
	アニメーション
--------------------------------------------------*/
.fadein {
	opacity : 0;
	transform : translate(0px, 100px);
	transition : all 800ms;
}
.fadein.scrollin {
	opacity : 1;
	transform : translate(0px, 0px);
}
.point .fadein:nth-of-type(1)  {
	transition-delay:0;
}
.point .fadein:nth-of-type(2)  {
	transition-delay:300ms;
}
.point .fadein:nth-of-type(3)  {
	transition-delay:600ms;
}