﻿/*header-------------------------------------------------------------------------*/
header.scr_header #logo {max-width: 90px;}
.top header{z-index:3 !important;}
.opacity_0{opacity:1 !important;}
.menu { display: none;}
/*header-------------------------------------------------------------------------*/


/*video---------------------------------------------------------------------------*/
#main_img::before {height: 100vh;}
#page_title .title_img {
    background-repeat: no-repeat;
    background-size: cover;
    background-position: center center;
    height: 500px;}
.title_img:before {
    content: "";
    display: block;
    width: 100%;
    height: 100%;
    background-color: rgba(175,175,175,0.6);
    position: absolute;
    top: 0px;
    left: 0;}
#page_title:before {height: 0%;}


/*IE*/
@media all and (-ms-high-contrast: none){
    .video{width: 100%;}
}
/*タブレット*/
@media screen and (max-width: 768px){
#main_img:before {height: 50vh;}
#main_img .menu {display: none;}
.page_title_box {width: 45%;}
}
/*スマホ*/
@media screen and (max-width: 667px){
div#video {height: 45vh !important;}
#main_img:before {height: 45vh !important;}
video.video {
    position: absolute;
    top: 50% !important;
    left: 50% !important;
    transform: translate(-50%,-50%) !important;}
#page_title .title_img {height: 300px;}
#page_title .page_title_box {padding: 20px 10px 30px;}
.page_title_box {width: 73%;}
}
/*video---------------------------------------------------------------------------*/


/*毎回いる*/

.swiper-button-next, .swiper-button-prev { z-index: 2 !important;}
#top_cms.back1:before {z-index: -1;}
.nav_menu_more a span::before {
    display: none !important;}
.nav_menu_more.mg_t-10px a span::before {
    display: block !important;}
div#contents2_wrap {margin-top: 50px;}


@media screen and (max-width: 667px){
#contents1 .line:before, #contents2 .line:before {
    left: 50%;
    -ms-transform: translate(-50%,0);
    -webkit-transform: translate(-50%,0);
    transform: translate(-50%,0);}
}



/*font-------------------------------------------------------------------------*/
body {font-family: 'Zen Kaku Gothic New',"游明朝", "YuMincho", "ＭＳ Ｐ明朝", "MS PMincho","ヒラギノ明朝 Pro W3", "Hiragino Mincho Pro", "Sawarabi Mincho", "serif" !important;
    font-weight: 500;
}
.cms_title p,.page_title_box p,.con_title .pop400,.con_box h2,a.more_btn,.pop400{font-family: 'Kurale','Zen Kaku Gothic New',"游明朝", "YuMincho", "ＭＳ Ｐ明朝", "MS PMincho","ヒラギノ明朝 Pro W3", "Hiragino Mincho Pro", "Sawarabi Mincho", "serif" !important;}
a,.box_title1,.cate_title,.box_title2,.hannari{
    font-family:'Kurale','Zen Kaku Gothic New',"游明朝", "YuMincho", "ＭＳ Ｐ明朝", "MS PMincho","ヒラギノ明朝 Pro W3", "Hiragino Mincho Pro", "Sawarabi Mincho", "serif" !important;}
.font_14 {font-size: 16px;}
.opacity08,.opacity07{opacity: 0.9;}

.line-l:before{top: 16px;}

/*font-------------------------------------------------------------------------*/





/*color------------------------------------------------------*/
/*#cffaff 207,250,255*/

