@charset "utf-8";

/* <MODULE> */
.sp{ display: none; }
.pc{ display:inherit; }
/* </ MODULE> */

/* <LAYOUT> */
#offcanvas-layer, #offcanvas-menu, #offcanvas-button {
  display: none;
}
#wrapper{
	text-align: left;
  position: relative;
}
/* </ LAYOUT> */


#jsWarning{
	position:fixed;
	bottom:0px;
	width: 100%;
	line-height: 20px;
	font-size: 10px;
	text-align: center;
	color: #fff;
	background-color: #900;
	padding-left:1em;
}
	
	
	
h3,h4{
	font-family: "ヒラギノ明朝 Pro W3", "Hiragino Mincho Pro","ＭＳ Ｐ明朝", "MS PMincho", serif;
	line-height:1.4
}
	
#kesennuma h3,
#fukahire h3,
#business h3,
#company h3,
#system h3{
	line-height:1.8;
	letter-spacing:0.1em;
}

#kesennuma .div_con h3,
#fukahire .div_con h3,
#business .div_con h3,
#company .div_con h3,
#system .div_con h3{
	line-height:1.4;
	letter-spacing:0.0em;
}


.div_main a:hover img,
.div_side .ul_bnr li a:hover img,
#div_footer .ul_nav li a:hover img,
.div_main ul .bl-hover img{
	filter:alpha(opacity=50); opacity:0.5;
}


#top .div_p ul li a,
#product00 .div_main .div_sub a,
#product00 .div_main .div_link ul li a,
#recipe .div_main ul li p a,
#recipe00 .div_recipe_material .div_pro_sub ul li a,
#recipe00 .div_main .div_link ul li a,
#product .div_w_sub li a,
#product .div_p_w .div_pro li a{
	background:url(../img/a1.gif) no-repeat left center;
	padding-left:15px;
}


#business .div_main .div_tel h3,
#company .div_main h4,
#mission .div_p h4,
#contact .div_main .div_tel h3,
#contact .div_print h3,
#privacy .div_con .div_tel h4,
#system .div_tel h3,
#product00 .div_p_paragraph h4,
#product00 .div_main .div_sub h3,
#recipe00 .div_recipe h3,
#recipe00 .div_main .div_link h3,
#voice .div_p h5,
#product .div_p_w .div_pro h4{
	font-size:16px;
	background:url(../img/bg_h2.gif) no-repeat left center;
	padding-left:17px;
}

#business .div_con table td.td_h span,
#product00 .div_main .div_sub h4{
	background:url(../img/bg_h3.gif) no-repeat left center;
	padding-left:17px;
}

#safety .div_c h4,
#sitemap .div_main h3{
	font-size:14px;
	background:url(../img/bg_h2.gif) no-repeat left center;
	padding-left:17px;
}







#vi{
	width:960px;
	margin:auto;
}

.ul_path{
	background:url(../img/path.gif) no-repeat left top;
	padding:5px 10px 10px;
}
.ul_path li{
	display:inline-block; /display:inline; /zoom:1;
	font-size:10px;
}
.ul_path li a,
.ul_path li.nolink{
	background:url(../img/path_li.gif) no-repeat right center;
	padding-right:10px;
	margin-right:5px;
}



.ul_side{
	border-top:#cec8c7 1px solid;
	margin-bottom:30px;
}
.ul_side li{
	border-bottom:#cec8c7 1px solid;
	background:url(../img/side/li.gif) no-repeat left top;
}
.ul_side li a{
	display:block;
}
.ul_side li a:hover{
	background:url(../img/side/li_on.gif) no-repeat left top;
}

.ul_side li ul{
	border:none;
	/*display:none;*/
}
.ul_side li ul li{
	border:none;
}
.ul_side li ul li a{
	background:url(../img/side/s.gif) no-repeat left top;
	display:block;
	_height:40px;
}
.ul_side li ul li a:hover{
	background:url(../img/side/s_on.gif) no-repeat left top;
}
.ul_side li ul li a.sub{
	background:url(../img/side/s_sub.gif) no-repeat left top;
	display:block;
	_height:40px;

}
.ul_side li ul li a.sub:hover{
	background:url(../img/side/s_sub_on.gif) no-repeat left top;
}



.ul_side li .ac_head{
	margin-top:-54px;
	height:54px;
	width:40px;
	margin-left:auto;
	_display:none;
	background:url(../img/side/ac.png) no-repeat right center;
	z-index:999;
	position:relative;
}
.ul_side li .ac_head:hover {
	filter:alpha(opacity=50); opacity:0.5;
}

.ul_side li .active {
	background:url(../img/side/ac_on.png) no-repeat right center;
}



.ul_side li .ac_cont{
	display: none;
}





.ul_bnr li{
	margin-bottom:10px;
}
.ul_bnr li:last-child {
	margin-bottom:0px;
}



.div_sec{
	width:960px;
	margin:auto;
	overflow:hidden; /zoom:1;
}
.div_main{
	float:left;
	width:720px;
}

