@charset "utf-8";
@import "./reset.css";
@import "./module.css";
@import url('https://fonts.googleapis.com/css?family=Noto+Sans+JP');
@import url('https://fonts.googleapis.com/css?family=Noto+Serif+JP');
@import url('https://fonts.googleapis.com/css2?family=Libre+Baskerville&family=Roboto+Slab:wght@400;700&display=swap');
@import url('https://fonts.googleapis.com/css2?family=Crimson+Text:wght@400;700&display=swap');

/*				*/
/*	width 1100px		*/
/*	BP 991px / 992px  	*/
/*	BP 767px / 768px	*/
/*	BP 487px / 488px	*/
/*				*/

@media screen and (max-width: 991px) {}
@media screen and (max-width: 767px) {}
@media only screen and (max-width: 487px) {}


/* slide 調整
-----------------------------------------*/

@media screen and (max-width: 991px) {
	.from_right{
	margin-left : 10% !important;
	}
}

@media screen and (max-width: 767px) {
	.from_right{
	margin-left : 30% !important;
	}
}

@media only screen and (max-width: 487px) {
	.from_right{
	margin-left : 70% !important;
	font-size : 12.5px !important;
	}
}

/* -----------------------------------------------------------
	base setting
----------------------------------------------------------- */

body{
	font-family:"游ゴシック体", YuGothic, "Yu Gothic M", "游ゴシック Medium", "Yu Gothic Medium",'Noto Sans JP','Noto Serif JP',Arial, Helvetica, sans-serif;
	-webkit-text-size-adjust: 100%;　/* ランドスケープ文字サイズ */
}

/* Windows 用 Medium 指定の游ゴシック */
@font-face {
  font-family: "Yu Gothic M";
  src: local("Yu Gothic Medium");
}
/* font-weight: bold の時は通常どおり Bold 書体を使わせる */
@font-face {
  font-family: "Yu Gothic M";
  src: local("Yu Gothic Bold");
  font-weight: bold;
}

#all{

}

@media screen and (max-width: 991px) {
	#all{
	width : 100%;
	}
}

#main{
	min-height:500px;
	width : 100%;
	margin : 0 auto;
/* 	padding-top : 24vw;*/
	margin-bottom : 80px;
}

@media screen and (max-width: 991px) {
	#main{
	width : 100%;
	}
}

/* h2 page title */

h2{
	font-size : 30px;
	margin : 0 auto;
	margin-top : 30px;
	margin-bottom : 50px;
	padding-bottom :10px;

	background-repeat: no-repeat;
	background-position : 0% 100%;
}

@media screen and (max-width: 767px) {
	h2{
	font-size : 22px;
	}
}

/*　明朝設定　*/
.m_text{
	font-size : 16px;
	font-family:'Noto Serif JP',Arial, Helvetica, sans-serif; 
	font-family: "Yu Mincho", "YuMincho";
}


.m_title{
	text-align : center;
	margin-bottom : 60px;
	font-size : 32px;
	font-family:"Yu Mincho", "YuMincho",'Noto Serif JP','Hiragino Mincho Pro',"メイリオ", sans-serif; 
	color : #000;
}


@media only screen and (max-width: 991px) {
	.m_title{
	font-size : 4vw;
	}
}

@media only screen and (max-width: 487px) {
	.m_title{
	font-size : 20px;
	}
}

/* アンカー調整 */

#koujyou,
#honsya{
  padding-top:120px;
  margin-top:-120px;
}


/* container
-----------------------------------------*/

.container{
	width : 1100px;
	margin : 0 auto;
/*	padding : 0 20px;*/
	margin-bottom : 140px;
}

.container_wide{
	width : 100%;
	margin-bottom : 60px;
}

@media screen and (max-width: 1100px) {
	.container{
	width : 100%;
	padding : 0 0%;
	}
}

@media screen and (max-width: 991px) {
	.container{
	width : 90%;
	padding : 0 5%;
	}
}

.contents_topics{
	background-color: #f3f0e5;
	padding-top : 40px;
	padding-bottom : 40px;
	line-height : 180%;
}

@media screen and (max-width: 991px) {
	.contents_topics{
	font-size : 14px;
	line-height : 150%;
	}
}

/* pp用　container */

.pp_container{
	width : 800px;
	margin : 0 auto;
}

@media screen and (max-width: 991px) {
	.pp_container{
	width : 95%;
	padding : 0 2.5%;
	}
}



/* a LINK
-----------------------------------------*/

a{
  color:#000;
  text-decoration:underline;
  -webkit-transition: 0.3s ease-in-out;
  -moz-transition: 0.3s ease-in-out;
  -o-transition: 0.3s ease-in-out;
  transition: 0.3s ease-in-out;
	padding-bottom : 15px;
}

a:hover{
  text-decoration:none;
	opacity:0.7;
	filter:alpha(opacity=70);
	-ms-filter: "alpha( opacity=70 )";
}

a:hover img {
  opacity: 0.9;
  filter: alpha(opacity=90);
  -moz-opacity: 0.9;
  -webkit-transition: 0.2s linear;
  -moz-transition: 0.2s linear;
  -o-transition: 0.2s linear;
  transition: 0.2s linear;
}

