@charset "utf-8";
/* CSS Document */
#main-area{background-color: #FBF4EA;}
#mini{background-color: #FCE9CE;padding:30px 20px;}
#before{background-color: #E8F4DB;padding:30px 20px;}
/*ナビ*/
#navi{width:100%;
margin-bottom:50px;
background-color:#c9e579;
box-sizing: border-box;}

.tag_navi {
    display: flex;
    flex-wrap: wrap;
    justify-content: center;
    max-width: 600px;
    margin: 30px auto ;
}
.tag_navi li a {
    display: block;
    color: #333333;
	font-weight:bold;
    background-color:#b1d546;
    font-size: 15px;
    margin: 0 5px 15px;
    padding: 10px 15px;
    border-radius: 40px;
    line-height: 1;
}

/*タイトル*/
.title{display: flex;
justify-content: center;
flex-direction: column;
position: relative;
margin:50px 0 35px;
padding:0px 15px;
}
.title-h2 {
 color: #333333;
  font-size: 30px;
padding:45px 0px 45px;
text-align: center;
border-top:2px solid #222222;
border-bottom:2px solid #222222;
background-color: #fff;
margin-bottom:35px;
}
.title_no{
color: #333333;
font-size: 20px;
font-weight: bold;
text-align: center;	
}

.title .icon_tent{
display:block;	
position: relative;	
margin: 0px auto 3px;
width:auto;	
top:10px;
}


.title_item{
color: #333333;
font-size: 24px;
font-weight: bold;
text-align: center;	
}

.title .icon_sun{
display:block;	
position: relative;	
margin: 0px auto 3px;
width:156px;
  height: 75px;		
top:-10px;
}

.title .icon_comment{
display:block;	
position: relative;	
margin: 0px auto 3px;	
top:0px;
left:10%;	
}

.title_mountain{
color: #333333;
font-size: 18px;
font-weight: bold;
padding:10px 15px 10px 15px;
margin-bottom:25px;
border-bottom: 2px solid #222;
	background: url("../img/icon_moutain.png") no-repeat;
	background-position: right;
	
}

.title_leaf{
	text-align: center;
color: #333333;
font-size: 18px;
font-weight: bold;
padding-bottom:10px;
margin-bottom:25px;
border-bottom: 2px solid #222;
	
}
.title_leaf::before{
  display:inline-block;
  margin-right: 15px;
  content: "";
  flex: 0 0 auto;
  background: url("../img/icon_leaf.png") no-repeat;
  width: 30px;
  height: 30px;
	
}


.title_tree{
color: #333333;
font-size: 14px;
font-weight: bold;
margin-bottom:15px;

	
}
.title_tree::before{
  display:block;
  margin-bottom: 10px;
  content: "";
  flex: 0 0 auto;
  background: url(../img/icon_trees.png) no-repeat;
  width: 200px;
  height: 17px;
	
}


