@charset "utf-8";

@import url('https://fonts.googleapis.com/css2?family=Noto+Sans+JP:wght@300;400;500;700&display=swap');

html,body {height: 100%;}

html {font-size: 62.5%;overflow-y: scroll;}

body,h1,h2,h3,h4,h5,h6,p,address,ul,ol,li,dl,dt,dd,table,th,td,img,figure,form,video {

  font-style: normal;font-weight: normal;

  /*font-family: 'Noto Sans JP', "Hiragino Kaku Gothic Pro", "ヒラギノ角ゴ Pro W3", "メイリオ", Meiryo, "ＭＳ Ｐゴシック", Arial, Verdana, sans-serif;*/

  line-height: 100%;/*color: #000;*/text-align: left;

  margin: 0;padding: 0;border: none;list-style-type: none;

}

/*input,button,textarea,select {

  margin: 0;padding: 0;background: none;border: none;border-radius: 0;outline: none;-webkit-appearance: none;-moz-appearance: none;appearance: none;

  font-family: 'Noto Sans JP', "Hiragino Kaku Gothic Pro", "ヒラギノ角ゴ Pro W3", "メイリオ", Meiryo, "ＭＳ Ｐゴシック", Arial, Verdana, sans-serif;

  color: #000;

}*/



/*input,button,textarea,select {

  margin: 0;padding: 0;border: none;border-radius: 0;background: none;outline: none;-webkit-appearance: none;-moz-appearance: none;appearance: none;

  font-family: "Hiragino Kaku Gothic Pro", "ヒラギノ角ゴ Pro W3", "メイリオ", Meiryo, "ＭＳ Ｐゴシック", Arial, Verdana, sans-serif;

  color: #000;

}*/



textarea {resize: vertical;}

select::-ms-expand {display: none;}



a {

  text-decoration: none;

  /*color: #000;*/

  outline: none;

}



img {

  vertical-align: bottom;

  max-width: 100%;

  height: auto;

}



*,*::after,*::before {-webkit-box-sizing: border-box;box-sizing: border-box;}



.preload * {

  -webkit-transition: none !important;

  -o-transition: none !important;

  transition: none !important;

}



/* --------------------------------------------------------------------------------



responsive



-------------------------------------------------------------------------------- */

@media screen and (min-width: 768px) {

  /*body {

    min-width: 1025px;

  }*/

  a:hover {

    opacity: .7;

  }

  .sp {

    display: none !important;

  }

  .pc_only {

    display: block;

  }

}

@media screen and (max-width: 767px) {

  a:active {

    opacity: .7;

  }

  .pc,
  .pc_only {

    display: none !important;

  }

}

/* --------------------------------------------------------------------------------



base



-------------------------------------------------------------------------------- */

p,

dt,

dd,

li,

th,

td,

input,

button,

textarea,

select {

  /*font-size: 1.8rem;*/

  line-height: 1;

}



@media screen and (max-width: 767px) {

  body {-webkit-text-size-adjust: 100%;}



  p,

  dt,

  dd,

  li,

  th,

  td,

  input,

  button,

  textarea,

  select {

    /*font-size: 3.733vw;*/

    line-height: 1;

  }

}



/* --------------------------------------------------------------------------------



main



-------------------------------------------------------------------------------- */