.container a {
  position: relative;
  display: inline-block;
  text-decoration: none;
}
.container a::after {
  position: absolute;
  bottom: 0px;
  left: 0;
  content: '';
  width: 100%;
  height: 1px;
  background: #333;
  transform: scale(0, 1);
  transform-origin: right top;
  transition: transform .5s;
}
.container a:hover::after {
  transform-origin: left top;
  transform: scale(1, 1);
}

.white_link{

}

.white_link a {
  position: relative;
  display: inline-block;
  text-decoration: none;
}
.white_link a::after {
  position: absolute;
  bottom: 0px;
  left: 0;
  content: '';
  width: 100%;
  height: 1px;
  background: #fff;
  transform: scale(0, 1);
  transform-origin: right top;
  transition: transform .5s;
}
.white_link a:hover::after {
  transform-origin: left top;
  transform: scale(1, 1);
}


/* リンクホバー 設定 */

a.arrowB{
	text-decoration : none;
	background-image : url("../images/common/arrow_blk.svg");
	background-position: 85px -25px;
	background-repeat : no-repeat;
	padding-right : 24px;
}



.features2 {
     text-align: left;
	padding-left : 40px;
}
 
.features2 span{
     position: relative;
     display: inline-block;
     padding: 0 0.5em;

}
      
.features2 span::before, .features2 span::after{
     position: absolute;
     top: 50%;
     content: '';
     width: 1.5em;
     height: 1px;
     background-color: black;
}
 
.features2 span::before {left: 100%;}
.features2 span::after { right: 100%;}

ul.features_li{
margin-left : 34px;
margin-top : 10px;
list-style-type: square;
list-style-position: outside;
}

a.arrow{
	text-decoration: none;
}

a.arrow img{
	vertical-align : -60% ;
}


/* -----------------------------------------------------------
	Header Footer setting
----------------------------------------------------------- */

/* Header
-----------------------------------------*/

#Header{
	position: fixed;
	top: 0;
	background : #fff;
	height : 100px;
	width : 100%;
	z-index: 10000;
	background : rgba(255,255,255,0.95);
	box-shadow: 0px 0px 16px -5px rgba(32, 41, 45, 0.3);
}

#Header_inner{
	margin: 0 auto;
	position: relative;
	max-width : 1100px;
	height : 100px;
}

@media screen and (max-width: 991px) {
	#Header{
	height : 60px;
	}
	#Header_inner{
	height : 60px;
	}
}

/* logo */
#Header h1#logo{
	position: relative;
	top: 20px;
	right: 0;

}

#Header h1#logo img{
	width : 300px ;
}


@media screen and (max-width: 991px) {
	#Header h1#logo{
	position: relative;
	top: 0px;
	right: 0;
	}

	#Header h1#logo img{
	width : 260px;
	}
}

/* Footer
-----------------------------------------*/

Footer{
	background-color:#eee;
	font-size : 13px;
	margin-top : 0px;
}

Footer > ul{
	text-align: center;
	padding-top : 30px;
	padding-bottom : 30px;
}

Footer > ul > li{
	display : inline-block;
	margin : auto 10px;
}

Footer > ul > li a{
	color : #333;
	text-decoration : none;
}

Footer .sepa{

}

@media screen and (max-width: 991px) {
Footer .sepa{
	display: none;
	}
}

p.copy{
	text-align : center;
	font-size : 12px;
}


/* -----------------------------------------------------------
	Effect setting
----------------------------------------------------------- */

/* pagetopへ表示 */

#page-top {
	position: fixed;
	bottom: 20px;
	right: 20px;
	font-size: 77%;
}

#page-top a {
	background: #00526d;
	text-decoration: none;
	color: #fff;
	width: 80px;
	padding: 30px 0;
	text-align: center;
	display: block;
	border-radius: 5px;

z-index: 999;
}

#page-top a:hover {
	text-decoration: none;
	background: #00698c;
}


@media only screen and (max-width: 487px) {
	#page-top a{
	display : none;
	}
}


/*下から fadein
-----------------------------------------*/

.fadein {
  opacity : 0;
  transform: translateY(30px);
  transition: all 1s;
}

/*下からスライドイン*/

.slidein {
   opacity: 0;
   animation-name: fadein-bottom;
   animation-duration: 1.5s;
   animation-timing-function: ease-out;
   animation-fill-mode: forwards;
}
@keyframes fadein-bottom {
   0% {
      opacity: 0;
      transform: translateY(20px);
   }
   100% {
      opacity: 1;
      transform: translateY(0);
   }
}

.pamphlet{
	text-align : center;
	margin-top : 100px;
}







/* -----------------------------------------------------------
	Nav setting
----------------------------------------------------------- */

.Nav {
  margin-top: 0px;
/*  border-top: solid 1px #F5F4F0;*/
/*  border-bottom: solid 1px #00ff00;*/
height : 0px;



}
@media screen and (max-width: 991px) {
  .Nav {
/*     position: relative; */
  border-top:none;
  }
}

/* Nav Humberger menu
-----------------------------------------*/

