@charset "UTF-8";

/*
===== CONTENTS ================================================================================

	Index:
  - Base Style
  - Layout
  
===============================================================================================
*/



/* 1: Base Style Setting
----------------------------------------------------------------------------------------------*/

/* Base Setting
==========================================================*/

body { font: 15px/2 "ヒラギノ明朝 ProN W6", "HiraMinProN-W6", "HiraMinProN-W3", "HG明朝E", "ＭＳ Ｐ明朝", "MS PMincho", "MS 明朝", serif;
	   /*letter-spacing:0.1em;*/ margin:0; padding:0; color:#505050;}
	 
a       { text-decoration: underline; color:#717071; }
/*a:hover { text-decoration: none; color:#969696; }*/
a { outline:none;}
img { -ms-interpolation-mode: bicubic; } 
:focus { outline: 0; }


/* main-layout
==========================================================*/

#toppages {}
#wrapper  {background:#E8E8E8;}

#logo { margin:25px auto 0; text-align:center;}

	#menu ul {width:630px; margin:0 auto 35px;}
	#menu li {position: relative; float: left;}
	#menu li img {vertical-align:bottom;}

	
	
	/* ドロップダウンメニュー */
	.drop-menu{margin-right: 20px;}
	.drop-menu:after {
		content: "";
		display: inline-block;
		width: 4px;
		height: 4px;
		border-top: 1px solid #3F3F3F;
		border-right: 1px solid #3F3F3F;
		-webkit-transform: rotate(135deg);
		transform: rotate(135deg);
		position:absolute;
		top: 62%;
		right: -7px;
		transition: 0.2s;
	}
	.drop-menu:hover .drop-menu-list {
		transform: scaleY(1); /* ドロップダウンメニューの表示 */
	}
	.drop-menu a {
		display:block;
		color: #505050;
		font-family: '游ゴシック', sans-serif;
		letter-spacing: 1.3px;
		text-decoration: none;
		padding: 10px 20px;
		box-shadow: 2px 3px 5px 0 rgba(80, 80, 80, .4);
		width: 100px;
	}

	.drop-menu-item {
		background-color: #fff;
		transition: opacity .3s;
	  }
	.drop-menu-item:hover {
		opacity: .8; /* ドロップダウンメニューアイテムのホバー時の不透明度 */
		transition: opacity .3s; /* 不透明度の変化をアニメーション化 */
	}

	.drop-menu_arrow {
		position: relative;
		display: inline-block;
	}
	.drop-menu_arrow::before,
	.drop-menu_arrow::after{
		content: "";
		position: absolute;
		top: 0;
		bottom: 0;
		right: 0;
		margin: auto;
		vertical-align: middle;
	}
	.drop-menu_arrow_r::after{
		right: 15px;
		width: 4px;
		height: 4px;
		border-top: 1px solid #3F3F3F;
		border-right: 1px solid #3F3F3F;
		-webkit-transform: rotate(45deg);
		transform: rotate(45deg);
	}
	
	.drop-menu-list {
		position: absolute;
		left: 0;
		top: 150%;
		transform: scaleY(0); /* ドロップダウンメニューの非表示 */
		transform-origin: center top; /* 変形を適応する基準を設定 */
		transition: transform .3s; /* 表示の変化をアニメーション化 */
		z-index: 1;
		width: 100px!important;
	}
	.drop-menu-item {
		background-color: #fff;
		transition: opacity .3s;
	}


	

#footer { width:1200px; margin:65px auto; font-size:12px; font-family:"ヒラギノ角ゴ Pro W3","Hiragino Kaku Gothic Pro","メイリオ", meiryo,"ＭＳ Ｐゴシック","MS PGothic",Arial, Helvetica, sans-serif;}
	#footer ul.foot_privacy { letter-spacing:normal; color:#808080;}
	#footer ul.foot_privacy li { float:left; margin:0 0 0 30px;}
	#footer ul.foot_privacy li a { color:#808080; text-decoration:none;}
	#footer ul.foot_privacy li a:hover { color:#808080;}
	
#footer .snsArea { float:right; position:relative;}
	#footer .snsArea .fbPosi { position:absolute; top:0; right:120px;}
	#footer .snsArea .twPosi { position:absolute; top:-4px; right:0;}



/* content
==========================================================*/

#content { width:1200px; margin:0 auto; min-height:650px; }
#mainBlock { width:710px; float:left; margin:0; padding:50px 0;}
#sideBlock { width:455px; float:right; padding:50px 0; }
	#sideBlock img { vertical-align:bottom;}
#oneColumnMain { padding:75px 0;}
.lh1{ line-height:1;}



/* WELLFARE
==========================================================*/

.prodttl{margin-bottom: 50px;}
.prodttl h1{font-size: 50px; line-height: 0.7; letter-spacing: 0.08em!important;}
.prodttl h1 span{font-size: 18px; letter-spacing: 0.06em!important;}
.prodttl p{margin-top: 25px; letter-spacing: 0.12em!important;}


#welfarePage .c-colum3 {display: flex; justify-content: space-between; gap: 20px;}
#welfarePage .c-colum3_item {margin-bottom: 30px; background: #fff; width: 380px; border-radius: 15px; font-family: "ヒラギノ角ゴ Pro W3","Hiragino Kaku Gothic Pro","メイリオ", meiryo,"ＭＳ Ｐゴシック","MS PGothic",Arial, Helvetica, sans-serif;}
#welfarePage .c-colum3_item h2{text-align: center; font-size: 18px; margin-bottom: 5px; padding-inline: 30px;}
#welfarePage .c-colum3_item p{text-align: justify; font-size: 14px; padding: 0 30px 35px;}
#welfarePage .c-colum3_item img{width: 100%;}



/* PRODUCT
==========================================================*/

#productPage .c-colum2 {display: flex; justify-content: space-between; gap: 20px; flex-wrap: wrap;}

#productPage .c-colum2_item {margin-bottom: 30px; border-radius: 15px; width: calc(50% - 20px); border: 2px solid #fff;}
#productPage .c-colum2_item .prodimg{width: 100%; border-radius: 15px; display: block; height: 100%; object-fit: cover;}

/* #productPage .c-colum2_item2 {margin-bottom: 30px; background: #fff; width: 580px; border-radius: 15px;width: calc(50% - 20px); border: 1px solid #fff;} 
#productPage .c-colum2_item2 .prodimg{width: 100%; border-radius: 15px 15px 0 0;} */
#productPage .c-colum2_item2 {position: relative; margin-bottom: 30px; border-radius: 15px; width: calc(50% - 20px); overflow: hidden; border: 2px solid #fff;}
#productPage .c-colum2_item2 .prodimg {width: 100%; border-radius: 15px; display: block!important; height: 100%; object-fit: cover;}
#productPage .c-colum2_item_btn {position: absolute; bottom: 0; width: 90%; display: none;  background: rgba(255, 255, 255, 0.8); opacity: 0; pointer-events: none; padding-top: 20px;}
#productPage .c-colum2_item2:hover .c-colum2_item_btn {display: flex; opacity: 1; pointer-events: auto;}


#productPage .c-colum2_item p{text-align: justify; font-size: 14px; padding: 0 30px 35px;}
.c-colum2_item_btn{display: flex; gap: 130px; padding:10px 30px; margin-inline: auto; justify-content: center;}
.c-colum2_item_btn img{height: 38px;}
.btn_nn{pointer-events: none; opacity: 0.4;}



/* 2: layout
----------------------------------------------------------------------------------------------*/

/* 2column commons name
*/

.col{ }
	.col-l{  }
	.col-r{  }

#single-wrapper{}
#pages-wrapper{}


#pages-wrapper .col{ }
	#pages-wrapper .col-l{}
	#pages-wrapper .col-r{}
	
	
#single-wrapper .col{ }
	#single-wrapper .col-l{ float:left; }
	#single-wrapper .col-r{ float:right; }

#single-wrapper .wrap-inner{ }






	



* html .sampleset{}/*IE6 Hack*/
*:first-child+html .sampleset{}/*IE7 Hack*/
head~/* */body .sampleset{}/*IE8 Hack*/