/*text*/
.txt_color1 {color: #0f3305;}
.txt_color2 {color: #f57402;}
.txt_color3 {color: #f57402;}
h3 {color: #f57402;}
.num{color:#7cd11b;}

div#footer_con h2 {color: #f57402;}
/*header li a.txt_white {color: #0f3305;}*/
header.scr_header li a.txt_white { color: #0f3305;}

#info_contact p span{color:#ffffff;}
/*text*/

/*bg*/
.bg_color1 {background-color: #7bb53a;}
.bg_color2 {background-color: #d2ffcc;}
.bg_color3 {background-color: #70b521;}

.bg_color5 {background-color: #f57402;}

.button_container span { background: rgba(15, 51, 5,1);}

div#fakeloader {
    background-image: url(dup/img/bg_img.jpg) !important;
    background-size: cover;}
    
div#fakeloader.bg_color1{background-color: #d2ffcc !important;}

/*bg*/

/*border*/
.border_color1 { border-color: #7cd11b;}
.border_color2 { border-color: #7cd11b;}
.border_color3 {border-color: #7cd11b}
.border_color4 { border-color: #b0eaff;}
/*border*/

/*hvr*/
.hvr_bg_color2:hover { background-color: #f3ffe3;}
.hvr_txt_color1:hover { color: #7bb53a;}
/*hvr*/


/*beforeafter*/
.back1:before,.back2:before{ background-color: rgba(201,255,176,0.2) !important;
background: linear-gradient(110deg, rgba(209,255,181,0.5) 0%, rgba(229,255,195,0.3) 40%, rgba(233,255,223,0.1) 100%);
}


.more_btn:hover:after {background-color: rgba(124,209,27,0.1) !important;}
.line:before {background-color: rgba(124,209,27,0.5) !important;}
.more_btn:before {border-color: rgba(124, 209, 27,0.7) !important;}
.line-l:before {background-color: rgba(15, 51, 5,0.5) !important;}
#main_img:before,#contents3_wrap:after,#info_contact .con_img:before,.title_img:before{background-color:rgba(154, 173, 147,0.4) !important;}
#main_img:before{z-index:2;}
#pc_nav li a::after, #top_pc_nav li a::after{background: rgba(255, 255, 255,0.5);}
header.scr_header li a::after{background: rgba(15, 51, 5,0.5) !important;}

header.scr_header{background-color: rgba(244,255,240,0.8) !important}

.overlay {background: linear-gradient(135deg, rgba(116, 191, 71,0.9) , rgba(192, 235, 134,0.9) ) !important;}

.cms_5-c .box_txt1::before,#cms_5-c .box_txt1::before {color: rgba(245, 116, 2,0.8);}


.pager li a { background-color: rgba(245,116,2,0.8) !important;}
.pager li a:hover {background-color: rgba(124, 209, 27,0.8) !important;}
/*color------------------------------------------------------*/




/*スマホ時固定ヘッダー------------------------------------------------------*/
.sp_menu{
transition: .3s;
z-index: 2;
position: fixed;
bottom: 0;
left: 0;
width: 100%;
font-size: 12px;
letter-spacing: 0px;
}
.sp_menu li{
width: 25%;
border-top: 1px solid #fff;
border-bottom: 1px solid #fff;
border-right: 1px solid #fff;
box-sizing: border-box;
}
.sp_menu li:nth-of-type(1),.sp_menu li:nth-of-type(5){border-left: 1px solid #fff;}
.sp_menu li:nth-of-type(5),.sp_menu li:nth-of-type(6){border-top: none;}
.sp_menu li a{padding: 10px 3px;height: 100%;box-sizing: border-box;}

.sp_menu_btn{
width: 20%;
padding: 5px 9px;
position: absolute;
top: -38px;
cursor: pointer;
}

.sp_menu_btn .nav_btn{
display: inline-block;
width: 15px;
height: 15px;
margin-right: 5px;
position: relative;
top: 3px;
}
.sp_menu_btn .nav_btn span{
display: block;
background-color: #fff;
height: 3px;
width: 15px;
position: absolute;
left: 5px;
top: 5px;
transition: .3s;
}
.sp_menu_btn .nav_btn.open_btn span:nth-child(1){
transform: rotate(-55deg);
left: -1px;
width: 13px;
}
.sp_menu_btn .nav_btn.open_btn span:nth-child(2){
transform: rotate(55deg);
right: -1px;
width: 13px;
}

.sp_menu_btn .nav_btn.close_btn span{left: 0;}
.sp_menu_btn .nav_btn.close_btn span:nth-child(1){transform: rotate(45deg);}
.sp_menu_btn .nav_btn.close_btn span:nth-child(2){transform: rotate(-45deg);}

.sp_menu_btn .close,.sp_menu_btn .open{
display: inline-block;
font-size: 14px;
}
.sp_menu_btn.opennow .open{display: none!important;}

.sp_menu.navclose{bottom: -91px;}

/*スマホ時固定ヘッダー------------------------------------------------------*/


/*catch-------------------------------------*/

div#main_img::after {
    content: '';
    background-image: url(dup/img/catch.png);
    position: absolute;
    height: 100%;
    width: 100%;
    max-width: 600px;
    opacity: 1.3;
    content: "";
    display: block;
    z-index: 2;
    left: 4%;
    bottom: 50%;
    transform: translate(40%, 14%);
    background-repeat: no-repeat;
    background-size: 100%;
    background-position: bottom;
}

#video::before {
background-image: url(dup/img/catch02.png);
    position: absolute;
    height: 100%;
    width: 100%;
    max-width: 200px;
    opacity: 1.3;
    content: "";
    display: block;
    z-index: 2;
    left: 4%;
    bottom: 50%;
    transform: translate(0px, 21%);
    background-repeat: no-repeat;
    background-size: 100%;
    background-position: bottom;
}
/*catch-------------------------------------*/


/*logo*/
#logo {
    max-width: 150px;
    box-sizing: border-box;}
p#logo2 a {max-width: 250px !important;}



/*BASE---------------------*/
.fixed_img {
    position: fixed;
    bottom: 280px;
    right: 1px;
    z-index: 2;
    width: 100%;
    max-width: 60px;
    transition: 0.5s;
    box-shadow: 4px 4px 10px rgb(51 51 51 / 20%);
    border-radius: 10px;}

.fixed_img:hover{
    opacity: 0.8;
    transition: 0.5s;
}
/*BASE---------------------*/




/*top-------------------------------------*/

section#intro::before {
    content: '';
    background: url(dup/img/hiba.png);
    position: absolute;
    width: 300px;
    height: 300px;
    background-repeat: no-repeat;
    background-size: 100%;
    max-width: 300px;
    right: -3%;
    top: 50%;
    opacity: 0.5;
    transform: rotate(58deg) translate(0px, -5%);
    z-index: 1;}

section#intro::after {
    content: '';
    background: url(dup/img/hiba.png);
    position: absolute;
    width: 600px;
    height: 600px;
    background-repeat: no-repeat;
    background-size: 100%;
    max-width: 600px;
    right: -10%;
    top: 50%;
    opacity: 0.5;
    transform: rotate(347deg) translate(0px, 17%);
    z-index: 1;
    -webkit-filter: blur(2px);
    -moz-filter: blur(2px);
    -o-filter: blur(2px);
    -ms-filter: blur(2px);
    filter: blur(2px);}

@media screen and (max-width: 1400px){
section#intro::after {
    content: '';
    background: url(dup/img/hiba.png);
    position: absolute;
    width:500px;
    height: 500px;
    background-repeat: no-repeat;
    background-size: 100%;
    max-width: 500px;}
}

@media screen and (max-width: 1300px){
section#intro::after {
    content: '';
    background: url(dup/img/hiba.png);
    position: absolute;
    width:400px;
    height: 400px;
    background-repeat: no-repeat;
    background-size: 100%;
    max-width: 400px;}
}

#contents1_wrap::before {
    content: '';
    background: url(dup/img/hiba.png);
    position: absolute;
    width: 350px;
    height: 350px;
    background-repeat: no-repeat;
    background-size: 100%;
    max-width: 350px;
    left: -3%;
    top: 50%;
    opacity: 0.5;
    transform: rotate(254deg) translate(-75%, -18%);
    z-index: 1;}

.fuwa1 {
    position: absolute;
    top: 2%;
    left: 4%;
    width: 400px;
    height: 400px;
    border: solid 3px #ffffff;
    z-index: -1;
    animation: fuwafuwa 20s infinite linear;}
    
.fuwa2 {
    position: absolute;
    top: 27%;
    right: 4%;
    width: 400px;
    height: 400px;
    border: solid 0px #ffffff;
    z-index: -1;
    animation: fuwafuwa 20s infinite linear;
    background: rgb(240,255,233);
    background: rgb(240,255,233);
    background: linear-gradient(90deg, rgba(240,255,233,1) 0%, rgba(225,255,207,1) 37%, rgba(216,255,192,1) 100%);}
    
.fuwa3 {
    position: absolute;
    top: 52%;
    left: 4%;
    width: 400px;
    height: 400px;
    border: solid 3px #ffffff;
    z-index: -1;
    animation: fuwafuwa 20s infinite linear;}
    
.fuwa4 {
    position: absolute;
    top: 77%;
    right: 4%;
    width: 400px;
    height: 400px;
    border: solid 0px #ffffff;
    z-index: -1;
    animation: fuwafuwa 20s infinite linear;
    background: rgb(240,255,233);
    background: rgb(240,255,233);
    background: linear-gradient(90deg, rgba(240,255,233,1) 0%, rgba(225,255,207,1) 37%, rgba(216,255,192,1) 100%);}


    

@keyframes fuwafuwa {  
	  
0%, 100% {
    border-radius: 63% 37% 54% 46%/55% 48% 52% 45%;
}
14% {
    border-radius: 40% 60% 54% 46%/49% 60% 40% 51%;
}
28% {
    border-radius: 54% 46% 38% 62%/49% 70% 30% 51%;
}
42% {
    border-radius: 61% 39% 55% 45%/61% 38% 62% 39%;
}
56% {
    border-radius: 61% 39% 67% 33%/70% 50% 50% 30%;
}
70% {
    border-radius: 50% 50% 34% 66%/56% 68% 32% 44%;
}
84% {
    border-radius: 46% 54% 50% 50%/35% 61% 39% 65%;
}
	  
}
/*top-------------------------------------*/


/*linkStyle*/
a.linkStyle {
    color: #0f3305;
    transition: 0.5s;
}
a.linkStyle:hover {
    opacity: 0.7;
}


.btn_container{transition:0.5s;}
.btn_container:hover{opacity:0.7;}


#cms_2-a figure.box_img1 img {box-shadow: 6px 6px 16px rgba(51,51,51,0.2);}




/*contact【調整用】-------------------------------------------------------------*/

@media screen and (max-width: 1400px){
p#contact_tel a, p#contact_mail a {
    font-size: -webkit-calc(1rem + 5px) !important;
    font-size: calc(1rem + 5px) !important;
    padding: 25px 10px;}}
@media screen and (max-width: 1200px){
p#contact_tel a, p#contact_mail a {
    font-size: -webkit-calc(1rem + 4px) !important;
    font-size: calc(1rem + 4px) !important;
    padding: 25px 5px;
    letter-spacing: 2px;}}


/*【タブレット】*/
@media screen and (max-width: 768px){
    
p#contact_tel a, p#contact_mail a {
    font-size: -webkit-calc(1rem + 1px) !important;
    font-size: calc(1rem + 1px) !important;}
}

/*【スマホ】*/

@media screen and (max-width: 667px){
p#contact_tel a, p#contact_mail a {
    letter-spacing: 2px;
    font-size: -webkit-calc(1rem + 1px) !important;
    font-size: calc(1rem + 1px) !important;
    padding: 20px 5px;
    letter-spacing: 2px;
    font-weight: 800 !important;}
}


@media screen and (max-width: 320px){
p#contact_tel a, p#contact_mail a {
    letter-spacing: 2px;
    font-size: -webkit-calc(1rem + 0px) !important;
    font-size: calc(1rem + 0px) !important;
    padding: 20px 5px;
    letter-spacing: 1px;
    font-weight: 800 !important;}
}
/*contact【調整用】-------------------------------------------------------------*/



.scr_header .button_container span {background: rgba(15, 51, 5,1);}
.button_container span {background: rgba(255, 255, 255,1);}
.button_container {top: 57%;}


#page10 .more_btn {text-transform: none;}

/*IE*/
@media all and (-ms-high-contrast: none){
}


/*タブレット*/
@media screen and (max-width: 768px){

.fixed_img {
    top: 65%;
    max-width: 45px;}


#logo { max-width: 120px;}
p#logo2 a {max-width: 180px !important;}
#fakeloader .fl { max-width: 200px;}

#video::before { max-width: 100px;}
div#main_img::after {
    max-width: 300px;
    bottom: 50%;
    transform: translate(40%, -17%);}


section#intro::after{content:none;}

section#intro::before {
    content: '';
    background: url(dup/img/hiba.png);
    position: absolute;
    width: 150px;
    height: 150px;
    background-repeat: no-repeat;
    background-size: 100%;
    max-width: 150px;
    right: -6%;
    top: 86%;
    opacity: 0.5;
    transform: rotate(352deg) translate(0px, -5%);
    z-index: 1;}
#contents1_wrap::before {
    content: '';
    background: url(dup/img/hiba.png);
    position: absolute;
    width: 250px;
    height: 250px;
    background-repeat: no-repeat;
    background-size: 100%;
    max-width: 250px;
    left: -3%;
    top: 59%;
    opacity: 0.5;
    transform: rotate(254deg) translate(-66%, -18%);
    z-index: 1;}


.fuwa1,.fuwa2,.fuwa3,.fuwa4{
    width: 300px;
    height: 300px;}
}