.Nav .navbtn {
  display: none;
}
@media screen and (max-width: 991px) {
  .Nav .navbtn {
    display: block;
    position: absolute;
    top: 10px;     /* Humberger position */
    right: 10px;
  }
}
@media screen and (max-width: 991px) {
  .Nav .navbtn a,
  .Nav .navbtn a.close {
    display: block;
    position: relative;
    width: 40px;
    height: 40px;
  			/*	  background-color: none;  Humberger color */
  }
  .Nav .navbtn a::before,
  .Nav .navbtn a.close::before {
    position: absolute;
    top:10px;
    left:10px;
    content:"";
    width: 20px;
    height: 3px;
    background-color: #777;
   transition: .2s;
  }
  .Nav .navbtn a.open::before {
    top:19px;
    transform: rotate(-45deg);
  -webkit-transform: rotate(-45deg);
  }
  .Nav .navbtn a::after,
  .Nav .navbtn a.close::after {
    position: absolute;
    bottom:25px;
    left:10px;
    content:"";
    width: 20px;
    height: 3px;
    background-color: #777;
    transition: .2s;
  }
  .Nav .navbtn a.open::after {
    bottom:33px;
    transform: rotate(-135deg);
  -webkit-transform: rotate(-135deg);
  }
}
@media screen and (max-width: 991px) {
  .Nav .navbtn a.open {
  }
}

@media screen and (max-width: 991px) {
  .Nav .navbtn a span {
    display: block;
    overflow: hidden;
    width: 1px;
    height: 1px;
  }
  .Nav .navbtn a span::after,
  .Nav .navbtn a.close span::after {
    position: absolute;
    top:18px;
    left:10px;
    content:"";
    width: 20px;
    height: 3px;
    background-color: #777;
  }
  .Nav .navbtn a.open span::after {
    display: none;
  }
}

/* Nav menu
-----------------------------------------*/

.Nav ul.close {
  display: none;
  border-top: solid 1px #F5F4F0;
}
.Nav > ul {

/*
  margin: 0 auto;
*/

 max-width: 800px;
	position: absolute;
	top : 16px;
	right: 0px;

}
@media screen and (max-width: 991px) {
  .Nav > ul {
  max-width: 1100px;
    display: none;
    position: absolute;
    top: 60px; /* btn position */
    left: 0;
    right: 0;
    z-index: 9;
   }
}
.Nav > ul > li {
  position: relative;
  font-size: 15px;
  display: inline-block;
}
@media screen and (max-width: 991px) {
  .Nav > ul > li {
    display: block;
    border-bottom: solid 1px #dddddd;
    background-color: rgba(255, 255, 255, 0.9);   /*　pull　base color★ */
  }
}

.Nav > ul > li a {
  display: block;
  position: relative;
  text-decoration: none;
  padding: 19px 25px;
  font-size: 15px;
  color: #000;
font-weight : normal;

  z-index: 2;
}
.Nav > ul > li.parent > a {
  padding-right:25px;
}
.Nav > ul > li.parent > a::before {
    display: block;
    content: "";
    position: absolute;
    top: 50%;
    right: 8px;
    width: 6px;
    height: 6px;
    margin: -6px 0 0 0;
    border-top: solid 2px #00a0e9;
    border-right: solid 2px #00a0e9;
    -webkit-transform: rotate(135deg);
    transform: rotate(135deg);
}
@media screen and (max-width: 991px) {
.Nav > ul > li.parent.open > a::before {
    -webkit-transform: rotate(-45deg);
    transform: rotate(-45deg);
}
}
@media screen and (max-width: 991px) {
  .Nav > ul > li.parent.open {
    border-bottom: none;
  }
}
  .Nav > ul > li.parent.open > a{
    color: #FFF;
  }
  .Nav > ul > li.parent.open > a::after {
  background: #333;
  -webkit-transform: scale(1);
  transform: scale(1);
}
@media screen and (max-width: 991px) {
  .Nav > ul > li.parent.open > a {
    color: #FFF;
  }
}

/*
.Nav > ul > li{

}

.Nav > ul > li a::after {
  position: absolute;
  z-index: -1;
  display: block;
  content: '';
}
.Nav > ul > li a,
.Nav > ul > li a::after {

  -webkit-transition: all .3s;
  transition: all .3s;
}
.Nav > ul > li a::after {
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
}
.Nav > ul > li a:hover::after {

}
*/

/*　hover animation ★ */

.Nav > ul > li a{
  position: relative;
  display: block; /* inline-block defo */
  text-decoration: none;
	text-align : center;
}

.Nav > ul > li a::after {
  position: absolute;
  bottom: 4px;
  left: 0;
  content: '';
  width: 100%;
  height: 1px;
  background: #00698c;
  transform: scale(0, 1);
  transform-origin: right bottom;
  transition: transform .5s;
}

.Nav > ul > li a:hover::after {
  transform-origin: left bottom;
  transform: scale(1, 1);
}

.current{
	 color: #00698c !important;
 	text-decoration : none;
	padding: 19px 25px;
	font-size : 15px !important;
}






/* nav current
-----------------------------------------*/

#home Nav > ul > li.home_cnt a,
#product Nav > ul > li.product_cnt a,
#company Nav > ul > li.company_cnt a,
#greeting Nav > ul > li.greeting_cnt a,
#access Nav > ul > li.access_cnt a,
#contact Nav > ul > li.contact_cnt a{
	position: relative;
	 color: #00698c !important;
 	text-decoration : none;
	padding: 19px 25px;
	font-size : 15px !important;
}

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

	#home Nav > ul > li.home_cnt a,
	#product Nav > ul > li.product_cnt a,
	#company Nav > ul > li.company_cnt a,
	#greeting Nav > ul > li.greeting_cnt a,
	#access Nav > ul > li.access_cnt a,
	#contact Nav > ul > li.contact_cnt a{
	background: #00698c;
	color : #fff !important;
	}

}