.main_wrap {
	background: url(https://cella6091.itembox.design/item/img/linoue/bg02.png) no-repeat center -90px;
	background-size: 100%;
	overflow: hidden;
}
.sec_wrap{
	width: 75%;
	margin: auto;
}

@media screen and (max-width: 767px) {
	.main_wrap{
		background: url(https://cella6091.itembox.design/item/img/linoue/bg02_sp.png) no-repeat center 172vw;
		background-size: 100%;
	}
	.sec_wrap{
		width: 90%;
	}
}






/* mv_wrap

---------------------------------------- */

.mv_wrap {
	position: relative;
	width: 95%;
	margin: 0 0 1% 5%;
}
@media screen and (max-width: 767px) {
	.mv_wrap{
		width: 100%;
		margin: 0;
	}
}

/* sec01

---------------------------------------- */
#sec01 .sec_wrap{
	position: relative;
	display: flex;
	align-items: center;
	width: 95%;
	height: 54vw;
	margin: 0 auto 8%;
	background: url(https://cella6091.itembox.design/item/img/linoue/bg01.png) no-repeat center top;
	background-size: 100%;
}
#sec01 h3{
	width: 45%;
	margin-left: 50%;
}
#sec01 .float{
	position: absolute;
	top: 4vw;
	right: 5vw;
	max-width: 290px;
	width: 15vw;
}


@media screen and (max-width: 1920px) and (min-width: 1025px) {

}
@media screen and (max-width: 1024px) {
}


@media screen and (max-width: 767px) {
	#sec01 .sec_wrap{
		display: block;
		width: 100%;
		height: auto;
		margin: 20% 0;
		background: none;
	}
	#sec01 h3{
		width: 80%;
		margin-left: 0;
		margin-bottom: 5%
	}
	#sec01 .image{
		width: 90%;
		margin-left: 10%
	}
}

/* sec02

---------------------------------------- */
#sec02{
	margin-bottom: 15%;
}
#sec02 h3{
	margin-bottom: 10%;
}
#sec02 .object{
	width: 70%;
	margin: 0 auto 5%;
}
#sec02 .box{
	padding: 3% 5%;
	background: #fff;
	border: 6px solid #AB9989;
	border-radius: 10px;
}
#sec02 .box h4{
	position: relative;
	display: table;
	margin: 0 auto 1em;
	font-size : 4.2rem;
	color : #806248;
	font-weight : bold;
	text-align: center;
	line-height : 1.5em;
	letter-spacing : 2.75px;
	font-family : 'Noto Sans JP', sans-serif;
	border-bottom: 2px solid #7E6147;
}
#sec02 .box h4 span{
	font-size : 6.5rem;
}
@media screen and (max-width: 767px) {
	#sec02 .sec_wrap{
		width: 80%;
	}
	#sec02 h3{
		margin-bottom: 8%;
	}
	#sec02 .object{
		width: 100%;
		margin: 0 auto 10%;
	}
	#sec02 .box{
		padding: 5%;
		border: 2px solid #AB9989;
	}
	#sec02 .box h4{
		font-size: 2rem;
		border-bottom: 1px solid #7E6147;
	}
	#sec02 .box h4 span{
		font-size : 3rem;
	}
}

