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

.fadein {opacity : 0; transform : translate(0, 30px); transition : all 1s;}
.fadein.active{opacity : 1; transform : translate(0, 0);}

body {color: #222; font-family: 'Noto Serif JP', serif; font-family: 'Shippori Mincho', serif; line-height: 1.6; background: #fff; width: 100vw; overflow-x: hidden;}
a {color: #fff; text-decoration: none; transition: all 0.5s ease 0s;}
a.tel {color: #444; text-decoration: underline;}
a::after {transition: all 0.5s ease 0s;}

.header {height:100vh; background-color: #efefef;}
.header-in {height:100vh; margin: 0 auto; position: relative;}
.h-logo {padding: 30px 0 0;}
.header h1 {position: absolute;}

section {margin: 0 auto;}
section h2, .sec_res strong {padding: 0 5px; position: relative; display: inline-block;}
section h2::after, .sec_res strong::after {content: ''; width: 100%; height: 10px; background: #f8d2cf; position: absolute; bottom: 8px; left: 0; z-index: -1;}
section h3 {text-align: center;}
section h3 span {color: #dccc8e; display: block;}

.cen {text-align: center;}

.sec_btn {text-align: center; position: relative;}
.sec_btn::after {content: ''; background: #f5f5f5; position: absolute; transform:rotate(5deg); z-index: -1;}

.sec_add {background: url(../images/sec02-bg.png) no-repeat center/cover;}
.sec_add-in {margin: 0 auto; text-align: center;}
.sec_add-in p {margin: 0 0 20px;}

.sec_res {text-align: center;}
.sec_res img {display: block; margin: 0 auto 50px;}
.sec_res strong {font-size: 2.0rem; margin: 0 0 30px;}
.sec_res div {margin: 0 auto; padding: 20px; background: #f5f5f5; position: relative; z-index: -10;}
.sec_res p {text-align: left; line-height: 2.3; z-index: 0;}
.sec_res p span {display: inline-block; position: relative;}
.sec_res p span::after {content: ''; width: 100%; height: 8px; background: #f8d2cf; position: absolute; bottom: 6px; left: 0; z-index: -1;}

.sec_the {background: #f5f5f5; max-width: 100%; margin: 0 0 50px;}
.sec_the .block {margin: 0 auto;}
.sec_the .block div {text-align: center; background: #fff; box-shadow: 0 10px 25px 0 rgba(0, 0, 0, .5);}
.sec_the .block img {display: inline-block; margin: 0 0 20px;}
.sec_the .block a {display: block; background: #b6aa84; margin: 0 auto; padding: 20px;position: relative;}
.sec_the .block a::after {content: ''; display: block; width: 10px; height: 10px; border-top: 1px solid #fff; border-right: 1px solid #fff; transform:rotate(45deg); position: absolute; }

.sec_faq dl {margin: 0 auto;}
.sec_faq dl dt {background: #e9e0d7; font-size: 1.5rem; margin: 0 0 20px; padding: 10px 20px;position: relative;}
.sec_faq dl dt::after {content: ''; display: block; width: 10px; height: 10px; border-bottom: 1px solid #222; border-right: 1px solid #222; transform:rotate(45deg); position: absolute;}
.sec_faq dl dt.active::after {transform:rotate(-135deg);}
.sec_faq dl dd {padding: 0 20px 20px; display: none;}

.sec_voi {background: url(../images/sec05-01.png) no-repeat right top; background-color: #f5f5f5; max-width: 100%; }
.voi_ttl {margin: 0 auto; text-align: left; border-bottom: 1px solid #999;}

.voi_block div span {color: #c5b097; display: inline-block; margin: 0 10px; }
.voi_block div div {border-bottom: 1px solid #999; margin: 0 0 10px; padding: 0 0 10px;}

.foot {background: #333333; color: #fff; }
.foot strong {display: block; border-bottom: 1px solid #999; padding: 0 0 10px; margin: 0 0 10px; font-size: 2.0rem;}
.foot_in ul li {margin: 0 0 5px;}
.map {position: relative; height: 0; }
.map iframe { position: absolute; top: 0; left: 0; width: 100%; height: 100%;}
.foot_img {text-align: center;}
.foot_img img {display: inline-block; margin: 0 10px;}

footer {background: #333; border-top: 1px solid #999; text-align: center; color: #999; font-size: 0.8rem; padding: 10px;}

.pagetop {background: #bbbd93; position: fixed; right: 0; z-index: 100;}
.pagetop a {display: block; position: relative; color: #bbbd93;}
.pagetop a::after {content: ''; display: block; width: 20px; height: 20px; border-top: 2px solid #fff; border-left: 2px solid #fff; transform:rotate(45deg); position: absolute;}