.div_main h3{
	font-size:16px;
	margin-bottom:5px;
}

.div_main .div_con{
	background: url(../img/bg_h.gif) no-repeat left top;
	overflow:hidden; /zoom:1;
	margin-top:50px;
}
.div_main .div_con h3{
	float:left;
	width:170px;
	font-size:16px;
	padding-top:20px;
}
.div_main .div_con .div_c{
	float:right;
	width:550px;
	padding-top:20px;
}




.div_side{
	float:right;
	width:210px;
}
.div_main,
.div_side{
	margin:30px 0px 0px;
	padding-bottom:80px;
	overflow:hidden; /zoom:1;
}


.copy{
	font-size:10px;
	line-height:6;
	text-align:center;
	background:#f5f4f0;
}

#div_header{
	background:url(../img/head/bg.png) repeat-x;
	_background:url(../img/head/bg.gif) repeat-x;
	height:200px;
}

#div_header h1{
	float:left;
	width:161px;
}

#div_header h1 a{
	padding-bottom:20px;
	display:block;
	background: url(../img/head/h1_a.png) no-repeat left bottom;
}

#div_header .div_nav{
	float:right;
	width:750px;
}

#div_header .lead{
	height:17px;
	overflow:hidden;
	font-size:10px;
	text-align:right;
	line-height:17px;
	letter-spacing:0.1em;
	/*font-weight:bold;*/
	color:#ffffff
}
#div_header .tel{
	height:68px;
	overflow:hidden;
	width:397px;
	margin-left:auto;
}
#div_header .tel img{
	display:block;
	margin:10px 0px 2px;
}

#div_header .tel_p{
	line-height:1.4;
	font-size:10px;
}
#div_header .tel_p a{
	font-weight:bold;
}

#div_header .nav_main{
	font-size:0px;
	background:url(../img/head/libg1.gif) no-repeat right top;
	height:56px;
	overflow:hidden;
	text-align: right;
}
#div_header .nav_main ul{
	overflow:hidden; /zoom:1;
}
#div_header .nav_main li{
	float:left;
}


#div_header .nav_sub{
	background:url(../img/head/libg2.gif) no-repeat right top;
	font-size:0px;
	height:30px;
	overflow:hidden;
}
#div_header .nav_sub ul{
	overflow:hidden; /zoom:1;
}
#div_header .nav_sub li{
	float:left;
}
#div_header ul li a:hover img{
	filter:alpha(opacity=0); opacity:0.0;
}



#div_footer{
	height:405px;
	background: url(../img/foot/bg.jpg) no-repeat center bottom;
}

#div_footer .ul_nav{
	font-size:0px;
	text-align:center;
	border-top:#cac4c2 1px solid;
	padding:23px 0px 54px;
}

#div_footer .ul_nav li{
	display:inline;
	margin:0px 9px;
}



#div_footer .div_company{
	overflow:hidden; /zoom:1;
}
#div_footer h2{
	float:left;
	position:relative;
	width:290px;
}
#div_footer h2 span{
	position:absolute;
	top:42px;
	left:67px;
	font-weight:normal;
	letter-spacing:0.1em;
}
#div_footer .tel{
	float:right;
	width:450px;
}

#div_footer .tel_p{
	line-height:1.5;
	font-size:10px;
	margin-top:10px;
}
#div_footer .tel_p a{
	font-weight:bold;
}

#pagetop{
	position: fixed;
	right:0px;
	bottom:0px;
	_display:none;
	z-index:500;
}
#pagetop a:hover img{
	filter:alpha(opacity=50); opacity:0.5;
}

.span_pdf{
	display:block;
	text-indent:-1em;
	padding-left:1em;
	font-size:10px;
}


.ul_side li ul{
	display: none;
}









@media screen and (max-width: 768px) {

html{font-size: 54.6875%;}
	body{
		min-width: 1px;
	}
	img{
		max-width: 100%;
		height: auto;
	}
/* <MODULE> */
.sp{ display: inherit; }
.pc{ display: none; }
/* </ MODULE> */

/* <LAYOUT> */
#offcanvas-layer, #offcanvas-menu, #offcanvas-button {
  display: none;
}
#wrapper{
	text-align: left;
  overflow-x: hidden;
  right: 0;
  min-width: initial;
  padding-top: 52px;
}
#offcanvas-menu {
  display: block;
  position: fixed;
  top: 0;
  right: -240px;
  width: 240px;
  height: 100%;
  z-index: 999999;
  padding-top: 52px;
  overflow-y: auto;
  background: #000;
}
  #offcanvas-menu a {
	color: #fff;
}
  #offcanvas-menu ul {
  margin: 0 16px;
}
  #offcanvas-menu li {
  display: inline;
}
  #offcanvas-menu li a {
  padding: 13px 12px;
  display: block;
  border-bottom: solid 1px #cccccc;
  text-align: left;
  position: relative;
  text-decoration: none;
}
  #offcanvas-menu li a span{
	 margin-left:1rem;
	 font-size:1rem;
  letter-spacing: -0.07em;
  color: #51cceb;
}
  #offcanvas-menu li a:after {
  color: #CEAF5C;
  position: absolute;
  right: 12px;
  top: calc(50% - 1.1rem);
  content: "\f061";
  font-family: "Font Awesome 5 Free";
  font-weight: 900;
}
	
