@charset "utf-8";
html {
  visibility: hidden;
}
html.wf-active, html.wfno-load {
    visibility: visible;
}
body{
    font-family: "Zen Old Mincho", serif;
    color:#333;
    background-color:#fff;
}
.red{
    color:#d2171a;
}
.tea{
    color:#bfbcb1;
}
.bg_subcolor{
    background-color:#F8F8F8;
}
.gothic {
    font-family: "yu-gothic-pr6n", sans-serif;
    font-weight: 400;
    font-style: normal;
}
img{
    display: block;
    width:100%;
    height:auto;
    object-fit: cover;
}
a.anchor{
    display: block;
    position: relative;
    top: -80px;
/*    top: -100px;*/
    visibility: hidden;
}
.anime_ot{
    opacity: 0.7;
    transition: .3s;
}
.page-top {
    position: fixed;
    right: 2vw;
    bottom: 5vh;
    z-index: 99;
    cursor: pointer;
    display: flex;
    flex-flow: column;
    justify-content: center;
    align-items: center;
    height: 50px;
    text-align: center;
    font-size:14px;
    color: #d2171a;
}
.page-top img{
    width:auto;
    margin:auto 10px 10px 0;
    animation:up 3s infinite;
}
@keyframes up{
    0%, 100%{
        transform:translateY(0);
    }
    50%{
        transform:translateY(10px);
    }
}
.pc{
    display: block;
}
.sp{
    display: none;
}
/*common*/
p, section.philosophy ul ul li{
    line-height: 2em;
    font-family: "yu-gothic-pr6n", sans-serif;
}
img.milk{
    position: absolute;
    bottom:-2px;
    left:0;
    z-index: 2;
}
img.milk.lower{
    z-index: -1;
}
img.milk.lower0{
    z-index: 0;
}
img.catch{
    width:75vw;
    max-width:1600px;
    height:400px;
    margin:auto;
}
aside.nav-menu{
    color:#d2171a;
    background-color:#F8F8F8;
}
/*common header*/
header{
    display: flex;
    justify-content: space-between;
    align-items: center;
    width:100%;
    height:70px;
    position:absolute;
    top:0;
    left:0;
    z-index: 999;
    color:#000;
    background-color:transparent;
}
header .box01, .scroll-nav .box01, footer .box01{
    display: flex;
    justify-content: space-between;
    width:90%;
    max-width:1600px;
    margin:auto;
}
header .box01, .scroll-nav .box01{
    align-items: center; 
}
header a.logo img, .scroll-nav .box01 a.logo img{
    width:200px;
}
header nav, .scroll-nav .wrap{
    width:60%;
    min-width:775px;
    font-weight: bold;
}
header nav ul, .scroll-nav .wrap ul{
    display: flex;
    justify-content: space-between;
}
.scroll-nav .wrap ul ul{
    display: flex;
    flex-flow: column;
}
header nav ul li, .scroll-nav .wrap ul li{
    display: flex;
    justify-content: center;
    align-items: center;
    text-align: center;
    padding:0 1.5em;
}
header nav ul li a, .scroll-nav .wrap ul li a{
    display: flex;
    justify-content: center;
    align-items: center;
    width:100%;
    height:100%;
    padding:0;
    line-height: 1.3em;
}
header nav ul li a:hover, .scroll-nav .wrap ul li a:hover{
    color:#d2171a;
    transition: .3s;
}
header nav ul li.contact-btn a:hover, .scroll-nav .wrap ul li.contact-btn a:hover{
    color:#fff;
}
.contact-btn{
    height:35px;
    color:#fff;
    background-color:#d2171a;
    border-radius: 50px;
}
.contact-btn a{
    display: flex;
    justify-content: center;
    align-items: center;
    text-align: center;
    padding:0 1.5em;
}
.contact-btn:hover{
    opacity: 0.7;
    transition: .3s;
}
.contact-btn_sp{
    display: none;
}
header .contact-btn{
    padding:0;
}
section .contact-btn{
    display: flex;
    justify-content: center;
    align-items: center;
    width:17em;
    margin:auto;
    font-weight: bold;
}
/*common scroll header*/
.scroll-nav {
    position: fixed;
    top:0;
    left:0;
    z-index: 999;
    display: flex;
    justify-content: space-between;
    align-items: center;
    width:100%;
    height:70px;
    background-color:#fff;
    transition: all 0.4s ease-out;
    transform: translateY(-100%);
}
.scroll-nav.active {
    transform: translateY(0);
    opacity: 1;
}
/*common eyecatch*/
img.eyecatch{
    width:80vw;
    max-width:1600px;
    height:35vh;
    min-height:380px;
    max-height:400px;
    margin:0 auto 100px;
    padding:80px 0 0;
}
img.eyecatch.company, img.eyecatch.news{
    object-position: top;
}
img.eyecatch.products{
    object-position: 50% 60%;
}
img.eyecatch.info01{
    object-position: 50% 30%;
}
img.eyecatch.info02{
    object-position: 50% 15%;
}
img.eyecatch.info03{
    object-position: 50% 5%;
}
img.eyecatch.info06{
    object-position: 50% 5%;
}
img.eyecatch.info07{
    object-position: 50% 25%;
}
/*common concept*/
p.concept{
    margin:50px auto;
    text-align: center;
}
p.concept span, span.text01{
    display: block;
    margin-bottom:25px;
    font-family: "Zen Old Mincho", serif;
    font-size:clamp(18px, 3vw, 24px);
}
/*common highlight*/
.h_type{
    display: flex;
    flex-flow: column;
    color:#d2171a;
/*    font-size:clamp(26px, 3vw, 48px);*/
    font-size:clamp(20px, 3vw, 36px);
    font-weight: 600;
    line-height: 1em;
}
.h_type span{
    font-size:clamp(12px, 2vw, 20px);
    font-weight: normal;
}
.h_type.middle{
/*    font-size:clamp(22px, 3vw, 36px);*/
    font-size:clamp(20px, 3vw, 30px);
}
/*
.h_type.middle span{
    font-size:clamp(12px, 3vw, 20px);
}
*/
.h_type.middle2{
    font-size:clamp(18px, 3vw, 22px);
}
.h_type.center{
    text-align: center;
}
.h_type.non-ec{
    padding-top:200px;
}
.h_w{
    font-weight: 400;
}
/*common nav-anc*/
ul.nav-anc{
    display: flex;
    justify-content: center;
    width:75vw;
    max-width:1600px;
    margin:75px auto 0;
    padding:0 0 100px;
}
ul.nav-anc li{
    width:25%;
    text-align: center;
    border-left:solid 1px #bfbcb1;
}
ul.nav-anc li:nth-last-of-type(1){
    border-right:solid 1px #bfbcb1;
}
ul.nav-anc li a{
    display: block;
    padding:25px 0;
    font-size:clamp(16px, 3vw, 18px);
    color:#d2171a;
    text-decoration: underline;
}
ul.nav-anc li a:hover{
    opacity: 0.5;
    transition: .3s;
}
/*common bottom-nav*/
aside.bottom-nav ul{
    display: grid;
    grid-template-columns: 1fr 1fr;
    grid-gap: 0;
}
aside.bottom-nav ul li{
    height:320px;
}
aside.bottom-nav ul li:hover a{
    background-color:#d2171a;
    transition: .3s;
}
aside.bottom-nav ul li:hover h2, aside.bottom-nav ul li:hover .link-flow{
    color:#fff;
}
aside.bottom-nav ul li a{
    display: flex;
    justify-content: center;
    align-items: center;
    width:100%;
    height:100%;
    background-color:#F8F8F8;
    border-top:solid 1px #d2171a;
    border-bottom:solid 1px #d2171a;
}
aside.bottom-nav ul li:nth-of-type(odd){
    border-right:solid 1px #d2171a;
}
aside.bottom-nav ul li h2{
    margin-bottom:35px;
}
aside.bottom-nav ul li .link-flow{
    color:#d2171a;
}
/*common bgimg-box*/
.bgimg-box{
    background-repeat: no-repeat;
    background-size:100%;
}
.bgimg-box.white{
    background-color:#F8F8F8;
    background-image: url(../img/milk_white-long.svg);
}
.bgimg-box.tea{
    background-color:#fff;
    background-image: url(../img/milk_tea-long.svg);
}
/*common footer*/
footer{
    padding:100px 0;
    color:#d2171a;
    background-color:#F8F8F8;
    border-top:solid 1px;
}
footer a.logo{
    width:280px;
}
footer .box01{
    flex-flow: column;
}
footer ul{
    display: flex;
    justify-content: space-between;
/*    width:30%;*/
    margin:50px 0 50px auto;
}
footer ul li{
    margin:10px 1em;
}
footer ul li:nth-last-of-type(1){
    margin:10px 0;
}
footer ul li a:hover{
    text-decoration: underline;
}
footer small{
    display: block;
    margin-left:auto;
}
/*index*/
/*eyecatch slide*/
.slide-top{
    width:100%;
    aspect-ratio:16/9;
    max-height:950px;
/*    height:100vh;*/
    position: relative;
}
.slide-top h2 {
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    z-index: 2;
    display: block;
    margin: auto;
    font-size:clamp(22px, 3vw, 36px);
    text-align: center;
    line-height: 1.6em;
    text-shadow:1px 1px 1px rgb(255,255,255,0.7), 
        5px 5px 3px rgb(255,255,255,0.8), -5px -5px 3px rgb(255,255,255,0.8), 5px -5px 3px rgb(255,255,255,0.8), -5px 5px 3px rgb(255,255,255,0.8), 0 5px 3px rgb(255,255,255,0.8), 5px 0 3px rgb(255,255,255,0.8), 0 -5px 3px rgb(255,255,255,0.8), -5px 0 3px rgb(255,255,255,0.8), 0 0 10px rgb(255,255,255,0.8);
}
.slide-top h2 span.large{
    font-size:clamp(32px, 3vw, 52px);
}
.slide-top h2 span.small{
    font-size:clamp(14px, 3vw, 18px);
}
.slide-top .shade{
    position: absolute;
    display: block;
    width:100%;
    height:100%;
    z-index: 1;
    background-color:rgb(255,255,255,0.4);
}
.slide-fade img{
    aspect-ratio:16/9;
    width:100%;
    max-height:950px;
/*    height:100vh;*/
}
/*top menu*/
.top-menu{
    position: relative;
    padding:0 0 300px;
}
.top-menu h2{
    width:80vw;
    max-width:1600px;
    margin:100px auto;
}
.top-menu .service{
    display: flex;
    margin-bottom:100px;
    position: relative;
}
.top-menu .service.reverse{
    flex-flow: row-reverse;
}
.top-menu .service img{
    width:60%;
    height:500px;
}
.top-menu .service::after{
    content:"";
    position: absolute;
    right:0;
    bottom:0;
    z-index: -1;
    width:50%;
    height:600px;
    background-color:#F8F8F8;
}
.top-menu .service.reverse::after{
    right:inherit;
    left:0;
}
.top-menu .service:hover::after{
    background-color:#d2171a;
    transition: .3s;
}
.top-menu .service .box01{
    display: flex;
    flex-flow: column;
    justify-content: center;
    align-items: flex-start;
    width:40%;
    height:500px;
    color:#d2171a;
}
.top-menu .service.reverse .box01{
    align-items: flex-end;
}
.top-menu .service:hover .box01, .top-menu .service:hover .h_type, .top-menu .recruit:hover .h_type{
    color:#fff;
}
.top-menu .service .box01 .text{
    margin:0 0 0 75px;
}
.top-menu .service.reverse .box01 .text{
    margin:0 75px 0 0;
}
.top-menu .service .box01 h3{
    margin-bottom:35px;
}
.link-flow{
    display: flex;
    align-items: center;
}
.link-flow::before{
    content:"";
    flex-grow: 1;
    width:300px;
    height:1px;
    margin-right:10px;
    background-color:#bfbcb1;
}
.top-menu .about{
    display: flex;
    flex-flow: column;
    width:80vw;
    margin:200px auto 0;
    padding:0 0 100px;
/*    margin:0 auto 100px;*/
    max-width:1600px;
}
.top-menu .about img{
    height:50vh;
    max-height:500px;
    min-height:320px;
    object-position: top;
}
.top-menu .about .box01{
    padding:75px;
}
.top-menu .about .box01:hover{
    background-color:#d2171a;
    transition: .3s;
}
.top-menu .about .box01:hover .h_type, .top-menu .about .box01:hover .link-flow{
    color:#fff;
}
.top-menu .about .box01 h3{
    margin-bottom:35px;
}
.top-menu .about .box01 .link-flow{
    width:100%;
    color:#d2171a;
}
.top-menu .recruit{
    display: flex;
    width:80vw;
    margin:200px 0 100px auto;
    position: relative;
}
.top-menu .recruit::after {
    content: "";
    position: absolute;
    top: 0;
    bottom: 0;
    right: 0;
    z-index: -1;
    width: 60%;
    height: 500px;
    margin: auto 0;
    padding: 100px 0 100px;
    background-color: #F8F8F8;
}
.top-menu .recruit .link-flow{
    color:#d2171a;
}
.top-menu .recruit:hover .h_type-left, .top-menu .recruit:hover .link-flow{
    color:#fff;
}
.top-menu .recruit:hover::after{
    background-color:#d2171a;
    transition: .3s;
}
.top-menu .recruit img{
    width:50%;
}
.top-menu .recruit .box01{
    display: flex;
    justify-content: flex-start;
    align-items: center;
}
.top-menu .recruit h3{
    margin-bottom:35px;
}
.top-menu .recruit .text{
    margin:0 0 0 75px;
}
/*top aside info*/
iframe.information-nav.top-news{
    width:100%;
    height:530px;
}
.top-info section.news{
/*    margin:0;*/
    padding:100px 0;
/*    margin:300px 0 100px;*/
}
.top-info section.news .box01{
    width:60vw;
    max-width:1000px;
    margin:50px auto;
}
ul.news li{
    margin-bottom:25px;
    border-bottom:solid 1px #bfbcb1;
}
ul.news li span.date{
    margin-right:75px;
    color:#bfbcb1;
}
ul.news li a{
    display: flex;
    width:100%;
    height:100%;
    padding:10px 0;
}
ul.news li a:hover{
    color:#d2171a;
    transition: .3s;
}
/*about*/
section.about.concept{
    padding:0 0 50px;
}
section.greeting{
    padding:75px 0;
    position: relative;
}
section.greeting .wrap{
    max-width:800px;
    min-width:320px;
    margin:auto;
}
article.about .bgimg-box{
    background-position: 50% -400%;
}
img.catch.greeting{
    max-width:1200px;
    height:480px;
}
p.sign{
    text-align: right;
}
p.sign span{
    display: block;
    font-family: "Zen Old Mincho", serif;
    font-size:24px;
    font-weight: 600;
}
section.philosophy{
    padding:100px 0;
    position: relative;
}
section.philosophy ul.wrap{
    max-width:800px;
    margin:50px auto 100px;
}
section.philosophy ul.wrap li.wrap{
    margin:35px 0;
    border-bottom:dotted 1.5px;
}
section.philosophy ul ul{
    margin:30px 0 0;
}
section.philosophy ul ul li{
    margin:0 0 25px 1em;
    list-style:decimal;
}
section.appeal{
    padding:100px 0;
}
section.appeal ul{
    display: flex;
    justify-content: space-between;
    width:75vw;
    max-width:1600px;
    margin:50px auto 0;
}
section.appeal ul li{
    width:30%;
    text-align: center;
    word-break: keep-all;
}
section.appeal ul li, section.appeal ul li h3, section.appeal ul li img{
    margin:0 0 35px;
}
section.appeal ul li img{
    aspect-ratio:1/1;
}
/*service*/
section.service{
    padding:0 0 100px;
}
section.service:nth-of-type(1){
    margin:100px 0 0;
}
section.service .bgimg-box{
    background-position: 50% -350%;
}
section.service .cont{
    width:75vw;
    max-width:1600px;
    margin:0 auto;
    padding:50px 0 0;
}
section.service .cont .wrap{
    display: flex;
    justify-content: space-between;
    align-items: flex-start;
    margin:50px 0 0;
}
section.service .cont .box, section.service .cont img.sub{
    width:47%;
}
section.service .cont img.sub{
    aspect-ratio:4/3;
}
section.service .cont .box.text{
    aspect-ratio:4/3;
/*    padding:50px 0;*/
    background-repeat: no-repeat;
    background-size:50%;
    background-position: bottom left;
}
section.service .cont .box.text.delivery{
    background-image: url(../img/bg-delivery.png);
}
section.service .cont .box.text.food{
    background-image: url(../img/bg-food.png);
}
section.service .cont .box.text.restaurant{
    background-image: url(../img/bg-restaurant.png);
}
section.service .cont .box.text a{
    display: block;
    width:7em;
    margin:50px 0 0 auto;
    padding:15px 0;
    text-align: right;
}
section.service .cont .box.text a:hover{
    opacity: 0.7;
    transition: .3s;
}
/*home delivery milk*/
section.d-milk.concept{
    position: relative;
    padding:0 0 200px;
}
section.d-milk.concept ul.nav-anc{
    padding:0 0 100px;
}
section.d-milk.flow{
    position: relative;
    padding:100px 0 200px;
}
ol.system{
    width:75vw;
    max-width:1200px;
    margin:50px auto 100px;
    position: relative;
    z-index: 1;
}
ol.system li{
    margin:0 0 50px;
    padding:0 0 25px;
}
ol.system li{
    background-repeat: no-repeat;
    background-size: auto;
    background-position: top right;
}
ol.system li.sys01{
    background-image: url(../img/icon_sys01.png);
}
ol.system li.sys02{
    background-image: url(../img/icon_sys02.png);
}
ol.system li.sys03{
    background-image: url(../img/icon_sys03.png);
}
ol.system li.sys03 a{
    display: flex;
    justify-content: center;
    margin:50px auto;
}
ol.system li a:hover{
    opacity: 0.7;
    transition: .3s;
}
ol.system li h3{
    width:80%;
    padding:15px 0;
    border-bottom:dotted 1.5px #bfbcb1;
}
ol.system li p{
    margin:15px 0;
}
ul.del-info{
    display: flex;
    flex-flow: row wrap;
    justify-content: space-between;
    align-items: flex-start;
    margin:50px 0;
}
ul.del-info li{
    min-height:300px;
    padding:0;
    background-color:#fff;
}
ul.del-info li.top{
    width:30%;
}
ul.del-info li.bottom{
    width:47%;
}
ul.del-info li .wrap{
    margin:25px;
}
ul.del-info li.cooler{
    background-image: url(../img/bg-cooler.png);
    background-position: bottom 5% right 15%;
}
ul.del-info h4{
    padding:0 0 10px;
    font-size:18px;
    text-align: center;
    color:#d2171a;
    border-bottom:solid 1px #bfbcb1;
}
ul.del-info li p{
    margin:15px 0 0;
}
section.area{
    padding:100px 0;
}
section.area .wrap{
    width:75vw;
    max-width:1200px;
    margin:0 auto 100px;
}
section.area .wrap img.area-pc{
    display: block;
    margin:75px 0 50px;
}
section.area .wrap img.area-sp, p.area-sp{
    display: none;
}
section.area ul li{
    margin:25px 0;
    border:solid 2px;
}
section.area ul li.orange{
    border-color:#FBBB64;
}
section.area ul li.yellow{
    border-color:#FFD671;
}
section.area ul li.blue{
    border-color:#A4C5FF;
}
section.area ul li.pink{
    border-color:#F7B1DE;
}
section.area ul li h3{
    margin:25px 25px 15px;
    padding:0 0 15px;
    font-size:clamp(18px, 3vw, 24px);
    font-weight: normal;
    border-bottom:dotted 1.5px #bfbcb1;
}
section.area ul li p{
    margin:0 25px 25px;
}
/*FAQ*/
article.faq{
    padding:0 0 75px;
}
section.faq{
    width:75vw;
    max-width:1200px;
    margin:50px auto 50px;
}
section.faq .wrap{
    padding:35px;
}
section.faq h3{
    display: flex;
    margin:0 0 15px;
    padding:0 0 15px;
    font-size:clamp(18px, 3vw, 24px);
    font-weight: 400;
    line-height: 1.3em;
    border-bottom:dotted 1.5px #bfbcb1;
}
section.faq h3 span.red{
    margin-right:10px;
}
/*order*/
article.order p.detail{
    text-align: center;
    margin:75px 0;
}
section.order.outline{
    width:75vw;
    max-width:1600px;
    margin:0 auto 100px;
}
section.order.outline .wrap{
    padding:75px;
}
section.order.outline h2{
    margin:0 0 25px;
    font-weight: normal;
}
section.order.outline .box01.first{
    margin:0 0 35px;
    padding:0 0 35px;
    border-bottom:solid 1.5px #bfbcb1;
}
section.order.outline ol{
    width:90%;
    margin:50px auto 0;
}
section.order.outline ol li{
    margin:50px 0 0;
}
section.order.outline ol li h3{
    margin:0 0 15px;
    padding:0 0 15px;
    font-size:20px;
    font-weight: normal;
    border-bottom:dashed 1.5px #bfbcb1;
}
section.order.outline ol li a{
    display: block;
    margin:50px 0;
    text-align: center;
}
section.order.outline ol li a:hover{
    opacity: 0.7;
    transition: .3s;
}
article.order ul.alert{
    width:70%;
    min-width:300px;
    margin:auto;
}
ul.alert li{
    text-indent:-1em;
    margin-left:1em;
    line-height: 2em;
}
ul.alert li::before{
    content:"※";
}
section.order.form{
    margin:100px auto 0;
    padding:100px 0;
}
.form-wrap{
    background-color:#fff;
    width:85%;
    min-width:800px;
    max-width:1000px;
    margin:75px auto;
    padding:40px 0 75px;
}
.order-form {
    width:90%;
    margin:50px auto;
/*    font-size:18px;*/
}
.order-form .border{
    padding:0 0 35px;
    border-bottom:dashed 1.5px #bfbcb1;
}
.order-form .form-box{
    display: flex;
    align-items: center;
    margin:35px 0;
}
.order-form .title-box{
    width:12em;
/*    width:20%;*/
    margin:0 2em 0 0;
    text-align: right;
}
.order-form input, .recruit-form .box01 input, .order-form select, .order-form textarea{
    padding:5px;
}
.order-form input.radio{
    width:15px;
    height:15px;
}
.order-form .ans-box{
    font-family: "yu-gothic-pr6n", sans-serif;
}
.order-form .ans-box.text input, .order-form .ans-box.text select, .order-form .ans-box.text textarea{
    width:25em;
}
.order-form .ans-box.jusyo div{
    display: flex;
    flex-flow: row nowrap;
    align-items: center;
}
.order-form .ans-box.jusyo div:nth-of-type(n+2){
    margin:35px 0 0;
}
.order-form .ans-box.jusyo div span:nth-of-type(1){
    display: inline-block;
    width:6em;
    margin:0 1em 0 0;
    text-align: right;
}
.order-form .ans-box.jusyo div span:nth-of-type(2){
    margin:0 0 0 1em;
    font-size:14px;
    line-height: 1.6em;
}
.order-form .ans-box.jusyo #yubin{
    width:10em;
}
.order-form .ans-box.radio label{
    margin-right:2em;
}
.order-form textarea{
    height:10em;
}
#formWrap h3.type03{
    margin:3em auto 2em;
    text-align: center;
    color:#d2171a;
    font-size:clamp(20px, 3vw, 30px);
}
/*products*/
section.product{
    position: relative;
}
ul.product{
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    grid-column-gap: 5%;
    width:75vw;
    max-width:1200px;
    margin:0 auto;
/*    padding:75px 0;*/
    padding:75px 0 0;
}
section.product.concept .nav-anc{
    padding:0 0 150px;
}
section.product.list{
    padding:100px 0;
}
ul.product li{
    margin:0 0 50px;
}
ul.product li .border{
    padding:15px;
    background-color:#fff;
    border:solid 2px #bfbcb1;
}
ul.product li img{
    aspect-ratio:1;
    object-fit: contain;
}
ul.product li h3{
    margin:15px 0;
    font-size:18px;
    text-align: center;
    line-height: 1.6em;
}
section.item{
    width:75vw;
    max-width:1200px;
    margin:0 auto 100px;
}
section.item p{
    text-align: center;
}
.item-wrap{
    max-width:800px;
    margin:50px auto 200px;
}
img.item, section.item img{
    max-width:500px;
    margin:50px auto;
    object-fit: contain;
    aspect-ratio:1;
}
section.item p.concept{
    max-width:800px;
}
section.item table{
    width:500px;
    margin:100px auto 25px;
    border-collapse: collapse;
}
section.item table th, section.item table td{
    width:50%;
    padding:1.3em 1em;
    font-family: "yu-gothic-pr6n", sans-serif;
    text-align: center;
    border-top:solid 1.5px #bfbcb1;
}
section.item table th{
    background-color:#F8F8F8;
}
section.item table tr:nth-last-of-type(1) th, section.item table tr:nth-last-of-type(1) td{
    border-bottom:solid 1.5px #bfbcb1;
}
section.item table caption{
    margin-bottom:15px;
    font-family: "yu-gothic-pr6n", sans-serif;
    font-weight: 400;
    text-align: center;
}
section.item ul.nav-anc{
    width:100%;
}
/*lower service*/
section.service_lower{
    padding:100px 0;
    position: relative;
}
section.service_lower.reverse{
    padding:0 0 150px;
}
section.service_lower.concept{
    padding:0 0 50px;
}
section.service_lower .wrap{
    display: flex;
    justify-content: space-between;
    align-items: center;
    width:75vw;
    max-width:1600px;
    margin:auto;
}
section.service_lower.reverse .wrap{
    flex-flow: row-reverse;
}
section.service_lower .wrap .box01{
    width:45%;
}
section.service_lower h2{
    margin:0 0 15px;
    padding:0 0 15px;
    border-bottom:dotted 1.5px #bfbcb1;
}
section.service_lower .wrap img{
    width:50%;
    aspect-ratio:4/3;
}
section.service_lower .wrap .box01 a{
    display: block;
    margin:100px 0 0;
    text-align: right;
}
section.service_lower .wrap .box01 a:hover{
    opacity: 0.7;
    transition: .3s;
}
/*delivery*/
section.delivery .box02{
    display: flex;
    flex-flow: column;
    justify-content: center;
    align-items: center;
    width:70%;
    margin:75px auto 0;
    text-align: center;
    background-color:#fff;
}
section.delivery .box02 h3{
    margin:50px 0 35px;
    color:#d2171a;
    font-size:28px;
}
section.delivery .box02 p.detail{
    display: flex;
    flex-flow: column;
    margin:0 1em 50px;
}
section.delivery .box02 p.detail span{
    margin:0 1em 35px;
    font-family: "Zen Old Mincho", serif;
    font-size:18px;
    font-weight: 600;
}
section.delivery .box02 img{
    width:auto;
}
section.delivery .box02 p.tell{
    display: flex;
    flex-flow: column;
    margin:15px 1em 50px;
}
section.delivery .box02 p.tell span{
    font-size:26px;
    font-weight: bold;
}
article.delivery{
    overflow: hidden;
}
.farmer{
    width:75vw;
    max-width:1600px;
    margin:35px auto 0;
    position: relative;
}
.farmer img.farmer{
    height: 35vh;
    min-height: 380px;
    max-height: 400px;
    object-position: top;
}
.farmer img.cone{
    position: absolute;
    right:-80px;
    bottom:-30px;
    width:280px;
}
/*restaurant*/
section.restaurant address{
    display: flex;
    justify-content: space-around;
    align-items: center;
    width:65%;
    min-width:320px;
    margin:50px auto;
    padding:50px 0;
}
section.restaurant address p.tell{
    text-align: center;
}
section.restaurant address p.tell span{
    display: block;
    font-size:26px;
    font-weight: bold;
}
section.restaurant a{
    display: block;
    margin:0 auto 100px;
    text-align: center;
}
section.restaurant a:hover{
    opacity: 0.7;
    transition: .3s;
}
/*company*/
section.company ul.type02{
    width:75vw;
    max-width:1000px;
    min-width:320px;
    margin:auto;
}
section.company iframe{
    display: block;
    width:75vw;
    max-width:1000px;
    height:50vh;
    max-height:500px;
    min-height:320px;
    margin:50px auto;
}
section.history{
    width:75vw;
    max-width:1600px;
    min-width:320px;
    margin:auto;
    padding:100px 0 200px;
}
table.history{
    width:75%;
    margin:50px auto 0;
    border-collapse: collapse;
}
table.history tr{
    border-top:solid 1.5px #bfbcb1;
    border-bottom:solid 1.5px #bfbcb1;
}
table.history th{
    vertical-align: middle;
    width:30%;
    color:#d2171a;
    font-weight: normal;
    background-color:#f8f8f8;
}
table.history th, table.history td{
    padding:1.5em 0;
    line-height: 2em;
}
table.history td{
    display: flex;
    width:100%;
}
table.history td:nth-of-type(n+2){
    border-top:dashed 1.5px #bfbcb1;
}
table.history td .month{
    display: block;
    width:30%;
    text-align: center;
}
section.base{
    padding:100px 0 50px;
}
section.base h3{
    width:75vw;
    margin:0 auto 50px;
    padding:0 0 15px;
    font-size:26px;
    font-weight: normal;
    color:#d2171a;
    border-bottom:dashed 1.5px #bfbcb1;
}
section.base h4{
    font-family: "yu-gothic-pr6n", sans-serif;
    font-size:18px;
    font-weight: 600;
    line-height: 1.6em;
}
section.base ul{
    width:75vw;
    max-width:1600px;
    min-width:320px;
    margin:auto;
    display: flex;
    flex-flow: row wrap;
    justify-content: space-between;
}
section.base ul li{
    display: flex;
    justify-content: space-between;
    align-items: flex-start;
    width:48%;
    height:240px;
    margin:0 0 50px;
}
section.base ul li img{
    width:60%;
    aspect-ratio:4/3;
    max-height:100%;
}
section.base ul li .box01{
    width:37%;
}
section.base ul li .box01 p{
    margin:25px 0 0;
    line-height: 1.6em;
}
section.base ul li .box01 a{
    display: block;
    margin-top:2em;
}
section.base ul li .box01 a:hover{
    opacity: 0.7;
    transition: .3s;
}
/*policy*/
article.policy{
    padding:0 0 100px;
}
article.policy p.detail{
    text-align: center;
    margin:75px 0;
}
section.policy{
    width: 75vw;
    max-width: 1200px;
    min-width:320px;
    margin: 50px auto 50px;
}
section.policy ul li{
    margin:50px 0;
}
/*
section.policy ul li::marker{
    font-size: clamp(18px, 3vw, 22px);
    color:#d2171a;
}
*/
section.policy ul li h2{
    display: flex;
    flex-flow: row;
    margin:0 0 15px;
    padding:0 0 15px;
    color:#333;
    border-bottom:dashed 1.5px #bfbcb1;
}
section.policy ul li h2 span{
    margin-right:5px;
}
/*information*/
iframe.information-nav.info-news{
    width:100%;
    height:720px;
}
section.info.concept{
    padding:0 0 50px;
    position: relative;
}
section.news, section.all-article{
    padding:100px 0 150px;
    position: relative;
}
ul.info-list{
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    grid-column-gap: 2%;
    grid-row-gap: 50px;
    width:75vw;
    max-width:1200px;
/*    max-width:1600px;*/
    min-width:300px;
    margin:50px auto;
}
li.info-box{
    background-color:#fff;
    border:solid 1.5px #bfbcb1;
}
li.info-box:hover{
    opacity: 0.7;
    transition: .3s;
}
/*
li.info-box .title-box{
    margin:1em;
}
*/
li.info-box img{
    aspect-ratio:4/3
}
li.info-box span.date{
    margin:1em 1em 15px;
}
li.info-box span.date, .title-box.lower span.date{
    display: block;
    font-size:14px;
    letter-spacing: 0.5px;
    color:gray;
}
li.info-box span.date span, .title-box.lower span.date span{
    margin-left:15px;
}
li.info-box h3 {
    margin: 5px 0 0;
    line-height: 1.6em;
    letter-spacing: 0.5px;
    overflow: hidden;
    display: -webkit-box;
    -webkit-box-orient: vertical;
    -webkit-line-clamp: 2;
    margin:15px 1em 1em;
}
.info-box.is-hidden{
    display: none;
}
.list-btn{
    display: flex;
    justify-content: center;
    width:75vw;
    margin:auto;
}
.list-btn a{
    text-align: center;
    cursor: pointer;
}
.info.lower{
    width:75vw;
    max-width:800px;
    min-width:320px;
    margin:auto;
}
.title-box.lower{
    margin:75px 0 15px;
    border-bottom:solid 1.5px #bfbcb1;
}
.title-box.lower h2{
    margin:10px 0 15px;
}
.info.lower .thumbnail, .info.lower img{
    margin:25px 0;
/*    aspect-ratio:4/3;*/
}
.article-nav{
    display: flex;
    justify-content: space-between;
    width:75vw;
    max-width:800px;
    min-width:320px;
    margin:50px auto 100px;
    padding:15px 0 0;
    border-top:dashed 1.5px #bfbcb1;
}
.article-nav li{
    display: flex;
    align-items: baseline;
    max-width:45%;
    line-height: 1.3em;
}
aside.category.lower{
    padding:100px 0 0;
}
aside.category.lower ul.nav-anc{
    margin:75px auto 0;
}
/*recruit*/
/*recruit common*/
main.recruit h1.lower, main.recruit h2{
    margin-bottom:75px;
    color:#d2171a;
    font-size: clamp(20px, 3vw, 26px);
    text-align: center;
}
main.recruit ul.type01 h3{
    margin:0 0 15px;
    padding:0 0 15px;
    font-size:clamp(18px, 3vw, 22px);
    font-weight: normal;
    color:#d2171a;
    border-bottom:dotted 1.5px #bfbcb1;
}
section.company ul.type02 li , main.recruit ul.type02 li{
    display: flex;
    align-items: center;
    padding:15px 0;
    border-top:solid 1.5px #bfbcb1;
}
section.company ul.type02 li:nth-last-of-type(1), main.recruit ul.type02 li:nth-last-of-type(1){
    border-bottom:solid 1.5px #bfbcb1;
}
main.recruit img.catch{
    width:100%;
    height: 380px;
}
main.recruit img.catch.info01{
    object-position: 50% 70%;
}
/*recruit main*/
.recruit-top{
    height:90vh;
    position: relative;
    background-image: url(../img/milk02.jpg);
    background-repeat: no-repeat;
    background-position: right;
}
.recruit-top .title-box{
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    display: flex;
    flex-flow: column;
}
.recruit-top h1{
    display: flex;
    flex-flow: column;
    justify-content: center;
    align-items: center;
    text-align: center;
    font-size: clamp(16px, 3vw, 26px);
    line-height:1.3em;
}
.recruit-top .title-box .ribbon{
/*    width:18em;*/
    display: inline-block;
    text-align: center;
    margin:0 auto 20px;
    font-size:16px;
    color:#d2171a;
}
.recruit-top .title-box .ribbon span{
    display: block;
    margin:0 40px 0 0;
    padding:7px 1em;
    font-weight: bold;
    line-height: 1.3em;
    border-top:solid 1px;
    border-bottom:solid 1px;
}
.recruit-top h1 .large{
    font-size: clamp(22px, 3vw, 36px);
}
.recruit-merit{
    padding:100px 0;
    position: relative;
}
.recruit-merit ul.type01{
    width:75vw;
    max-width:1000px;
    min-width:320px;
    margin:100px auto;
}
.recruit-merit ul.type01 li{
    margin:75px 0;
}
.recruit-company{
    padding:100px 0 150px;
    position: relative;
}
.recruit-company .wrap{
    display: flex;
    justify-content: space-between;
    align-items: flex-start;
    width:75vw;
    max-width:1000px;
    min-width:320px;
    margin:auto;
}
.recruit-company .wrap .box01, .recruit-company .wrap .box02{
    width:47%;
}
.recruit-company .wrap .box01 img{
/*    height:300px;*/
    aspect-ratio:4/3;
    margin:0 0 50px;
}
section.company ul.type02, .recruit-company ul.type02{
    margin:75px auto 0;
}
section.company ul.type02 li, .recruit-company ul.type02 li{
    justify-content: space-around;
}
section.company ul.type02 li h3, .recruit-company ul.type02 li h3{
    width:7em;
    margin:0 0 0 1em;
    line-height: 2em;
    word-break: keep-all;
}
section.company ul.type02 li p, .recruit-company ul.type02 li p{
    width:60%;
    margin-right:1em;
    font-family: "Zen Old Mincho", serif;
}
section.recruit-greeting {
    padding:100px 0 150px;
    position: relative;
}
.recruit-greeting .wrap{
    display: flex;
    justify-content: space-between;
    width:75vw;
    max-width:1000px;
    min-width:320px;
    margin:auto;
}
.recruit-greeting .wrap p, .recruit-greeting .wrap img{
    width:47%;
}
.recruit-greeting .wrap img{
    aspect-ratio:4/3;
}
section.recruit-joblist{
    padding:100px 0;
    position: relative;
}
.recruit-joblist ul{
    width:75vw;
    max-width:1000px;
    min-width:320px;
    margin:auto;
}
.recruit-joblist ul li{
    margin:0 0 50px;
    border:solid 1.5px #bfbcb1;
}
.recruit-joblist ul li a{
    display: flex;
    justify-content: space-between;
    align-items: center;
    background-color:#fff;
}
.recruit-joblist ul li a:hover{
    opacity: 0.7;
    transition: .3s;
}
.recruit-joblist ul li img{
    width:35%;
    height:220px;
}
.recruit-joblist ul li .box01{
    width:65%;
/*    margin:1em 2em;*/
}
.recruit-joblist ul li h3{
    margin:1em 2em 10px;
/*    margin:0 0 10px;*/
    padding:0 0 13px;
    font-size:18px;
    border-bottom:dotted 1.5px #bfbcb1;
}
.recruit-joblist ul li p{
    margin:10px 2.2em;
}
.recruit-joblist ul li span{
    display: block;
    margin:25px 2em 0;
/*    margin:25px 0 0;*/
    text-align: right;
    font-size:14px;
}
/*recruit lower*/
.recruit-lower.detail .box01{
    width:75vw;
    max-width:1000px;
    min-width:320px;
    margin:auto;
}
.recruit-lower.detail img{
    margin:50px 0 100px;
}
.recruit-lower.detail img.info03{
    object-position: 50% 5%;
}
.recruit-lower.content{
    padding:0 0 150px;
    position: relative;
}
.recruit-lower.content .wrap{
    width:75vw;
    max-width:1000px;
    min-width:320px;
    margin:auto;
}
.recruit-lower.content ul li{
    margin:0 0 35px;
}
.recruit-lower.content h3{
    font-family: "yu-gothic-pr6n", sans-serif;
    font-size:18px;
    margin-bottom:15px;
}
.recruit-lower.melit{
    padding:100px 0 150px;
    position: relative;
}
.recruit-lower.melit ul{
    width:60vw;
    max-width:1000px;
    min-width:320px;
    margin:auto;
}
.recruit-lower.melit ul li{
    display: flex;
/*    justify-content: space-between;*/
    align-items: center;
    margin:35px 0;
}
.recruit-lower.melit ul li img{
    width:100px;
}
.recruit-lower.melit ul li .box01{
    width:100%;
}
.recruit-lower.interview{
    padding:100px 0 150px;
    position: relative;
}
.recruit-lower.interview .wrap{
    width:75vw;
    max-width:1000px;
    min-width:320px;
    margin:auto;
}
.recruit-lower.interview .title{
    text-align: center;
    line-height: 2em;
}
.recruit-lower.interview .title h3{
    font-size:18px;
}
.recruit-lower.interview img.catch{
    margin:0 0 35px;
}
.recruit-lower.interview img.catch.gpart, .recruit-lower.interview img.catch.info02{
    object-position: top;
}
.recruit-lower.interview img.catch.delivery{
    object-position: 50% 35%;
}
.recruit-lower .box01 img.catch.info06{
    object-position: 50% 35%;
}
.recruit-lower.interview .box01{
    display: flex;
    justify-content: space-between;
    align-items: flex-start;
    margin:50px 0;
}
.recruit-lower.interview .box01.reverse{
    flex-flow: row-reverse;
}
.recruit-lower.interview .box01 img{
    width:50%;
    height:320px;
}
.recruit-lower.interview .box01 img.info01_2{
    object-position: top;
}
.recruit-lower.interview .box01 img.info02_1, .recruit-lower.interview .box01 img.info02_2, .recruit-lower.interview .box01 img.info06_2{
    object-position: top;
}
.recruit-lower.interview .box01 img.info02_3{
    object-position: 80% 50%;
}
.recruit-lower.interview .box01 img.info03_2{
    object-position: top;
}
.recruit-lower.interview .box01 img.info07_4{
    object-position: top;
}
.recruit-lower.interview .box01 p{
    width:46%;
}
.recruit-lower.schedule{
    padding:100px 0 150px;
    position: relative;
}
.recruit-lower.schedule ul{
    width:75vw;
    max-width:1000px;
    min-width:320px;
    margin:auto;
}
.recruit-lower.schedule ul li{
    display: flex;
    justify-content: space-between;
    align-items: center;
    background-color:#F9F4F4;
    border-top:solid 1.5px #bfbcb1;
}
.recruit-lower.schedule ul li:nth-last-of-type(1){
    border-bottom:solid 1.5px #bfbcb1;
}
.recruit-lower.schedule ul li .time{
    width:25%;
    height:100%;
    text-align: center;
    font-size:18px;
    font-weight: 600;
    line-height: 1.3em;
}
.recruit-lower.schedule ul li p{
    width:75%;
    padding:1em 3em;
    background-color:#fff;
}
.recruit-lower.overview{
    padding:100px 0 150px;
    position: relative;
}
.recruit-lower.overview .wrap{
    width:75vw;
    max-width:1000px;
    min-width:320px;
    margin:auto;
}
.recruit-lower.overview ul.type02 li{
    display: flex;
    justify-content: space-between;
    padding:20px 0;
}
.recruit-lower.overview ul li h3{
    display: block;
    width:25%;
    padding:0 3%;
    font-size:18px;
    line-height: 2em;
}
.recruit-lower.overview ul li p{
    width:75%;
}
.recruit-form{
    width:75vw;
    max-width:1000px;
    min-width:320px;
    margin:auto;
    padding:100px 0;
}
.recruit-form form{
    margin:50px 0;
    padding:50px 0;
}
.recruit-form .box01{
    display: flex;
    align-items: center;
    padding:35px 50px;
}
.recruit-form .box01 label{
    width:10em
}
.recruit-form .box01 input{
    width:70%;
}
.submit-btn{
    display: block;
    margin:50px auto 0;
    padding:15px 25px;
    font-family: "Zen Old Mincho", serif;
    font-size:18px;
    color:#fff;
    background-color:#d2171a;
    border:none;
    border-radius: none;
}