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



/*==================================
	common
==================================*/
html { font-size: 62.5%;/* 10px */}
body { position: relative; color: #3e3a39; letter-spacing: 0.05em; font-family: 'Noto Sans JP', sans-serif; font-weight: 400; font-size:1.5rem;}
body a { text-decoration: none; color: #8db439; outline: none !important;}
a img { transition:0.8s;}
a:hover { opacity: 1;}
li { outline: none !important;}


.fade {opacity : 0;transform: translateY(40px);transition: 1s;}
.inner { margin: 0 auto;}
/* hover action */
a:hover .imgBox img { transform: scale(1.05); opacity: 0.5 !important;}
a .overTxt { position:relative; display:inline-block; transition:transform 0.5s, background-position 0.5s ease; background:linear-gradient(to right, #8db439, #8db439 50%, #231815 50%); background-clip:text; -webkit-background-clip:text; -webkit-text-fill-color:transparent; background-size:200% 100%; background-position:100%; text-decoration:none; overflow:hidden}
a .overTxtBrn { position:relative; display:inline-block; transition:transform 0.5s, background-position 0.5s ease; background:linear-gradient(to right, #8db439, #8db439 50%, #72503c 50%); background-clip:text; -webkit-background-clip:text; -webkit-text-fill-color:transparent; background-size:200% 100%; background-position:100%; text-decoration:none; overflow:hidden}
a .overBox { transition:0.8s;}
a:hover .overBox { background: #8db439; color: #fff;}
a:hover .overTxt,
a:hover .overTxtBrn { background-position: 0 100%;}
/* imgBox */
.imgBox { background: #8db439; overflow: hidden;}

/* Responsive 768 */
@media screen and (min-width: 768px) {
body { min-width: 1220px;}
a[href^="tel:"] { pointer-events: none;}
.inner { width: 1220px;}
.outer { width: 1660px;}
.spOnly { display: none;}
}
/* Responsive 767 */
@media screen and (max-width: 767px) {
body { width: 100%;}
img { width: 100%; height: auto;}
.inner { width: 90%;}
.outer { width: 90%;}
.pcOnly { display: none;}
}

/* bg */
.bg_pattern01 { background: url("/lib/img/bg_pattern01.png") center top repeat;}
/* Responsive 767 */
@media screen and (max-width: 767px) {
.bg_pattern01 { background-size: 60% auto;}
}

/* img-fadein */
.img-fadein img { opacity: 0;}
.img-fadein.lazyloaded img.lazyloaded { opacity: 1;}

/* font */
.txt_c { text-align: center;}
.txt_l { text-align: left;}
.txt_r { text-align: right;}
 .bold { font-weight: 700;}
.fc_brn { color: #72503c;}
.fc_lgy { color: #e9e9e9;}
.box_read { overflow: hidden; text-overflow: ellipsis; white-space: nowrap;}/* 1行越えたら点 */

/* btn */
.btn_brn { display: inline-block;}
.btn_brn a { background: #72503c; color:#fff; display: block;}
.swiper-containerArea .swiper-button .swiper-button-prev:focus,
.swiper-containerArea .swiper-button .swiper-button-next:focus {outline: none;}

/* title */
.secTit { text-align: center;}
.secTit .secTit_jp { font-weight: 700; color: #72503c; margin-bottom: 2px;}
.secTit .secTit_en { font-weight: 500; color: #e9e9e9; font-size: 10px;}
/* Responsive 768 */
@media screen and (min-width: 768px) {
.secTit { margin-bottom: 50px;}
.secTit .secTit_jp { font-size: 34px;}
.secTit .secTit_en {}
}
/* Responsive 767 */
@media screen and (max-width: 767px) {
.secTit { margin-bottom: 25px;}
.secTit .secTit_jp { font-size: 20px;}
.secTit .secTit_en {}
}

/* arrow */
.arr { position: relative; padding-right: 15px;  text-decoration: none;}
.arr:after { content: ""; display: block; width: 8px; height: 8px; border-top: 1px solid #fff; border-left: 1px solid #fff;}
.arr-big:after { width: 12px; height: 12px;}
.arr-right:after { transform: rotate(135deg); position: absolute; right: 50%; top: 50%; margin-top: -4px; margin-right: -2px;}
.arr-left:after { transform: rotate(315deg); position: absolute; right: 50%; top: 50%; margin-top: -4px; margin-right: -6px;}
.arr-top:after { transform: rotate(45deg); position: absolute; right: 50%; top: 50%; margin-top: -2px; margin-right: -6px;}
.arr-bottom:after { transform: rotate(225deg); position: absolute; right: 50%; top: 50%; margin-top: -6px; margin-right: -6px;}

/* tag */
.tagcol01 { background: #72503c;}
.tagcol02 { background: #f09056;}
.tagcol03 { background: #d5bf8f;}

/* imgBoxArea */
ul.imgBoxArea { display: flex; flex-wrap: wrap;}
ul.imgBoxArea .imgBox.imgBox240 { margin-bottom: 10px; width: 240px; height: 170px;}
ul.imgBoxArea .imgBox.imgBox240 img { object-fit: cover; width: 240px; height: 170px;}
ul.imgBoxArea .imgBox.imgBox370 { margin-bottom: 10px; width: 370px; height: 230px;}
ul.imgBoxArea .imgBox.imgBox370 img { object-fit: cover; width: 370px; height: 230px;}
/* Responsive 767 */
@media screen and (max-width: 767px) {
ul.imgBoxArea .imgBox.imgBox240,
ul.imgBoxArea .imgBox.imgBox370 { width: 100%;}
ul.imgBoxArea .imgBox.imgBox240 img,
ul.imgBoxArea .imgBox.imgBox370 img{ width: 100%;}
}


/* title */
.swiper-pagination-bullet { border-radius: 0; background: #e1e1e1; opacity: 1;}
.swiper-pagination-bullet.swiper-pagination-bullet-active { background: #8db439;}
/* Responsive 768 */
@media screen and (min-width: 768px) {
.swiper-pagination-bullet {  width: 55px; height: 2px;}
}
/* Responsive 767 */
@media screen and (max-width: 767px) {
.swiper-pagination-bullet { width: 25px; height: 4px;}
}






/*==================================
	parts
==================================*/
/* news_list */
dl.news_list {}
dl.news_list dt { display: flex; justify-content: space-between; color:#3e3a39; cursor: pointer;}
dl.news_list dt:hover { opacity: 0.8;}
dl.news_list dt .date { border-bottom: solid 1px #c5c5c5;}
dl.news_list dt .tit { border-bottom: solid 1px #e9e9e9;}
dl.news_list dt .tit .overTxt { position:relative; display:inline-block; transition:transform 0.5s, background-position 0.5s ease; background:linear-gradient(to right, #8db439, #8db439 50%, #231815 50%); background-clip:text; -webkit-background-clip:text; -webkit-text-fill-color:transparent; background-size:200% 100%; background-position:100%; text-decoration:none; overflow:hidden}
dl.news_list dt .tit:hover .overTxt { background-position: 0 100%;}
dl.news_list dt .tit.arr:after { border-top: 1px solid #999999; border-left: 1px solid #999999; right: 5px;}
dl.news_list dd { display: none; color: #666666; line-height: 2; border-bottom: solid 1px #e9e9e9;}
dl.news_list dd a { color: #72503c; text-decoration: underline;}
dl.news_list dt.open .tit.arr.arr-right:after { transform: rotate(225deg);}
dl.news_list dt.open .tit .overTxt { -webkit-text-fill-color: #8db439; background: none;}
/* Responsive 768 */
@media screen and (min-width: 768px) {
dl.news_list { width: 1000px; margin: 0 auto;}
dl.news_list dt {}
dl.news_list dt .date { font-size: 13px; width: 16%; padding: 20px 0;}
dl.news_list dt .tit { width: 81%; padding: 20px 20px 20px 0;}
dl.news_list dd { padding: 20px 20px 20px 190px;}
}
/* Responsive 767 */
@media screen and (max-width: 767px) {
dl.news_list { width: 90%; margin: 0 auto;}
dl.news_list dt {}
dl.news_list dt .date { font-size: 8px; width: 17%; padding: 15px 0;}
dl.news_list dt .tit { font-size: 12px; width: 78%; padding: 15px 15px 15px 0;}
dl.news_list dd { font-size: 12px; padding: 15px 15px 15px 15px;}
}


/* pickup_list */
ul.pickup_list { display: flex; flex-wrap: wrap;}
/* Responsive 768 */
@media screen and (min-width: 768px) {
ul.pickup_list { justify-content: center;}
ul.pickup_list li { width: 370px; margin-left: 55px;}
ul.pickup_list li:nth-child(3n+1) { margin-left: 0;}
ul.pickup_list li:nth-child(n+4) { margin-top: 50px;}
ul.pickup_list li .en { font-size: 12px; padding-top: 20px;}
ul.pickup_list li .tit { font-size: 20px; padding-top: 8px;}
}
/* Responsive 767 */
@media screen and (max-width: 767px) {
ul.pickup_list li { width: 47%;}
ul.pickup_list li:nth-child(2n+1) { margin-right: 6%;}
ul.pickup_list li:nth-child(n+3) { margin-top: 30px;}
ul.pickup_list li .en { font-size: 8px; padding-top: 10px;}
ul.pickup_list li .tit { font-size: 12px; padding-top: 5px;}
}

/* productmenuBox */
.productmenuBox .inner { width: 980px; padding: 35px 0; display: flex; justify-content: space-between;}
.productmenuBox .inner .box {}
.productmenuBox .inner .box .img {}
.productmenuBox .inner .box .img img {}
.productmenuBox .inner .box .tit { text-align: center; color: #72503c; font-weight: 700; margin: 30px 0;}

.productmenuBox .inner .box a .tit .overTxt { position:relative; display:inline-block; transition:transform 0.5s, background-position 0.5s ease; background:linear-gradient(to right, #8db439, #8db439 50%, #72503c 50%); background-clip:text; -webkit-background-clip:text; -webkit-text-fill-color:transparent; background-size:200% 100%; background-position:100%; text-decoration:none; overflow:hidden}
.productmenuBox .inner .box a:hover .tit .overTxt { background-position: 0 100%;}


.productmenuBox .inner .box .productLink {}
.productmenuBox .inner .box .productLink li { border-bottom: solid 1px #e9e9e9;}
.productmenuBox .inner .box .productLink li a { display: block; padding: 20px 20px 20px 50px;}
.productmenuBox .inner .box .productLink li a.line2 { padding: 10px 20px 10px 50px;}
.productmenuBox .inner .box.box01 .productLink li:nth-child(1) a { background: url("/lib/img/hd_productmenu_sw_item01.png") left center no-repeat;}
.productmenuBox .inner .box.box01 .productLink li:nth-child(2) a { background: url("/lib/img/hd_productmenu_sw_item02.png") left center no-repeat;}
.productmenuBox .inner .box.box01 .productLink li:nth-child(3) a { background: url("/lib/img/hd_productmenu_sw_item03.png") left center no-repeat;}
.productmenuBox .inner .box.box02 .productLink li:nth-child(1) a { background: url("/lib/img/hd_productmenu_rs_item01.png") left center no-repeat;}
.productmenuBox .inner .box.box02 .productLink li:nth-child(2) a { background: url("/lib/img/hd_productmenu_rs_item02.png") left center no-repeat;}
.productmenuBox .inner .box.box02 .productLink li:nth-child(3) a { background: url("/lib/img/hd_productmenu_rs_item03.png") left center no-repeat;}
.productmenuBox .inner .box.box02 .productLink li:nth-child(4) a { background: url("/lib/img/hd_productmenu_rs_item04.png") left center no-repeat;}
.productmenuBox .inner .box.box03 .productLink li:nth-child(1) a { background: url("/lib/img/hd_productmenu_mb_item01.png") left center no-repeat;}
.productmenuBox .inner .box.box03 .productLink li:nth-child(2) a { background: url("/lib/img/hd_productmenu_mb_item02.png") left center no-repeat;}










/*==================================
	header
==================================*/
.headerArea {}
header { background: #fff; width: 100%;}
header .hd_logoArea {}
header .hd_logoArea img { width: 100%;}
header .hd_logoArea .logoTxt {}
header .hd_logoArea .logo {}
header .hd_vmArea { position: absolute; right: 0; top: 0; z-index: 2000}
header .hd_vmArea .box { display: flex;}
header .hd_vmArea .box .boxbtn {}
header .hd_vmArea .box .boxbtn .atag { color: #fff; text-align: center; display: flex; align-items: flex-end; justify-content: center;position: relative;}
header .hd_vmArea .box .boxbtn .atag .num { display: none;}
header .hd_vmArea .box .boxbtn .atag .num { font-size: 10px; position: absolute; background: #f09056; right: 15px; top: 8px; border-radius: 20px; padding: 2px; min-width: 18px; min-height: 18px;}
header .hd_vmArea .box .boxbtn.mypage { background: #9dc14e;}
header .hd_vmArea .box .boxbtn.cart { background: #95bb43;}
header .hd_vmArea .box .boxbtn.menu { background: #8db439; position: relative;}
header .hd_vmArea .box .boxbtn.menu .menutxt { position: absolute; width: 100%; text-align: center; color: #fff;}
header .hd_hmArea {}
.headerArea header { position: relative; z-index: 1000;}
.headerArea.fixed header { position: fixed; top: 0; left: 0;}
/* Responsive 768 */
@media screen and (min-width: 768px) {
header { height: 185px; overflow: hidden; position: sticky; z-index: 1500;}
header .hd_logoArea { position: relative;}
header .hd_logoArea .logoTxt { width: 257px; position: absolute; left: 0; right: 0; top: 25px; margin: auto;}
header .hd_logoArea .logo { width: 92px; margin: 0 auto; padding-top: 55px;}
header .hd_vmArea {}
header .hd_vmArea .box .boxbtn.menu { width: 80px; height: 70px; font-size: 12px;}
header .hd_vmArea .box .boxbtn.menu .menutxt { bottom: 12px;}
header .hd_vmArea .box .boxbtn .atag { width: 80px; height: 70px; font-size: 12px; padding-bottom: 12px;}
header .hd_vmArea .box .boxbtn.mypage .atag { background: url("/lib/img/icon_mypage.svg") center 15px no-repeat; background-size: 24px auto;}
header .hd_vmArea .box .boxbtn.cart .atag { background: url("/lib/img/icon_cart.svg") center 15px no-repeat; background-size: 25px auto;}
header .hd_vmArea .txt { color: #8db439; font-size: 12.5px; text-align: center; margin: 10px 0;}
header .hd_hmArea {}
.headerArea.fixed header { height: 70px; overflow: hidden;}
.headerArea.fixed header .hd_logoArea .logoTxt { display: none;}
.headerArea.fixed header .hd_vmArea .txt { display: none;}
.headerArea.fixed header .hd_logoArea .logo { width: 68px;; margin: 0; padding-top: 15px; position: relative; z-index: 1;}
}
/* Responsive 767 */
@media screen and (max-width: 767px) {
header { min-height: 50px; box-shadow: 0px 0px 20px 0px rgba(0, 0, 0, 0.1);}
header .inner { width: 100%;}
header .hd_logoArea { display: flex; align-items: center; min-height: 50px; padding-left: 2.6%;}
header .hd_logoArea .logoTxt { max-width: 113.5px; width: 30.26%; display: flex;}
header .hd_logoArea .logoTxt img { width: auto; height: 7px;}
header .hd_logoArea .logo { max-width: 47.5px; width: 12.66%; margin-right: 2%;}
header .hd_logoArea .logo a { display: flex;}
header .hd_logoArea .logo img { width: auto; height: 28px;}
header .hd_vmArea {}
header .hd_vmArea .box { height: 50px;}
header .hd_vmArea .box .boxbtn {}
header .hd_vmArea .box .boxbtn.menu { height: 100%; min-height: 50px; font-size: 10px; min-width: 55px; padding-bottom: 2px;}
header .hd_vmArea .box .boxbtn.menu .menutxt { bottom: 2px;}
header .hd_vmArea .box .boxbtn .atag { height: 100%; font-size: 9px; min-width: 55px; padding-bottom: 2px; letter-spacing: -0.05em;}
header .hd_vmArea .box .boxbtn.mypage .atag { background: url("/lib/img/icon_mypage.svg") center 10px no-repeat; background-size: 20px auto;}
header .hd_vmArea .box .boxbtn.cart .atag { background: url("/lib/img/icon_cart.svg") center 10px no-repeat; background-size: 20px auto;}
header .hd_vmArea .box .boxbtn .atag .num { top: 3px; right: 3px;}
header .hd_vmArea .txt { display: none;}
header .hd_hmArea { display: none;}
.headerOverlay { display: none;}
.headerArea.fixed header {}
}

/* ---------------
    hd_vmArea
--------------- */
#nav-toggle { cursor: pointer; top: 0; right: 0; display: flex; justify-content: center; align-items: center; position: relative; z-index: 500;}
#nav-toggle > div { position: relative; width: 20px;}
#nav-toggle span { width: 100%; height: 1px; left: 0; display: block; background: #fff; position: absolute; -webkit-transition: top .5s ease, -webkit-transform .6s ease-in-out; transition: top .5s ease, -webkit-transform .6s ease-in-out; transition: transform .6s ease-in-out, top .5s ease; transition: transform .6s ease-in-out, top .5s ease, -webkit-transform .6s ease-in-out;}
#nav-toggle span:nth-child(1) { top: 1px;}
#nav-toggle span:nth-child(2) { top: 7px;}
#nav-toggle span:nth-child(3) { top: 14px;}
#nav-toggle:hover span:nth-child(1) { top: 4px;}
#nav-toggle:hover span:nth-child(3) { top: 10px;}
.openVM #nav-toggle {}
.openVM #nav-toggle span { background: #fff;}
.openVM #nav-toggle span:nth-child(1) { top: 5px; -webkit-transform: rotate(45deg); transform: rotate(45deg);}
.openVM #nav-toggle span:nth-child(2) { top: 5px; width: 0; left: 50%;}
.openVM #nav-toggle span:nth-child(3) { top: 5px; -webkit-transform: rotate(-45deg); transform: rotate(-45deg);}
#nav-toggle { z-index: 2000;}
#container { z-index: 1900;}
.fixed #gloval-nav { position: fixed;}
#gloval-nav { position: fixed; background: #8db439; color: #222222; top: 0; left: 0; right: 0; bottom: 0; z-index: 1990; display: -webkit-box; display: flex; visibility: hidden; -webkit-box-orient: vertical; -webkit-box-direction: normal; flex-direction: column; -webkit-box-pack: center; justify-content: center; -webkit-box-align: center; align-items: center; opacity: 0; -webkit-transition: opacity .6s ease, visibility .6s ease; transition: opacity .6s ease, visibility .6s ease;}
#gloval-nav nav { overflow: hidden;}
#gloval-nav a { display: block; color: #fff; text-decoration: none; -webkit-transition: color .6s ease; transition: color .6s ease;}
#gloval-nav a:hover { color: #666;}
#gloval-nav ul { list-style: none; display: flex; flex-wrap: wrap; justify-content: space-between;}
#gloval-nav ul li { width: 48%; opacity: 0; -webkit-transform: translateX(200px); transform: translateX(200px); -webkit-transition: opacity .2s ease, -webkit-transform .6s ease; transition: opacity .2s ease, -webkit-transform .6s ease; transition: transform .6s ease, opacity .2s ease; transition: transform .6s ease, opacity .2s ease, -webkit-transform .6s ease;}
#gloval-nav ul li:nth-child(1),
#gloval-nav ul li:nth-child(3),
#gloval-nav ul li:nth-child(5),
#gloval-nav ul li:nth-child(7),
#gloval-nav ul li:nth-child(9),
#gloval-nav ul li:nth-child(11) { -webkit-transition-delay: .1s; transition-delay: .1s;}
#gloval-nav ul li:nth-child(2),
#gloval-nav ul li:nth-child(4),
#gloval-nav ul li:nth-child(6),
#gloval-nav ul li:nth-child(8),
#gloval-nav ul li:nth-child(10),
#gloval-nav ul li:nth-child(12) { -webkit-transition-delay: .3s; transition-delay: .3s;}
#gloval-nav ul li.tel { width: 90%; -webkit-transition-delay: .6s; transition-delay: .6s;}
#gloval-nav ul li.mail { width: 90%; -webkit-transition-delay: .8s; transition-delay: .8s;}
#gloval-nav ul li a.arr-right:after { right: 10%;}
#gloval-nav ul li a .overTxt { position:relative; display:inline-block; transition:transform 0.5s, background-position 0.5s ease; background:linear-gradient(to right, #cbe396, #cbe396 50%, #fff 50%); background-clip:text; -webkit-background-clip:text; -webkit-text-fill-color:transparent; background-size:200% 100%; background-position:100%; text-decoration:none; overflow:hidden}
#gloval-nav ul li a:hover .overTxt { background-position: 0 100%;}

/* open */
.openVM #gloval-nav { visibility: visible; opacity: 1;}
.openVM #gloval-nav li { opacity: 1; -webkit-transform: translateX(0); transform: translateX(0); -webkit-transition: opacity .9s ease, -webkit-transform 1s ease; transition: opacity .9s ease, -webkit-transform 1s ease; transition: transform 1s ease, opacity .9s ease; transition: transform 1s ease, opacity .9s ease, -webkit-transform 1s ease;}
/* Responsive 768 */
@media screen and (min-width: 768px) {
#nav-toggle { min-height: 70px; min-width: 80px; right: 0;}
#nav-toggle > div { top: -13px;}
#gloval-nav { width: 590px; height: 385px; position: absolute; left: auto; right: 0; top: 70px;}
#gloval-nav a { padding: 15px 0;}
#gloval-nav nav { max-width: 470px;}
#gloval-nav ul li.tel,
#gloval-nav ul li.mail { display: none;}
}
/* Responsive 767 */
@media screen and (max-width: 767px) {
#nav-toggle { min-height: 50px; min-width: 55px;}
#nav-toggle > div { width: 20px; top: -13px;}
#gloval-nav { top: 50px; font-size: 9px; letter-spacing: 0.05em;}
#gloval-nav a { padding: 10px 0;}
#gloval-nav nav { width: 84%;}
/* open */
.openVM { overflow: hidden;}
.openVM #gloval-nav { position: fixed;}
}
/* contact */
#gloval-nav ul li.hd_contact { letter-spacing: 0; background: #fff; box-shadow: 8.604px 12.287px 30px 0px rgba(0, 0, 0, 0.05);}
#gloval-nav ul li.hd_contact a { height: 100%; display: flex; flex-wrap: wrap; align-items: center; justify-content: center;}
#gloval-nav ul li.hd_contact a .tit { color: #231815; font-weight: 700;}
#gloval-nav ul li.hd_contact a .img { width: 100%;}
#gloval-nav ul li.hd_contact a:hover img { opacity: 1;}
#gloval-nav ul li.hd_contact a .txt { color: #3e3a39; line-height: 1.8;}
#gloval-nav ul li.hd_contact a .arr { width: 50px; height: 50px; position: absolute; right: 0; bottom: 0;}
#gloval-nav ul li.hd_contact.tel .arr { background: #72503c;}
#gloval-nav ul li.hd_contact.tel .img { width: 370px;}
#gloval-nav ul li.hd_contact.tel .img img { width: 100%;}
#gloval-nav ul li.hd_contact.mail .arr { background: #a5c65d;}
/* Responsive 767 */
@media screen and (max-width: 767px) {
#gloval-nav ul li.hd_contact{ width: 100%; max-width: 530px; margin: 0 auto;}
#gloval-nav ul li.hd_contact { margin-top: 15px;}
#gloval-nav ul li.hd_contact a { padding: 10px 0 15px 0; text-align: center;}
#gloval-nav ul li.hd_contact.tel a .overTxt { position:relative; display:inline-block; transition:transform 0.5s, background-position 0.5s ease; background:linear-gradient(to right, #72503c, #72503c 50%, #231815 50%); background-clip:text; -webkit-background-clip:text; -webkit-text-fill-color:transparent; background-size:200% 100%; background-position:100%; text-decoration:none; overflow:hidden;}
#gloval-nav ul li.hd_contact.mail a:hover .overTxt{ background-position: 0 100%;}
#gloval-nav ul li.hd_contact.mail a .overTxt { position:relative; display:inline-block; transition:transform 0.5s, background-position 0.5s ease; background:linear-gradient(to right, #8db439, #8db439 50%, #231815 50%); background-clip:text; -webkit-background-clip:text; -webkit-text-fill-color:transparent; background-size:200% 100%; background-position:100%; text-decoration:none; overflow:hidden;}
#gloval-nav ul li.hd_contact.tel a:hover .overTxt{ background-position: 0 100%;}
#gloval-nav ul li.hd_contact a .tit { font-size: 12px;}
#gloval-nav ul li.hd_contact a .img { margin: 6px auto 4px auto;}
#gloval-nav ul li.hd_contact a .txt { font-size: 10px;}
#gloval-nav ul li.hd_contact a .arr { width: 40px; height: 40px;}
#gloval-nav ul li.hd_contact.tel {}
#gloval-nav ul li.hd_contact.tel .img { max-width: 80%;}
#gloval-nav ul li.hd_contact.tel .img img { max-width: 220px;}
#gloval-nav ul li.hd_contact.mail .img img { width: 35px;}
}

/* ---------------
    hd_hmArea
--------------- */
.hd_hmArea { position: absolute; left: 0; right: 0;}
.hd_hmArea .list { display: flex; justify-content: center; margin-top: 21px;}
.hd_hmArea .list li { margin: 0 20px; line-height: 22px;}
.hd_hmArea .list li a { padding: 10px 10px 20px 10px;}

.hd_hmArea .list li a { position: relative; display: inline-block; color: #231815;}
.hd_hmArea .list li a:after { position: absolute; bottom: 0; left: 0; content: ""; width: 100%; height: 3px; background: #8db439; transform: scale(0, 1); transform-origin: left top; transition: transform .5s;}
.hd_hmArea .list li a:hover:after { transform: scale(1, 1);}
.hd_hmArea .list li.on a:after { transform: scale(1, 1);}
.hd_hmArea .list li a .arr:after { border-top: 1px solid #999999; border-left: 1px solid #999999; right: 0;}

.hd_hmArea .productmenu { cursor: pointer;}
.hd_hmArea .productmenuBox {visibility: collapse; opacity: 0; overflow: hidden; background: #f9f9f9; transition: opacity .6s ease, visibility .6s ease;}
.hd_hmArea .productmenuBox .inner .box .productLink li a.arr:after { border-top: 1px solid #999999; border-left: 1px solid #999999; right: 0;}
.headerOverlay { height: 0;  visibility: collapse; position: absolute; z-index: 1; opacity: 0; background-color: rgba(0,0,0,.5); top: 0; bottom: 0; left: 0; right: 0; height: 100%; width: 100%; transition: opacity .6s ease, visibility .6s ease;}
/* open */
.openHM header { height: auto; overflow:initial; min-height: 185px;}
.openHM .headerArea.fixed header { height: auto; overflow:initial; min-height: 70px;}
.openHM .hd_hmArea .productmenu .overTxt{  background-position: 0 100%;}
.openHM .hd_hmArea .productmenu a:after { transform: scale(1, 1);}
.openHM .hd_hmArea .productmenuBox { height: auto; visibility: visible; opacity: 1;}

.openHM .headerOverlay { position: fixed; visibility: visible; opacity: 1; z-index: 900;}
.openHM .headerArea.fixed header .headerOverlay { height: auto; overflow:initial; min-height: 540px;}
/* fixed */
.fixed .hd_hmArea { top: 5px;}
.fixed .hd_hmArea .list { margin-top: 13px;}
@media screen and (max-width: 1220px) {
.fixed .hd_hmArea .list { margin-right: 50px;}
.fixed .hd_hmArea .list li { margin: 0 10px;}
.headerArea.fixed header .hd_vmArea .box .boxbtn .atag { font-size: 10px; width: 70px;}
.headerArea.fixed header .hd_vmArea .box .boxbtn.menu { width: 70px; min-width: 70px;}
.headerArea.fixed header .hd_vmArea #nav-toggle { width: 70px; min-width: 70px;}
.headerArea.fixed header .hd_vmArea .box .boxbtn.menu .menutxt { font-size: 10px;}
}
@media screen and (max-width: 1100px) {
.fixed .hd_hmArea .productmenuBox .inner { width: 880px;}
.fixed .hd_hmArea .list { margin-right: 110px;}
.fixed .hd_hmArea .list li { margin: 0 5px; letter-spacing: -0.02em; font-size: 14px;}
}
@media screen and (max-width: 900px) {
.fixed .hd_hmArea .productmenuBox .inner { width: 750px;}
.fixed .hd_hmArea .productmenuBox .inner .box .productLink li a { font-size: 13px;}
.fixed .hd_hmArea .productmenuBox .inner .box .img img { width: 220px; height: 124px; object-fit: cover;}
.headerArea.fixed header .hd_vmArea .box .boxbtn .atag { font-size: 9px; width: 55px;}
.headerArea.fixed header .hd_vmArea .box .boxbtn.menu { width: 55px; min-width: 55px;}
.headerArea.fixed header .hd_vmArea #nav-toggle { width: 55px; min-width: 55px;}
.headerArea.fixed header .hd_vmArea .box .boxbtn.menu .menutxt { font-size: 9px;}
.fixed .hd_hmArea .list li { font-size: 13px;}
}
/*==================================
	footer
==================================*/
footer { background: #fafafa; text-align: center; padding: 0 0 100px 0; position: relative;}
@keyframes waves_w_move{0%{background-position:0 0;transform:translate(0,10px)}50%{background-position:300px 0;transform:translate(0,0)}100%{background-position:600px 0;transform:translate(0,10px)}}
footer .ft_waves_area { width: 100%; overflow: hidden; position: absolute; top: 0; background: #fff; height: 6rem;}
footer .ft_waves_area .ft_waves {width: 100%; height: 100%; background: url("/lib/img/ft_waves.png") repeat-x; background-size: auto; background-size: contain; animation: waves_w_move 5s linear infinite; transform-origin: 0% 0%;}
footer .ft_contact { position: relative; top: -40px;}
footer .ft_contact li { background: #fff; box-shadow: 8.604px 12.287px 30px 0px rgba(0, 0, 0, 0.05);}
footer .ft_contact li a { height: 100%; display: flex; flex-wrap: wrap; align-items: center; justify-content: center;}
footer .ft_contact li a .tit { color: #231815; font-weight: 700;}
footer .ft_contact li a .img { width: 100%;}
footer .ft_contact li a:hover img { opacity: 1;}
footer .ft_contact li a .txt { color: #3e3a39; line-height: 1.8;}
footer .ft_contact li a .arr { width: 50px; height: 50px; position: absolute; right: 0; bottom: 0;}
footer .ft_contact .tel .arr { background: #72503c;}
footer .ft_contact .tel .img { width: 379px;}
footer .ft_contact .tel .img img { width: 100%;}
footer .ft_contact .mail .arr { background: #a5c65d;}


footer .ft_nav .tit a .overTxt { position:relative; display:inline-block; transition:transform 0.5s, background-position 0.5s ease; background:linear-gradient(to right, #8db439, #8db439 50%, #72503c 50%); background-clip:text; -webkit-background-clip:text; -webkit-text-fill-color:transparent; background-size:200% 100%; background-position:100%; text-decoration:none; overflow:hidden}
footer .ft_nav .tit a:hover .overTxt { background-position: 0 100%;}

footer .ft_photo {}
footer .ft_photo li {}
footer copy { font-size: 12px;}
/* Responsive 768 */
@media screen and (min-width: 768px) {
footer .ft_waves_area {}
footer .ft_waves_area .ft_waves {}
footer .ft_contact { display: flex; justify-content: space-between; margin-bottom: 60px;}
footer .ft_contact li { width: 580px; height: 220px;}
footer .ft_contact li a { padding: 20px 0;}
footer .ft_contact li a .tit { font-size: 18px;}
footer .ft_contact li a .txt { font-size: 14px;}
footer .ft_contact .tel .arr { display: none;}
footer .ft_nav { display: flex; margin-bottom: 60px; text-align: left;}
footer .ft_nav .tit { font-size: 16px; font-weight: 700; color: #72503c; margin-bottom: 50px;}
footer .ft_nav .list { display: flex; flex-wrap: wrap; justify-content: center; flex-direction: column; max-height: 190px;}
footer .ft_nav .list li { width: 255px; margin: 10px 0;}
footer .ft_nav .ft_nav_product { width: 765px;}
footer .ft_nav .ft_nav_product li {}
footer .ft_nav .ft_nav_product li.spacer1 { min-height: 25px;}
footer .ft_nav .ft_nav_product li.spacer2 { min-height: 48px;}
footer .ft_nav .ft_nav_service { width: 455px;}
footer .ft_nav .ft_nav_service li { width: 200px;}
footer .ft_nav .ft_nav_service .list { max-height: 175px;}
footer .ft_photo { margin-bottom: 80px;}
}
/* Responsive 767 */
@media screen and (max-width: 767px) {
footer .ft_waves_area {}
footer .ft_waves_area .ft_waves {}
footer .inner { width: 100%;}
footer .ft_contact { width: 77.33%; max-width: 560px; margin: 0 auto 40px auto;}
footer .ft_contact li { position: relative;}
footer .ft_contact li a { padding: 15px 0 20px 0;}
footer .ft_contact .tel a .overTxt { position:relative; display:inline-block; transition:transform 0.5s, background-position 0.5s ease; background:linear-gradient(to right, #72503c, #72503c 50%, #231815 50%); background-clip:text; -webkit-background-clip:text; -webkit-text-fill-color:transparent; background-size:200% 100%; background-position:100%; text-decoration:none; overflow:hidden;}
footer .ft_contact .tel a:hover .overTxt{ background-position: 0 100%;}
footer .ft_contact li a .tit { font-size: 12px;}
footer .ft_contact li a .img { margin: 8px auto;}
footer .ft_contact li a .txt { font-size: 10px;}
footer .ft_contact li a .arr { width: 40px; height: 40px;}
footer .ft_contact .tel {}
footer .ft_contact .tel .img { max-width: 80%;}
footer .ft_contact .mail { margin-top: 25px;}
footer .ft_contact .mail .img img { width: 48px;}
footer .ft_nav { display: none;}
footer .ft_photo { margin-left: 5%; margin-bottom: 30px;}
}