#home Nav > ul > li.home_cnt a::after,
#product Nav > ul > li.product_cnt a::after,
#company Nav > ul > li.company_cnt a::after,
#greeting Nav > ul > li.greeting_cnt a::after,
#access Nav > ul > li.access_cnt a::after,
#contact Nav > ul > li.contact_cnt a::after {
  position: absolute;
  bottom: 4px;
  left: 0;
  content: '';
  width: 100%;
  height: 1px;
background: #00698c;

transform:none !important;
}

#home Nav > ul > li.home_cnt a:hover::after,
#product Nav > ul > li.product_cnt a:hover::after,
#company Nav > ul > li.company_cnt a:hover::after,
#greeting Nav > ul > li.greeting_cnt a:hover::after,
#access Nav > ul > li.access_cnt a:hover::after,
#contact Nav > ul > li.contact_cnt a:hover::after {
}


/* 2階層 */
.Nav > ul > li > ul {
  display: none;
  position: absolute;
  top: 53px;
  left: 0;
  width: auto;
			  background-color: rgba(255, 255, 255, 0.8);
  z-index: 9;
}

@media screen and (max-width: 991px) {
  .Nav > ul > li > ul {
    background-color: #fbfbfb;
    position: static;
  }
}

.Nav > ul > li > ul li {
  white-space: nowrap;
}

.Nav > ul > li > ul li a {
  position: relative;
  padding: 12px 27px 12px 27px;
}
@media screen and (max-width: 991px) {
  .Nav > ul > li > ul li a {
    border-bottom: solid 1px #dddddd;
    background-color: #EEE;
  }
}
.Nav > ul > li > ul li a::before {
    display: block;
    content: "";
    position: absolute;
    top: 50%;
    left: 10px;
    width: 6px;
    height: 6px;
    margin: -6px 0 0 0;
    border-top: solid 2px #00a0e9;
    border-right: solid 2px #00a0e9;
    -webkit-transform: rotate(45deg);
    transform: rotate(45deg);
}
.Nav > ul > li > ul li a:hover {
  text-decoration: underline;
}

@media screen and (max-width: 991px) {
  .Nav > ul > li > ul li a:hover {
    background-color: #FFF;
  }
}

.Nav > ul > li > ul li ul li a {
  padding-left: 42px;
}
.Nav > ul > li > ul li ul li a::before {
    left: 20px;
}


/* -----------------------------------------------------------
	TOPページ
----------------------------------------------------------- */

/* TOP slider */

.slider{
	margin-bottom : 100px;
	box-shadow: 0px 0px 16px -5px rgba(32, 41, 45, 0.8);
}

.slider img{
	width:100%;
}

.top_main{
}

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

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

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

.top_news{
	margin-bottom : 60px;
}


/* TOP タイトル */

.title_box{
	margin-bottom : 40px;
	text-align : center;
}

.title_box p{
	font-size : 24px;
	margin-bottom : 24px;	
	font-family: 'Roboto Slab','Libre Baskerville','Noto Sans JP', serif;
}

.title_box .title_line{
	width : 78px;
	margin : 0 auto;
	border-bottom : 1px solid #000;
}

/* TOP About */

.about_us_txt{
	text-align : center;
	font-size : 14px;
	line-height : 200%;
	letter-spacing : 6px;
}



@media only screen and (max-width: 991px) {
	.about_us_txt{
	line-height : 180%;
	text-align : left;
	}
}




/* TOP Ploduct */

.top_ploduct_area img{
	width : 100%;
}

.top_ploduct_area{
	position : relative;
	width : 100%;
/*	background : #6c981b;*/
}

.oneArea {
  display: flex;
  flex-direction: row;
/*  background: #FFEB3B;*/
}

.oneArea .oneBox {
	position : relative;
  width: 50%;
  border: 1px solid #fff;
  background: #fff;
  box-sizing: border-box;
  color: #000;
  font-size: 1.5rem;
  text-align: center;
  padding: 0px;
  margin-right: 0%;
}

.oneArea .oneBox a{
 background-color: rgba(0,0,0,0.0);
text-shadow: 4px 4px 5px #000; 
}

@media screen and (max-width: 767px) {
	.oneArea {
	display: block;
	}
	.oneArea .oneBox {
	width: 90%;
	margin : 0 auto;
	}
}

.ploduct_item_l{
	position: absolute;
	top:  45%;
	left:  38%;
	font-size: 18px;
}

.ploduct_item_r{
	position: absolute;
	top:  45%;
	font-size: 18px;
	right:  38%;
}

@media screen and (max-width: 991px) {
	.ploduct_item_l{
	left:  28%;
	}
	.ploduct_item_r{
	right:  28%;
	}
}

@media screen and (max-width: 767px) {
	.ploduct_item_l{
	left:  38%;
	}
	.ploduct_item_r{
	left:  38%;
	right:  auto;
	}
}