/* sec03

---------------------------------------- */
#sec03 h3{
	position: relative;
	padding-bottom: 1em;
	margin-bottom: 2em;
	font-size: 6rem;
	color: #000;
	text-align: center;
	font-weight: bold;
	font-family : 'Noto Sans JP', sans-serif;
}
#sec03 h3:after{
	content: "";
	position: absolute;
	left: 0;
	right: 0;
	bottom: 0;
	width: 3em;
	height: 1px;
	margin: auto;
	border-bottom: 6px solid #c5b8ad;
}
#sec03 #colorvari01{
	background: url(https://cella6091.itembox.design/item/img/linoue/bg03.jpg);
}
#sec03 #colorvari02{
	background: url(https://cella6091.itembox.design/item/img/linoue/bg04.jpg);
}
#sec03 #colorvari03{
	background: url(https://cella6091.itembox.design/item/img/linoue/bg05.jpg);
}
#sec03 #colorvari04{
	background: url(https://cella6091.itembox.design/item/img/linoue/bg06.jpg);
}
#sec03 .sec_wrap{
	position: relative;
	display: flex;
	justify-content: space-between;
	align-items: center;
	padding: 1.5% 0;
}
#sec03 .sec_wrap .product{
	position: absolute;
	right: 0;
	top: 11vw;
	width: 7vw;
}
#sec03 .colorvari_wrap.even .product{
	position: absolute;
	left: 0;
	right: auto;
	top: 12vw;
}
#sec03 .sec_wrap .img{
	width: 50%;
}
#sec03 .sec_wrap .txt{
	position: relative;
	width: 46%;
}
/*#sec03 .colorvari_wrap.even .sec_wrap{
	width: 80%;
	margin-left: 12%;
}*/
#sec03 .colorvari_wrap.even .img{
	order: 2;
}
#sec03 .colorvari_wrap.even .txt{
	order: 1;
}
#sec03 .sec_wrap .txt h4{
	margin: 1em 0 0.2em;
	font-size: 3rem;
	color: #000;
	font-weight: bold;
	text-align: center;
	font-family : 'Noto Sans JP', sans-serif;
}
#sec03 .sec_wrap .txt h4 + p{
	margin-bottom: 2em;
	font-size: 2rem;
	color: #231815;
	text-align: center;
	letter-spacing: 0;
	font-family : 'Noto Sans JP', sans-serif;
}
#sec03 .colorvari_wrap.even .txt h4 + p{
	margin-bottom: 1em;
}
#sec03 .sec_wrap .colovari_btn a{
	display: flex;
	justify-content: center;
	align-items: center;
	width: 9em;
	height: 2.2em;
	margin: auto;
	font-size: 2.8rem;
	color: #fff;
	font-weight: 500;
	font-family : 'Noto Sans JP', sans-serif;
	background: #b14655;
	border-radius: 37.47px;
}
@media screen and (max-width: 1400px) {
	#sec03 .sec_wrap .txt h4{
		font-size: 2.6rem;
	}
}
@media screen and (max-width: 1220px) {
	#sec03 h3{
		font-size: 4.5rem;
	}
	#sec03 .sec_wrap .txt h4{
		font-size: 2.2rem;
	}
	#sec03 .sec_wrap .txt h4 + p{
		margin-bottom: 1em;
		font-size: 1.4rem;
	}
	#sec03 .sec_wrap .colovari_btn a{
		font-size: 1.8rem;
	}
	/*#sec03 #colorvari03 .sec_wrap .product{
		right: -2vw;
	}
	#sec03 #colorvari04 .sec_wrap .product{
		left: -2vw;
	}*/
	#sec03 .sec_wrap .product{
		width: 7vw;
	}
}
@media screen and (max-width: 1060px) {
	#sec03 .sec_wrap .txt h4{
		font-size: 2rem;
	}
	#sec03 .sec_wrap .txt h4 + p{
		font-size: 1.4rem;
	}
}
@media screen and (max-width: 1000px) {
	#sec03 .sec_wrap .product{
		top: auto;
		bottom: 0;
	}
	#sec03 .colorvari_wrap.even .product{
		top: auto;
		bottom: 0;
	}
}
@media screen and (max-width: 767px) {
	#sec03 h3{
		font-size: 2.6rem;
	}
	#sec03 h3:after{
		border-bottom: 3px solid #c5b8ad;
	}
	#sec03 .sec_wrap{
		display: block;
		width: 80%;
		padding: 8% 5%;
		overflow: initial;
	}
	#sec03 .sec_wrap .img{
		width: 100%;
		margin-bottom: 10%
	}
	#sec03 .sec_wrap .txt{
		width: 100%;
	}
	#sec03 .sec_wrap .txt h4 + p,
	#sec03 .colorvari_wrap.even .txt h4 + p{
		margin-bottom: 0.5em;
	}
	#sec03 .sec_wrap .product{
		bottom: -5vw;
		width: 15vw;
	}
	#sec03 .sec_wrap .product,
	#sec03 #colorvari03 .sec_wrap .product{
		right: -11vw;
	}
	#sec03 .colorvari_wrap.even .product,
	#sec03 #colorvari04 .sec_wrap .product{
		left: auto;
		right: -11vw;
		bottom: -5vw;
	}
}
@media screen and (max-width: 440px) {
	#sec03 .sec_wrap .product{
		bottom: 10vw;
	}
	#sec03 .colorvari_wrap.even .product,
	#sec03 #colorvari04 .sec_wrap .product{
		bottom: 10vw;
	}
}
@media screen and (max-width: 330px) {
	#sec03 .sec_wrap .txt h4{
		font-size: 1.8rem;
	}
	#sec03 #colorvari04 .sec_wrap .txt h4 + p br{
		display: block !important;
	}
}