/*スマホ*/
@media screen and (max-width: 667px){
    
#logo { max-width: 70px;}
header.scr_header #logo {max-width: 60px;}

#video::before {content:none;}
div#main_img::after {content:none;}

.catch01{
    z-index: 2;
    max-width: 230px;
    width: 100%;
    height:45vh;
    top: 28vh;
    right: 5%;
}

.catch02 {
    z-index: 2;
    max-width: 90px;
    width: 100%;
    height:45vh;
    top: 15vh;
    left: 6%;
}


.font_24_sp {  font-size: 22px;}
.pd_l-r5per_tb { padding: 0 5%;}
.intro_title h3 {letter-spacing: 0.8px !important;}

section#intro::before {
    content: '';
    background: url(dup/img/hiba.png);
    position: absolute;
    width: 120px;
    height: 120px;
    background-repeat: no-repeat;
    background-size: 100%;
    max-width: 120px;
    right: -8%;
    top: 96%;
    opacity: 0.5;
    transform: rotate(350deg) translate(0px, -5%);
    z-index: 1;}

#contents1_wrap::before {
    content: '';
    background: url(dup/img/hiba.png);
    position: absolute;
    width: 120px;
    height: 120px;
    background-repeat: no-repeat;
    background-size: 100%;
    max-width: 120px;
    left: -5%;
    top: 98%;
    opacity: 0.5;
    transform: rotate(254deg) translate(-66%, -18%);
    z-index: 1;
}