.ploduct_item_r a,.ploduct_item_l a{
	color : #fff;
}

.ploduct_bg img{
	width : auto !important;
}

.txt-space1{
	letter-spacing : 1px;
}

.txt-space2{
	letter-spacing : 5px;
}

.txt-space3{
	letter-spacing : 12px;
}

/* TOP Ploduct-title */

.top_ploduct_title_box{
	z-index: 999;
	position: absolute;
	top:  0;
	bottom:  0;
	left:  0;
	 right:  0;
	margin:  auto; 
	width : 30%;
	height : 104px;
	background : #fff;
	padding-top : 40px;
}

.top_ploduct_title_box_sp{
	display : none;
}

@media screen and (max-width: 767px) {
	.top_ploduct_title_box{
	display : none;
	}

	.top_ploduct_title_box_sp{
	display : block;
	}
}

/* TOP Contact */

.contact{
	height : 260px;
	background-image: url(../images/top/contact_bg.jpg);  
	background-repeat : no-repeat;
	background-size:  cover; 
	padding-top : 72px;
	padding-bottom : 72px;
	color : #fff;
}

.contact_txt{
	text-align : center;
	font-size : 14px;
	line-height : 200%;
	letter-spacing : 6px;
	padding-right : 5px;
	padding-left : 5px;
}

@media screen and (max-width: 991px) {
	.contact_txt{
	width : 90%;
	text-align : left;
	padding-right : 5%;
	padding-left : 5%;
	}
}

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

	.contact_txt{
	font-size : 15px;
	line-height : 160%;
	letter-spacing : 1px;
	}
}

.contact .title_box .title_line{
	border-bottom : 1px solid #fff;
}

.contact a{
	color : #fff;
}

/* TOP 最新情報 */

.top_news_box{
	width:80%;
	margin : 0 auto;
}

dl.news_list{
	width:100%;
	overflow:hidden; /*floatしたので高さ確保*/
	border-bottom:1px dotted #ddd;
	border-top:none; /*dt,dd設定とかぶるので*/
	border-left:none; /*dt,dd設定とかぶるので*/
	border-right:none; /*dt,dd設定とかぶるので*/
}

dl.news_list dt{
	width:150px;
	float:left;
	padding:10px 0 10px 10px;
	border-top:1px dotted #ddd;
	color : #666;
	padding-right : 0;
	font-weight : normal !important;
	font-family: 'Crimson Text','Roboto Slab','Libre Baskerville','Noto Sans JP', arial,helvetica,sans-serif;
}

dl.news_list dd{
	margin-left:150px; /*dtの横幅にあわせて(padding含)*/
	padding:10px;
/* 	border-left:1px solid #ccc;*/ /*長くなる要素にあわせて*/
 	border-top:1px dotted #ddd;
	font-weight : normal !important;

}
dl.news_list dd:after{
	clear:both; /*1段ずつfloat解除する設定*/
}

dl.news_list img{
	vertical-align:middle;
}

@media only screen and (max-width: 991px) {
	.top_news_box{
	width:100%;
	margin : 0 auto;
	}
	dl.news_list dt{
	padding:10px 0 0px 0px;
	float:none;
	width:100%;
	}
	dl.news_list dd{
	padding:0px 0 10px 0px;
	margin-left:0; 
	width:100%;
	border-top:none;
	}
}


/* TOP アクセス */


a.to_map{
	margin-top : 50px;
	text-align : center;
}


.access{
	clear : both;
}

.access_wrap{
/*	background : #f2e7ba;*/
	clear : both;
}


/* PC版表示 */

@media screen and (min-width: 488px) {
	.access_wrap{
	display : block;
	}
}

@media screen and (max-width: 487px) {
	.access_wrap{
	display : none;
	}
}





.access_box{
/*	background : #f2d3ba;*/
	width : 480px;
	letter-spacing : 1px;
	font-size : 14px;
}

.box_l{
	float : left;
}

.box_r{
	float : right;
}

@media screen and (max-width: 991px) {
	.box_l,.box_r{
	float : none;
	clear : both;
	margin : 0 auto;
	margin-bottom : 30px;
	font-size : 13.5px;
	letter-spacing : 0px;
	}

}

@media screen and (max-width: 991px) {
	.box_l,.box_r{
	margin-bottom : 30px;
	font-size : 13.5px;
	letter-spacing : 0px;
	}
}

.access_sepa{
/*	background : #f2bad6;*/
	margin : 0px;
	float : left;
	padding : 0 25px 0 25px;
	margin-bottom : 30px;
}

p.access_area{
	text-align : center;
	margin-bottom : 20px;
}

.access_item{
	text-align : right;
}

.access_line{
	border-left : 1px solid #444;
}


/* スマホ版 */

@media screen and (min-width: 488px) {
	.access_wrap_sp{
	display : none;
	}
}

@media screen and (max-width: 487px) {
	.access_wrap_sp{
	display : block;
	}
}

.access_wrap_sp dd{
		margin-bottom : 10px;
}


/* -----------------------------------------------------------
	Contentsページsetting
----------------------------------------------------------- */
/* 各IMAGE調整 */

.main_imege{
	margin-bottom : 60px;
	box-shadow: 0px 0px 16px -5px rgba(32, 41, 45, 0.8);
}

