@charset "UTF-8";
/* 
	
CSS page.css */




/*
base #333
green #00af84
*/



/*//////////////////


#index


//////////////////*/

/* common */
#index {  }

/* #mainv */
#index #mainv { height: 920px; width: 100%; display: flex; justify-content: center; align-items: center; position: relative; }
#index #mainv .copybox { position: relative; z-index: 1; text-shadow: 0 0 30px rgba(0,0,0,0.1); text-align: center; }
#index #mainv .maincopy { font-size: 7.2rem; line-height: 1.7; color: #fff; -webkit-writing-mode: vertical-rl; -ms-writing-mode: tb-rl; writing-mode: vertical-rl; display: inline-block; text-align: left; font-family: 'Noto Sans JP', sans-serif; letter-spacing: 0.1em; font-weight: 700; margin-top: 100px; }
#index #mainv .bg { position: absolute; top: 0; left: 0; object-fit: cover; font-family: 'object-fit: cover;'; display: block; width: 100%; height: 100%; z-index: -1; }
#index #mainv .subcopy { font-size: 2.8rem; font-family: 'Noto Sans JP', sans-serif; font-feature-settings : "palt"; letter-spacing: 0.16em; text-align: center; margin-top: -20px; color: #fff; }
#index #mainv .scroll { font-size: 1.8rem; color: #fff; position: absolute; left: 0; bottom: 10px; text-align: center; width: 100%; }
@media screen and (max-width: 1100px){
	#index #mainv .maincopy { font-size: 6rem; }
	#index #mainv .subcopy { font-size: 2.4rem; }
}
@media screen and (max-width: 767px){
	#index #mainv { height: 100vh; width: 100%; }
	#index #mainv .copybox { position: relative; z-index: 1; text-shadow: 0 0 10px rgba(0,0,0,0.1); }
	#index #mainv .maincopy { font-size: 4.0rem; margin-top: 40px; }
	#index #mainv .subcopy { font-size: 1.8rem; margin-top: -10px; }
	#index #mainv .scroll { font-size: 1.3rem; }
}


/* #sec_1 */
#index #swrap_1 {  }
#index #sec_1 .incnt { display: flex; justify-content: space-between; align-items: center; max-width: 940px; }
#index #sec_1 .txtbox { flex: 1; }
#index #sec_1 .txtbox .box1 { display: flex; align-items: center; }
#index #sec_1 .txtbox .logobox { width: 160px; margin-right: 60px; }
#index #sec_1 .txtbox .txt1 { line-height: 2.3; margin-top: 60px; }
#index #sec_1 .imgbox { width: 296px; margin-left: 80px; }
@media screen and (max-width: 1100px) {
	#index #sec_1 .incnt { flex-direction: column-reverse; }
	#index #sec_1 .imgbox { width: 296px; margin: 0 auto 80px; }
	#index #sec_1 .txtbox { flex: none; text-align: center; }
}
@media screen and (max-width: 767px) {
	#index #sec_1 .txtbox .logobox { width: 120px; margin-right: 40px; }
	#index #sec_1 .txtbox .box1 { justify-content: center; }
	#index #sec_1 .txtbox .txt1 { margin-top: 30px; }
	#index #sec_1 .imgbox { width: 160px; margin-bottom: 50px; }
}
@media screen and (max-width: 500px) { 
	#index #sec_1 .txtbox .logobox { width: 100px; margin-right: 30px; }
	#index #sec_1 .txtbox { text-align: justify; }
}
@media screen and (max-width: 350px) { 
	#index #sec_1 .txtbox .logobox { width: 90px; margin-right: 20px; }
}


