﻿@charset "utf-8";

/* プロパティー初期化 */
body {-webkit-font-smoothing: subpixel-antialiased;}/*フォントのチラツキを解消*/
body {-webkit-text-size-adjust: 100%;}/*iPhoneの文字サイズ調整リセット*/

html {
	color: #000;
	background: #FFF
}
body, div, dl, dt, dd, ul, ol, li, h1, h2, h3, h4, h5, h6, pre, code, form, fieldset, legend, input, textarea, p, blockquote, th, td {
	margin: 0;
	padding: 0
}
table {
	border-collapse: collapse;
	border-spacing: 0
}
fieldset, img {
	border: 0
}
address, caption, cite, code, dfn, em, strong, th, var {
	font-style: normal;
	font-weight: normal
}
ol, ul {
	list-style: none
}
caption, th {
	text-align: left
}
h1, h2, h3, h4, h5, h6 {
	font-size: 100%;
	font-weight: normal
}
q:before, q:after {
	content: ''
}
abbr, acronym {
	border: 0;
	font-variant: normal
}
sup {
	vertical-align: text-top
}
sub {
	vertical-align: text-bottom
}
input, textarea, select {
	font-family: inherit;
	font-size: inherit;
	font-weight: inherit
}
input, textarea, select {
*font-size:100%
}
legend {
	color: #000
}

