@import url(font-awesome.min.css);
@import url("https://fonts.googleapis.com/css?family=Open+Sans:400,600,400italic,600italic|Roboto+Slab:400,700");
@charset "UTF-8";

#body-inside{
	overflow-x: hidden;
}

* {
	color: #444444;
	/*font-family: 'Noto Sans JP',sans-serif;
	line-height: 1.7;*/
	font-family: kozuka-gothic-pro, sans-serif;
	font-weight: 200;
	font-style: normal;
	font-size: 2.75vw;
	line-height: 200%;
	width: auto;
	margin-left: 0px;
}

a {
	text-decoration: none;
}

a:hover {
	opacity: 0.7;
    -webkit-transition: all 0.3s ease-in-out;
    -moz-transition: all 0.3s ease-in-out;
    -o-transition: all 0.3s ease-in-out;
}

img {
	vertical-align: bottom;
}

h1 {
	/*font-family: 'Cinzel','Noto Serif JP', serif;
    font-weight: lighter;*/
	font-family: a-otf-ryumin-pr6n, serif;
	font-weight: 300;
	font-style: normal;
	color: #444444;
}

h2 {
	font-family: a-otf-ryumin-pr6n, serif;
	font-size: 1.8rem;
	font-weight: 300;
	font-style: normal;
	line-height: 4rem;
    letter-spacing: .05em;
	margin-top: 1rem;
	margin-bottom: 1rem;
	
}

h3 {
	font-family: 'Cinzel','Noto Serif JP', serif;
	font-size: 1.6rem;
	color: #444444;
    text-align: center;
	letter-spacing: .2rem;
}

p.circle {
	font-family: a-otf-ryumin-pr6n, serif;
	font-size: 1.3rem;
	width: 5rem;
	height: 5rem;
	border: solid 1px;
	padding: 1rem 0;
	margin: 0 auto 1rem;
	border-radius: 50%;
}

.resizeimage img {
	margin: 0 auto;
	
}
.title01 {
    position: relative;
}
.title01 img {
  width: 100%;
  height: 250px;
  object-fit: cover;
  }




.wrapper {
	max-width: 1000px;
	margin: 0 auto;
	border-bottom: 2px solid #DFD9C5 ;
}

.inner {
	margin: 0 5%;
	padding: 1.9rem 0.8rem;
}

.inner img {
    width: 60%;
}
.box h2{
	font-size: 1.8rem;
    color: #AB9567;
	margin:1rem;
}
.box_navy h2{
	font-size: 1.8rem;
	color:#64789C;
	margin: 1rem;
}
.box_nocolor h2{
	font-size: 1.8rem;
	color:#707070;
	margin: 1rem;
}


/* ------------ ヘッダー ------------ */

header {
	text-align: center;
}

header img {
    width: 11.0rem;
    margin: 1.2rem 0 ;
}

p.top_cap {
	font-family: 'Cinzel','Noto Serif JP', serif;
	font-weight: lighter;
	font-size: 1.4rem;
	line-height: 1.5rem;
	color: #444444;
	padding: 0.5rem 0 0;
	width: auto;
    text-align: center;
	letter-spacing: 0.1rem;
	background: #E6E1D5;
}

p.top_cap img {
	margin-top: 0.9rem;
}

img.logo {
	width: 30%;
	margin: 2rem 0 3rem;
}


/* -- TOPに戻るボタン -- */

#page_top {
    position: fixed;
    right: 0px;
    bottom: 0px;
    margin: 0;
	z-index: 999;
    color: #FFFFFF
    
}

#page_top a{
    position: relative;
    display: flex;
    width: 65px;
    height: 65px;
    justify-content: center;
    background:#AB9567;/*背景の色を変える*/
    transition: opacity .6s ease;
    color: #FFFFFF;/*アイコンの色を変える*/
    align-items: center;
    text-decoration: none;
    font-size: 32px;
	text-align: center;
   
}

#page_top .fas {
    color: #FFFFFF;
	line-height: 1.5rem;
	
}

