@charset "UTF-8";
/*=======================================
 	             SMACSS  base
 ========================================*/

/*=======================================
	         SMACSS  layout　　　　　　　       ( style.scss ) ( header.scss / main.scss / footer.scss ...) 
========================================*/
/*=======================================
 	        animation
 ========================================*/
.inview {
  opacity: 0;
  transform: translate(0, 5%);
  transition: 0.6s;
}
.inview.active {
  transform: translate(0, 0);
  opacity: 1;
}

/*=======================================
                  PC   
========================================*/
/* ===================
	　　 General
=================== */
html {
  font-size: 62.5%;
}

* {
  -webkit-box-sizing: border-box;
  box-sizing: border-box;
}
#mainLP_Contents{
	/* background-image: url(/Page/PHILOSOPHY/210618/img/pc.jpg); */
	background-repeat: no-repeat;
	background-size: 120rem; 
	background-position-x: center; 
	background-position-y: -9rem;
	overflow: hidden;
	margin-top: 2rem;
}
#wrapper {
  width: 120rem;
  margin: 0 auto;
  -webkit-font-feature-settings: "palt";
          font-feature-settings: "palt";
  -webkit-box-sizing: border-box;
          box-sizing: border-box;
}

/* ===================
	　　  common
=================== */
img{
	max-width: 100%;
	height: auto;
}
.sp_only{
	display: none;
}
.pc_only{
	display: block;
}
.yugothic{
	font-family: "游ゴシック体", YuGothic, "游ゴシック Medium", "Yu Gothic", "メイリオ", sans-serif;
	line-height: 2;
	letter-spacing: 0.01em;
	font-feature-settings: "palt";
}
.about{
	font-size: 1.4rem;
	position: relative;
}
.caption{
	font-size: 1.2rem;
	color: #666666;
	text-align: right;
}
.Crimson_Text{
	font-family: 'Crimson Text', serif;
	letter-spacing: 0.025em;
	font-feature-settings: "palt";
}
.price a{
	font-size: 1.3rem;
	letter-spacing: 0.015em;
	border-bottom: 0.1rem solid #cccccc;
}
.mb14pc{
	margin-bottom: 1.4rem;
}
.ml09pc{
	margin-left: 0.9rem;
}
#bg-color{
	width: 120rem;
	margin: 0 auto;
	background-color: #f7f7f7;
	/* opacity: 0.5; */
}
/* ===================
	　 firstview
=================== */
#firstview{
	text-align: center;
	padding-top: 2.7rem;
	margin-bottom: 8.45rem;
}
#firstview .bg-white{
	width: 98.2rem;
	background-color: #ffffff;
	margin: 0 auto;
}
.fv-img{
	width: 80rem;
	padding-top: 2.9rem;
	margin: 0 auto 2.6rem;
}
#firstview h2{
	font-size: 3rem;
	margin-bottom: 1.2rem;
}
.subtitle{
	font-size: 2.6rem;
	font-style: italic;
	font-weight: 600;
	color: #998600;
	padding-bottom: 3rem;
	margin-bottom: 8.15rem;
}
/* ===================
	　　 cont
=================== */
#cont1{
	text-align: center;
	border-top: 0.1rem solid #b8b8b8;
	
}
#cont1 h2{
	width: 39rem;
	height: 16rem;
  	background-image: url(/Page/PHILOSOPHY/210618/img/cont1-title.svg);
	background-repeat: no-repeat;
	background-size: cover;
	text-indent: 100%;
    white-space: nowrap;
    overflow: hidden;
	margin: 8.8rem auto 5.9rem;
}
.cont-img{
	width: 80rem;
	position: relative;
	margin: 0 auto 6.6rem;
}
.design-cut{
	width: 33.5rem;
	position: absolute;
	z-index: 2;
	left: 54.5rem;
	top: 39.1rem;
}
#cont1 .about::before{
	content: "";
	background-image: url(/Page/PHILOSOPHY/210618/img/bracket01.svg);
	background-repeat: no-repeat;
	background-size: cover;
	width: 3rem;
	height: 3.2rem;
	position: absolute;
	display: inline-block;
	left: 19rem;
	top: -2.5rem;
}
#cont1 .about::after{
	content: "";
	background-image: url(/Page/PHILOSOPHY/210618/img/bracket02.svg);
	background-repeat: no-repeat;
	background-size: cover;
	width: 3.1rem;
	height: 3.1rem;
	position: absolute;
	display: inline-block;
	right: 19rem;
	bottom: -2.45rem;
}
#cont1 .about{
	margin-bottom: 11.35rem;
}
.embroider{
	width: 31rem;
	position: absolute;
	z-index: 2;
	right: -12.1rem;
	top: 38.9rem;
}
.sewing{
	width: 24.6rem;
	position: absolute;
	z-index: 2;
	right: -8.1rem;
	top: 39.2rem;
}

