@charset "utf-8";
/*大まかな設定*/
body { 
    width: 100%;
    font-size: 16px;
    margin: 0;
    padding: 0;
    color:#333
    /*background-color: rgb(191, 199, 181);x*/
}
#wrapper { 
    width: 980px;
    margin: auto;
} 
#main {
    width: 880px;
    padding: 0;
    margin: 20px auto;
    /*background-color: azure;x*/
}
/*見出しの設定：文字色*/
h1 {color: rgb(63, 33, 8);
    text-align: center;
}
h2 {color:#fffacd;}
/*ページトップロゴ*/
#top_h1 { 
    float: left;
    margin-top: 10px;    
    margin-left: 100px;/*へッターのとこにいた*/
}
/*aの設定*/
a { color:#994714;}
a:visited {color: #431708 ;}
a:hover {
    color:#cc8f14;
    font-weight: bold;
    text-decoration:none;}

a:hover img { 
    opacity: 0.7;}
/*マージン処理　※h3は抜き*/
h1, h2, h3, h4, h5, h6 { margin-top: 0;}
p {
    width: 90%;
    margin: 0 auto;
    line-height:  1.6;
}
/*空白マージンTOP*/
p.mt5 { 
    margin-top: 5em;
}
p.mt3 { 
    margin-top: 3em;
}
p.mt1 { 
    margin-top: 1em;
}
section.mt5 { 
    margin-top: 5em;
}
section.mt10 { 
    margin-top: 10em;
}
span.mt1 { 
    margin-top: 1em;
}
span.mt3 { 
    margin-top: 3em;
}
p.mt1_mb2 { 
    margin-top: 1em;
    margin-bottom: 2em;
}
p.mb2 { 
    margin-bottom: 2em;
}
p.mb7 { 
    margin-bottom: 7em;
}
/*太文字*/
span.bold { 
    font-weight: bold;
}
span.boldred { 
    font-weight: bold;
    color: rgb(255, 5, 5);
}

p.important { 
    margin-top: 2em;
    font-weight: bolder;
}
p.important2 { 
    margin-top: 2em;
    margin-bottom: 2em;
    font-weight: bolder;
    color: #ff0000;
}
p.important3 { 
    margin-top: 2em;
    margin-bottom: 3em;
    font-weight: bolder;
}
/* 文字を点滅せさるアニメーション-coffee.html */
/*2023/6/22削除-coffee.html */
.blinktext{
    -webkit-animation:blink 1.2s ease-in-out infinite alternate;
    -moz-animation:blink 1.2s ease-in-out infinite alternate;
    animation:blink 1.2s ease-in-out infinite alternate;
    }
    @-webkit-keyframes blink{
    0% {opacity:0;}
    100% {opacity:1;}
    }
    @-moz-keyframes blink{
    0% {opacity:0;}
    100% {opacity:1;}
    }
    @keyframes blink{
    0% {opacity:0;}
    100% {opacity:1;}
    }
/*画像と下部の文字t*/
figure { 
    width: 880px;
    margin: auto;
    line-height: 1.6;
}
figcaption {
    text-align: center;
    font-size: smaller;
}
/*img設定*/
/*imgの下部の余白消し*/
img { 
    vertical-align: bottom;
    text-align: center;  
}
/*main見出しの装飾*/
#main h1 { 
    background-color: #dddbc0;
    padding: 20px;
    font-size: 26px;
    border-bottom: solid 2px #4d4d36;
}
#main h2 {
    font-size: 22px;
    border: 1px solid #61240f;
    background-color:#008b8b;
    padding: 11px 22px;
    border-radius: 5px;
    margin: 20px 0;
}
#main h3 {
    font-size: 18px;
    border-left: solid 4px #61240f;
    background-color: #e6e6a1;
    padding: 5px 10px 5px 15px;
    margin: 30px 0;
    /*background-color: aqua;x*/
}
#main h4 { 
    margin-top: 1em;
    margin-bottom: 0;
}
#main img {
    margin: 10px auto;
}
/*ヘッダーの設定*/
header { 
    width: 100%;
    margin: 10px auto;
    /*background-color: #0f9999;x*/
}
#header_contact { 
    font-weight: bold;
    float: right;
    margin: 30px 100px 30px 0 ;
    /*background-color: aqua;x*/
}
#header_contact .spece { 
    padding-right: 0.5em;
    padding-left: 0.5em;
}