/*------------------------------ topバナータイトル ------------------------------*/

.top_box {
    background-color: #FFFFFF;
    background-color:rgba(255,255,255,0.65);
	width: 16rem;
    padding: 1.2rem;
    text-align: center;
    position:absolute;
    top: 25%;/*40%*/
    left: 30%;/*50%*/
    transform: translate(-50%, -50%);
    border-radius: 0px 30px 0px 30px; /* 角を丸くする */
}
.top_box h3 {
    font-size: 2.2rem;
	line-height: 3rem;
    color: #665B3D;
    margin: 1rem 0;
	letter-spacing: .3rem;
}
.top_box p {
	font-family: a-otf-ryumin-pr6n, serif;
    font-size: 1.1rem;
	line-height: 1.8rem;
    color: #665B3D;
	border-top: solid 1px #AB9567;
	border-bottom: solid 1px #AB9567;
	padding: 0.5rem 0;
	margin: 0 1.5rem 1rem;
	letter-spacing: .1rem;
}

/* ------------ テキスト ------------ */

.first_category {
	width: 100%;
	margin:0 auto;
	text-align: center;
}

.first_category .box {
	margin: 7rem 0 ;
}

.first_category .box p {
	font-family: a-otf-ryumin-pr6n, serif;
	font-size: 1.2rem;
	line-height: 4rem;
	letter-spacing: .1rem;
}


/*------------------------------ 各ブロックトップタイトル ------------------------------*/

.top_box1 {
	width: 70%;
    text-align: center;
    position:absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
	background-color: #FFFFFF;
    background-color:rgba(255,255,255,0.65);
  
	
}

.top_box1 h2 {
    font-size: 2.4rem;
	font-weight: 500;
    color: #444444;
	letter-spacing: 0.3rem;
    padding:30px 10px;
	
}

header h2,
.concept h2,
.concept h3,
footer h2 {
	font-size: 2rem;
	color: #DFD9C5;
}

.title h2 {
	color: #AB9567;
}

.title p {
	color: #AB9567;
}

/* ------------ カテゴリー ------------ */

/*.category {
	width: 100%;
	margin: 5rem auto 0;
	text-align: center;
}*/

.category .title {
	padding: 0 1rem
}

.category .box {
	margin: 7rem 0 5rem;
}

.category .box p {
	font-size: 1.1rem;
	line-height: 3.5rem;
}

/* ------------ アイテムイメージ ------------ */
.category .item_image {
	width: 100%;
	margin: 0 0 6rem 0;
	text-align: left;
}

.category .item_image img {
	width: 80%;
	height: 30rem;
	object-fit: cover;
}

.category .item_image:hover {
	opacity: 0.7;
    -webkit-transition: all 0.3s ease-in-out;
    -moz-transition: all 0.3s ease-in-out;
    -o-transition: all 0.3s ease-in-out;
}
/* -- イメージ01 -- */

.category .item_image01 {
	width: 100%;
	margin: 0 0 6rem 0;
	text-align: left;
}

.category .item_image01 img {
	width: 60%;
	height: 40rem;
	object-fit: cover;
}

.category .item_image01:hover {
	opacity: 0.7;
    -webkit-transition: all 0.3s ease-in-out;
    -moz-transition: all 0.3s ease-in-out;
    -o-transition: all 0.3s ease-in-out;
}


/* -- イメージ02 -- */

.category .item_image02 {
	width: 100%;
	margin: 0 0 6rem 0;
	text-align: right;
}

.category .item_image02 img {
	width: 80%;
	height: 25rem;
	object-fit: cover;
}

.category .item_image02:hover {
	opacity: 0.7;
    -webkit-transition: all 0.3s ease-in-out;
    -moz-transition: all 0.3s ease-in-out;
    -o-transition: all 0.3s ease-in-out;
}

/* -- イメージ03 -- */

/*.category {
	position: relative;
}*/

.category .item_image03 {
	width: 100%;
	margin: 0;
	text-align: left;
}

