@charset "UTF-8";

#wrapper {
padding-top:130px;
width:100%;}
.container {
position:relative;
padding:75px 0;}
.container-t00 {
position:relative;
padding-top:0px !important;}
.container-t40 {
position:relative;
padding-top:40px !important;}
.container-t80 {
position:relative;
padding-top:80px !important;}
.container-t120 {
position:relative;
padding-top:120px !important;}
.container-b00 {
position:relative;
padding-bottom:0px !important;}
.container-b40 {
position:relative;
padding-bottom:40px !important;}
.container-b80 {
position:relative;
padding-bottom:80px !important;}
.container-b120 {
position:relative;
padding-bottom:120px !important;}
.contents {
position:relative;
margin:0 auto;
width:88%;
max-width:1100px;}
.contents-2col {
text-align:left;
justify-content:space-between;
-ms-flex-pack:justify;
max-width:1150px;}
.main {
width:69.57%;
max-width:800px;}
.sidebar {
width:26.09%;
max-width:300px;}

@media only screen and (max-width:1023px) {

#wrapper {
padding-top:100px;}
.container {
padding:7.5% 0;}
.container-t40 {
padding-top:4% !important;}
.container-t80 {
padding-top:8% !important;}
.container-t120 {
padding-top:12% !important;}
.container-b40 {
padding-bottom:4% !important;}
.container-b80 {
padding-bottom:8% !important;}
.container-b120 {
padding-bottom:12% !important;}
.contents {
width:90%;}
.main {
margin:0 auto;
width:100%;
max-width:800px;}
.sidebar {
margin:7.5% auto 0;
width:100%;
max-width:800px;}

}

@media only screen and (max-width:640px) {

.container {
padding:50px 0;}
.container-t40 {
padding-top:25px !important;}
.container-t80 {
padding-top:50px !important;}
.container-t120 {
padding-top:75px !important;}
.container-b40 {
padding-bottom:25px !important;}
.container-b80 {
padding-bottom:50px !important;}
.container-b120 {
padding-bottom:75px !important;}
.sidebar {
margin:50px auto 0;}

}

/* header ============ */

.header {
font-family:"M PLUS 1",sans-serif;
position:fixed;
z-index:999;
top:0;
left:0;
width:100%;
height:85px;
background:rgba(255,255,255,0.85);
transition:height 0.25s;}
.header .header-logo {
position:absolute;
left:5px;
top:50%;
width:400px;
transform:translate(0,-50%);
transition:0.25s;}
.header .header-tel {
position:absolute;
top:50%;
right:75px;
width:300px;
transform:translate(0,-50%);
transition:0.25s;}
.header.scrolled {
height:55px;}
.header.scrolled .header-logo {
width:250px;}
.header.scrolled .header-tel {
width:220px;}

@media only screen and (max-width:1023px) {

.header {
height:55px;}
.header .header-logo {
width:250px;}
.header .header-tel {
display:none;}

}

/* gmenu-pc =================== */