.title-bg03 {
    background-color: #f9f79d;
    color: #222;
}
.title-bg01 {
    color: #333;
    background-color:#cae1b7;
	border-bottom:2px dashed #222;
	margin-bottom: 20px;
}
.index-tit,.headline05{color:#333;}
.check-list__item {
	align-items: center;}
	
.info-content__heading {
    margin: 20px 0 15px;
    color: #f35d33;
}	

.w200{width:150px;margin:0 auto!important;}


.col1{display: flex;

flex-direction: column;
justify-content: center;
padding: 10px 5px;
box-sizing: border-box;
}
.col1_inner {
width:680px;
max-width:90%;
min-width:300px;
margin:0 auto;
box-sizing: border-box;
	flex-grow: 1;
}

.col2{display: flex;
flex-direction: row;
flex-wrap: wrap;
justify-content: space-around;
align-content: flex-start;
padding: 10px 5px;
box-sizing: border-box;
}
.col2_inner {
    width:49%;
padding:15px;
margin-right:1%;
box-sizing: border-box;
flex-grow: 1;
}
.col2_inner:nth-child(2n) {
margin-right:0px;
}
.col2_inner img{width:80%;
}

.col2_inner .title-bg01 {
    color: #333;
    background-color:#cae1b7;
	border-bottom:2px dashed #222;
	padding:10px;
	font-size: 14px
}
.inner_img {margin:0 auto 10px;text-align: center;}
.inner_img img{
	width:100%;
	max-width:450px;
}

.txt-sho{font-size:13px;line-height: 2;}

/*アクティブ*/
.product-content01__body {
	justify-content: flex-end;}
.product-content01__body .detail-btn02{margin: 15px auto 0;}
 .flex-content .product-content01__img {
    width: 300px;
    height: 300px;
	 border-radius: 50%;
	  margin-bottom:0px;
  }
 .product-content01__body {
    display: flex;
    flex-direction: column;
    width: calc(100% - 325px);
  }

/*動画*/
.youtube {
    display: block;
    margin: 0 auto 30px;
    box-sizing: border-box;
    max-width: 85%;
    aspect-ratio: 16 / 9;
}

/*装飾*/
.circle{border-radius: 50%;}
.shadow {
    box-shadow: rgba(0,0,0,0.2) 0 0 8px;
    border-radius: 4px;}
.opa{opacity:0.5}
.vis{visibility: visible;}



.tag-or {
  display: inline-block;
  padding: 4px 8px;
margin:10px 3px 15px;
  background: #f08336;
  color: #FFFFFF;
  font-size: 12px;
  line-height: 1;
}


.tag-dog {
    display: inline-block;
    padding: 4px 8px;
    margin: 10px 3px 0;
    background: #439D42;
    color: #FFFFFF;
    font-size: 12px;
    line-height: 1;
}
.tag-cat {
    display: inline-block;
    padding: 4px 8px;
    margin: 10px 3px 0;
    background: #e96f03;
    color: #FFFFFF;
    font-size: 12px;
    line-height: 1;
}

/*ボタン*/
.detail-btn02 {
  margin: 15px auto 30px;
  display: flex;
  justify-content: center;
  border-radius: 25px;
  align-items: center;
  box-sizing: border-box;
  width: 210px;
  max-width: 100%;
  height: 50px;
  color: #fff;
  font-size: 14px;
  font-weight: bold;
  cursor: pointer;
  background: url(/assets/vendor/fonts/stylesheet/images/icon/white/arrow.svg) right 15px center / 10px no-repeat #e9670d;
}

/*背景*/
.bk-beige{background-color:#ECCFA6;
	padding: 20px;}
.bk-yl{background-size: auto auto;
	padding: 10px;
background-color:  #FFF9BA;
}

/*調整*/
.border-box{margin: 30px 10px 50px;
box-sizing: border-box;
}

.info-content{background-color:#f5e3c8; }

.content-link__txt a {
  color: #444;
  font-size: 11px;
	font-weight:bold;
}
.monitor{align-items: center;}
.monitor__img {
  flex: 0 0 auto;
  max-width: 200px;
  max-height: 200px;
margin-right:15px;	
}
.monitor__img img{width:100%;border-radius:50%;}
.item_center {
    display: flex;
    align-items: center;
    justify-content: center;
}
.item_center_inner {
    width: 90%;
}
.mb50{margin-bottom:50px}
.mb80{margin-bottom:80px}
.mb100{margin-bottom:100px}
.p5{padding:10px 15px;}


@media print, screen and (max-width: 767px){
.title {
    display: flex;
    justify-content: center;
    flex-direction: column;
    position: relative;
    margin: 50px 0 30px;
    padding: 0px 10px;
}
.title-h2 {
    color: #333333;
    font-size: 26px;
    padding: 30px 0px 30px;
    margin-bottom: 30px;}
    
.product-content01__body {
    display: flex;
    flex-direction: column;
    width: 100%;
}
.col2_inner {
    padding: 5px;}	
    
    .flex-content .product-content01__img {
    margin-bottom: 30px;
    width:250px;
    height: 250px;
}
  
  }