@media screen and (max-width: 991px) {
	.main_imege{
	height : 310px !important;
	}
}
@media screen and (max-width: 767px) {
	.main_imege{
	height : 210px !important;
	}
}


/* ploducページ menu */

.container .title_box {
}

.product_box img{
	display: inline-block;
	box-shadow: 0px 0px 16px -5px rgba(32, 41, 45, 0.8);
}

/* ploduc menu */

.product_menu{
	width : 100%;
/*	height : 42px;*/ 
/*	background : #ccc;*/ 
	margin-top : 80px;
	margin-bottom : 80px;
	text-align : center;
	font-size:0;

}

.product_menu_btn li{
  position: relative;

	display: inline-block;
	background : #00526d;
	width : 214px;
	height : 42px;
	color : #fff;
	line-height : 42px;
	margin : 1px 1px 1px 1px;
	font-size:14px !important;
}

.product_menu_btn li a{
	margin : 0;
	padding : 0;
	display: inline-block;
	width : 214px;
	height : 42px;
	color : #fff;
	text-decoration : none;
    background-size: 200% 100%;	
    background-image: -webkit-linear-gradient(left, transparent 50%, rgba(0, 105, 140, 1) 50%);	
    background-image: linear-gradient(to right, transparent 50%, rgba(0, 105, 140, 1) 50%);
    -webkit-transition: background-position 1.6s cubic-bezier(0.19, 1, 0.22, 1) .0s, color .0s ease 0s, background-color .0s ease;
    transition: background-position 1.6s cubic-bezier(0.19, 1, 0.22, 1) .0s, color .0s ease 0s, background-color .0s ease;
}

.product_menu_btn li a:hover{
opacity:1; 
	color : #fff !important;
    background-position: -100% 100%;
}
.p_current{	margin : 0;
	padding : 0;
	display: inline-block;
	width : 214px;
	height : 42px;
	color : #fff;
	text-decoration : none;
	background : #00698c !important;
}

/* ploductページ set */

.product_box{
	margin : 0 auto;
	width : 880px;
	background : #fbfbfb;
	padding : 6%;
	clear : both;
	margin-bottom : 10px;
	box-sizing: border-box;
}

.product_box_left{
	float : left;
	margin-right : 6%;
}

.product_box_left img{
	width : 154px;
}

.product_box_right{
	float : left;
	width : 490px;
	min-height : 100px;
	padding-left : 6%;
/* 	border-left : 1px dotted #333; */ 
/* 	background : #aaa;*/ 
}

.item_name{
	font-size : 22px;
	margin-bottom : 20px;
	color : #666;
	border-bottom : 1px solid #ddd;
	font-family: 'Roboto Slab','Libre Baskerville','Noto Sans JP', serif;
	padding-bottom : 15px;
}

.item_txt{
	font-size : 15px;
	line-height : 200%;
}

.mini_subtxt{

	font-size : 17px;
	padding-left : 14px;
}

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

	.product_box{
	width : 100%;
		padding-left : 0%;
	padding-right : 0%;
	}

	.product_box_left{
	float : none;
	text-align : center;
	margin : 0 auto;
	margin-bottom : 40px;
	}

	.product_box_right{
	min-height : auto;
	float : none;
	width : 100%;
	padding-left : 0%;
	}

	.product_box_left img{
/*	width : 100%;*/
	}

	.item_name{
	text-align : center;
	}

	.item_txt{
		width : 80%;
	margin : 0 auto;
	}
}

@media screen and (max-width: 767px) {
	.item_name{
	font-size : 22px !important;
	margin-bottom : 4%;
	}
	.item_txt{
		width : 100%;
	margin : 0 auto;
	}
}

.read{
	text-align : center;
	line-height :200%;
	margin-bottom : 40px;
}

@media screen and (max-width: 991px) {
	.read{
	text-align : left;
	}
}



.product_set{
	display: flex;
	flex-direction: row;
}

.product_set_mini{
	width : 30.8%;
	min-height : 200px;
	text-align : center;
	margin-bottom : 80px;
	margin-left : 1%;
	margin-right : 1%;
}

.product_set_mini li{
	font-family: 'Roboto Slab',"ariel","YuGothic","Yu Gothic","Meiryo","ヒラギノ角ゴ",sans;

}

.addition {
	border-left : 2px solid #00526d;
	padding-left : 30px;
}

@media screen and (max-width: 767px) {
	.product_set{
	display: block;
	}
	.product_set_mini{
	margin : 0 auto;
	margin-left : auto;
	margin-right : auto;
	margin-bottom : 60px;
	width : 90%;
	}
}

.set_name{
	font-size : 20px;
	margin-bottom : 10px;	
	margin-top : 10px;
}

.product_set_mini ul{
	margin-top : 20px;
}

.product_set_mini li{
	line-height : 180%;
}


/* 写真 設定 (製品) */

.photo_products{
	display:flex;
	width : 800px;
	margin : 0 auto;
}

.prod-item img {
	padding : 5%;
	width : 86%;
/*	border :5% solid #fff;*/
}

@media screen and (max-width: 991px) {
	.prod-item img {
	width : 100% !important;
	padding-top : 20px;
	padding-bottom : 20px;
	}

	.photo_products{
	display:block;
	width : 100% !important;
	}

}


