@charset "utf-8";
html{font-family: "Noto Sans Japanese","Hiragino Kaku Gothic Pro","メイリオ",Meiryo,Osaka,"ＭＳ Ｐゴシック","MS PGothic",sans-serif;-ms-text-size-adjust:100%;-webkit-text-size-adjust:100%;}body{margin:0;font-size:100%;}article,aside,details,figcaption,figure,footer,header,hgroup,main,menu,nav,section,summary{display:block;}audio,canvas,progress,video{display:inline-block;vertical-align:baseline; text-decoration:underline;}a:hover{text-decoration:none;}audio:not([controls]){display:none;height:0;}[hidden],template{display:none;}a{background-color:transparent;}a:active,a:hover{outline:0;}abbr[title]{border-bottom:1px dotted;}b,strong{font-weight:bold;}dfn{font-style:italic;}h1{margin:0 0 0.67em;}mark{background:#ff0;color:#000;}small{font-size:80%;}sub,sup{font-size:75%;line-height:0;position:relative;vertical-align:baseline;}sup{top:-0.5em;}sub{bottom:-0.25em;}img{border:0; vertical-align:bottom;}svg:not(:root){overflow:hidden;}figure{margin:1em 40px;}hr{-moz-box-sizing:content-box;box-sizing:content-box;height:0;}pre{overflow:auto;}code,kbd,pre,samp{font-family:monospace,monospace;font-size:1em;}button,input,optgroup,select,textarea{font-family: "Noto Sans Japanese","Hiragino Kaku Gothic Pro","メイリオ",Meiryo,Osaka,"ＭＳ Ｐゴシック","MS PGothic",sans-serif;color:inherit;font:inherit;margin:0;}button{overflow:visible;}button,select{text-transform:none;}button,html input[type="button"],input[type="reset"],input[type="submit"]{-webkit-appearance:button;cursor:pointer;}button[disabled],html input[disabled]{cursor:default;}button::-moz-focus-inner,input::-moz-focus-inner{border:0;padding:0;}input{line-height:normal;}input[type="checkbox"],input[type="radio"]{box-sizing:border-box;padding:0;}input[type="number"]::-webkit-inner-spin-button,input[type="number"]::-webkit-outer-spin-button{height:auto;}input[type="search"]{-webkit-appearance:textfield;-moz-box-sizing:content-box;-webkit-box-sizing:content-box;box-sizing:content-box;}input[type="search"]::-webkit-search-cancel-button,input[type="search"]::-webkit-search-decoration{-webkit-appearance:none;}fieldset{border:1px solid #c0c0c0;margin:0 2px;padding:0.35em 0.625em 0.75em;}legend{border:0;padding:0;}textarea{overflow:auto;}optgroup{font-weight:bold;}table{border-collapse:collapse;border-spacing:0;}td,th{padding:0;}ul,ol{padding-left:0;list-style: none;}dd{margin:0;}address{font-style: normal;}

body{background-color: #f8f7fc;}

.lazyload,
.lazyloading {
	opacity: 0;
}
.lazyloaded {
	opacity: 1;
	transition: opacity 300ms;
}
header{
background: url(../img/kv.jpg) #b0b0b0 no-repeat 50% 100%;
background-attachment: fixed;
background-size: cover;
height: 685px;
width: 100%;
position: relative;
text-align: center;
display: table;
}
#hgroup{
width: 100%;
display: table-cell;

vertical-align: middle;}
#hgroup .container{padding: 20px 0;}
/* #hgroup .container{position: absolute; bottom: 0; left: 50%; margin: 0 0 0 -480px;} */
.fadein_text,
.fadein_text span {
  opacity: 0;
}
header p{margin: 0;}
header h1 { margin: 0 0 20px; padding: 0.2em 1.5em; background-color: rgba(35,35,35,0.8); font-size: 26px; font-weight: normal; color: #fff; font-family: 'IM Fell DW Pica', serif; display: inline-block; font-style: italic; position: relative;}

header .catch,header .lead,.profile dt,main h2,main h3,.gallery figure.cover h3,.gallery .cs{font-family:"Times New Roman", "游明朝", YuMincho, "ヒラギノ明朝 ProN W3", "Hiragino Mincho ProN", "メイリオ", Meiryo, serif;}
header .catch { margin: 0 0 0.6em; font-size: 38px; line-height: 1; font-weight: bold;}
header .catch span{ margin-bottom: 5px; padding: 0.2em 1em; display: inline-block; background-color: rgba(255,255,255,0.8); color: #493327; line-height: 1;}
header .lead { margin:0; font-size: 18px; font-weight: bold; line-height: 1.5; color:#191816}

main{padding: 40px 0 0;}

.container{
max-width: 960px;
margin: 0 auto;
}

.profBox{ margin-top: -150px; margin-bottom: 70px; width: 100%; position: relative; z-index: 5;}

.profile{ background:rgba(255,255,255,0.5); padding: 1em; /* position: absolute; right: 0; bottom:0; width: 250px;*/ text-align: left; box-shadow:0px 0px 20px -2px #a8a8a8;}
.profile.person:before{ margin-right: 15px; content: ""; display: inline-block; width: 80px; height: 80px; background: url(../img/profile_thm.png) no-repeat 0 0; background-size: 100% auto; vertical-align: middle; float: left;}

.profile dt{ margin-bottom: 0.7em; color: #251f19; font-size: 18px; font-weight: bold;}
.profile dd{overflow: hidden;}
.profile dd p,.profile.product p{margin-bottom: 1em; font-size: 13px; line-height: 1.5;}
.profile a{display: inline-block; padding: 0 1.5em; color: #fff; background: #333333; border-radius: 13px; height: 26px; line-height: 26px; text-decoration: none; font-size: 12px;}

/*
.profBox .banner{ width:298px;}
.profBox .banner a{display: block; margin-left: 10px; box-shadow:0px 0px 20px -2px #a8a8a8;}
.profBox .banner img{width: 100%; height: auto;}
*/
.profile a:hover,.bannerList a:hover,.banner a:hover,#pagetop:hover{opacity: 0.6; transition: all 0.3s;}

section{ padding-bottom: 40px; position: relative;}
article section:before{display: block; content: ""; width: 100%; height: 1px; background: #b7856a; position: absolute; top: 0; left: 0;}

main h2{ margin: 0;color: #493327; font-size: 28px; padding: 50px 0 30px; line-height: 1.7; text-align: center;}
main .gallery_cnt h2{font-size: 33px;}

main h3{ margin: 0; padding: 2.5em 0 0.85em 1em; text-indent: -1em; color: #b7856a; font-size: 19px; line-height: 1.5}
main h4{margin: 0 0 0.5em; font-size: 14px;}
main p{ margin:0 0 30px; font-size: 15px; color: rgba(0,0,0,0.85); line-height: 1.9}
main p.indent{margin-left: 1em; line-height: 1.7}

.clr_dandelion,.clr_lilac,.clr_anemone,.clr_ika,.clr_sango,.clr_kojika,.clr_cactus,.clr_azuki,.clr_shibukami,.clr_tsurigane{ border-bottom-style: solid; border-bottom-width: 2px;}
.clr_dandelion{border-bottom-color: #F7D700;}
.clr_lilac{ border-bottom-color: #A98AC3}
.clr_anemone{ border-bottom-color: #97559F}
.clr_ika{border-bottom-color:#574845}
.clr_sango{border-bottom-color:#F68797}
.clr_kojika{border-bottom-color:#CF8697}
.clr_cactus{border-bottom-color: #3F7128}
.clr_azuki{border-bottom-color:#935E66}
.clr_shibukami{border-bottom-color:#C88359}
.clr_tsurigane{border-bottom-color:#7A7FA9}


#pagetop{ display: block; position: fixed; width: 40px; height: 40px; right: 20px; bottom: 20px; background: rgba(0,0,0,0.80); color: #ffff; padding: 10px; border-radius: 10px; text-decoration: none;}
.arrow-up.icon {
  color: #fff;
  position: relative;
  margin-left: 20px;
  margin-top: 6px;
  width: 2px;
  height: 26px;
  background-color: #fff;
		display: inline-block;
}
.arrow-up.icon:before {
		display: inline-block;
  content: '';
  position: absolute;
  left: -10px;
  top: 1px;
  width: 20px;
  height: 20px;
  border-top: solid 2px #fff;
  border-right: solid 2px #fff;
  -webkit-transform: rotate(-45deg);
          transform: rotate(-45deg);
}

footer{ padding: 20px 0; text-align: center;}
footer .logo{margin-bottom: 15px;}
footer address{font-size: 12px; color: #727272;}

.clear{clear: both;}
.clearfix,.layoutImage01,.layoutImage02,.layoutImage03,.gallery{*zoom: 1;}
.clearfix:after,.layoutImage01:after,.layoutImage02:after,.layoutImage03:after,.gallery:after {content: "."; display: block; clear: both;height: 0; visibility: hidden;}

.layoutImage01,.layoutImage02,.layoutImage03{margin-bottom: 30px;}
.txt{max-width: 530px;}
.txt p:last-child{margin-bottom: 0;}
.layoutImage01 .txt{ float: left;}
.layoutImage02 .txt{ float: right;}
.layoutImage03 .txt{max-width: 100%;}

.img{max-width: 385px;}

.layoutImage01 .img{float: right; margin: 0 0 10px 20px;}
.layoutImage02 .img{float: left; margin: 0 20px 10px 0;}
.img img,.col02 li img{display: block; max-width:100%;height:auto}
.img img +img{margin-top: 10px;}

.profile.product{background: hsla(48,100%,91%,0.8)}
.profile.product h2{ margin: 0 0 0.5em; padding: 0; text-align: center; font-size: 22px;}
.profile.product h2,.profile.product p{color: #033300}
.profile.product .layoutImage01{margin-bottom: 0;}
.profile.product .txt{max-width: 660px;}
.profile.product .img{max-width: 240px;}
.profile.product a{ background: #033300; margin: 0 auto}


.box{ margin: 0 10px 20px;  border: 1px dotted #ccc; padding: 10px; background: #fff;}
.col02{margin: 0;}
.col02 li{width: 49%; float: left; text-align: center;}
.col02 li:first-child{margin-right: 2%;}
.col02 li img{margin: 0 auto;}
.col02 li p{margin: 0; font-size: 13px;}

.t_c{text-align: center;}
.t_r{text-align: right;}
.spOnly{display: none!important;}

@media only screen and (max-width : 960px) {
header{height: 500px;}
header h1{font-size: 22px;}
header .catch{ font-size: 32px;}
	#hgroup .container{left: 0; margin: 0; width: 90%;}
	main{padding: 20px 0 0;}
	#hgroup .container,.container{margin: 0 5%;}
	
	.profBox{margin-top: -70px;}
	
	.txt{max-width: 60%;}
	.img{max-width: 38%;}
.layoutImage01 .img{ margin-left:2%;}
.layoutImage02 .img{ margin-right:2%;}
}

@media only screen and (max-width : 660px) {
	header{background-position:50% 0px; background-attachment:inherit;}
	#hgroup .container,.container{margin: 0 2.5%; width: 95%;}
	header h1{padding: 0.2em 0.3em; font-size: 16px; margin-bottom: 15px;}
	header .catch{padding:0.2em 0.3em; font-size: 25px; line-height: 1.3; background-color: rgba(255,255,255,0.6);}
	header .catch span{ padding:0; background-color: transparent; display: inline;}
	header .lead{font-size:14px; }
	
.profBox,.profile,.banner{display: block;}
.profBox{ width: 100%;}
.profile{ margin: 0 0 10px; box-sizing: border-box;}
.profile:before,.profile dt{float: none; display: inline-block;vertical-align: middle; }

.profile:before{margin-right: 15px; width: 45px; height: 45px;}
.profile dt{margin-bottom: 0;}
.profile dd{clear: both; text-align: center;}
.profile dd p{text-align: left;}
.profBox .banner a{margin-left: 0;}
.profile,.profBox .banner{width: 100%;}
.profile a{margin: 0 auto;}
	
	main h2{padding: 1em 0 0.5em; font-size: 20px; line-height: 1.4;}
	main .gallery_cnt h2{font-size:24px; line-height: 1.4;}
	main p{margin-bottom: 1.5em;}
	.layoutImage01, .layoutImage02{margin-bottom: 0;}
	.layoutImage01 .img,.layoutImage02 .img{float: none; margin: 0 auto; max-width: 100%; text-align: center;}
	.layoutImage01 .txt,.layoutImage02 .txt{margin: 0 0 20px; float: none; max-width: 100%;}
	.box{ margin: 0 0 20px;}
	.col02 li{width: 100%; margin-right: 0;}
	.col02 li:first-child{margin-bottom:10px;}
	.pcOnly{display: none!important;}
	.spOnly{display: block!important;}
}

/* .gallery
=========================================== */
.bg{ background: #f0eee9;}

.gallery{ margin: 0 0 45px;}
.gallery li{ width: 182px; margin-right: 10px; float: left; box-sizing: border-box;}
.gallery:last-child{margin-right: 0;}

.gallery .icn_zoom{display: block; width: 30px; height: 30px; background: url(../img/icn.png) no-repeat 100% 50%; background-size: auto 30px; text-indent: -9999px; opacity: 0;}
.gallery .icn_degital:before,.gallery .icn_dl:before{content: ""; display: inline-block; background: url(../img/icn.png) no-repeat; vertical-align: middle; position: absolute; top: 0; left: 0;}
.gallery .icn_degital:before{ background-size: auto 13px; background-position:  0 50%; width: 13px; height: 13px; top: 0.1em;}
.gallery .icn_dl:before{ background-size: auto 18px; background-position:  -18px 50%; vertical-align: middle; width: 18px; height: 18px;}
.gallery .link_txt{ display: block; padding-left: 20px; font-size: 14px; color: #333333; text-decoration: none; line-height: 1.1; position: relative;}
.gallery .link_txt:hover{text-decoration: underline;}

.gallery .cs{ padding-top: 7.5em; height: 300px; background: #e0ded9; color: #9f9b9b; text-align: center; font-size: 18px;}

.slbImage{padding: 5em 0 2.5em!important;}
.slbCaption{font-size: 16px!important;}

@media only screen and (min-width : 661px)  and (max-width : 960px){
	.gallery li{width: 19%; min-height: 300px; height: auto; margin-right: 1%; margin-bottom: 15px;}
}

@media only screen and (max-width : 660px) {
	.gallery li{width: 49%; height: auto; margin-right: 2%; margin-bottom: 15px;}
	.gallery li:nth-child(2n){margin-right: 0;}
	.gallery li:nth-child(2n+1){ clear: both;}
	.gallery .cs{ padding-top: 5em;}
	.gallery .link_txt{font-size: 12px;}
}

.gallery figure {
		margin: 0 0 10px;
  position: relative;
  display: block;
  overflow: hidden;
  width: 100%;
  color: #ffffff;
  font-size: 16px;
  text-align: center;
		max-height: 300px;
}

.gallery figure.cover * {
  -webkit-box-sizing: border-box;
  box-sizing: border-box;
  -webkit-transition: all 0.25s ease;
  transition: all 0.25s ease;
}
.gallery figure.cover:before {
  position: absolute;
  bottom: 0;
  left: 0;
  right: 0;
  top: 100%;
  content: '';
  background-color: rgba(51, 51, 51, 0.9);
  -webkit-transition: all 0.25s ease;
  transition: all 0.25s ease;
  -webkit-transition-delay: 0.25s;
  transition-delay: 0.25s;
		z-index:1;
}
.gallery figure.cover.g_01:before {
background-color: rgba(248, 215, 132, 0.8);
}
.gallery figure.cover.g_02:before {
background-color: rgba(207, 52, 70, 0.6);
}
.gallery figure.cover.g_03:before {
background-color: rgba(34, 60, 157, 0.6);
}
.gallery figure.cover.g_04:before {
background-color: rgba(251, 223, 2, 0.6);
}
.gallery figure.cover.g_05:before {
background-color: rgba(72, 115, 44, 0.6);
}


.gallery figure img {
		margin: 0 -150px 0 0;
  vertical-align: top;
  /* max-width: 100%; */
  backface-visibility: hidden;
		position: relative;
		left: -50%;
		z-index: 0;
}
.gallery figure.cover img{
  -moz-transition: -moz-transform 0.7s linear;
  -webkit-transition: -webkit-transform 0.7s linear;
  -o-transition: -o-transform 0.7s linear;
  -ms-transition: -ms-transform 0.7s linear;
  transition: transform 0.7s linear;
}
.gallery figure.cover:hover img,
.gallery figure.cover.hover img{
-webkit-transform: scale(1.5);
    -moz-transform: scale(1.5);
    -o-transform: scale(1.5);
    -ms-transform: scale(1.5);
    transform: scale(1.5);
				opacity: 0.7;
}

.gallery figure.cover figcaption {
  position: absolute;
  top: 0;
  bottom: 0;
  left: 0;
  right: 0;
  z-index: 1;
  align-items: center;
  display: flex;
  flex-direction: column;
  justify-content: center;
}
main .gallery figure.cover h3{
  margin: 0 0 25px;
		padding: 0;
		color: #000;
		font-size: 18px;
		text-indent: 0;
  opacity: 0;
  letter-spacing: 1px;
		font-size: 20px;
}
.gallery figure.cover h3 span{
font-size: 14px;
text-decoration: underline;
display: block;
}
.gallery figure.cover h3,
.gallery figure.cover .icn_zoom{
  -webkit-transform: translateY(100%);
  transform: translateY(100%);
  text-transform: uppercase;
  font-weight: 400;
  -webkit-transition-delay: 0.05s;
  transition-delay: 0.05s;
}

.gallery figure.cover a {
  position: absolute;
  top: 0;
  bottom: 0;
  left: 0;
  right: 0;
  z-index: 1;
}
.gallery figure.cover:hover:before,
.gallery figure.cover.hover:before {
  bottom: 0;
		top: 0;
  -webkit-transition-delay: 0s;
  transition-delay: 0s;
}
.gallery figure.cover:hover h3,
.gallery figure.cover:hover .icn_zoom,
.gallery figure.cover.hover h3,
.gallery figure.cover.hover .icn_zoom
 {
  -webkit-transform: translateY(0);
  transform: translateY(0);
  opacity: 1;
}
.gallery figure.cover:hover h3,
.gallery figure.cover.hover h3 {
  -webkit-transition-delay: 0.2s;
  transition-delay: 0.2s;
}
.gallery figure.cover:hover .icn_zoom,
.gallery figure.cover.hover .icn_zoom {
  -webkit-transition-delay: 0.3s;
  transition-delay: 0.3s;
}

.sl-overlay{
background: #000
}
.sl-wrapper .sl-close,.sl-wrapper .sl-navigation button{color: #fff;}
.sl-wrapper .sl-image .sl-caption{color: #000; background: hsla(0,0%,100%,0.5); text-align: center;}

/* bannerList
=========================================== */
.bannerList{ margin: 0; padding-top: 50px;}
.bannerList li{margin-bottom: 10px;}
.bannerList li img{max-width: 100%; height: auto;}

/* animate
=========================================== */
.js-scroll{
	opacity:0;
	transition: all 1s;
}
.js-scroll-in{
	opacity:1;
}
.js-scroll-y{
	opacity:0;
	transition: all 1s;
	transform:translate(0px,120px) scale(1);
}
.js-scroll-y-in{
	opacity:1;
	transform:translate(0px,0px) scale(1);
}
.js-scroll-left{
	opacity:0;
	transition: all 1s;
	transform:translate(-60px,0) scale(1);
}
.js-scroll-left-in{
	opacity:1;
	transform:translate(0px,0px) scale(1);
}
.js-scroll-right{
	opacity:0;
	transition: all 1s;
	transform:translate(60px,0) scale(1);
}
.js-scroll-right-in{
	opacity:1;
	transform:translate(0px,0px) scale(1);
}
.js-scroll-blur{
	opacity:0;
	transition: all 1s;
	-webkit-filter: blur(5px);
	filter: blur(5px);
}
.js-scroll-blur-in{
	-webkit-filter: blur(0);
	filter: blur(0);
	opacity:1;
}
.effect-y{
	transition: all 1s;
	transform:translate(0px,120px);
}
.effect-y-in{
	transform:translate(0px,0px);
}
.effect-y-top{
	transition: all 0.1s;
}