.category .item_image03 img {
	width:80%;
	height: 30rem;
	object-fit: cover;
}

.category .item_image03:hover {
	opacity: 0.7;
    -webkit-transition: all 0.3s ease-in-out;
    -moz-transition: all 0.3s ease-in-out;
    -o-transition: all 0.3s ease-in-out;
}
/*		.title03 {
    position: relative;
	width: 100%;
	margin: 0 0 6rem 0;
	text-align: center;
}
.title03 img {
   width: 80%;
	height: 35rem;
	object-fit: cover;
  }*/
/* -- イメージ04 -- */

.category .item_image04 {
	width: 100%;
	text-align: center;   
	position: relative;
}

.category .item_image04 img {
	width: 80%;
	height: 30rem;
	object-fit: cover;
	text-align: center;
	
}

.category .item_image04:hover {
	opacity: 0.7;
    -webkit-transition: all 0.3s ease-in-out;
    -moz-transition: all 0.3s ease-in-out;
    -o-transition: all 0.3s ease-in-out;
}

/* -- イメージ05 
.category .item_image05 {
	width: 100%;
	margin: 0 0 10rem 0;
	text-align: center;
}

.category .item_image05 img {
	width: 100%;
	object-fit: cover;
}

.category .item_image05:hover {
	opacity: 0.7;
    -webkit-transition: all 0.3s ease-in-out;
    -moz-transition: all 0.3s ease-in-out;
    -o-transition: all 0.3s ease-in-out;
}
-- */
.category .item_image05 {
	width: 100%;
	margin: 0 0 6rem 0;
	text-align: right;
}

.category .item_image05 img {
	width: 80%;
	height: 31rem;
	object-fit: cover;
}

.category .item_image05:hover {
	opacity: 0.7;
    -webkit-transition: all 0.3s ease-in-out;
    -moz-transition: all 0.3s ease-in-out;
    -o-transition: all 0.3s ease-in-out;
}
/* -- イメージ06 -- */
.category .item_image06 {
	width: 100%;
	margin: 0 0 6rem 0;
	text-align: right;
}

.category .item_image06 img {
	width: 60%;
	height: 40rem;
	object-fit: cover;
}

.category .item_image06:hover {
	opacity: 0.7;
    -webkit-transition: all 0.3s ease-in-out;
    -moz-transition: all 0.3s ease-in-out;
    -o-transition: all 0.3s ease-in-out;
}
/* -- イメージ07 -- */

.category .item_image07 {
	width: 100%;
	margin: 0 0 20rem 0;
	text-align: right;
}

.category .item_image07 img {
	width: 80%;
	height: 25rem;
	object-fit: cover;
}

.category .item_image07:hover {
	opacity: 0.7;
    -webkit-transition: all 0.3s ease-in-out;
    -moz-transition: all 0.3s ease-in-out;
    -o-transition: all 0.3s ease-in-out;
}
/*------------------------------ pickup ------------------------------*/
.pickup {
	font-family: a-otf-ryumin-pr6n, serif;
    letter-spacing: 0.3rem;
    font-weight: 500;
    font-size: 2rem;
    color: #707070;
	padding: 0.5rem;
    border-bottom: solid 1px #ffffff;
    border-top: solid 1px #ffffff;
    text-align: center;
	margin-bottom: 3rem;
	margin: 1.5rem 7.0rem 4.5rem;
	
}

/* ------------ pickup背景色 ------------ */


