@charset "utf-8";
/*------------------------------------------------------------
	hair
------------------------------------------------------------*/
#main {
	margin-bottom: 187px;
}
#main .brand {
    margin-bottom: 263px;
}
#main .brand .imgInner {
	margin-bottom: 215px;
}
#main .brand .imgInner .textInner dt {
	line-height: 1.65;
}
#main .brand .ddStyle01 {
	margin-top: 175px;
}
#main .brand .photoInner::before {
    display: none;
}
#main .brand .photoInner:after {
	bottom: -10.5%;
    background-image: url(../img/hair/bg01.png);
}
#main .brand .imgBox .textBox .subBox {
    max-width: 482px;
}
#main .brand .imgBox .textBox {
    margin: -56px -6% 0 0;
}
#main .brand .headLine02 {
    margin-bottom: 92px;
}
#main .brand .imgBox .photoBox::before {
    background-image: url(../img/hair/bg02.png);
}
#main .brand .imgBox .borderBox::before {
    width: 37.6vw;
}
#main .brand .imgBox .textBox p {
	margin-bottom: 40px;
}
#main .brand .imgBox .textBox:last-child {
	margin-bottom: 0;
}
#main .brand .imgBox .textBox .title {
	margin-bottom: 41px;
	font-size: 3rem;
	font-weight: 500;
	line-height: 1.17;
}
#main .brand .imgBox .textBox .title span {
	margin: 0 10px 7px 6px;
	display: inline-block;
	vertical-align: middle;
	font-size: 1.6rem;
	font-weight: 400;
	line-height: 1;
}
#main .brand .imgBox .textBox .textDl {
	width: 100%;
	align-items: center;
}
#main .brand .imgBox .textBox .textDl dt {
	padding-bottom: 9px;
	width: 32.5%;
	font-size: 3rem;
	line-height: 1.17;
}
#main .brand .imgBox .textBox .textDl dt::first-letter {
	font-weight: 700;
}
#main .brand .imgBox .textBox .textDl dt:last-of-type ,
#main .brand .imgBox .textBox .textDl dd:last-of-type {
	padding-bottom: 0;
}
#main .brand .imgBox .textBox .textDl dd {
	padding-bottom: 9px;
	width: 67.5%;
	font-size: 1.6rem;
}
#main .brand .imgBox:after {
    height: 99%;
    bottom: -57%;
    background: url(../img/hair/bg03.png);
}
#main .brand .imgBox .photoBox .enTitle {
    bottom: -22.5%;
}
#main .brand .imgArea .textArea {
    margin: -147px 8px 0 0;
}
#main .greyBox {
	margin-bottom: 226px;
    padding: 266px 0 286px;
}
#main .greyBox .headLine02 {
    margin: 0 0 0 3px;
}
#main .greyBox .products {
    margin-bottom: 456px;
}
#main .greyBox .products .imgBox {
    margin-bottom: 277px;
    align-items: flex-start;
}
#main .greyBox .products .imgBox:last-of-type {
    margin-bottom: 0;
}
#main .greyBox .products .photoBox {
    margin-left: 1px;
    width: 589px;
}
#main .greyBox .products .textBox {
    margin: 0 0 -142px -156px !important;
    padding: 104px 89px 109px 160px !important;
	width: calc(100% - 434px) !important;
}
#main .greyBox .products .textBox h3 {
	margin-bottom: 21px;
	padding-bottom: 0;
   	line-height: 1.65;
}
#main .greyBox .products .textBox h3 span {
	margin-bottom: 21px;
   	line-height: 1.95;
}
#main .greyBox .products .textBox h3:after {
    display: none;
}
#main .greyBox .products.typeB{
    margin-bottom: 0;
	padding: 30px 0;
	background-color: #fff;
}
#main .greyBox .lineBox ul {
    padding: 71px 62px 70px 64px;
}
#main .greyBox .lineBox li .phoBox {
    margin-bottom: 43px;
}
#main .greyBox .lineBox li .ttl {
    margin-bottom: 38px;
    padding-bottom: 22px;
	min-height: 170px;
    line-height: 1.95;
    box-sizing: border-box;
}
#main .greyBox .lineBox li .text {
    margin: 0 -16px 19px 0;
	min-height: 250px;
}
#main .hair {
	margin-bottom: 400px;
}
#main .hair.brand .imgInner {
    align-items: flex-start;
}
#main .hair.brand .photoInner:after {
    bottom: -10.7%;
}
#main .hair.brand .imgInner .textInner {
	margin: 121px 0 0;
}
#main .hair.brand .imgInner .textInner .headLine02 {
    margin-bottom: 85px;
}
#main .hair.brand .imgInner .textInner p {
	line-height: 1.95;
}
#main .hair.brand .imgBox .textBox {
    margin: -38px -6% 0 0;
}
#main .hair.brand .imgBox:after {
    bottom: -79.3%;
}
#main .hair.brand .imgBox .photoBox .enTitle {
    bottom: -73.8%;
}
#main .hair.brand .imgArea .borderBox {
    width: 583px;
}
#main .hair.brand .imgArea .textArea {
    margin: -121px 8px 0 0;
}