/*グローバルナビ設定*/
#global_navi { 
    width: 980px;
    clear: both;
    overflow: hidden;
    margin: 10px auto;
}
#global_navi ul { 
    list-style: none;
    margin: 0;
    padding: 0;
}
#global_navi ul li { 
    font-size: 14px;
    width: 130px;
    float: left;
    margin-left: 10px;
    text-align: center;
    background-color: rgb(223, 212, 185);/*x*/
}
#global_navi ul li a { 
    display: block;
    padding: 15px 0 15px 0;
    text-decoration: none;
}
#global_navi ul li a .current { 
    border-bottom: solid 2px #FFF;
}
.btn-square { 
  position: relative;
  display: inline-block;
  font-weight: bold;
  padding: 7px 10px 10px 10px;
  text-decoration: none;
  color: #000;
  border-bottom: solid 4px #0f9977;
  border-radius: 3px;
  transition: .10s;/*速さ*/
}
.btn-square:active {
    /*ボタンを押したとき*/
    -webkit-transform: translateY(4px);
    transform: translateY(4px);/*下に動く*/
    border-bottom: none;/*線を消す*/
  }
.btn-square span { 
    border-bottom: solid 2px #FFF;
}
.btn-square a:hover { 
    background: #e6e3bf;
}
/*パンくずリストの設定*/
#breadcrumb ol li { display: inline;}
#breadcrumb ol li::after { 
    content: ">";
    padding-left: 7px;
}
#breadcrumb ol li:last-child::after { content: none;}
/*ページトップイメージ*/
#pagetop_img { 
    width: 100%;
    margin: 10px auto 50px;
}
/*index各ページへのimgボタン周辺*/
#cafe_top  {
    margin-top: 5em;
}
#shop_top  {
    margin-top: 3em ;
    margin-bottom: 5em;
}
#shop_top a img {
   margin-top: 3em;
    box-shadow: 0 0 5px #999;
}

/*indexスライドショーの設定*/
#main_visual { 
    width: 100% ;
    margin: auto;
}
.slider {
	position: relative;
	width: 880px;
	height: 500px;
    margin: 0 auto 30px;
	overflow: hidden;
	z-index: 0;
}
.slider div {
	position: absolute;
	top: 0;
	left: 0;
}

.slider-inner div:nth-of-type(1) {
	animation: slider-inner 30s 0s infinite both;
	z-index: 6;
}

.slider-inner div:nth-of-type(2) {
	animation: slider-inner 30s 5s infinite both;
	z-index: 5;
}

.slider-inner div:nth-of-type(3) {
	animation: slider-inner 30s 10s infinite both;
	z-index: 4;
}

.slider-inner div:nth-of-type(4) {
	animation: slider-inner 30s 15s infinite both;
	z-index: 3;
}

.slider-inner div:nth-of-type(5) {
	animation: slider-inner 30s 20s infinite both;
	z-index: 2;
}

.slider-inner div:nth-of-type(6) {
	animation: slider-inner 30s 25s infinite both;
	z-index: 1;
}

@keyframes slider-inner {
	0% { left: 0; opacity: 0; }
	5% { left: 0; opacity: 1; }
	20% { left: 0; opacity: 1; }
	25% { left: 0; opacity: 0; }
	26% { left: 100%; opacity: 0; }
	100% { left: 100%; opacity: 0; }
}
/*cafeページスライド*/
.slider02 {
    height: 600px;
  overflow: hidden;
  position: relative; }
.slider-item02 {
    z-index:10;
    opacity: 0;
    width: 100%;
    height: 680px;
    background-position: center center;
    background-repeat: no-repeat;
    background-size: cover;
    position: absolute;
    left: 0;
    top: 0;
    -webkit-animation: anime 48s 0s infinite;
    animation: anime 48s 0s infinite; }
.slider-item02:nth-of-type(2) {
        -webkit-animation-delay: 8s;
        animation-delay: 8s; }
.slider-item02:nth-of-type(3) {
        -webkit-animation-delay: 16s;
        animation-delay: 16s; }
.slider-item02:nth-of-type(4) {
        -webkit-animation-delay: 24s;
        animation-delay: 24s; }
.slider-item02:nth-of-type(5) {
        -webkit-animation-delay: 32s;
        animation-delay: 32s; }
.slider-item02:nth-of-type(6) {
        -webkit-animation-delay: 40s;
        animation-delay: 40s; }
