@charset "UTF-8";
img.pc {
    display: block;
}
img.sp {
    display: none;
}
img{
   max-width: none;
}

@media (max-width: 800px) {
    img.pc {
        display: none;
    }
    img.sp {
        display: block;
    }
}
.clear{clear:both !important;}

.clearfix:after  {
	content: "";
	display: block;
	height: 0;
	clear: both;
	visibility: hidden;
}
.clearfix {
	min-height: 1px;
}
.sp {
	width: 100%;
    height: auto;
}

br.sp{
    display: none;   
}

@media (max-width: 800px) {

br.sp{
    display: block;   
}
}

.sample_header{
    display: block;
    background: #818a2f;
    position: fixed;
    top: 0;
    left: 0;
    width: 100%;
    z-index: 9999;
    
}


.sample_footer{
    display: block;
    background: #818a2f;
    width: 100%;
    
}

    .sample_header img,
    .sample_footer img{
        margin: 0px auto;
    }

@media (max-width: 800px) {
.sample_header{
    position: relative;
    
}
    
    
    .sample_header img,
    .sample_footer img{
        width: 100%;
        height: auto;

    }
    
 }



/*mainimage*/
/*------------------------------------------------------------------------------*/
.about_wrapper{
    padding-top:90px; 
}


.kv_box{
	display: table;
    margin: 0px auto;
    width: 100%;
    background: url("main.png") no-repeat center center;
    background-size: cover;	
}

.kv_tit{
	display: table-cell;
    padding: 100px 0px;
    vertical-align: middle;
    text-align: center;
    font-size: 34px;
    letter-spacing: 5px;
    /*
    color: #737C16;    
    text-shadow:0px 0px 10px #FFF;
    */
    color: #FFF;    
    text-shadow:0px 0px 5px #737C16,0px 0px 10px #737C16;
    line-height: 2;
    font-weight:bold;
    font-family: "游明朝", YuMincho, "ヒラギノ明朝 ProN W3", "Hiragino Mincho ProN", "HG明朝E", "ＭＳ Ｐ明朝", "ＭＳ 明朝", serif;
	
}



/*------------------------------------------------------------------------------*/
/*  共通  */
.tit_01 {
    width: 100%;
    margin: 0px auto;
    display: block;
    text-align: center;
    font-size: 28px;
    color: #737C16;
    padding-bottom: 50px;

}

    .tit_01 span{
        font-size: 17px;
    }

.tit_02 {
    width: 100%;
    margin: 0px auto;
    display: block;
    font-size: 18px;
    color: #737C16;
    padding-bottom: 30px;
}

.tit_03 {
    width: auto;
    margin: 0px 0px 10px;
    display: table;
    font-size: 14px;
    color: #FFF;
    background: #737C16;
    font-weight: bold;
    padding: 5px 10px;
}


/*  about_history  */
.agave_box {
    width: 90%;
    max-width: 1200px;
    margin: 0px auto;
    display: block;
    padding: 50px 0px 0px;
}

.agave_box_01,
.agave_box_02{
    width: 100%;
    margin: 0px auto;
    display: table;
    padding-bottom: 50px;
    font-size: 18px;
    line-height: 1.8;
}

.agave_box_01 span,
.agave_box_02 span{
    font-size: 12px;
}


.agave_box_left {
    display: table-cell;
    vertical-align: middle;
}

    .agave_box_01 .agave_box_left {
        padding: 0px 50px 0px 0px;
    }


.agave_box_right {
    display: table-cell;
    vertical-align: middle;
}

    .agave_box_02 .agave_box_right {
        padding: 0px 0px 0px 50px;
    }

@media (max-width: 1200px) {
.agave_box_01 .agave_box_right img{
        width: 350px;
        height: auto;
     
    }   

.agave_box_02 .agave_box_left img{
        width: 400px;
        height: auto;
     
    }   
    
  }

.agave_box_left_sp {
    display: none;
}

/*  about_promise  */
.agave_item {
    width: 100%;
    margin: 0px auto;
    display: block;
    padding: 50px 0px;
    background: #F4F4F4;
}

.agave_item_box{
    width: 90%;
    max-width: 1200px;
    margin: 0px auto;
    display: block;
    padding-bottom: 50px;
}




/*  btn  */
.lp_btn{
    width: 100%;
    padding:0px 12px;
    height: 40px;
    background: #818A2F;
    border-radius: 5px;
    text-align: center;
    display: table;
    margin: 0px auto;
 } 

    .lp_btn:hover{
        opacity: 0.7;
     } 