/* #sec_2 */
#index #swrap_2 { background: #f7f7f7; }
#index #sec_2 .list { display: flex; justify-content: space-between; align-items: center; flex-wrap: wrap; margin-top: -30px; }
#index #sec_2 .list>li { width: 500px; height: 220px; display: flex; justify-content: space-between; align-items: center; margin-top: 30px; }
#index #sec_2 .list>li .imgbox { width: 220px; height: 220px; }
#index #sec_2 .list>li .imgbox img { object-fit: cover; font-family: 'object-fit: cover;'; display: block; width: 100%; height: 100%; }
#index #sec_2 .list>li .title { flex: 1; display: flex; justify-content: center; align-items: center; text-align: center; background: #fff; width: 92%; height: 100%; padding: 0 4%; }
#index #sec_2 .imglist { display: flex; justify-content: center; align-items: center; flex-wrap:wrap; margin-top: 60px; } 
#index #sec_2 .imglist>li { width: 33.33%; } 
@media screen and (max-width: 1280px) {
	#index #sec_2 .list>li { width: 48%; }
}
@media screen and (max-width: 1100px) {
	#index #sec_2 .list { display: block; margin: 0 auto; max-width: 600px; }
	#index #sec_2 .list>li { width: 100%; }
	#index #sec_2 .list>li:first-child { margin-top: 0; }
}
@media screen and (max-width: 767px) {
	#index #sec_2 .list>li { height: 160px; margin-top: 20px; }
	#index #sec_2 .list>li .imgbox { width: 160px; height: 160px; }
	#index #sec_2 .list>li:last-child { height: auto; }
	#index #sec_2 .list>li:last-child .title { padding: 8%; text-align: justify; width: 84%; }
	#index #sec_2 .list>li:last-child .title br { display: none; }
	#index #sec_2 .imglist { margin: 0 -7%; } 
	#index #sec_2 .imglist>li { width: 50%; } 
}
@media screen and (max-width: 500px) {
	#index #sec_2 .list>li { height: 110px; margin-top: 10px; }
	#index #sec_2 .list>li .imgbox { width: 110px; height: 110px; }
}


/* #sec_3 */
#index #sec_3 { }


/* #sec_4 */
#index #sec_4 .inbox { display: flex; justify-content: space-between; align-items: center; }
#index #sec_4 .imgbox { width: 300px; height: 240px; overflow: hidden;  margin-right: 70px; }
#index #sec_4 .imgbox img { object-fit: cover; font-family: 'object-fit: cover;'; display: block; width: 100%; height: 100%; transition: 0.6s; }
#index #sec_4 .txtbox { flex: 1; }
#index #sec_4 .txtbox .btnbox ul { justify-content: flex-start; }
@media screen and (max-width: 1100px) {
	#index #sec_4 .inbox { align-items: normal; } 
	#index #sec_4 .inbox .imgbox { display: flex; height: auto; }
	#index #sec_4 .imgbox { margin-right: 60px; }
}
@media screen and (max-width: 767px) {
	#index #sec_4 .inbox { display: block; } 
	#index #sec_4 .txtbox { flex: none; }
	#index #sec_4 .imgbox { margin-right: 0; margin-bottom: 30px; width: 100%; height: calc(100px + 20vw); }
	#index #sec_4 .txtbox .btnbox ul { justify-content: center; }
}










/*//////////////////


#product


//////////////////*/

/* sec_1 */
#product #sec_1 .boxlist { display: flex; justify-content: space-between; margin-top: 40px; }
#product #sec_1 .boxlist li { width: 48%; background: #f7f7f7; padding: 50px 6%; box-sizing: border-box; }
@media screen and (max-width: 767px) { 
	#product #sec_1 .boxlist { display: block; margin-top: 30px; }
	#product #sec_1 .boxlist li { width: 100%; padding: 30px 6%; }
	#product #sec_1 .boxlist li:first-child { margin-bottom: 10px; }
}
@media screen and (max-width: 500px) { 
}