img.fixed_img {display: none !important;}

.fuwa1, .fuwa2, .fuwa3, .fuwa4 {
    width: 150px;
    height: 150px;}


p#logo2 a {
    margin: 50px auto 10px;
    max-width: 140px !important;}

#fakeloader .fl {max-width: 140px;}
p#copyright {padding-bottom: 135px;}

#cms_1-a .pager li {margin-right: 0px;}


}




@media screen and (max-width: 360px){
.catch01{
    z-index: 2;
    max-width: 220px;
    width: 100%;
    height:45vh;
    top: 28vh;
    right: 7%;
}

.catch02 {
    z-index: 2;
    max-width: 85px;
    width: 100%;
    height:45vh;
    top: 15vh;
    left: 6%;
}
}


@media screen and (max-width: 320px){

.catch01{
    z-index: 2;
    max-width: 200px;
    width: 100%;
    height:45vh;
    top: 30vh;
    right: 7%;
}


.catch02 {
    z-index: 2;
    max-width: 70px;
    width: 100%;
    height:45vh;
    top: 18vh;
    left: 6%;
}
}



/*IE*/
@media all and (-ms-high-contrast: none){


.more_btn{padding: 6px 0px 13px  !important;}
#page_title .page_title_box { padding-bottom: 20px !important;}
.pager li a {padding-bottom: 12px !important;}
#cms_2-a .cate .cate_title {
    padding-top: 15px  !important;
    padding-bottom: 17px  !important;}
.cate_list li a { padding-bottom: 13px !important;}
#cms_3-b .cate_title {
    padding-top: 10px  !important;
    padding-bottom: 15px  !important;}
.btn_container a{
    padding-top: 10px  !important;
    padding-bottom: 12px   !important;}
#contact_mail a,#tel_txt a{padding-top: 25px;}
#page9 .more {padding-bottom: 5px;}
#page10 .more_btn {
    padding-top: 7px !important;
    padding-bottom: 6px !important;}
}






/*20220425*/
.sns_links {max-width: 290px;}
.sns_links li {
    width: 13%;
    margin-right: 4%;
    box-sizing: border-box;
}