#cont2{
	text-align: center;
	padding-bottom: 12rem;
}
#cont2 .bg-white{
	width: 72rem;
	background-color: #ffffff;
	padding-bottom: 4.6rem;
	margin: 0 auto;
}
.cont2-img{
	width: 48rem;
	padding-top: 4.6rem;
	margin: 0 auto 3.8rem;
}
#cont2 h2{
	font-size: 3.4rem;
	font-weight: 600;
	font-style: italic;
	margin-bottom: 3rem;
	letter-spacing: 0.028em;
}
#cont2 .about{
	margin-bottom: 2.4rem;
}
/* ===================
	　　  button
=================== */


/*=======================================
               Responsive   
========================================*/
/* for SP */
@media only screen and (max-width: 767px) {
  

  /*=======================================
                    SP    
  ========================================*/

/* ===================
	　　 General
=================== */
.main-inner{
	/* background-image: url(/Page/PHILOSOPHY/210618/img/sp.jpg); */
	background-repeat: no-repeat;
	background-size: calc(750* (100vw / 750)); 
	background-position-x: center; 
	background-position-y: calc(-120* (100vw / 750));
	overflow: hidden;
}
.main-area .main-inner{
	width: 100%;
}
#wrapper {
  width: calc(750* (100vw / 750));
  margin: 0 auto;
  -webkit-font-feature-settings: "palt";
          font-feature-settings: "palt";
  -webkit-box-sizing: border-box;
          box-sizing: border-box;
}
#breadcrumb .cateList {
  text-overflow: ellipsis;
  white-space: nowrap;
  overflow: hidden;
}
  /* ===================
  　　  common
  =================== */
 .sp_only{
	display: block;
}
.pc_only{
	display: none;
}
.yugothic{
	letter-spacing: 0.01em;
} 
.about{
	font-size: calc(28* (100vw / 750));
}
.caption{
	width: calc(688* (100vw / 750));
	font-size: calc(26* (100vw / 750));
	letter-spacing: 0.01em;
	text-align: justify;
	margin-left: auto;
	margin-right: auto;
}
.Crimson_Text{
	font-family: 'Crimson Text', serif;
	letter-spacing: 0.025em;
	font-feature-settings: "palt";
}
.price a{
	font-size: calc(23* (100vw / 750));
	letter-spacing: 0.015em;
	border-bottom: calc(2* (100vw / 750)) solid #cccccc;
}
.mb14pc{
	margin-bottom: calc(165* (100vw / 750));
}
.ml09pc{
	margin-left: calc(15* (100vw / 750));
}
#bg-color{
	width: 100%;
	/* opacity: 0.5; */
}
  /* ===================
  　　　 firstview
  =================== */