/* sec04

---------------------------------------- */
#sec04{
	padding: 10% 0 5%	;
	background: url(https://cella6091.itembox.design/item/img/linoue/bg07.png) no-repeat center 60px;
	background-size: 100%;
}
#sec04 h3{
	position: relative;
	padding-bottom: 1em;
	margin-bottom: 2em;
	font-size: 5.5rem;
	color: #000;
	text-align: center;
	font-weight: bold;
	font-family : 'Noto Sans JP', sans-serif;
}
#sec04 h3:after{
	content: "";
	position: absolute;
	left: 0;
	right: 0;
	bottom: 0;
	width: 3em;
	height: 1px;
	margin: auto;
	border-bottom: 6px solid #d9d1c9;
}
#sec04 .figure{
	width: 70%;
	margin: 0 auto 10%;
}
#sec04 .color{
	width: 70%;
	margin: 0 auto 5%;
}
#sec04 .color ul.flex{
  display: flex;
  justify-content:space-between; 
}
#sec04 .color ul.flex li{
  max-width: 100%;
}
#sec04 .color ul.flex li a{
  display: block;
  text-align: center;
}

#sec04 .txt,
#sec05 .txt{
	display: flex;
	justify-content: space-between;
	width: 85%;
	margin: 0 auto 10%;
}
#sec04 .txt .product_info{
	width: 50%;
}
#sec04 .txt .product_info p,
#sec05 .txt .product_info p{
	color: #231815;
  line-height: 1.5;
}
#sec04 .txt h4,
#sec05 .txt h4{
	margin-bottom: 0.5em;
	font-size: 3rem;
	color: #000;
	font-weight: 500;
	font-family : 'Noto Sans JP', sans-serif;
}
#sec04 .txt h4 span,
#sec05 .txt h4 span{
	font-size: 2rem;
	font-weight: normal;
}
#sec04 .txt p,
#sec05 .txt p{
	font-size: 2rem;
	letter-spacing: 0;
	font-family : 'Noto Sans JP', sans-serif;
}
.component{
	width: 16em;
	-webkit-transition: 0.7s ease-in-out;
	-moz-transition: 0.7s ease-in-out;
	-o-transition: 0.7s ease-in-out;
	transition: 0.7s ease-in-out;
}
.component.active{
	width: 45%;
	border: 2px solid #969696;
}
.component dt{
	position: relative;
	display: flex;
	align-items: center;
	padding: 0.5em 1em 0.5em 2.8em;
	font-size: 2.4rem;
	color: #000;
	font-weight: 500;
	font-family : 'Noto Sans JP', sans-serif;
	border: 2px solid #969696;
	cursor: pointer;
}
.component dt:hover{
	opacity: 0.7;
}
.component.active dt{
	border: none;
}
.component dt:before{
	content: "";
	display: block;
	position: absolute;
	top: 0;
	bottom: 0;
	left: 8%;
	width: 1.1em;
	height: 3px;
	margin: auto;
	background: #040000;
	-webkit-transform: rotate(0deg);
    -moz-transform: rotate(0deg);
    transform: rotate(0deg);
}
.component dt:after{
	content: "";
	display: block;
	position: absolute;
	top: 0;
	bottom: 0;
	left: 8%;
	width: 1.1em;
	height: 3px;
	margin: auto;
	background: #040000;
	-webkit-transform: rotate(90deg);
    -moz-transform: rotate(90deg);
    transform: rotate(90deg);
}
.component.active dt:before{
	left: 5%;
}
.component.active dt:after{
	display: none;
}
.component dd{
	display: none;
	padding: 1% 5% 5%;
	font-size: 1.6rem;
	line-height: 1.6;
	font-family : 'Noto Sans JP', sans-serif;
}
@media screen and (max-width: 1100px) {
	#sec04 h3{
		font-size: 4.5rem;
	}
	.component{
		width: 10.7em;
		margin: auto;
	}
	.component dt{
		font-size: 1.6rem;
	}
	.component.active{
		width: 100%;
	}
	.component.active dt{
		display: table;
		margin: auto;
	}
	#sec04 .txt{
		display: block;
		width: 55%;
		margin: 0 auto 20%;
	}
	#sec04 .txt .product_info{
		width: 100%;
		margin-bottom: 5%;
	}
}
@media screen and (min-width: 901px){
  #sec04 .color ul.flex li{
    width: 95%;
  }
}
@media screen and (max-width: 835px) {
	#sec04 .txt{
		width: 70%;
	}
}
@media screen and (max-width: 767px){
	#sec04{
		padding: 15% 0 5%;
		background: url(https://cella6091.itembox.design/item/img/linoue/bg07_sp.png) no-repeat center 3vw;
		background-size: 100%;
	}
	#sec04 h3{
		padding-bottom: 0;
		font-size: 2.4rem;
	}
	#sec04 h3:after{
		display: none;
	}
	#sec04 .figure{
		width: 100%;
		margin: 0 auto 15%;
	}
	#sec04 .color{
		width: 90%;
		margin: 0 auto 10%;
	}
  #sec04 .color ul.flex li{
    margin-right: 2%;
  }
  #sec04 .color ul.flex li:last-child{
    margin-right: 0;
  }  
	.component{
		width: 10em;
	}
	.component.active{
		border: 1px solid #969696;
	}
	.component dt{
		padding: 1em 0.5em 1em 2.5em;
		border: 1px solid #969696;
	}
	.component dd{
		font-size: 1.2rem;
	}
}
@media screen and (max-width: 440px) {
	.component dt{
		font-size: 1.4rem;
	}
	#sec04 .txt{
		width: 77%;
	}
	#sec04 .txt h4{
		font-size: 2rem;
	}
	#sec04 .txt h4 span{
		font-size: 1.4rem;
	}
	#sec04 .txt p{
		font-size: 1.3rem;
	}

}
@media screen and (max-width: 330px) {
	#sec04 .txt{
		width: 84%;
	}
	#sec04 .txt p{
		font-size: 1.2rem;
	}
}