@media all and (max-width: 896px) {
	.pageTitle {
		margin: 0px 0 72px;
	}
	#main {
		margin-bottom: 109px;
	}
	#main .brand {
		margin-bottom: 97px;
	}
	#main .brand .imgInner .textInner dt {
		margin-bottom: 15px;
		line-height: 1.5;
	}
	#main .brand .ddStyle01 {
		margin-top: 20px;
	}
	#main .brand .imgBox .textBox {
		margin: 0 39px;
	}
	#main .brand .headLine02 {
		margin-bottom: 39px;
		padding-bottom: 24px;
		line-height: 1.3;
	}
	#main .brand .headLine02.h2Style01 {
		margin-bottom: 27px;
	}
	#main .brand .imgBox .borderBox {
		margin-bottom: 43px;
	}
	#main .brand .imgBox .borderBox::before {
		width: calc(100% - 107px);
	}
	#main .brand .photoInner::after {
		bottom: -13.2%;
	}
	#main .brand .imgInner {
		margin-bottom: 66px;
	  }
	  #main .brand .imgBox .photoBox .enTitle {
		bottom: -40%;
	  }
	#main .brand .imgBox .textBox p {
		margin-bottom: 29px;
	}
	#main .brand .imgBox .textBox .title {
		margin-bottom: 10px;
		font-size: 2rem;
		line-height: 1.47;
	}
	#main .brand .imgBox .textBox .title span {
		margin: 0 0 7px 10px;
		font-size: 1.4rem;
	}
	#main .brand .imgBox {
		margin-bottom: 76px;
	}
	#main .brand .imgBox .textBox .textDl dt {
		padding-bottom: 5px;
		width: 42.6%;
		font-size: 2rem;
	}
	#main .brand .imgBox .textBox .textDl dd {
		padding-bottom: 5px;
		width: 57.4%;
		font-size: 1.4rem;
	}
	#main .brand .imgArea .textArea {
		margin: 0;
	}
	#main .greyBox {
		margin-bottom: 84px;
		padding: 105px 0 60px;
	}
	#main .greyBox .products {
		margin-bottom: 87px;
	}
	#main .greyBox .products .imgBox {
		margin-bottom: 58px;
	}
	#main .greyBox .products .photoBox {
		margin: 0 auto;
		width: auto;
	}
	#main .greyBox .products .imgBox01 .photoBox {
		margin-bottom: 0;
	}
	#main .greyBox .products .textBox {
		margin: 0 auto !important;
		padding: 24px 19px 41px !important;
		width: auto !important;
	}
	#main .greyBox .products .textBox h3 {
		margin-bottom: 7px;
		line-height: 1.5;
	}
	#main .greyBox .products .textBox h3 span {
		margin-bottom: 9px;
		line-height: 1.95;
	}
	#main .greyBox .products.typeB{
		margin-bottom: 60px;
		padding: 30px 0 0;
	}
	#main .greyBox .products.typeB .textBox h3 {
		margin-bottom: 35px;
	}
	#main .greyBox .lineBox ul {
		padding: 43px 19px 50px;
	}
	#main .greyBox .lineBox li .phoBox {
		margin-bottom: 27px;
	}
	#main .greyBox .lineBox li .ttl {
		margin-bottom: 21px;
    	padding-bottom: 17px;
		min-height: inherit;
		line-height: 1.95;
		box-sizing: border-box;
	}
	#main .greyBox .lineBox li .text {
		margin: 0 -16px 19px 0;
		min-height: inherit;
	}
	#main .hair {
		margin-bottom: 196px;
	}
	#main .hair.brand .imgInner .textInner {
		margin: 0 20px;
	}
	#main .hair.brand .imgInner .textInner p {
		font-size: 1.4rem;
		line-height: 2;
	}
	#main .hair.brand .imgInner .borderBox {
		margin: 0px 20px 30px auto;
	}
	#main .hair.brand .imgBox {
		margin-bottom: 106px;
	}
	#main .hair.brand .imgBox .textBox {
		margin: 0 20px;
	}
	#main .hair.brand .imgBox .borderBox {
		margin-bottom: 39px;
	}
	#main .hair.brand .imgBox .photoBox .enTitle {
		bottom: -121.8%;
	}
	#main .hair.brand .imgArea .borderBox {
		width: auto;
	}
	#main .hair.brand .imgArea .textArea {
		margin: 0 auto;
	}	
	.text-hight {
		height: auto;
	}
}

@media all and (max-width: 359px) {
	#main .brand .imgBox .textBox {
		margin: 0 20px;
	}

}