/* #sec_2 */
#product #swrap_2 { background: #f7f7f7; }
#product #sec_2 .box1 { margin: 60px 0 80px; position: relative; }
#product #sec_2 .box1 .bg { margin: 0 auto; width: 500px; }
#product #sec_2 .box1 li { position: absolute; left: 50%; }
#product #sec_2 .box1 li a { display: flex; align-items: center; line-height: 1.4; font-size: 1.6rem;  }
#product #sec_2 .box1 li .num { background: url(../img/product/bg_num.png); width: 38px; height: 38px; background-size: contain; line-height: 1; letter-spacing: 0; font-size: 1.8rem; font-family: 'Montserrat', sans-serif; display: flex; justify-content: center; align-items: center; margin-right: 5px; background-position: center center; background-repeat: no-repeat; flex-shrink: 0;}
#product #sec_2 .box1 li:nth-child(1) { margin-left: 245px; top: -19px; }
#product #sec_2 .box1 li:nth-child(2) { margin-left: -387px; top: -8px; }
#product #sec_2 .box1 li:nth-child(3) { margin-left: 260px; top: 182px; }
#product #sec_2 .box1 li:nth-child(4) { margin-left: 215px; top: 360px; }
#product #sec_2 .box1 li:nth-child(5) { margin-left: -360px; top: 408px; }
#product #sec_2 .list1 li { display: flex; align-items: center; margin-bottom: 30px; height: 380px; background: #fff; }
#product #sec_2 .list1 li:nth-child(even) { flex-direction: row-reverse; }
#product #sec_2 .list1 li .imgbox { width: 420px; height: 380px; }
#product #sec_2 .list1 li .imgbox img { object-fit: cover; font-family: 'object-fit: cover;'; display: block; width: 100%; height: 100%; }
#product #sec_2 .list1 li .txtbox { padding: 0 70px; flex: 1; }
#product #sec_2 .list1 li .txtbox .copy.s2 { display: flex; align-items: center; }
#product #sec_2 .list1 li .txtbox .copy.s2 .num { background: url(../img/product/bg_num.png); width: 50px; height: 50px; background-size: contain; line-height: 1; letter-spacing: 0; font-size: 2.4rem; font-family: 'Montserrat', sans-serif; display: flex; justify-content: center; align-items: center; margin-right: 10px; background-position: center center; background-repeat: no-repeat; flex-shrink: 0; }
@media screen and (max-width: 1100px) { 
	#product #sec_2 .box1 .bg { width: 280px; }
	#product #sec_2 .box1 li:nth-child(1) { margin-left: 130px; top: 51px; }
	#product #sec_2 .box1 li:nth-child(2) { margin-left: -270px; top: 70px; }
	#product #sec_2 .box1 li:nth-child(3) { margin-left: 130px; top: 116px; }
	#product #sec_2 .box1 li:nth-child(4) { margin-left: 130px; top: 245px; }
	#product #sec_2 .box1 li:nth-child(5) { margin-left: -265px; top: 312px; }
	#product #sec_2 .list1 li { align-items: normal; height: auto; } 
	#product #sec_2 .list1 li .imgbox { display: flex; height: auto; width: 45%; }
	#product #sec_2 .list1 li .txtbox { padding: 40px 6%; }
}
@media screen and (max-width: 767px) { 
	#product #sec_2 .box1 { margin: 40px 0; }
	#product #sec_2 .box1 .bg { width: 280px; }
	#product #sec_2 .box1 li .txt { display: none; }
	#product #sec_2 .box1 li:nth-child(1) { margin-left: 130px; }
	#product #sec_2 .box1 li:nth-child(2) { margin-left: -165px; }
	#product #sec_2 .box1 li:nth-child(3) { margin-left: 130px; }
	#product #sec_2 .box1 li:nth-child(4) { margin-left: 130px; }
	#product #sec_2 .box1 li:nth-child(5) { margin-left: -165px; }
	#product #sec_2 .list1 li { display: block; margin-bottom: 20px; } 
	#product #sec_2 .list1 li .imgbox { display: flex; width: 100%; height: calc(100px + 40vw); }
	#product #sec_2 .list1 li .txtbox { flex: none; margin-right: 0; width: 88%; }
	#product #sec_2 .list1 li .txtbox .copy.s2 .num { width: 32px; height: 32px; font-size: 1.8rem; margin-right: 6px; }
}
@media screen and (max-width: 500px) { 
	#product #sec_2 .box1 { margin: 30px 0; }
	#product #sec_2 .box1 .bg { width: 250px; }
	#product #sec_2 .box1 li:nth-child(1) { margin-left: 115px; top: 46px; }
	#product #sec_2 .box1 li:nth-child(2) { margin-left: -148px; top: 62px; }
	#product #sec_2 .box1 li:nth-child(3) { margin-left: 115px; top: 102px; }
	#product #sec_2 .box1 li:nth-child(4) { margin-left: 115px; top: 217px; }
	#product #sec_2 .box1 li:nth-child(5) { margin-left: -148px; top: 278px; }
	#product #sec_2 .list1 li .txtbox { padding: 8%; }
}