#offcanvas-menu li.art a:after{
	content: '\f063';
  top: calc(50% - 0.9rem);
}
#offcanvas-menu ul li.art ul li a:after {
  content: "\f061";
}
#offcanvas-menu>ul>li.art.close>a:after{
	transform: scale(1, -1);
}
#offcanvas-menu ul ul{
	margin: 0;
	display: none;
}
#offcanvas-menu ul ul li a{
	font-size: 12px;
	padding: 6px 22px 6px 32px;
}
#offcanvas-menu ul ul li a span{
	display: block;
	margin-bottom: 4px;
	font-size: 16px;
}
	
	
	
  #offcanvas-container {
  display: block;
  position: relative;
  top: 0;
  right: 0;
  width: 100%;
}
  #offcanvas-button {
  display: block;
  width: 52px;
  height: 52px;
  position: fixed;
  top: 0px;
  right: 0px;
  z-index: 999999999999;
}
  #offcanvas-button:after {
  content: "MENU";
  color: #fff;
  bottom: 4px;
  position: absolute;
  text-align: center;
  left: 0;
  font-size: 1.2rem;
  font-family: 'Cormorant Garamond';
  width: 100%;
}
  #offcanvas-button span, #offcanvas-button span:before, #offcanvas-button span:after {
  position: absolute;
  top: 50%;
  left: 50%;
  height: 2px;
  width: 25px;
  cursor: pointer;
  background: #fff;
  display: block;
  content: '';
  -webkit-transition: all 500ms ease-in-out;
  transition: all 500ms ease-in-out;
}
  #offcanvas-button span {
  transform: translate3d(-50%, -8px, 0);
  -webkit-transform: translate3d(-50%, -8px, 0);
}
  #offcanvas-button span:before {
  transform: translate3d(-50%, -10px, 0);
  -webkit-transform: translate3d(-50%, -10px, 0);
}
  #offcanvas-button span:after {
  transform: translate3d(-50%, 8px, 0);
  -webkit-transform: translate3d(-50%, 8px, 0);
}
  #offcanvas-button.close {
  background: #000;
}
  #offcanvas-button.close:after {
  content: "";
}
  #offcanvas-button.close span {
  background-color: transparent;
}
  #offcanvas-button.close span:before {
  -ms-transform: translateX(-50%)rotate(45deg);
  transform: translateX(-50%)rotate(45deg);
  -webkit-transform: translateX(-50%)rotate(45deg);
  top: 7px;
  width: 35px;
}
  #offcanvas-button.close span:after {
  -ms-transform: translateX(-50%)translateY(-10px)rotate(-45deg);
  transform: translateX(-50%)translateY(-10px)rotate(-45deg);
  -webkit-transform: translateX(-50%)translateY(-10px)rotate(-45deg);
  top: 17px;
  width: 35px;
}

	#div_header{
	width: 100%;
  position: fixed;
	top:0;
	left: 0;
  z-index: 100001;
	display: block;
		background:url("../img/head/bg-sp.png") repeat;
	color: #fff;
  height: 52px;
	margin: 0;
}
	#div_header h1 {
    float: left;
    width: 52px;
}
	#div_header h1 a {
    padding-bottom: 0;
}
	.div_sec {
    width: auto;
}
	#div_header .div_nav {
    display: none;
}
	.div_main {
    float: none;
    width: auto;
		padding: 0 20px
}
	.div_side {
    float: none;
		margin:50px auto 0;
}
	#div_footer {
    height: 205px;
    background: url(../img/foot/bg.jpg) no-repeat center bottom / contain;
}
	#div_footer .ul_nav{
		display: none;
	}
	#div_footer h2 {
    float: none;
		margin: 15px auto;
}
	#div_footer .tel {
    float: none;
    width: auto;
		text-align: center;
		padding: 0 20px;
}
	#pagetop {
    display: none;
}
	
/* </ LAYOUT> */

#vi {
    width: auto;
}
.div_main .div_con .div_c {
    float: none;
    width: auto;
    padding-top: 20px;
}
	#kesennuma .div_con h3 br,
	#fukahire .div_con h3 br,
	#business .div_con h3 br,
	#company .div_con h3 br,
	#system .div_con h3 br{
    display: none;
}
	#kesennuma h3, #fukahire h3, #business h3, #company h3, #system h3 {
    margin-bottom: 20px;
}
.div_main .div_tel {
    width: auto !important;
    padding: 1px 0px !important;
    border: #cec8c7 1px solid !important;
    margin: 50px auto 0px !important;
}
.div_main .div_tel_sub {
    width: calc(100% - 44px) !important;
    padding: 20px !important;
    border: #e3e0dd 1px solid !important;
    margin: auto !important;
}


}