.slider-item02:nth-of-type(7) {
            -webkit-animation-delay: 48s;
            animation-delay: 48s; }
 @keyframes anime {
          0% {
                opacity: 0;
            }
            8% {
                opacity: 1;
            }
            17% {
                opacity: 1;
            }
            25% {
                opacity: 0;
                transform: scale(1.2) ;
                 z-index:9;
            }
            100% { opacity: 0 }
        }


/*フッターナビ01*/
footer {
    background-color: #bcccc9;
    text-align: center;
}
footer #footer_nav { 
    padding-top: 10px 0;
}
footer #footer_nav ul { 
    list-style: none;
    margin: 10px auto;
    padding: 0;
}
footer #footer_nav li { 
    display: inline;
    border-left: solid 1px #61240f;
    margin-left: 5px;
    padding-left: 5px;
    font-size: smaller;
}
footer #footer_nav li:last-child { 
    border-right: solid 1px #61240f;
    padding: 0 5px;
}
/*フッターナビ02*/
footer #footer_nav02 li { 
    display: inline;
    border-left: solid 1px #61240f;
    margin-left: 5px;
    padding-left: 5px;
    font-size: smaller;
}
footer #footer_nav02 { 
    padding-top: 10px 0;
}
footer #footer_nav02 ul { 
    list-style: none;
    margin: 10px auto;
    padding: 0;
}
footer #footer_nav02 li:last-child { 
    border-right: solid 1px #61240f;
    padding: 0 5px;
}
footer small { 
    display: block;
    padding: 5px 0;
    background-color: #431708;
    color: rgb(252, 248, 248);
}
/*目次の設定*/
#tec_mokuji { 
    width: 400px;
    margin: 10px;
    padding: 10px;
    border: solid 1px #61240f;
}
#tec_mokuji p { 
    margin-left: 40px;
    font-weight: bold;
}
#tec_mokuji ul {
    list-style: none;
    margin: 0 0 0 20px;
    padding: 10px;
}

/*会社案内ページ兼coffeeページグラフ*/
section #rinen { 
    text-align: center;
}
section #rinen ul { 
    list-style: none;
}
section #rinen ul li { 
    font-weight: bold;
}
.company p { 
    font-weight: bold;
}
.company p.none_bold { 
    font-weight: normal;
}
.company table { 
    width: 90%;
    border-collapse: collapse;
    margin: 0 auto 16px;
}
.company table th,
.company table td { 
    border: solid 1px #61240f;
    padding: 10px;
}
.company02 ul {
    list-style: none;
}
/*imyページul*/
#imy ul {
    list-style: decimal;
    font-weight: bold;
}
#imy ul li { 
    padding-top: 10px;
    padding-bottom: 10px;
}
/*coffeeページオンラインショップ装飾*/
#onlineshop a img {
    margin-top: 3em;
     box-shadow: 0 0 5px #999;
 }
/*技術ページli設定*/
section #machine ul.ma_01 { 
    list-style: square;
    font-weight: bold;
}
section #machine ul { 
    list-style: decimal;
}
section #machine ul li {
    font-weight: bold;
}
section #machine02 ul {
    font-weight: bold;
    list-style: decimal;
}
section #machine02 ul li { 
    padding-top: 1em;
}
section #machine02 ul p { 
    font-weight: normal;
}

/*技術ページimg*/
#iroiro_kome {
    padding: 0px;
    overflow: hidden;
    /*background-color: blueviolet;x*/
}
#iroiro_kome ul {
    list-style: none;
    margin: 0;
    padding: 0 58px;
}
#iroiro_kome ul li {
    width: 300px;
    margin: 10px 40px;
    float: left;
    border: solid 1px #333;
    text-align: center;
    /*background-color: rgb(179, 124, 73);x*/
}
#iroiro_kome ul li img { 
    margin: 0 auto;
}
/*lawのtable設定*/
#law_table table { 
    width: 100%;
    border-collapse: collapse;
    margin-bottom: 1em;
}
#law_table th,
#law_table td { 
    border: solid 1px #333;
    padding: 15px;
}
#law_table th { 
    width: 20%;
}
/*各newsのh2*/
#news_h2 {
    width: 70%;
    margin-top: 2em;
    margin-left: 2em;
    margin-bottom: 0;
    color: #006400;
}
/*お問合せページ*/
#contact_01 {
   width: 70%; 
   margin: 50px;
}
p.float_r {
    width: 40%;
    float: right;
}