/* #sec_3 */
#product #sec_3 .vegibox { text-align: center; background: #f7f7f7; padding: 40px 6%; margin-bottom: 20px; }
#product #sec_3 .vegibox .vegilist li { margin: 0 0.5em; display: inline-block; }
#product #sec_3 .vegibox .txt2 { font-weight: bold; margin-bottom: 10px; text-align: center; }
@media screen and (max-width: 767px) { 
	#product #sec_3 .vegibox { padding: 30px 6%; }
}
@media screen and (max-width: 500px) { 
	#product #sec_3 .vegibox { padding: 8%; }
	
}

/* #sec_4 */
#product #sec_4 .imgbox { display: flex; justify-content: center; align-items: center; margin-bottom: 60px; }
#product #sec_4 .imgbox .img1 { width: 222px; text-align: center;}
#product #sec_4 .imgbox .img1:first-child { margin-right: 60px; }
#product #sec_4 .tablelist table:first-child { margin-bottom: 20px; }
@media screen and (max-width: 767px) { 
	#product #sec_4 .imgbox { padding: 0 12%; margin-bottom: 40px; }
	#product #sec_4 .imgbox .img1:first-child { margin-right: 5vw; }
}










/*//////////////////


#charm


//////////////////*/

/* sec_1 */
#charm #sec_1 .charmlist { margin-top: 100px; }
#charm #sec_1 .charmlist li { display: flex; justify-content: space-between; align-items: center; margin-bottom: 60px; }
#charm #sec_1 .charmlist li:last-child { margin-bottom: 0; }
#charm #sec_1 .charmlist li .imgbox{ width: 680px; }
#charm #sec_1 .charmlist li .imgbox img { object-fit: cover; font-family: 'object-fit: cover;'; display: block; width: 100%; height: 100%; height: 420px; }
#charm #sec_1 .charmlist li:nth-child(even) { flex-direction: row-reverse; }
#charm #sec_1 .charmlist li .txtbox{ width: calc(100% - 750px); }
@media screen and (max-width: 1380px) {
	#charm #sec_1 .charmlist li .imgbox{ width: 50%; }
	#charm #sec_1 .charmlist li .txtbox{ width: calc(50% - 60px); }
}
@media screen and (max-width: 1100px) { 
	#charm #sec_1 .charmlist li { align-items: normal; height: auto; } 
	#charm #sec_1 .charmlist li .imgbox { display: flex; height: auto; width: 50%; }
	#charm #sec_1 .charmlist li .imgbox img { height: 100%; }
	#charm #sec_1 .charmlist li .txtbox{ width: calc(50% - 60px); padding: 40px 0; }
	#charm #sec_1 .charmlist li:nth-child(2) .imgbox { flex-direction: column; }
	#charm #sec_1 .charmlist li:nth-child(2) .imgbox img { height: 50%; }
	#charm #sec_1 .charmlist li:first-child .imgbox img { object-position: 0% 50%;}
}
@media screen and (max-width: 767px) { 
	#charm #sec_1 .charmlist { margin-top: 60px; }
	#charm #sec_1 .charmlist li { display: block; } 
	#charm #sec_1 .charmlist li .imgbox { display: flex; height: auto; width: 100%; height: 100%; margin-bottom: 40px; }
	#charm #sec_1 .charmlist li .txtbox { flex: none; margin-bottom:40px; width: 100%;padding: 0; }
	#charm #sec_1 .charmlist li:nth-child(2) .imgbox img { height: calc(100px + 20vw); }
}










/*//////////////////


#privacy


//////////////////*/

/* sec_1 */
#charm #sec_1 .charmlist { margin-top: 100px; }










/*//////////////////


#news


//////////////////*/

#news #mainv img { object-position: 20% 50%;}