.lp_btn a{
    width: 100%;
    padding:0px;
    color: #FFF;
    font-size: 16px;
    text-align: center;
    vertical-align: middle;
    display: table-cell;
 } 

.max480{
    max-width: 480px;
 } 

@media (max-width: 800px) {
.lp_btn{
    width: 100%;
 } 

 } 

/*  Recommend  */
.lp_recommend_01{
    width: 100%;
    height: 550px;
    margin: 0px auto;
    font-size: 20px;
    display: block;
    clear: both;
 } 

    .lp_recommend_left{
        float: left;
        width: 100%;
        position: relative;
     } 

        .lp_recommend_left img{
            position: absolute;
            /*display: block;*/
            top:0;
            left:-200px;
         } 

    .lp_recommend_right{
        width: 480px;
        padding-right: 40px;
        display: block;
        float: right;
    } 

.lp_recommend_02{
    width: 100%;
    height: 450px;
    margin: 0px auto;
    font-size: 20px;
    display: block;
    clear: both;
 } 


    .lp_recommend_02 .lp_recommend_left{
        float: right;
     } 

        .lp_recommend_02 .lp_recommend_left img{
            left:auto;
            right:-200px;
         } 

    .lp_recommend_02 .lp_recommend_right{
        padding-right: 0px;
        padding-left: 40px;
        float: left;
    } 

.lp_recommend_box{
    display: block;
    } 

.lp_recommend_copy{
    display: block;
    padding-bottom: 20px;
    font-weight: bold;
    font-size: 22px;
    color: #737C16;
    } 

.lp_recommend_tit{
    display: block;
    padding: 10px 0px;
    font-size: 16px;
    color: #737C16;
    } 

    .lp_recommend_tit span{
        display: block;
        font-weight: normal;
        font-size: 14px;
        } 

.lp_recommend_txt{
    display: block;
    padding-bottom: 20px;
    font-size: 16px;
    } 

.lp_recommend_money{
    display: block;
    padding-bottom: 10px;
    font-weight: bold;
    font-size: 24px;
    color: #737C16;
    } 

    .lp_recommend_money span{

        font-size: 14px;
        } 

@media (max-width: 800px) {

.lp_recommend_01{
    height: auto;
 } 

    .lp_recommend_left{
        float: none;
        position: relative;
     } 

        .lp_recommend_left img{
            position: relative;
            display: block;
            top:0;
            left:auto;
            width: 92%;
            height: auto;
            margin: 0px auto;
         } 

    .lp_recommend_right{
        width: 92%;
        padding-right: 0px;
        display: block;
        float: none;
        margin: 0px auto;
   } 

.lp_recommend_02{
    height: auto;
 } 

    .lp_recommend_02 .lp_recommend_left{
        float:none;
     } 

        .lp_recommend_02 .lp_recommend_left img{
            left:auto;
            right:auto;
         } 

    .lp_recommend_02 .lp_recommend_right{
        padding-right: 0px;
        padding-left: 0px;
        float: none;
    } 
    

    .lp_recommend_box{
        width: 92%;
        display: block;
        margin: 0px auto;
        padding: 20px 0px;

    } 
    
    .lp_recommend_box .lp_btn{
        width: 100%;

    } 
    
.lp_recommend_copy{
    padding-bottom: 15px;
    font-size: 16px;
    } 

.lp_recommend_tit{
    padding-bottom: 15px;
    font-size: 16px;
    } 

    .lp_recommend_tit span{
        font-size: 12px;
        } 

.lp_recommend_txt{
    padding-bottom: 15px;
    font-size: 12px;
    } 

    
} 
   
    
/*  collection  */
.lp_collection{
    width: 100%;
    margin: 0px auto 30px;
    font-size: 20px;
    display: block;
    clear: both;
 } 

    .lp_collection_box{
        width: 32%;
        margin-right: 2%;
        margin-bottom: 20px;
        display: block;
        float: left;
     } 

    .lp_collection .lp_collection_box:nth-child(3n){
        margin-right: 0;
     } 

.lp_collection_img img{
    width: 100%;
    height: auto;
 } 


@media (max-width: 800px) {

.lp_collection{
    width: 100%;
    margin: 0px auto;
    font-size: 20px;
    display: block;
    clear: both;
 } 

    .lp_collection_box{
        width: 100%;
        margin: 0px auto;
        padding-right: 0px;
        padding-bottom: 30px;
        display: block;
        float: none;

     } 

    
    
} 

.lp_collection_txt .lp_recommend_txt{
    font-size: 11px;
     } 


@media (max-width: 800px) {
    
.lp_collection_box lp_btn{
    width: 100%;
 } 


    
    
} 
  