.background {
    background: #665B3D;
    margin: 0 -200% 10rem;/*0rem各トップの高さもともと5rem*/
    padding: 3rem 200%;
    text-align: center;
}
.background01{
	background: #CBE3EB;
	margin: 0 -200% 10rem;/*0rem各トップの高さもともと5rem*/
    padding: 3rem 200%;
    text-align: center;
}
.background01 .pickup{
	color:#707070;
}
.background_gr1{
  background: -moz-linear-gradient(top, #CBE3EB, #F3FCFF);
  background: -webkit-linear-gradient(top, #CBE3EB,#F3FCFF);
  background: linear-gradient(to bottom, #CBE3EB, #F3FCFF);
  /*グラデーション以外は省略*/
	   margin: 0 -200% 10rem;/*0rem各トップの高さもともと5rem*/
    padding: 3rem 200%;
    text-align: center;

}
.background02{
		background: #E8F3F6;
	margin: 0 -200% 10rem;/*0rem各トップの高さもともと5rem*/
    padding: 3rem 200%;
    text-align: center;
}

/* ------------ pickup商品 ------------ */

.product {
	overflow: hidden;
	/*padding-top: 4rem;*/
    margin-bottom: -3rem;
}

.product .item {
	float: left;
	width: 44%;
	margin: 0 3% 3rem 3%;
	text-align: center;
}

.product .item h4 {
	font-weight: lighter;
	font-size: 1.1rem;
}

.product .item img {
	width: 100%;
	height: auto;
}

.product .item:hover {
	opacity: 0.7;
    -webkit-transition: all 0.3s ease-in-out;
    -moz-transition: all 0.3s ease-in-out;
    -o-transition: all 0.3s ease-in-out;
}

.product .item .box {
	padding: 2rem 0.7rem;
	/*background-color: rgba(255,255,255,0.75);*/
}

.product .item .box h4,
.product .item .box p {
	line-height: 2.5rem;
    text-align: center;
	color: #707070;
}

.product .item .box img {
	width: 1.6rem;
	margin: 0.6rem 0.8rem 0;
}




/* ------------ pickup商品 ------------ */
.product1 {
	overflow: hidden;
	padding-top: 4rem;
    margin-bottom: -3rem;
}

.product1 .item {
	float: left;
	width: 44%;
	margin: 0 3% 3rem 3%;
	text-align: center;
}

.product1 .item h4 {
	font-weight: lighter;
	font-size: 1.1rem;
}

.product1 .item img {
	width: 100%;
	height: auto;
}

.product1 .item:hover {
	opacity: 0.7;
    -webkit-transition: all 0.3s ease-in-out;
    -moz-transition: all 0.3s ease-in-out;
    -o-transition: all 0.3s ease-in-out;
}

.product1 .item .box {
	padding: 2rem 0.7rem;
	/*background-color: rgba(255,255,255,0.75);*/
}

.product1 .item .box h4,
.product1 .item .box p {
	line-height: 2.5rem;
    text-align: center;
	color: #FFFFFF;
}

.product1 .item .box img {
	width: 1.6rem;
	margin: 0.6rem 0.8rem 0;
}

/*アイテムセンター*/
.product .item_center {
	width: 100%;
	margin: 0 25% 4rem;
}
/*pickup矢印*/
.title01 {
    position: relative;
	width: 100%;
	margin: 0 0 6rem 0;
	text-align: right;
}
.title01 img {
   width: 100%;
	height: 20rem;
	object-fit: cover;
  }
.title01 p{
	position: absolute;
	color:#444444;
	background-color:#E8F3F6;
	padding:0.2rem 1rem;
	bottom: 1rem;
	right: 0;
	font-size: 1rem;
	
}
/*つけ襟*/
/*.category .item_image02 {
	width: 100%;
	margin: 0 0 6rem 0;
	text-align: right;
}

.category .item_image02 img {
	width: 80%;
	height: 35rem;
	object-fit: cover;
}*/

.product .item_left{
	position: relative;
	width: 100%;
	margin: 0 0 6rem 0;
	text-align: left;
}
.product .item_left img{
	width: 80%;
	height: 20rem;
	object-fit: cover;
	object-position : 50% 33%;
}
.product .item_left p{
	position: absolute;
	color:#444444;
	background-color:#E8F3F6;
	padding:0.2rem 1rem;
	bottom: 1rem;
	left: 0;
	font-size: 1rem;
}
.product .item_right{
	position: relative;
	width: 100%;
	margin: 0 0 6rem 0;
	text-align: right;
}
.product .item_right img{
	width: 80%;
	height: 20rem;
	object-fit: cover;
}
.product .item_right p{
	position: absolute;
	color:#444444;
	background-color:#E8F3F6;
	padding:0.2rem 1rem;
	bottom: 1rem;
	right: 0;
	font-size: 1rem;
}
.product .item_left2{
	position: relative;
	width: 100%;
	margin: 0 0 6rem 0;
	text-align: left;
}
.product .item_left2 img{
	width: 80%;
	height: 20rem;
	object-fit: cover;
	object-position : 50% 30%;
}
.product .item_left2 p{
	position: absolute;
	color:#444444;
	background-color:#E8F3F6;
	padding:0.2rem 1rem;
	bottom: 1rem;
	left: 0;
	font-size: 1rem;
}


/* -- view moreボタン -- */

.button span {
	font-family: a-otf-ryumin-pr6n, serif;
    font-size: 1.5rem;
    color: #665B3D;
    background-color: #ffffff;
    font-weight: 600;
    letter-spacing: 0.1rem;
    padding: 1.0rem 2rem;
    border-radius: 40px;
}
.button {
    text-align: center;
	padding: 2.0rem 2.0rem;
}

/* -- フェードイン -- */

.scroll-up {
    opacity: 0; 
    visibility: hidden;
    transform: translateY(50px);
    transition: all 1s;
}

.scroll-up.is-show {
    opacity: 1;
    visibility: visible;
    transform: translateY(0px);
}

/* ------------ フッター前背景色 ------------ */


.background {
    background: #e4c4ec;
    margin: 0 -200% 5rem;
    padding: 3rem 200%;
    text-align: center;
}

/* ------------ フッター ------------ */

footer {
	/* --border-top: 1px solid #DFD9C5;-- */
	text-align: center;
}

footer h2 {
    font-family: a-otf-ryumin-pr6n, serif;
	/* -- margin-top: 2.5rem; -- */
	/*margin-top: -5rem;/* -- 境界線ない時 -- */
}

a.contact {
	display: inline-block;
	width: 3rem;
	height: 3rem;
	border: .99px solid #DFD9C5;
	border-radius: 50%;
	margin: 2rem 0.5rem;
}

i.fa {
	font-size: 1.3rem;
	line-height: 3rem;
}

p.tel {
	font-size: 1.4rem;
	margin-bottom: 0.6rem;
}

p.mail {
	font-size: 1.0rem;
	margin-bottom: 0.6rem;
}

p.copyright {
	font-size: 0.6rem;
}

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

    .resizeimage img {
	    width: 100%;
	    height: 400px;
	    object-fit: cover;
    }
 .title01 img {
  width: 100%;
  height: 15rem;
  object-fit: cover;
  }
 .top_box1 h2 {
    font-size: 2rem;
	line-height: 4rem;
	padding:10px 8px;
}
	   /* ------------ アイテムイメージ ------------ */
/* -- イメージ -- */
.category .item_image img {
	width: 80%;
	height: 20rem;
	object-fit: cover;
}   
/* -- イメージ01 -- */
.category .item_image01 img {
	width: 80%;
	height: 35rem;
	object-fit: cover;
}


/* -- イメージ02 -- */
.category .item_image02 img {
	width: 80%;
	height: 20rem;
	object-fit: cover;
}

/* -- イメージ03 -- */
.category .item_image03 img {
	width:80%;
	height: 30rem;
	object-fit: cover;
}

/* -- イメージ05 -- */

.category .item_image05 img {
	width: 80%;
	height: 18rem;
	object-fit: cover;
}
/* -- イメージ06 -- */
 .category .item_image06 img {
	width: 80%;
	height: 35rem;
	object-fit: cover;
}
	   
 .category .item_image07 img {
	width: 80%;
	height: 20rem;
	object-fit: cover;
}



    }


@media screen and (min-width: 560px) {
	
* {
	font-size: 16px;
}
	/*.top_box1 {
	width: 40rem;
    text-align: center;
    position:absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
	background-color: #FFFFFF;
    background-color:rgba(255,255,255,0.65);
  
	
}

.top_box1 h2 {
    font-size: 2.4rem;
	font-weight: 500;
    color: #665B3D;
	letter-spacing: 0.3rem;
    padding:30px 10px;
	padding-left: 10px;
	padding-top: 50px;
}*/

/*.top_box1 h2 {
    font-size: 2rem;
	line-height: 3rem;
}*/
.top_box p {
    font-size: 1rem;
	line-height: 2rem;
}	

.resizeimage img {
	width: 100%;
	height: 400px;
	object-fit: cover;
}
	
.inner img {
    width: 40%;
}
    
img.logo {
	width: 10rem;
	margin-top: 2rem;
	margin-right: 0;
	margin-left: 0;
}

.category .item_image05 {
	width: 100%;
	margin: 0 0 6rem 0;
	text-align: right;
}

.category .item_image05 img {
	width: 80%;
	height: 20rem;
	object-fit: cover;
}

.category .item_image05:hover {
	opacity: 0.7;
    -webkit-transition: all 0.3s ease-in-out;
    -moz-transition: all 0.3s ease-in-out;
    -o-transition: all 0.3s ease-in-out;
}
	 /* ------------ アイテムイメージ ------------*/
/* -- イメージ -- */
/*.category .item_image img {
	width: 80%;
	height: 25rem;
	object-fit: cover;
}   
/* -- イメージ01 -- */
/*.category .item_image01 img {
	width: 80%;
	height: 40rem;
	object-fit: cover;
}


/* -- イメージ02 -- */
/*.category .item_image02 img {
	width: 80%;
	height: 25rem;
	object-fit: cover;
}

/* -- イメージ03 -- */
/*.category .item_image03 img {
	width:80%;
	height: 30rem;
	object-fit: cover;
}

/* -- イメージ05 -- */

/*.category .item_image05 img {
	width: 80%;
	height: 20rem;
	object-fit: cover;
} */
	/* -- イメージ03 -- */
.category .item_image03 img {
	width:80%;
	height: 35rem;
	object-fit: cover;
}
/* -- イメージ01 -- */
.category .item_image01 img {
	width: 65%;
	height: 35rem;
	object-fit: cover;
}
	.category .item_image07 img {
	width: 80%;
	height: 30rem;
	object-fit: cover;
}
  
}


@media screen and (min-width: 960px) {
	
/*------------------------------ topバナータイトル ------------------------------*/
	
.top_box {
	width: 30%;
    padding: 1.7rem;
    text-align: center;
    position:absolute;
    top: 40%;/*40%*/
    left: 35%;/*50%*/
    transform: translate(-30%, -50%);
}	
.top_box h3 {
    font-size: 2.5rem;
	line-height: 3.5rem;
}
.top_box p {
    font-size: 1.2rem;
	line-height: 2rem;
}

.resizeimage img {
	width: 100%;
	height: 100%;
	object-fit: cover;
}

.title01 img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  }
.inner img {
    width: 40%;
}
    
img.logo {
	width: 10rem;
	margin-top: 2rem;
	margin-right: 0;
	margin-left: 0;
}
	.category .item_image05 {
	width: 100%;
	margin: 0 0 6rem 0;
	text-align: right;
}
/* -- イメージ05 -- */
.category .item_image05 img {
	width: 80%;
	height: 30rem;
	object-fit: cover;
}

/* -- イメージ01 -- */
.category .item_image01 img {
	width: 65%;
	height: 40rem;
	object-fit: cover;
}
	

	
}


@media screen and (min-width: 1200px) {
	
.top_box {
	width: 25%;
    padding: 1.7rem;
    text-align: center;
    position:absolute;
    top: 33%;/*40%*/
    left: 35%;/*50%*/
    transform: translate(-30%, -50%);
}	
.top_box h3 {
    font-size: 2.8rem;
	line-height: 3.8rem;
}
.top_box p {
    font-size: 1.3rem;
	line-height: 2.3rem;
}

    
}