#firstview{
	text-align: center;
	padding-top: calc(40* (100vw / 750));
	margin-bottom: calc(113* (100vw / 750));
}
#firstview .bg-white{
	width: calc(730* (100vw / 750));
	/* opacity: 0.5; */
}
.fv-img{
	width: calc(700* (100vw / 750));
	padding-top: calc(60* (100vw / 750));
	margin: 0 auto calc(45* (100vw / 750));
}
#firstview h2{
	font-size: calc(60* (100vw / 750));
	line-height: 1.1;
	margin-bottom: calc(25* (100vw / 750));
}
.subtitle{
	font-size: calc(46* (100vw / 750));
	padding-bottom: calc(52* (100vw / 750));
	margin-bottom: calc(106* (100vw / 750));
}
#firstview .about{
	letter-spacing: 0.01em;
}
 /* ===================
  　　    cont
  =================== */
#cont1{
	border-top: calc(2* (100vw / 750)) solid #b8b8b8;
}
#cont1 h2{
	width: calc(580* (100vw / 750));
	height: calc(250* (100vw / 750));
  	background-image: url(/Page/PHILOSOPHY/210618/img/sp_cont1-title.svg);
	background-size: 100%;
	margin: calc(118* (100vw / 750)) auto calc(64* (100vw / 750));
}
.cont-img{
	width: 100%;
	margin: 0 auto calc(111* (100vw / 750));
}
.design-cut{
	width: calc(351* (100vw / 750));
	left: calc(369* (100vw / 750));
	top: calc(330* (100vw / 750));
}
#cont1 .about::before{
	width: calc(47* (100vw / 750));
	height: calc(47* (100vw / 750));
	left: calc(-47* (100vw / 750));
	top: calc(-35* (100vw / 750));
}
#cont1 .about::after{
	width: calc(47* (100vw / 750));
	height: calc(47* (100vw / 750));
	right: calc(-47* (100vw / 750));
	bottom: calc(-31* (100vw / 750));
}
#cont1 .about{
	width: calc(599* (100vw / 750));
	text-align: justify;
	margin-left: auto;
	margin-right: auto;
	margin-bottom: calc(150* (100vw / 750));
}

.embroider{
	width: calc(311* (100vw / 750));
	right: calc(90* (100vw / 750));
	top: calc(329* (100vw / 750));
}
.sewing{
	width: calc(209* (100vw / 750));
	right: calc(30* (100vw / 750));
	top: calc(330* (100vw / 750));
}

#cont2{
	padding-bottom: calc(115* (100vw / 750));
}
#cont2 .bg-white{
	width: calc(702* (100vw / 750));
	padding-bottom: calc(57* (100vw / 750));
	/* opacity: 0.5; */
}
.cont2-img{
	width: calc(639.4* (100vw / 750));
	padding-top: calc(60* (100vw / 750));
	margin: 0 auto 2.5rem;
}
#cont2 h2{
	font-size: calc(56* (100vw / 750));
	margin-bottom: calc(40* (100vw / 750));
	letter-spacing: 0.025em;
}
#cont2 .about{
	margin-bottom: calc(49* (100vw / 750));
}
.footer{
	margin-top: calc(0* (100vw / 750))!important;
}
  /* ===================
  　　  button
  =================== */

}

/* for Tablet */
@media screen and (min-width: 768px) and  (max-width: 1200px) {

  /*=======================================
                    Tablet    
  ========================================*/
/* ===================
	　　 General
=================== */
html {
    font-size: calc(10* (100vw / 1200))!important;
}

* {
  -webkit-box-sizing: border-box;
  box-sizing: border-box;
}
#mainLP_Contents{
	/*background-image: url(/Page/style/210611/img/pc.jpg);*/
	background-repeat: no-repeat;
	background-size: calc(1200 *(100vw / 1200)); 
	background-position-x: calc(0 *(100vw / 1200)); 
	background-position-y: calc(-6 *(100vw / 1200));
	overflow: hidden;
}
#wrapper {
  width: calc(1200 *(100vw / 1200));
  margin: calc(0 *(100vw / 1200)) ;
  -webkit-font-feature-settings: "palt";
          font-feature-settings: "palt";
  -webkit-box-sizing: border-box;
          box-sizing: border-box;
}

}


/*# sourceMappingURL=style.css.map */