/* WordPress ページ用 */
	.pct50{ width: 50%; display: inline-block;}
	.pct50 img{ width: 100%; margin: -1px 0;}
	@media only screen and (max-width: 640px) {
		.ibst01 img{ width: 50vw;}
	}
	.ft0{ font-size: 0; letter-spacing: 0; line-height: 0; margin: 24px 0;}
	.phimg01{padding: 1em 0 3em 0; position: relative;}
	.phimg02{padding: 1em 0 1em 0; position: relative;}
	.midashi_h2{border-top: solid 1px #000; border-bottom: solid 1px #000; padding: 0.6em 1em 0.4em 1em; font-size: 26px;line-height: 1em; letter-spacing: 0.3em; margin-bottom: 0.4em;}
	.midashi_h202{border-top: solid 1px #fff; border-bottom: solid 1px #000; padding: 0.6em 1em 0.4em 1em; font-size: 26px;line-height: 1em; letter-spacing: 0.3em; margin-bottom: 0.4em;}
	.cntnt001{padding: 1.6em;}
	.cntnt002{padding: 1.6em 0;}
	.cntnt001 h3{ font-size: 22px; margin-bottom: 0.4em; letter-spacing: 0.1em;}
	.prt00{ font-size: 0; line-height: 0; letter-spacing: 0;}
	.bgi_cv{ background-position: center; position: relative; background-size: cover;}
	.kurohaikei001{ position: absolute; width: 100%; top: 0; left: 0; height: 100%; background-color: rgba(0,132,189,0.50); transition: all 500ms 0s ease;}
	.bgi_cv:hover .kurohaikei001{ background-color: rgba(0,132,189,0.30);}
	.kurohaikei002{ position: relative;}
	.max_img img{width: 100%;}


html, body {height: 100%; letter-spacing:0.1em; font-size:16px; line-height:2em;}
@media only screen and (max-width: 640px) {
html, body {font-size:14px;}
}
/*cssコンテナ内部全てを含めた横幅にする＆上部にくっつける*/
div,ul,li{-moz-box-sizing: border-box; box-sizing: border-box; vertical-align:top;}

/*＝＝＝ ＝＝＝*/
.gothic{font-family:"游ゴシック","YuGothic","Hiragino Kaku Gothic ProN","Hiragino Kaku Gothic Pro","ＭＳ ゴシック",sans-serif;}
.mincho{font-family:"游明朝","YuMincho","Hiragino Mincho ProN","Hiragino Mincho Pro","ＭＳ 明朝",serif;}
.mojikan_dai{ letter-spacing:0.3em; line-height:1.6em;}
.font_size14{ font-size:14px;}

.yokohaba00{ font-size:0px;}
.yokohaba{-moz-box-sizing: border-box; box-sizing: border-box; display:inline-block; vertical-align:top;}

img{ max-width:100%; height:auto;}

body{ font-family:"メイリオ", Meiryo, "ヒラギノ角ゴ Pro W3", "Hiragino Kaku Gothic Pro", Osaka, "ＭＳ Ｐゴシック", "MS PGothic", sans-serif;}

.yuu_g{font-family:'YuGothic', 'Yu Gothic', 'Hiragino Kaku Gothic Pro', 'Meiryo', sans-serif;}
.yuu_m{font-family: "游明朝体", "Yu Mincho", YuMincho, serif;}
.mai_ryo{ font-family:"メイリオ", Meiryo, "ヒラギノ角ゴ Pro W3", "Hiragino Kaku Gothic Pro", Osaka, "ＭＳ Ｐゴシック", "MS PGothic", sans-serif;}

.fnt_00{ font-size:0;}

a:hover {opacity:0.8;}/*←これはdiv用。（imgはJavaScriptで対応済み）*/
li {list-style: none;}
/*＝＝＝ ＝＝＝*/




head {
margin:0;
background : white;
}
body {
margin:0;
background : white;
}


/* リンクのアンダーライン無し */
a.no-underline {
  text-decoration: none;
}
a.underline-hover:hover {
  text-decoration: underline;


/* リンク */
a{
color: #666;
text-decoration:none;
transition: 0.5s;
-webkit-transition: 0.5s;
-moz-transition: 0.5s;
-o-transition: 0.5s;
-ms-transition: 0.5s;
}

a:hover{
color:#666;
}

a:active, a:focus {
outline: 0;
}

}
/* 均等割り付け */
.table-justify {
  display: flex;
  justify-content: space-between;
}



/* ドキュメントページ用 */
.document-page-container {
    width:80%; 
    height:auto;
    margin-left:10%; 
    margin-right:10%; 
    margin-top:0px;
}
.document-page-section1 {
    width:100%;
    font-size:x-large;
    text-decoration: underline;
}
/* トップメージメッセージ */
.top-page-message-container1,
.top-page-message-container2,
.top-page-message-container3 {
text-align:center;
font-size:2vw;
font-weight: 500;
color:black;
padding:3em 1em;
text-align:center;
letter-spacing:0.2em;
}
.top-page-message-container1 {
line-height: 2em;
color:white;
}
.top-page-message-container2 {
line-height: 1.5em;
padding-top:0px;
padding-bottom:1em;
}
.top-page-message-container3 {
line-height: 1.5em;
padding-top:0px;
padding-bottom:1em;
color:black;
}


/* ナビゲーションメニュー(ロゴ) */
.nv{ 
    width:100%;
    height:auto;
    margin:0;
    position:fixed;
    background-color: #eeeeee;
    opacity: 0.7;
    z-index: 9999;
}

.nv_snslogo{ /* SNSロゴ */
    width:100%;
    padding-right:1em;
    margin:0;
    margin-top:2px;
    background-color : #eeeeee;
    float:right;
    text-align:right;
}
.nv_corplogo{ /* 会社ロゴ */
    background-color : #eeeeee;
    width:40%; 
    margin:0;
    float:left;
    text-align:left;
    display:none;
}
.nv_corplogo img {
    width:25px;
}


/* ナビゲーションメニュー */
.nv-menu-container {
    clear: both;
    display: block;
    justify-content: center;
    text-align:center;
    width:100%;
    height:auto; 
    margin:0; 
    padding-top:10px;
    background-color : #eeeeee;
    vertical-align: bottom;
    line-height: 1.0em;   
}
.nv-menu-container img{
    width:135px;
    height:49px;
    border: solid 3px black;
}

/* カテゴリページ */
.c_page1{
    display: flex;
    mergin-top:1em;
}
.c_page2,.c_page2t{
    /*
    display: flex;
    justify-content: center;
    flex-direction: row;
    flex-wrap: wrap;
    */
    margin-top:0em;
    background:white;
    width:83%;
    height:auto;

    float:left;
    text-align           : center;
}
.c_page2t {
    width:100%;
}
.c_page3, .c_page3t{
    width:300px;
    height:200px;

    padding: 0;
    padding-top:0.2em;
    margin-top:0em;
    margin-left:0.7em;
    margin-right:0.7em;
    margin-bottom:1.5em; 
    color: #5d627b;
    background: white;
    border-top: solid 5px #eec06e;
    box-shadow: 2px 2px 2px 2px rgba(0,0,0,0.22);

    display              : inline-block;

}

.p_page3, .p_page3t{
    width:250px;
    height:300px;

    text-align:center;
    padding: 0;
    padding-top:0.2em;
    margin-top:0em;
    margin-left:0.7em;
    margin-right:0.7em;
    margin-bottom:1.5em; 
    color: #5d627b;
    background: white;
    border-top: solid 5px #eec06e;
    box-shadow: 2px 2px 2px 2px rgba(0,0,0,0.22);

    display              : inline-block;

}

/* アイテム内容 */
.c_itemL{
    background: #ffffff;
    width:40%;
    height:150px;
    float:  left;
    padding-left:5px;
    padding-top:5px;
}
.c_itemL img {
    width:145px;
    height:135px;
}

.c_itemR{
    background: #ffffff;
    width:60%;
    height:150px;
    overflow-wrap: break-word;
    overflow:hidden;
    float:  left;
    font-size:18px;
    line-height:1.2em;font-color:#0; padding-top:0em; padding-left:0.2em; padding-bottom:0.2em;
}

.c_itemA{
    background-color: #ffffff;
    width:100%;
    height:150px;
    overflow-wrap: break-word;
    overflow:hidden;
    float:  left;
    line-height:1.2em;font-color:#0; padding-top:0em; padding-left:0.2em; padding-bottom:0.2em;
}

.b-pagelink{
    display: flex;
    justify-content: center;
    flex-direction: row;
    flex-wrap: wrap;
    font-size: 1em; font-weight: bold; text-align:center;text-decoration: none;color:black;
}

.c_list{
    width:15%;
    height:auto;
    float:  left;
    text-align:center;
    font-size:2vw;
    margin-top:0em;
    padding-left:2px;
    background:white;
}
.c_listitem {
    padding: 0.5em 1em;
    margin: 0.2em 0;
    height:2em;
    color: #232323;
    border-left: solid 10px #eec06e;
    border-right: solid 1px #eec06e;
    border-top: solid 1px #eec06e;
    border-bottom: solid 1px #eec06e;
    line-height: 1em;

    white-space: nowrap;
    overflow: hidden;
    text-overflow: clip;
    -webkit-text-overflow: clip; /*Safari用*/
    -o-text-overflow: clip; /*Opera用*/
}
.c_listitem p {
    margin: 0; 
    padding: 0;
}

/* プロダクトリスト */
.product-listitem {
    position:relative;
    padding: 0;
    margin: 0;
    margin-bottom: 5px;
    height:2em;
    text-align:center;
    color: #232323;
    /*background: #fff8e8;*/
    border-left: solid 1px #eec06e;
    border-right: solid 1px #eec06e;
    border-top: solid 1px #eec06e;
    border-bottom: solid 1px #eec06e;
    line-height: 1em;
}
.product-listitem p {
    margin: 0; 
    padding: 0;
}
.product-listitem-text {
  position:absolute;
  top:50%;
  left:50%;
  transform:translate(-50%,-50%);
  width:100%;
}

/* プロダクトアイテム */
.product-item-img{
    position: relative;
    width:250px;
    height:250px;
    float:  left;
    padding:5px;
}
.product-item-simg{
    width:100px;
    height:60px;
    position: absolute;
    top:0px;
    left:0px;
    padding-top:10px;
}
.product-item-simg2{
    width:100px;
    height:100px;
    position: absolute;
    top:0px;
    left:0px;
    padding-top:10px;
}
.product-item-img img{
    width:100%;
    height:100%;
    object-fit:cover;
}
.product-item-title{
    background: white;
    width:100%;
    height:1.5em;
    padding-left:10px;
    float:  left;
    font-size:18px;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
    text-align:left;
}
.product-item-text{
    background: white;
    width:100%;
    height:1em;
    overflow-wrap: break-word;
    float:  left;
    font-size:12px;
    line-height:1.5em;
    padding-left:10px;
}

.product-listitem-header {
    top: 0;
    left: 0;
    height:100%;
    line-height: 1.2em;
    position: absolute;
    width:1em;
    font-size:0.5em;
    text-align:center;
    font-weight: 500;
    word-break: break-all;
    background-color:  #eec06e;
}
.product-item-lstimg{
    width:50px;
    height:50px;
    float:  left;
    padding:5px;
}

/* プロダクトリスト（その他の候補) */
.product-list-A {
    position: relative;
    width:80%;
    height:auto;
    margin:10%;
    margin-top:2em;
    padding: 0.5em 1em;
    border: solid 3px #5d627b;;
    border-radius: 8px;
    float:left;
}
.product-list-A .title {
    position: absolute;
    display: inline-block;
    top: -13px;
    left: 10px;
    padding: 0 9px;
    line-height: 1;
    font-size: 19px;
    background: #FFF;
    color: black;
    font-weight: bold;
}
.product-list-A p {
    margin: 0; 
    padding: 0;
}
.product-list-A .list {
    width 30%;
    color: black;
    display: inline-block;
    margin:10px;
}

.product-list-I {
    position: relative;
    width:80%;
    height:auto;
    margin:1em;
    margin-bottom:1em;
    padding: 0.5em 1em;
    border: solid 3px #5d627b;;
    border-radius: 8px;
    float:left;
}
.product-list-I .title {
    position: absolute;
    display: inline-block;
    top: -13px;
    left: 10px;
    padding: 0 9px;
    line-height: 1;
    font-size: 19px;
    background: #FFF;
    color: black;
    font-weight: bold;
}
.product-list-I p {
    margin: 0; 
    padding: 0;
}
.product-list-I .list {
    width 30%;
    color: black;
    display: inline-block;
    margin:10px;

}

.t_main{
    background:white;
    float:  left;    
    width:100%;
    height:auto;
    font-size:medium;
    padding-top:0em;
}
.c_main{
    float:  left;    
    width:100%;
    height:auto;
    font-size:medium;
    padding-top:120px;
}
.h_main{
    background:white;
    float:  left;    
    width:100%;
    height:auto;
    font-size:medium;
}
.t_margin {
    height:7em;
}





/* スライダー */
.s_main{
    width:100%; height:auto; margin:0;padding:0;
    position: relative;
}

.t_sectionR1 {
    position: relative;
    margin-top:25%;
    margin-left:20%;
    width:80%;
    height:80%;
}
.t_sectionR1 img {
    width:80%;
    height:80%;
    max-width:100%;
    max-height:100%;
}
.t_sectionR2 {
    top: -20%;
    left: 0;
    position: absolute;
    width:50%;
    height:60%;
}

.br1 {
  float:left;
  bottom: 0;
  left: 0;
  margin-top:1em;
  margin-bottom:1em;
  padding-left:10%;
  padding-right:10%;
  width: 100%;
  height: 10px;
  content: '';
  background-image: -webkit-repeating-linear-gradient(135deg, #000, #000 1px, transparent 2px, transparent 5px);
  background-image: repeating-linear-gradient(-45deg, #000, #000 1px, transparent 2px, transparent 5px);
  background-size: 7px 7px;
  -webkit-backface-visibility: hidden;
  backface-visibility: hidden;
}

/* ヘダー 左線 */
c_t1 {
  padding: 0.25em 0.5em;/*上下 左右の余白*/
  color: #494949;/*文字色*/
  background: transparent;/*背景透明に*/
  border-left: solid 5px #7db4e6;/*左線*/
}

h5 {
  position: relative;
  display: inline-block;
  padding: 0 55px;
}

h5:before, h5:after {
  content: '';
  position: absolute;
  top: 50%;
  display: inline-block;
  width: 45px;
  height: 2px;
  border-top: solid 1px black;
  border-bottom: solid 1px black;
}

h5:before {
  left:0;
}
h5:after {
  right: 0;
}

.head-border {
    font-size: 24px;
    display: flex;
    align-items: center;
}



/* トップイメージ */
.top-img-container01, 
.top-img-container02, 
.top-img-container03, 
.top-img-container04, 
.top-img-container05, 
.top-img-container06{
    clear:both;
    position: relative;
    width:100%;
    height:auto;;
    margin:0;
    padding:0;
}
.top-img-container01 img,
.top-img-container02 img,
.top-img-container03 img,
.top-img-container04 img,
.top-img-container05 img,
.top-img-container06 img{
    width:100%;
    height:auto;
}

.top-img-container04{
    width:100%;
    height:55%;
}
.top-img-container04 img{
    width:100%;
    height:100%;
    object-fit:cover;
}

/* トップイメージ(アイコン) */
.top-img-circle1,
.top-img-circle2,
.top-img-circle3,
.top-img-circle4,
.top-img-circle5,
.top-img-circle6, 
.top-img-circle7 {
    width: 110px;
    height: 110px;
    color: #000000;
    background: black;
    display: flex;
    justify-content: center;
    align-items: center;
    font-size: 1.2rem;
    border-radius: 50%;
    position: absolute;
    display:none;
}
.top-img-circle1 { top: 50%; left: 45%;}
.top-img-circle2 { top: 30%; left: 45%;}
.top-img-circle3 { top: 30%; left: 45%;}
.top-img-circle4 { top: 40%; left: 45%;}
.top-img-circle5 { top: 25%; left: 45%;}
.top-img-circle6 { top: 30%; left: 45%;}
.top-img-circle7 { top: 30%; left: 45%;}

.top-img-text1 {
    width: 108px;
    height: 108px;
    color: #000000;
    background: #eeeeee;
    justify-content: center;
    align-items: center;
    text-align:center;
    font-size: 1.2rem;
    border-radius: 50%;
}
.top-img-text11 {
padding-top:22px;font-size:small;
}
.top-img-text12 {
font-size:large;
}

/* QuestionAnser */
.QuestionAnser-Q {
  width:100%;
  display:flex;
  position: relative;
  padding: 0.5rem 1.2rem;
  border: 3px solid #d8d8d8;
  border-radius: 10px;
  background: #f9f9f9;
  font-size:16px; font-weight: 500;
}

.QuestionAnser-Q:before {
  position: absolute;
  bottom: -14px;
  left: 1em;
  width: 0;
  height: 0;
  content: '';
  border-width: 14px 12px 0 12px;
  border-style: solid;
  border-color: #d8d8d8 transparent transparent transparent;
}
.QuestionAnser-A {
 font-size:16px; font-weight: 500;
 width:100%;
 padding-left:2em;
 padding-top:1em;
}

/* 会社概要 テーブル */
.th-a {
  width: 100px;
  text-align:center;
  padding:10px 15px;
  font-size:14px;
  border: 1px solid #bbb;
}
.th-a-bn {
  width: 100px;
  text-align:center;
  padding:10px 15px;
  font-size:14px;
  border: 1px solid #bbb;
  border-bottom:none;
}
.th-a-tn {
  width: 100px;
  text-align:center;
  padding:10px 15px;
  font-size:14px;
  border: 1px solid #bbb;
  border-top:none;
}

.th-b {
  width: 500px;
  padding-left:10px;
  font-size:14px;
  text-align:left;
  line-height:1.3em;
  border: 1px solid #bbb;
}

.th-b-tn {
  width: 500px;
  padding-left:10px;
  font-size:14px;
  text-align:left;
  line-height:1.3em;
  border: 1px solid #bbb;
  border-top:none;
}

.tb {
  width: 100%;
  background:#FFFFEE;
}

/* 原材料表示テーブル */
.th-rm-a0 {
  text-align:center;
  font-size:14px;
  border: 1px solid #bbb;
  padding-left:5px;
}
.th-rm-a1 {
  width:150px;
  text-align:left;
  font-size:14px;
  border: 1px solid #bbb;
  padding-left:5px;
}
.th-rm-r1 {
  width:150px;
  text-align:right;
  font-size:18px;
  border: 1px solid #bbb;
  border-right: 0px;
}
.th-rm-l1 {
  width:60px;
  text-align:left;
  font-size:14px;
  border: 1px solid #bbb;
  border-left: 0px;
}









/* ページトップへ */
#page-top {
    position: fixed;
    right: 5px;
    bottom: 20px;
    height: 50px;
    text-decoration: none;
    font-weight: bold;
    transform: rotate(90deg);
    font-size: 90%;
    line-height: 1.5rem;
    color: #737373;
    padding: 0 0 0 35px;
    border-top: solid 1px;
}
#page-top::before {
    content: "";
    display: block;
    position: absolute;
    top: -1px;
    left: 0px;
    width: 15px;
    border-top: solid 1px;
    transform: rotate(35deg);
    transform-origin: left top;
}

.t0 {
  width: 100%;
  height:auto;
  background:#FFFAF0;
  /*background: url("./img/topimg/t04.jpg") repeat-y;*/
  /*
   justify-content      : center;
   flex-direction       : row;
   flex-wrap            : wrap;
  */
  text-align           : center;
}
.t1 {
  width: 25%;
  height:auto;
  margin:0;
  margin-right:2%;
  margin-left:2%;
  padding-top:1.5em;
  border-bottom: solid 1px #eec06e;
  display              : inline-block;
}
.t11u {
 width:80%;
 height:16px;
 padding:0;
 margin:0;
 margin-left:10%;
 font-size:16px;
 background:#BDB76B;
 text-align:left;
 line-height:16px;
 overflow:hidden;
}
.t11l {
 width:80%;
 height:auto;
 padding:0;
 margin:0;
 margin-left:10%;
 margin-bottom:1.5em;
 font-size:12px;
 background:#BDB76B;
 text-align:right;
 line-height:12px;
 overflow:hidden;
 border-bottom: solid 2px black;
}


.t12 {
 width:100%;
 height:80%;
}
.img11 {
 border-radius: 50% 0 50% 0;
}
.img12 {
  border-radius: 50% 50% 50% 0;
}
.img13 {
  border-radius: 50% 0 50% 50%;
}
.img14 {
  border-radius: 0 50% 50% 50%;
}