.gmenu {
font-family:"M PLUS 1",sans-serif;
position:fixed;
z-index:998;
width:100%;
left:0;
top:85px;
background:linear-gradient(90deg,#d3fccc,#bbfaaa);
box-shadow:0 1px 2px 0 rgba(0,0,0,0.2);
transition:top 0.25s;}
.gmenu.scrolled {
top:55px;}
.gmenu-pc {
margin:0 auto;
width:100%;
max-width:1150px;}
.gmenu-pc > li {
position:relative;
flex-grow:1;}
.gmenu-pc > li::after {
content:"";
position:absolute;
left:0;
top:0;
width:1px;
height:100%;
background:#fff;
transform:skew(-15deg,0);}
.gmenu-pc > li:nth-child(1)::after {
display:none;}
.gmenu-pc > li.arrow::before {
content:"";
position:absolute;
left:50%;
bottom:4px;
width:0;
height:0;
border-left:5px solid transparent;
border-right:5px solid transparent;
border-top:7px solid #33bb00;
transform:translate(-50%,0);
transition:0.25s;}
.gmenu-pc > li.arrow:hover::before {
transform:translate(-50%,0) rotate(180deg);}
.gmenu-pc > li > a {
position:relative;
display:block;
font-size:100%;
line-height:45px;
letter-spacing:0.00em; 
white-space:nowrap;
color:#222;}
.gmenu-pc > li > a:hover {
color:#e82;}
.gmenu-pc > li ul.sub-menu {
visibility:hidden;
opacity:0;
position:absolute;
top:80%;
left:50%;
width:270px;
overflow:hidden;
background:linear-gradient(0deg,#d3fccc,#e6fee1);
border-radius:6px; 
transition:0.25s;
transform:translate(-50%,0);}
.gmenu-pc > li:hover ul.sub-menu {
top:100%;
visibility:visible;
opacity:1;}
.gmenu-pc > li ul.sub-menu li {}
.gmenu-pc > li ul.sub-menu li a {
display:block;
font-size:92%;
line-height:43px;
color:#222;
white-space:nowrap;
border-bottom:1px solid #e82;}
.gmenu-pc > li ul.sub-menu li:last-child a {
border-bottom:none;}
.gmenu-pc > li ul.sub-menu li a:hover {
background:rgba(255,255,255,0.5);}
.gmenu-contact {
display:none;
width:100%;}
.gmenu-contact li {
/*width:33.333333%;*/
width:50%;}
.gmenu-contact li a {
position:relative;
display:block;
padding:21px 0 0 0;
font-size:68%;
line-height:24px;
white-space:nowrap;
overflow:hidden;
color:#222;
background-color:#a5ed8a;
background-image:repeating-linear-gradient(-55deg,rgba(255,255,255,0.3) 0, rgba(255,255,255,0.3) 1px,transparent 1px, transparent 3px);
box-shadow:0 0 0 1px rgba(255,255,255,1);}
.gmenu-contact li a::after {
content:"";
position:absolute;
z-index:2;
top:7px;
right:50%;
width:16px;
height:16px;
background:url("../images/i_tel.svg") no-repeat center center / contain;
transform:translate(50%,0);}
.gmenu-contact li:nth-child(2) a::after {
background:url("../images/i_mail.svg") no-repeat center center / contain;}
.gmenu-contact li:nth-child(3) a::after {
background:url("../images/i_rsv.svg") no-repeat center center / contain;}

@media only screen and (max-width:1023px) {

.gmenu {
top:55px;}
.gmenu-pc {
display:none;}
.gmenu-contact {
display:flex;}

}

/* hamburger gmenu-sp =================== */

.gmenu-sp-button {
position:fixed;
z-index:10000;
display:flex;
cursor:pointer;
justify-content:center;
align-items:center;
border:none;
outline:none;
-webkit-appearance:none;
-moz-appearance:none;
appearance:none;
top:18px;
right:10px;
width:49px;
height:49px;
background:#33bb00;
border-radius:50%;
transition:0.25s;}
.header.scrolled .gmenu-sp-button {
top:3px;}
.gmenu-sp-button span, .gmenu-sp-button span::before, .gmenu-sp-button span::after {
content:"";
position:absolute;
display:block;
height:1px;
width:30px;
background:#fff;
transition:0.25s;}
.gmenu-sp-button span::before {
bottom:7px;}
.gmenu-sp-button span::after {
top:7px;}
.gmenu-sp-button.active {
display:flex;
background:none;}
.gmenu-sp-button.active span {
background:none;}
.gmenu-sp-button.active span::before {
bottom:0;
background:#222;
transform:rotate(45deg);}
.gmenu-sp-button.active span::after {
top:0;
background:#222;
transform:rotate(-45deg);}
#gmenu-sp-btn-check {
display:none;}

@media only screen and (max-width:1023px) {

.gmenu-sp-button {
top:0px;
right:0px;
width:55px;
height:55px;
border-radius:0;}
.header.scrolled .gmenu-sp-button {
top:0px;}

}

.gmenu-sp-bg {
pointer-events:none;
opacity:0;
position:fixed;
z-index:9998;
top:0;
left:0;
width:100%;
height:100%;
background:rgba(0,0,0,0.05);
transition:0.25s;}
.gmenu-sp-bg.active {
pointer-events:auto;
opacity:1;}
.gmenu-sp-container {
-webkit-overflow-scrolling:touch;
overflow-scrolling:touch;
pointer-events:none;
opacity:0;
position:fixed;
z-index:9999;
overflow-y:auto;
overscroll-behavior-y:contain;
left:0;
top:0;
width:100%;
height:100%;
background:rgba(255,255,255,0.95);
transition:0.25s;}
.gmenu-sp-container.active {
pointer-events:auto;
opacity:1;}
.gmenu-sp-modal {
margin:70px auto 40px;
width:85%;
max-width:480px;}
.gmenu-sp-modal .gmenu-sp-logo {
margin:0 0 18px 0;}
.gmenu-sp-contact {
margin:0 0 20px 0;
width:100%;
overflow:hidden;
border-radius:20px;}
.gmenu-sp-contact li {
/*width:33.333333%;*/
width:50%;}
.gmenu-sp-contact li a {
position:relative;
display:block;
padding:28px 0 0 0;
font-size:84%;
line-height:28px;
white-space:nowrap;
overflow:hidden;
color:#222;
background-color:#a5ed8a;
background-image:repeating-linear-gradient(-55deg,rgba(255,255,255,0.3) 0, rgba(255,255,255,0.3) 1px,transparent 1px, transparent 3px);
box-shadow:0 0 0 1px rgba(255,255,255,1);}
.gmenu-sp-contact li a::after {
content:"";
position:absolute;
z-index:2;
top:10px;
right:50%;
width:20px;
height:20px;
background:url("../images/i_tel.svg") no-repeat center center / contain;
transform:translate(50%,0);}
.gmenu-sp-contact li:nth-child(2) a::after {
background:url("../images/i_mail.svg") no-repeat center center / contain;}
.gmenu-sp-contact li:nth-child(3) a::after {
background:url("../images/i_rsv.svg") no-repeat center center / contain;}
ul.gmenu-sp {}
ul.gmenu-sp a {
display:block;
color:#222;}
ul.gmenu-sp a:hover {
color:#e82;}
ul.gmenu-sp > li {
text-align:left;
padding:0 0 0 8px;
border-bottom:1px solid #ddd;}
ul.gmenu-sp > li > a {
position:relative;
padding:0 0 0 4px;
font-size:108%;
line-height:48px;
white-space:nowrap;}
ul.gmenu-sp > li > a::before {
content:"";
position: absolute;
right:100%;
top:50%;
width: 0;
height: 0;
border-style:solid;
border-width:5px 0 5px 8px;
border-color:transparent transparent transparent #222;
transform:translate(0,-50%);}
ul.gmenu-sp ul.sub-menu {
padding:0 0 15px 0;}
ul.gmenu-sp ul.sub-menu a {
padding:0 0 0 6px;
font-size:92%;
line-height:30px;
white-space:nowrap;}

@media only screen and (max-width:640px) {

.gmenu-sp-contact li a {
padding:21px 0 0 0;
font-size:68%;
line-height:24px;}
.gmenu-sp-contact li a::after {
top:7px;
right:50%;
width:16px;
height:16px;}

}

/* mainimg ============= */

.mainimg {
font-family:"M PLUS 1",sans-serif;
position:relative;
padding:70px 0;
background:url("../images/bg_canvas.jpg") repeat center center / 240px;}
.mainimg::after {
content:"";
position:absolute;
left:0;
bottom:0;
width:100%;
aspect-ratio:150 / 10;
background:url("../images/bg_w_dn.svg") no-repeat center center / 100% 100%;
transform:translate(0,1px);}
.mainimg .ttl {
font-size:292%;
line-height:1.15;}
.mainimg .ttl-eng {
margin:0.4em 0 0 0;
line-height:1.15;
letter-spacing:0.1em;
color:#2e9b00;}

@media only screen and (max-width:1023px) {

.mainimg {
padding:7% 0;}

}

@media only screen and (max-width:640px) {

.mainimg {
padding:50px 0;}
.mainimg .ttl {
font-size:8.5vw;}
.mainimg .ttl-eng {
font-size:3vw;}

}

/* bread ========== */

.bread {
margin:10px 0 0 0;
padding:0 24px;
text-align:left;}
.bread ul li {
font-size:76%;
line-height:1.3;}
.bread ul li:not(:last-of-type) {
display:flex;}
.bread ul li:not(:last-of-type)::after {
content:">";
display:block;
margin:0 6px;}
.bread ul li a {
color:#222;}
.bread ul li a:hover {
color:#e82;}

@media only screen and (max-width:640px) {

.bread {
padding:0 12px;}
.bread ul li {
font-size:68%;}

}

/* gallery ================= */

ul.gallery {
justify-content:space-between;
-ms-flex-pack:justify;
margin:3% auto;}
ul.gallery::after {
content:"";
display:block;
width:31%;}
ul.gallery li {
width:31%;
padding:1% 0;}
ul.gallery li.col-66 {
width:65.5%;}
ul.gallery li.col-60 {
width:59.5%;}
ul.gallery li.col-50 {
width:48%;}
ul.gallery li.col-40 {
width:37%;}

ul.gallery li .img-col-contents {
justify-content:space-between;
-ms-flex-pack:justify;}
ul.gallery li .img-col-50 {
width:47.3282%;}
ul.gallery li .img-col-60 {
width:62.1849%;}
ul.gallery li .img-col-40 {
width:31.9328%;}

ul.gallery li p {
margin:0 !important;}
ul.gallery li .img {
position:relative;}
ul.gallery li img {
width:100%;
border-radius:20px;}
ul.gallery li .ttl {
position:absolute;
padding:0 9px;
right:0;
bottom:0;
display:inline-block;
font-size:68%;
line-height:28px;
color:#fff;
white-space:nowrap;
background:#555545;
border-radius:10px;}
ul.gallery li .txt {
margin:1em 0 0 0;
font-size:84%;
line-height:1.55;}

@media only screen and (max-width:767px) {

ul.gallery {
width:94%;
max-width:480px;}
ul.gallery li {
padding:3% 0;
width:100% !important;}
ul.gallery li .img-col-50 , ul.gallery li .img-col-60 , ul.gallery li .img-col-40 {
width:100%;}
ul.gallery li .img-col-50:last-child , ul.gallery li .img-col-60:last-child , ul.gallery li .img-col-40:last-child {
padding:6% 0 0 0;}

}

/*  smenu  ======================*/

ul.smenu {
text-align:left;
font-family:"M PLUS 1",sans-serif;
justify-content:space-between;
-ms-flex-pack:justify;
margin:0 auto;
width:100%;}
ul.smenu::after {
display:block;
content:"";
width:32%;}
ul.smenu li {
margin:0.5% 0;
width:32%;}
ul.smenu li p {
margin-bottom:0 !important;}
ul.smenu li a {
position:relative;
display:block;
padding:12px;
font-size:116%;
line-height:1.3;
font-weight:500;
color:#fff;
background-color:#2e9b00;
background-image:repeating-linear-gradient(-55deg,rgba(255,255,255,0.25) 0, rgba(255,255,255,0.25) 1px,transparent 1px, transparent 3px);
box-shadow:1px 1px 2px 0 rgba(0,0,0,0.2);
border-radius:15px;
transition:box-shadow 0.25s;}
ul.smenu li a .eng {
margin:3px 0 0 0;
font-size:11px;
font-weight:400;
letter-spacing:0.03em;
color:rgba(255,255,255,0.5);}
ul.smenu li a:hover {
box-shadow:0 0 0 3px #f6b470;}
ul.smenu li a::after {
content:"";
position:absolute;
z-index:2;
right:8px;
top:50%;
width:7px;
height:7px;
border-right:1px solid #fff;
border-bottom:1px solid #fff;
transform:translate(0,-50%) rotate(-45deg);}

@media only screen and (max-width:1023px) {

ul.smenu li {
margin:1% 0;
width:48.5%;}

}

@media only screen and (max-width:640px) {

ul.smenu li {
margin:6px 0;
width:100%;}

}

/* footer ============ */

.footer-address {
text-align:left;
justify-content:space-between;
-ms-flex-pack:justify;
align-items:center;
background:#fff;}
.footer-address .left {
padding:0 55px;
width:50%;
max-width:600px;
line-height:1.5;}
.footer-address .right {
position:relative;
width:50%;
min-width:calc(100% - 600px);}
.footer-address .logo {
margin:0 0 10px 0;}
.footer-address .tel {
margin:10px 0 15px 0;
font-size:204%;
line-height:1.2;
font-weight:bold;}
.footer-address .tel a {
color:#222;}
.footer-address table {
margin:0 0 12px 0;
width:100%;
font-size:84%;
line-height:1.35;
white-space:nowrap;}
.footer-address table th {
text-align:center;
padding:11px 0;
color:#fff;
background:#33bb00;}
.footer-address table td {
text-align:center;
background:#fff;
padding:12px 6px;
border-bottom:1px solid #33bb00;}
.footer-address .notice {
text-align:left;
margin-top:8px;
font-size:10px;
line-height:1.5;}
.footer-address .right .ttl-map {
position:absolute;
z-index:10;
text-align:center;
padding:14px 0;
left:0px;
top:0px;
width:56px;
font-size:12px;
line-height:14px;
color:#fff;
white-space:nowrap;
background:#555545;}
.footer-address iframe {
margin:40px 0;
vertical-align:bottom;
border-radius:40px 0 0 40px;}

.footer {
font-family:"M PLUS 1",sans-serif;
justify-content:space-between;
-ms-flex-pack:justify;
align-items:center;
flex-direction:row-reverse;
padding:35px 55px;
background:#eaeae3;}
.footer .txt {
width:calc(100% - 330px);}
.footer .carus {
text-align:center;
padding:0 0 5px 0;
width:280px;
font-size:76%;
line-height:1.25;
white-space:nowrap;}
.footer .carus img {
margin:0 0 16px 0;}
.footer .carus .btn a {
text-align:center;
position:relative;
display:block;
margin:10px 0 0 0;
padding:0.7em 0;
font-weight:bold;
color:#2e9b00;
background:#fff;
border-radius:20px;}
.footer .carus .btn a:hover {
color:#e82;}
.footer .carus .btn a::after {
content:"";
position:absolute;
z-index:2;
right:8px;
top:50%;
width:6px;
height:6px;
border-right:1px solid #33bb00;
border-bottom:1px solid #33bb00;
transform:translate(0,-50%) rotate(-45deg);
transition:0.25s;}
.footer .carus .btn a:hover::after {
border-right:1px solid #e82;
border-bottom:1px solid #e82;}

.fmenu-contact {
margin:0 0 20px 0;
width:500px;}
.fmenu-contact li {
width:50%;
padding:0 15px 0 0;}
.fmenu-contact li a {
position:relative;
display:block;
font-size:100%;
line-height:44px;
white-space:nowrap;
color:#2e9b00;
background:#fff;
border-radius:5px;
transition:background 0.25s;}
.fmenu-contact li a:hover {
background:#bbfaaa;}
.fmenu-contact li a::before , .fmenu-contact li a::after {
content:"";
position:absolute;
top:50%;
right:0%;
width:15px;
height:2px;
background:#eaeae3;
transform:translate(0,-50%);}
.fmenu-contact li a::after {
right:8px;
width:10px;
height:10px;
border-radius:50%;}

.fmenu {
width:100%;
max-width:800px;}
.fmenu li {
flex-grow:1;}
.fmenu li a {
position:relative;
display:block;
font-size:84%;
line-height:30px;
white-space:nowrap;
color:#222;
transition:0.25s;}
.fmenu li a:hover {
color:#e82;}
.fmenu li a::after {
content:"";
position:absolute;
left:0px;
top:50%;
width:1px;
height:16px;
background:#222;
transform:translate(0,-50%);}
.footer-copyright {
font-size:76%;
line-height:43px;
color:#fff;
letter-spacing:0.05em;
white-space:nowrap;
background:#33bb00;}

@media only screen and (max-width:1023px) {

.footer-address {
text-align:center;
margin:40px 0 0 0;
padding:50px 0 0 0;
background:#eaeae3;}
.footer-address .left {
margin:0 auto;
padding:0;
width:88%;}
.footer-address .right {
width:100%;
margin:50px 0 0 0;}
.footer-address .right .ttl-map {
left:50%;
top:0;
transform:translate(-50%,-50%);}
.footer-address iframe {
margin:0;
border-radius:0;}

.footer {
padding:0 0 35px 0;}
.footer .txt {
width:100%;}
.footer .carus {
margin:30px 0 0 0;
width:100%;
font-size:84%;}
.footer .carus img {
margin:0 0 18px 0;}
.footer .carus .btn a {
display:inline-block;
margin:12px 0 0 0;
padding:0.7em 3.2em;}

.fmenu-contact {
margin:1px 0 0 0;
width:100%;}
.fmenu-contact li {
width:50%;
padding:0;
border-left:1px solid rgba(255,255,255,0.8);}
.fmenu-contact li:nth-child(odd) {
border-left:none;}
.fmenu-contact li a {
font-size:92%;
line-height:50px;
color:#fff;
background:#33bb00;
border-radius:0;}
.fmenu-contact li a:hover {
background:#e82;}
.fmenu-contact li a::before , .fmenu-contact li a::after {
display:none;}

.fmenu {
max-width:100%;}
.fmenu li {
width:50%;
border-left:1px solid rgba(255,255,255,0.8);
border-bottom:1px solid rgba(255,255,255,0.8);}
.fmenu li:nth-child(odd) {
border-left:none;}
.fmenu li a {
font-size:92%;
line-height:50px;}
.fmenu li a:hover {
background:rgba(255,255,255,0.2);}
.fmenu li a::after {
display:none;}

}

@media only screen and (max-width:640px) {

.footer-address table th {
padding:10px 0;}
.footer-address table td {
padding:10px 8px;}

}

.page-top {
opacity:0;
pointer-events:none;
position:fixed;
z-index:998;
bottom:0;
right:0;
width:43px;
height:43px;
line-height:0;
transition:0.25s;}
.page-top.scrolled {
opacity:1;
pointer-events:auto;}
.page-top a {
position:relative;
display:block;
width:100%;
height:100%;
background:#555545;
transition:0.25s;}
.page-top a:hover {
background:#e82;}
.page-top a::after {
content:"";
position:absolute;
z-index:2;
left:50%;
top:50%;
width:25%;
height:25%;
border-top:1px solid #fff;
border-right:1px solid #fff;
transform:translate(-50%,-30%) rotate(-45deg);}

.bnr-fix {
position:fixed;
z-index:998;
right:0;
top:150px;
width:60px;}
.bnr-fix ul {}
.bnr-fix ul li {
padding:0 0 15px 0;}
.bnr-fix ul li a {
display:block;
padding:3px 8px 3px 0;
background-color:#2e9b00;
background-image:repeating-linear-gradient(-55deg,rgba(255,255,255,0.3) 0, rgba(255,255,255,0.3) 1px,transparent 1px, transparent 3px);
border-radius:20px 0 0 20px;
transform:translate(10px,0);
transition:transform 0.25s;}
.bnr-fix ul li:nth-child(2) a {
background-color:#555545;}
.bnr-fix ul li a:hover {
transform:translate(0,0);}

@media only screen and (max-width:1023px) {

.bnr-fix {
display:none;}

}