/* -----------------------------------------------------------
	Contentsページ 
----------------------------------------------------------- */

/* 会社概要
-----------------------------------------*/

.company_image_bg{
	height : 430px;
	background:url(../images/company/company_image.jpg) no-repeat center center;
	background-size:cover;



}

.company_box{
	width : 800px;
	margin : 0 auto;
	margin-bottom : 40px;	
}

@media only screen and (max-width: 991px) {
	.company_box{
	width : 100%;
	margin : 0 auto;
	}
}

.yakuin_dd{
	display : inline-block;
	width : 130px;
}


/* 本社 工場 */




.features3 {
     text-align: center;
	padding-top : 40px;
	margin-bottom : 20px;

}
 
.features3 span{
     position: relative;
     display: inline-block;
     padding: 0 0.5em;
	font-size : 20px !important;
}
      
.features3 span::before, .features3 span::after{
     position: absolute;
     top: 50%;
     content: '';
     width: 2em;
     height: 1px;
     background-color: #666;
}
 
.features3 span::before {left: 100%;}
.features3 span::after { right: 100%;}








/* 表 */

dl.dl-list{
	width:100%;
	overflow:hidden; 
	border-bottom:1px dotted #ccc;
	border-top:none; 
	border-left:none; 
	border-right:none; 
}

dl.dl-list dt{
	width:250px;
	float:left;
	padding:20px 0 20px 100px;
	border-top:1px dotted #ccc;
	color : #000;
	padding-right : 0;
	font-weight : normal !important;
}

dl.dl-list dd{
	margin-left:340px; /*dtの横幅にあわせて(padding含)*/
	padding:20px;
/* 	border-left:1px solid #ccc;*/ /*長くなる要素にあわせて*/
 	border-top:1px dotted #ccc;
	font-weight : normal !important;

}
dl.dl_list dd:after{
	clear:both; /*1段ずつfloat解除する設定*/
}

dl.dl-list img{
	vertical-align:middle;
}

@media only screen and (max-width: 991px) {
	dl.dl-list dt{
	padding:15px 0 5px 0px;
	float:none;
	width:100%;
	}

	dl.dl-list dd{
	padding:5px 0 15px 0px;
	margin-left:0; 
	width:100%;
	border-top:none;
	}
}

/* 写真 設定 */

.photo{
	display:flex;
}

.p-item img {
	padding : 10px;
}

@media screen and (max-width: 991px) {
	.photo{
	display:block;
	}

	.p-item img {
	width : 90%;
	padding : 5%;
	}
}

/* パンフレット */
.pamphlet{
	padding : 20px;
	border : 1px solid #444;
	width : 70%;
	margin : 0 auto;
	margin-top : 40px;
}
@media only screen and (max-width: 991px) {
	.pamphlet{
	width : 90%;
	padding : 5%;
	}
}

@media only screen and (max-width: 487px) {
	.pamphlet{
	font-size : 12.5px;
	}

}


/* ご挨拶
-----------------------------------------*/

.greeting_image_bg{
	height : 530px;
	background:url(../images/greeting/greeting_image.jpg) no-repeat center center;
	background-size:cover;
}

.greeting_wrap{
	padding-left : 100px;
	padding-right : 100px;
	margin : 0 auto;
}

@media only screen and (max-width: 991px) {
	.greeting_wrap{
	padding-left : 2%;
	padding-right : 2%;

	}
}




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

}

.greeting p{
	margin-bottom : 20px;
	letter-spacing : 3px;
	line-height : 220%;
}

@media only screen and (max-width: 991px) {
	.greeting p{
	line-height : 180%;
	}

}

.ceo{
	float : right;
}

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

.ceo img{
	width : 90%;
}
}


/* アクセス
-----------------------------------------*/


/* main image */




.access_image_bg{
	height : 530px;
	background:url(../images/access/access_image.jpg) no-repeat center center;
	background-size:cover;
}


.access_img{
	
}

@media screen and (max-width: 767px) {
	.access_img{
	width : 90%;
	}
}

.location{
	text-align : center;
	margin-top : 40px;
	margin-bottom : 40px;
	line-height : 200%;
}

.transportation{
	padding : 20px;
	border : 1px solid #000;
	width  : 500px;
	margin-bottom : 40px;
	margin : 0 auto;
	text-align : center;
}


@media screen and (max-width: 767px) {
	.transportation{
	width  : 90%;
	padding : 5%;
	font-size : 13px;
	}
}





.transportation span.line{
	display : inline-block;
	width : 200px;
	background : #ff0000;
}





/* 織金網
-----------------------------------------*/

.orikanaami_image_bg{
	height : 530px;
	background:url(../images/product/orikanaami/orikanaami_image.jpg) no-repeat center center;
	background-size:cover;
	margin-bottom : 40px;
}

.item_eng{
	font-size : 18px;
	font-family: 'Roboto Slab',"ariel","YuGothic","Yu Gothic","Meiryo","ヒラギノ角ゴ",sans;
	color :#444;
}


/* 打版金網
-----------------------------------------*/

.dabankanaami_image_bg{
	height : 530px;
	background:url(../images/product/dabankanaami/dabankanaami_image.jpg) no-repeat center center;
	background-size:cover;
	margin-bottom : 40px;
}

/*特長*/

