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

:root {
    --main-color01: #116622;
    --base-color01:  #F4F8F5;
    --background-gray:#F5F5F5;
    --text-color:#1C1C1C;
	--red:#FC523C;
	--orenge:#FFB221;
	--orenge_base:#FFF9E8;	
}
p{color: var(--text-colo);}



/*common--------------------------------------------------------------*/
.Boxstyle01{background: var(--base-color01);}
.Boxstyle02{background: var(--orenge_base);}
.Boxstyle03{background: var(--background-gray);}

span.tv{display: inline-block;color: #fff; background: var(--main-color01); padding: 1px 15px; border-radius: 50px;margin: 0 8px;}
span.newspaper{display: inline-block;color: #fff; background: #589364; padding: 1px 15px; border-radius: 50px;margin: 0 8px;}
span.radio{display: inline-block;color: #fff; background: #9ABEA2; padding: 1px 15px; border-radius: 50px;margin: 0 8px;}	
	

div.animation_box {
  padding: 10px;
  opacity: 0;
  transform: translateY(-20px);
  transition: 1s ease;
}
/* 1秒間かけてフェードイン */
.fadeIn1s {
    animation-name: fadeIn1s;
    animation-delay: 0.8s;
    animation-duration:1s;
    animation-fill-mode: forwards;
    transform: translateY(-50px);
    opacity: 0;
}
@keyframes fadeIn1s {
    0% {
    }
    100% {
        transform: translateY(0);
        opacity: 1;
    }
}

/*Header--------------------------------------------------------------*/
@media print, screen and (min-width: 1556px) {
header,.header_inner,header .headerTel{height: 80px;}
header .Logo a{width: 240px;}	
header dl dt{ display:none !important;}
.menu-parent:hover a , .menu-parent_off:hover a {background-color: #fff; color: #116622;transition: all .2s;}	
.child_BTN:hover{opacity: 0.5;transition: all .2s;}	
main{padding-top: 160px;}	
}
@media print, screen and (min-width: 1277px) and (max-width: 1556px) {
header,.header_inner,header .headerTel{height: 80px;}	
header .Logo a{width: 220px;}
header dl dt{ display:none !important;}
.menu-parent:hover a , .menu-parent_off:hover a {background-color: #fff; color: #116622;transition: all .2s;}
main{padding-top: 160px;}	
	
}

@media print, screen and (min-width: 769px) and (max-width: 1276px) {
header{border-bottom:1px solid var(--main-color01);
}	
header .Logo a{width: 240px;}	
header nav.base-container{display:none !important;}	
header dl dt{ display:block !important;}
.top_header_r{width:70%;max-width: 603px;}	
.TypeBanner , .TypeBanner02{display: none;}	
.InstaBox , .YoutubeBox{display: none!important;}
main{padding-top: 80px;}	
}

@media print, screen and (min-width: 769px) and (max-width: 945px){
.top_header_r{width:70%;max-width: 413px;}		
.CONTACTBox{position:absolute; top:8px; right:79px; cursor: pointer;}
.CONTACTBox a{background: #fff;border: 2px solid #116622;padding: 29px;}
.CONTACTBox a span{display: none;}
.CONTACTBox a::before{content: "\f0e0"; font-family: FontAwesome;color:  var(--main-color01);;font-size: 28px;position: absolute;top: 51%;left: 39%;transform: translate(-50%, -50%);}
header{
	width:100%;
	border-bottom:2px solid var(--main-color01);
}	

}

/*footer-----------------------------------------------------*/	
@media print, screen and (min-width: 859px) and (max-width: 1308px){
.footer_nav_ul{display:grid; grid-template-columns: repeat(5,138px); gap:55px 25px;}		
.footer-parent {display: inline-block; margin-right: 0;color: var(--main-color01); margin-bottom: 0;}	
.footer_icon_menu{display: flex;justify-content: center;align-items: center;gap:20px;margin: 50px auto 20px;flex-wrap: wrap;}	
.footer-parent ul{display: block; margin-top: 13px; border-top: 2px solid var(--main-color01);padding-top: 20px;width: 100%; max-width: 120px;}		
}

@media print, screen and (min-width: 769px) and (max-width: 859px){
.footer_nav_ul{display:grid; grid-template-columns: repeat(4,138px); gap:55px 35px;}		
.footer-parent {display: inline-block; margin-right: 0;color: var(--main-color01); margin-bottom: 0;}	
.footer_icon_menu{display: flex;justify-content: center;align-items: center;gap:20px;margin: 50px auto 20px;flex-wrap: wrap;}	
.footer-parent ul{display: block; margin-top: 13px; border-top: 2px solid var(--main-color01);padding-top: 20px;width: 100%; max-width: 120px;}			
}

@media print, screen and (min-width: 769px) and (max-width: 1210px){
.footer_flex{display: block; margin-bottom: 50px;}	
.footer_l{width: 100%;max-width: 420px; margin: 0 auto;}	
.footer_r{width: 100%;max-width: 556px; display: flex; justify-content: flex-start; align-items: center;flex-wrap: wrap;	margin: 30px auto 0;}	
.footer_title{font-size: 27px;color: var(--main-color01); font-weight: 700;text-align: center;display: block;}		
.footer_title img{display: block;width: 100%; max-width: 68px; margin: 10px auto;}	
}


/*FV-----------------------------------------------------------------*/
@media print, screen and (min-width: 769px) and (max-width:1186px){
.fvBox{position: relative;}	
.fv_content{position: absolute;z-index: 1; left: 3.4%; bottom: 1px;background-color: #fff;padding: 20px;border-radius: 15px;}	
.fv_content p{font-size: 1.1vw;}	
.fv_content h1{font-family: "Jost", sans-serif;font-weight: 600;font-size: 4vw;line-height: 1.3;color: var(--main-color01);letter-spacing: 0.6;}
.fv_content_inner{background: var(--background-gray); padding: 10px 7px; border-radius:15px;display: flex;justify-content: flex-start;align-items: center;}
.fv_content_inner p{padding-right: 15px;font-size: 1.1vw;}		
.fv_content_inner h2{font-family: "Jost", sans-serif;font-weight: 600;font-size: 4vw;line-height: 1.3;color: var(--main-color01);letter-spacing: 0.6;border-left: 1px solid #156622;padding:5px 15px;}	
.fv_content_inner h2 span{font-family: "Noto Sans JP",sans-serif;font-weight: 700;font-size: 1.5vw;line-height: 1.3;color: var(--main-color01);padding-left: 8px;}
	
}






	
/* TOP PAGE -----------------------------------------------------------------*/		

/*news*/
@media print, screen and (min-width: 769px) and (max-width:990px){
.top_flexBox01{display: block;}	
.top_flexBox01_l{width: 100%;}	
.top_flexBox01_r{width: 100%;max-width: 900px; margin: 20px auto;}	
.tab_off_990{display: none!important;}		
.tab_on_990{display: block;margin: 30px auto 0; text-align: center;}		
}

/*about*/
@media print, screen and (min-width: 769px) and (max-width:1000px){
.top_flexBox02{display: block;}	
.top_flexBox02_l{width: 100%; max-width: 700px; margin: 25px auto;}	
.top_flexBox02_r{width: 100%; max-width:603px; margin: 0 auto; }	
.top_flexBox02_r p img{width: 100%; max-width: 603px;}	
	
.top_flexBox03{display: block; margin-top: 65px;}	
.top_flexBox03_inner{width: 100%;max-width: 590px; margin: 30px auto;}
.top_flexBox03_inner img{width: 100%; max-width: 590px;}	
.illust_top_01{position: absolute;top:-48%; left: -7%;}	
.illust_top_01 img{width: 100%; max-width: 280px;}		
	
}

/*case*/
@media print, screen and (min-width: 915px) and (max-width:1370px){
.top_flexBox04{width: 100%;max-width: 810px; display: flex;justify-content: flex-start; align-items: flex-start;flex-wrap: wrap;gap:30px;margin: 40px auto;}
.top_flexBox04_inner{width: calc(100% / 2); max-width: 390px;box-sizing: border-box;}	
	
}
@media print, screen and (min-width: 769px) and (max-width:914px){
.top_flexBox04{width: 100%;max-width: 430px; display: flex;justify-content: flex-start; align-items: flex-start;flex-wrap: wrap;gap:30px;margin: 40px auto;}
.top_flexBox04_inner{width: 100%; max-width: 450px;box-sizing: border-box;margin-right: 0;}
.top_flexBox04_inner img{width: 100%; max-width: 450px;}	
	
}

/*new products*/
@media print, screen and (min-width: 769px) and (max-width:1500px){
.top_flexBox05_inner{margin-bottom: 65px;}	
.illust_top_02{position: absolute;top: -11.5%; right:0;}		
.illust_top_02 img{width: 100%; max-width: 320px;}	
.illust_top_03{position: absolute;left: 0; bottom: -70px;}	
.illust_top_03 img{width: 100%; max-width: 320px;}		
	
}
@media print, screen and (min-width: 769px) and (max-width:1339px){
.top_flexBox05{display: block; margin-top: 90px;}	
.top_flexBox05_l{width: 100%; max-width:650px; margin: 40px auto;}
.top_flexBox05_r{width: 100%; max-width:650px; margin:0 auto;}

.top_flexBox05_l img{width: 100%; max-width: 650px;}	
.top_flexBox05_r_img{width: 100%; max-width: 650px; display: block; margin-bottom: 30px;}
.top_flexBox05_inner{display: flex;justify-content: flex-start;align-items: flex-start;gap:30px 0;}
.top_inner_left{margin-right: 30px;}		
.top_flexBox05_inner img{width: 100%; max-width: 310px;}		

}

/*customers voice*/
@media print, screen and (min-width: 1018px) and (max-width:1368px){
.top_flexBox06{width: 100%;max-width: 936px; display: flex;justify-content: flex-start; align-items: flex-start;flex-wrap: wrap;margin: 40px auto;}
.top_flexBox06_inner{width: calc(100% / 3); max-width: 282px;box-sizing: border-box; margin-right: 30px; margin-bottom: 30px;}	
.top_flexBox06_inner img{width: 100%; max-width: 282px;}	

}
@media print, screen and (min-width:769px) and (max-width:1017px){
.top_flexBox06{width: 100%;max-width: 624px; display: flex;justify-content: flex-start; align-items: flex-start;flex-wrap: wrap;margin: 40px auto;}
.top_flexBox06_inner{width: calc(100% / 2); max-width: 282px;box-sizing: border-box; margin-right: 30px;margin-bottom: 30px;}	
.top_flexBox06_inner img{width: 100%; max-width: 282px;}	
.last_margin , .last_margin02_sp{margin-right: 0!important;}	
}



	
/*under_page-----------------------------------------------------*/	


/*new products*/	
@media print, screen and (min-width:769px) and (max-width:1146px){
.under_flexBox01{display: block;}
.under_flexBox01_l{width: 100%; max-width: 508px; margin: 0 auto 30px;}	
.under_flexBox01_r{width: 100%;max-width: 600px; margin: 80px auto 20px;}		
.under_flexBox01_r img{width: 100%; max-width: 600px;}		
	
.under_flexBox02{display: block;}
.under_flexBox02_inner{width: 100%;max-width: 600px;min-height: 420px;display: flex;flex-direction: column;margin-right: 45px;margin-bottom: 60px;margin: 30px auto!important;}	
.under_flexBox02_inner2{width: 100%;max-width: 600px;min-height: 370px;display: flex;flex-direction: column;margin-right: 45px;margin-top: 60px;margin: 30px auto!important;}	
.line_bottom_dot{border-bottom: none;}
	
	
.under_flexBox03{display: block; margin-top: 60px;}
.under_flexBox03_l{width: 100%; max-width: 508px;margin: 30px auto;}	
.under_flexBox03_r{width: 100%;max-width: 600px;margin: 30px auto;}		
.under_flexBox03_r img{width: 100%; max-width: 600px;}		
	
}

@media print, screen and (min-width:769px) and (max-width:1361px){
.under_flexBox04{display:block; margin:65px 0;}
.under_flexBox04 p{width: 100%; max-width: 608px;margin: 30px auto;}		
	
.under_numberList01{display:block;}	
.under_numberList01 li{width: 100%; max-width: 546px;margin: 50px auto;}		
}

/*wrapping*/	
@media print, screen and (min-width:924px) and (max-width:1295px){
.under_flexBox07{background: var(--base-color01);padding: 40px 30px; display: block;border-radius: 0 15px 15px 15px ;}	
.under_flexBox07_l{width: 100%;max-width: 600px;margin: 0 auto 50px;}
.under_flexBox07_r{width:100%;display: flex; justify-content:flex-start; align-content: flex-start; flex-wrap: wrap;gap:20px; margin: 0 auto;max-width: 800px;}	
	
}
@media print, screen and (min-width:769px) and (max-width:923px){
.under_flexBox07{background: var(--base-color01);padding: 40px 30px; display: block;border-radius: 0 15px 15px 15px ;}	
.under_flexBox07_l{width: 100%;max-width: 600px;margin: 0 auto 50px;}
.under_flexBox07_r{width:100%;display: flex; justify-content:flex-start; align-content: flex-start; flex-wrap: wrap;gap:20px; margin: 0 auto;max-width: 520px;}	
	
}



@media print, screen and (min-width:978px) and (max-width:1329px){
	
.under_flexBox08{background:#fff;padding: 45px; display: flex; justify-content:center; align-content: flex-start;gap:25px;border-radius: 0 15px 15px 15px;}	
.under_flexBox08 p{height: 250px; width: auto;}	
.under_flexBox08 p img{width: auto; max-height: 250px;display: block; margin: 0 auto;}		
	
}
@media print, screen and (min-width:769px) and (max-width:977px){
	
.under_flexBox08{background:#fff;padding: 45px; display: flex; justify-content:center; align-content: flex-start;gap:15px;border-radius: 0 15px 15px 15px;}	
.under_flexBox08 p{height: 200px; width: auto;}	
.under_flexBox08 p img{width: auto; max-height: 200px;display: block; margin: 0 auto;}		
	
}

/*download*/
@media print, screen and (min-width:769px) and (max-width:1100px){
.under_flexBox09{display: block;}
.under_flexBox09_l{width: 100%;max-width:800px; margin: 20px auto 30px;}	
.under_flexBox09_r{width: 100%;max-width:800px;margin: 20px auto;}	
.under_flexBox09_r img{max-width: 800px;}		
	
}