#news #sec_1 .box { display:flex; justify-content:space-between; }
#news #sec_1 .box .mainbox { margin-right:60px; flex: 1; }
#news #sec_1 .box .mainbox .pagenav.pager { display: none; }
#news #sec_1 .box .sidebox { width: 280px; }
#news #sec_1 .box .sidebox .title { font-size: 2.4rem; font-family: 'Montserrat', sans-serif; letter-spacing: 0.02em; border-bottom: 1px solid #333; margin-bottom: 20px; }
#news #sec_1 .box .sidebox li a:hover { text-decoration: underline; }
@media screen and (max-width: 1100px){
	#news #sec_1 .box { display: block; }
	#news #sec_1 .box .mainbox { margin-bottom:100px; margin-right:0; flex: none; width: 100%; }
	#news #sec_1 .box .mainbox .pagenav.pager { display: block; margin-top: 80px; text-align:center; }
	#news #sec_1 .box .sidebox { width: 100%; }
	#news #sec_1 .box .sidebox .title { font-size: 2.0rem; }
	#news #sec_2 { display: none; }
}


/*//////////////////


#news.under


//////////////////*/
#news.under #sec_1 .box .datecatebox { margin-bottom: 40px; }
#news.under #sec_1 .box .mainbox .pagenav.pager { display: block; text-align: center; margin-top: 100px; }
#news.under #sec_1 .box .mainbox .pagenav.pager .btn.back { min-width: 240px; width: 240px; margin: 0 auto; }
@media screen and (max-width: 767px){
	#news.under #sec_1 .box .mainbox .pagenav.pager .btn.back { margin-top: 20px; }
}









/*//////////////////


#contact.index


//////////////////*/

/* #sec_1 */
#contact.index #sec_form .btn.base.submit { height: 100px; border-radius: 50px; font-size: 2.2rem; }
@media screen and (max-width: 767px){
	#contact.index #sec_form .btn.base.submit { height: 80px; border-radius: 40px; font-size: 1.8rem; }
}

/* #sec_2 */
#contact.index #sec_2 { text-align: center; }
#contact.index #sec_2 .tel a { font-size: 3rem; line-height: 1; }
#contact.index #sec_2 .tel a .icon { width: 26px; margin-right: 5px; }
#contact.index #sec_2 .tel .txt { font-size: 1.6rem;}
@media screen and (max-width: 767px){
	#contact.index #sec_2 .tel a { font-size: 2.4rem; }
	#contact.index #sec_2 .tel a .icon { width: 18px;}
	#contact.index #sec_2 .tel .txt { font-size: 1.4rem;}
}

/* #sec_3 */
#contact.index #sec_3 .inbox { background: #f7f7f7; padding: 40px 6%; display: flex; justify-content: space-between; align-items: center; }
#contact.index #sec_3 .txtbox { flex: 1; margin-right: 40px; }
#contact.index #sec_3 .bnrbox { display: flex; align-items: center; }
#contact.index #sec_3 .bnrbox img { height: 60px; transition: 0.6s;}
#contact.index #sec_3 .bnrbox img:hover { opacity: 0.7; }
#contact.index #sec_3 .bnrbox img:last-child { margin-left: 10px; }
@media screen and (max-width: 1100px){
	#contact.index #sec_3 .bnrbox { display: block; }
	#contact.index #sec_3 .bnrbox img:last-child { margin-left: 0; margin-top: 10px; display: block; }
}
@media screen and (max-width: 767px){
	#contact.index #sec_3 .inbox { padding: 8%; display: block; }
	#contact.index #sec_3 .txtbox { flex: none; margin-right: 0; }
	
	#contact.index #sec_3 .bnrbox { display: flex; margin-top: 20px; text-align: center; flex-wrap: wrap; }
	#contact.index #sec_3 .bnrbox img { height: 40px; }
	#contact.index #sec_3 .bnrbox img:last-child { margin: 5px 5px 0; display: inline-block; }
}



/*//////////////////


#contact.thanks


//////////////////*/

/* #sec_2 */
#contact.thanks #sec_2 { text-align: center; }
#contact.thanks #sec_2 .tel a { font-size: 3rem; line-height: 1; }
#contact.thanks #sec_2 .tel a .icon { width: 26px; margin-right: 5px; }
#contact.thanks #sec_2 .tel .txt { font-size: 1.6rem;}
@media screen and (max-width: 767px){
	#contact.thanks #sec_2 .tel a { font-size: 2.4rem; }
	#contact.thanks #sec_2 .tel a .icon { width: 18px;}
	#contact.thanks #sec_2 .tel .txt { font-size: 1.4rem;}
}