.features{
	text-align : center;
	margin-bottom : 40px;
}

.features {
     text-align: center;
}
 
.features span{
     position: relative;
     display: inline-block;
     padding: 0 0.5em;
}
      
.features span::before, .features span::after{
     position: absolute;
     top: 50%;
     content: '';
     width: 2em;
     height: 1px;
     background-color: #666;
}
 
.features span::before {left: 100%;}
.features span::after { right: 100%;}

.features_list{
	text-align : center;
	margin-bottom : 40px;
	line-height : 200%;
}

@media screen and (max-width: 991px) {
	.features_list{
	text-align : left;

	}
}




.img_center{
	text-align : center;	
}

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

	p.features{
	margin-bottom : 40px;
	line-height : 120%;
	}
}




/* 加工方法
-----------------------------------------*/

.kakouhouhou_image_bg{
	height : 530px;
	background:url(../images/product/kakouhouhou/kakouhouhou_image.jpg) no-repeat center center;
	background-size:cover;
	margin-bottom : 40px;
}

/* その他
-----------------------------------------*/

.sonota_image_bg{
	height : 530px;
	background:url(../images/product/sonota/sonota_image.jpg) no-repeat center center;
	background-size:cover;
	margin-bottom : 40px;
}

/* ご利用規約
-----------------------------------------*/

.agreement_image_bg{
	height : 530px;
	background:url(../images/agreement/agreement_image.jpg) no-repeat center center;
	background-size:cover;
	margin-bottom : 40px;
}

.agreement p{
	line-height : 250%;
}

.agreement_riyou{
	text-align : center;
	font-size : 14px;
	margin-bottom : 40px;
}
.agreement h3{
	margin-bottom : 30px;
}


.features_txt{

}

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

	.features_txt{
	line-height : 180% !important;
	}

}

.ijyou{
	
}

.ijyou li{
	text-align : right;

}







/* 個人情報の取扱い
-----------------------------------------*/

.privacy_image_bg{
	height : 530px;
	background:url(../images/privacy/privacy_image.jpg) no-repeat center center;
	background-size:cover;

}

.preamble{
	margin-bottom : 80px;
}

.privacy h3{
	margin-bottom : 30px;
}

.p_box{
	margin-left : 38px;
	margin-bottom : 40px;	
}

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

	.p_box{
	margin-left : 10px;
	margin-bottom : 40px;	

	}

	.p_box ol{
	marker-offset:1em;
	}
	.p_box p{
	line-height : 150% !important;
	}
}

.p_space{
	display : inline-block;
	margin-left : 26px;
}

@media screen and (max-width: 767px) {
	.p_space{
	margin-left : 5px;
	}
}



.seitei{
	margin-bottom : 40px;
}

.seitei li{
	text-align : right;
	font-size : 14px;
	line-height : 140%;
}



/* -----------------------------------------------------------
	pamphletページ 
----------------------------------------------------------- */

ul.p_list{
	padding : 0 50px 100px;
	width : 400px;
	margin : 0 auto;
}

ul.p_list{
	list-style-type: square;
	list-style-position:outside;
}


ul.p_list li{
	margin-bottom : 10px;
}


@media screen and (max-width: 768px) {
	ul.p_list{
	padding : 0 0% 50px;
	width : 95%;
	}
}

.container ul.p_list li a{
	text-decoration: none;
	transition: .3s;
	color : #00526d;
position:static;
  display: inline;
	}

.container ul.p_list li a:hover{
  text-decoration: none;

	}


.container ul.p_list li a::after {

  background: none;

}

.container ul.p_list li a:hover::after {
  transform-origin: none;
  transform: none;
}



.p_list span{
	color : #00526d;
	padding-right : 10px;
	font-size : 80%;
	vertical-align : center;
}



.r_company{
	border : 1px solid #444;
	padding : 20px 10px 10px;
	text-align : center;
	width : 400px;
	margin : 0 auto;

}

@media screen and (max-width: 487px) {
	.r_company{
	width : 100%;
	padding : 20px 0 10px;
	font-size : 80%;
	}
}




.te_list{
	list-style-type: square;
	list-style-position:outside;
}



/* -----------------------------------------------------------
	Other 
----------------------------------------------------------- */

/* clearfix
-----------------------------------------*/

/* for modern brouser */
.clearfix:after {
  content: ".";
  display: block;
  clear: both;
  height: 0;
  visibility: hidden;
}
/* IE7,MacIE5 */
.clearfix {
  display: inline-block;
}
/* WinIE6 below, Exclude MacIE5 \*/
* html .clearfix {
  height: 1%;
}
.clearfix {
  display: block;
}

/* Module
-----------------------------------------*/
/* PCで非表示 */
.sp_blk{
	display: none;
}

@media only screen and (max-width: 991px) {
	.sp_blk{
	display: block;
	}
}

/* PCで改行キャンセル */
@media screen and (min-width: 768px){
	.br-sp {
	display: none; 

	}
}

/* boxshadow */
.boxshadow{
	box-shadow: 0px 0px 16px -5px rgba(32, 41, 45, 0.6);
}

/* スマホで改行キャンセル */

@media screen and (max-width: 991px) {
    .nobr-sp { display:none; }
}

@media screen and (max-width: 487px) {
    .nobr-sp487 { display:none; }
}