/* sec05

---------------------------------------- */
#sec05{
	padding-bottom: 4%;
}
#sec05 .sec_wrap{
	width: 65%;
}
#sec05 .sub{
	width: 45%;
	margin: 0 auto 5%;
}
#sec05 .sub + h3{
	display: block;
	width: 100%;
	margin: 0 0 3%;
}
#sec05 .large{
	width: 82.5%;
	margin-left: 17.5%;
}
#sec05 h3{
	display: flex;
	flex-wrap: wrap;
	justify-content: center;
	width: 18em;
	margin: 3em auto 1em;
	font-size: 4.2rem;
	color: #2C343A;;
	text-align: center;
	font-weight: bold;
	font-family : 'Noto Sans JP', sans-serif;
}
#sec05 h3 span{
	margin-bottom: 0.8em;
	font-size: 2.6rem;
	font-family : 'Noto Sans JP', sans-serif;
}
#sec05 h3 span.blue{
	display: flex;
	justify-content: center;
	align-items: center;
	width: 10em;
	padding: 0.1em;
	color: #fff;
	font-weight: normal;
	background: #96a9b3;
	border-radius: 24px;
}
#sec05 h3 span.brown{
	display: flex;
	justify-content: center;
	align-items: center;
	width: 16em;
	padding: 0.1em;
	color: #fff;
	font-weight: normal;
	background: #c3957e;
	border-radius: 24px;
}
#sec05 h3 + p{
	margin-bottom: 8%;
}
#sec05 h3 + p + p{
	width: 70%;
	margin: 0 auto 5%;
}
#sec05 .txt{
	width: 100%;
}
#sec05 .txt .product_info{
	width: 31em;
}
#sec05 .txt .product_info p.fss{
	margin-top: 0.5em;
	font-size: 1.5rem;
	text-align: right;
}
#sec05 .sec_wrap .item_list{
  margin-bottom: 8%;
}
#sec05 .sec_wrap .item_list ul{
  display: flex;
  justify-content: space-between;
}
#sec05 .sec_wrap .item_list ul li{
  max-width: 100%
}
@media screen and (max-width: 1100px) {
	#sec05 .sec_wrap{
		width: 75%;
	}
	#sec05 h3{
		width: 100%;
	}
	#sec05 h3 span{
		font-size: 2rem;
	}
	#sec05 .txt{
		display: block;
		width: 58%;
		margin: 0 auto 20%;
	}
	#sec05 .txt .product_info{
		width: 100%;
		margin-bottom: 5%;
	}
}
@media screen and (min-width: 901px){
  #sec05 .sec_wrap .item_list ul li{
    width: 95%;
  }
}
@media screen and (max-width: 835px) {
	#sec05 h3 span{
		font-size: 1.8rem;
	}
	#sec05 .txt{
		width: 75%;
	}
}
@media screen and (max-width: 767px){
	#sec05 .sec_wrap{
		width: 80%;
	}
	#sec05 .sub{
		width: 65%;
		margin: 0 auto 10%;
	}
	#sec05 .sub + h3{
		margin: 0 auto 8%;
	}
	#sec05 .large{
		width: 90%;
		margin-left: 10%;
		margin-bottom: 8%;
	}
	#sec05 h3{
		margin: 2em auto 1em;
		font-size: 3rem;
	}
	#sec05 h3 span{
		font-size: 1.6rem;
	}
	#sec05 h3 span.blue{
		width: 12em;
		padding: 0.2em;
	}
	#sec05 h3 span.brown{
		width: 17em;
		padding: 0.2em;
	}
	#sec05 h3 span.kakeru{
		padding-top: 0.2em;
		margin: 0 0.2em;
	}
	#sec05 h3 + p{
		margin-bottom: 10%;
	}
	#sec05 h3 + p + p{
		width: 100%;
	}
	#sec05 .txt{
		width: 82%;
	}
	#sec05 .txt .product_info p.fss{
		margin-top: 0.5em;
	}
  #sec05 .sec_wrap .item_list ul li{
    margin-right: 2%;
  }
  #sec05 .sec_wrap .item_list ul li:last-child{
    margin-right: 0;
  }  
}
@media screen and (max-width: 440px) {
	#sec05 h3{
		font-size: 2.2rem;
	}
	#sec05 h3 span{
		font-size: 1rem;
	}
	#sec05 h3 span.brown{
		width: 16em;
	}
	#sec05 h3 span.blue{
		width: 12em;
	}
	#sec05 .txt{
		width: 94%;
	}
	#sec05 .txt h4{
		font-size: 2rem;
	}
	#sec05 .txt h4 span{
		font-size: 1.4rem;
	}
	#sec05 .txt p{
		font-size: 1.3rem;
	}
	#sec05 .txt .product_info p.fss{
		font-size: 1rem;
	}
}
@media screen and (max-width: 330px) {
	#sec05 h3{
		font-size: 2rem;
	}
	#sec05 .txt{
		width: 100%;
	}
	#sec05 .txt p{
		font-size: 1.2rem;
	}
}

/* sec06

---------------------------------------- */
#sec06{
	margin-bottom: 3%;
}
@media screen and (max-width: 767px){
	#sec06{
		margin-bottom: 8%;
	}
}














