@charset "utf-8";
/* CSS Document */

:root {
  --color1: #886C43;/*ブラウン*/
  --color2: #D7B759;/*黄土色*/
  --color3: #ECE9E7;/*ベージュ*/
  --color4: #2E2E2E;/*ブラック*/
}

#underbar_wrap {
	font-family: "Noto Sans JP", YuGothic, "Yu Gothic medium", "Hiragino Sans", Meiryo, "sans-serif";
	text-align: center;
	font-size: clamp(0.8rem, 0.5rem + 2.06vw, 1.875rem);
	color: var(--color4);
}

#underbar_wrap .w1000 {
	width: 90%;
	max-width: 1000px;
	margin: 0 auto;
}

#underbar_wrap h3 {
	font-family: "Noto Serif JP", "Yu Mincho", "YuMincho", "Hiragino Mincho ProN", "Hiragino Mincho Pro", Meiryo, serif;
	color: var(--color1);
	letter-spacing: 0.3em;
	margin-bottom: 3.0em;
	font-weight: 500;
	font-size: 200%;
	position: relative;
}

#underbar_wrap h3:after{
	content: "";
        display: inline-block;
        background: url(https://www.forcise.jp/img/item/underbar/cate2026/ung_check.png) no-repeat bottom;
        background-size: 100%;
        height: auto;
        width: 5%;
       aspect-ratio: 50 / 8;
	position: absolute;
	left: 50%;
	transform: translateX(-50%);
	bottom: -0.5em;
	max-width: 50px;
}

#underbar_wrap .btn a {
	background: var(--color1);
	color: #FFFFFF;
	padding: 1.0em 2%;
	border-radius: 40px;
	display: block;
	position: relative;
}

 #underbar_wrap .btn a:after{
	content: "";
    width: 0.5em;
    height: 0.5em;
    border: 0;
    border-top: solid 2px #FFFFFF;
    border-right: solid 2px #FFFFFF;
    position: absolute;
    top: 50%;
    margin-top: -0.2em;
    transform: rotate(45deg);
    right: 5%;
}

#underbar_wrap #fv img {
	width: 100%;
	vertical-align: bottom;
}

#underbar_wrap #fv #obi {
	font-family: "Noto Serif JP", "Yu Mincho", "YuMincho", "Hiragino Mincho ProN", "Hiragino Mincho Pro", Meiryo, serif;
	background: var(--color1);	
	font-weight: 500;
	padding: 1.0em 0;
}

#underbar_wrap #fv #obi ul {
	justify-content: center;
	flex-wrap: wrap;
}

#underbar_wrap #fv #obi ul li {
	margin: 0.5em 0;
}

#underbar_wrap #fv #obi ul li a {
	color: #FFFFFF;
	display: block;
	padding: 0 2.0em;
	border-right: 1px solid #FFFFFF;
	line-height: 1.0;
	letter-spacing: 0.1em;
}

#underbar_wrap #fv #obi ul li:last-child a {
	border-right: none;
}

#underbar_wrap #ninsyo {
	padding: 8.0rem 0;
	text-align: left;
}

#underbar_wrap #ninsyo .box_1 {
	width: 25%;
}

#underbar_wrap #ninsyo dl {
	width: 70%;
}

#underbar_wrap #ninsyo dt {
	font-size: 140%;
	margin-bottom: 3.0rem;
	font-family: "Noto Serif JP", "Yu Mincho", "YuMincho", "Hiragino Mincho ProN", "Hiragino Mincho Pro", Meiryo, serif;
	letter-spacing: 0.1em;
	font-weight: 500;
}

#underbar_wrap #ninsyo dd {
	line-height: 1.8;
}


#underbar_wrap #award {
	background: url(https://www.forcise.jp/img/item/underbar/cate2026/bk_1.jpg) no-repeat top center;
	background-size: cover;
	padding: 8rem 0 16rem;
}

#underbar_wrap #award .box {
	position: relative;
	display: inline-block;
	padding: 0 5%;
	/*margin-top: 2.0em;*/
}

#underbar_wrap #award .box:before,
#underbar_wrap #award .box:after {
	content: "";
	display: inline-block;
	background: url(https://www.forcise.jp/img/item/underbar/cate2026/laurel.png) no-repeat center;
	background-size: 100%;
	width: 15%;
	aspect-ratio: 130 / 214;
	position: absolute;
	top: 50%;
	transform: translateY(-50%);
}

#underbar_wrap #award .box:before {
	left: 0;
}

#underbar_wrap #award .box:after {
	right: 0;
	transform: translateY(-50%) scaleX(-1);
}



#underbar_wrap #award .box p {
	font-family: "Noto Serif JP", "Yu Mincho", "YuMincho", "Hiragino Mincho ProN", "Hiragino Mincho Pro", Meiryo, serif;
	color: var(--color1);
	font-size: 180%;
	margin: 0.3em auto;
	/*position: relative;*/
	/*padding-left: 8%;*/
	font-weight: 500;
}

#underbar_wrap #award .box p:before {
	content: "";
    display: inline-block;
	background: url(https://www.forcise.jp/img/item/underbar/cate2026/crown.png) no-repeat right;
        background-size: 100%;
        height: auto;
        width: 8%;
       aspect-ratio: 65 / 45;
	margin-right: 0.5em;
	/*position: absolute;
	top: 60%;
	transform: translateY(-50%);
	left: 0;*/
}


#underbar_wrap #award .box .span1 {
	font-size: 150%;
	display: inline-block;
	margin-left: 0.5em;
}

#underbar_wrap #award .kome,#underbar_wrap #award p.kome {
	font-size: clamp(0.875rem, 0.6rem + 0.88vw, 1.25rem);
}

#underbar_wrap #award .box .kome {
	vertical-align: text-top;
	display: inline-block;
	margin-left: 0.5em;
}

#underbar_wrap #award .box .span2 {
	font-weight: 500;
}

#underbar_wrap #award img {
	margin: 3.0em auto;
}


#underbar_wrap #series {
	padding: 8.0rem 0;
}

#underbar_wrap #series ul {
	margin-bottom: 2.0em;
}

#underbar_wrap #series li {
	width: 24%;
	font-weight: 500;
}

#underbar_wrap #series li span {
	color: var(--color1);
	border: 1px solid;
	padding: 0.1em 1.5em;
	font-size: 80%;
}

#underbar_wrap #series li p {
	margin: 1.0em auto;
}

#underbar_wrap #series li .view_more a {
	color: var(--color1);
	font-size: 80%;
	position: relative;
	padding-right: 8%;
}

#underbar_wrap #series li .view_more a:before {
	content: "";
    width: 0.5em;
    height: 0.5em;
    border: 0;
    border-top: solid 2px #886C43;
    border-right: solid 2px #886C43;
    position: absolute;
    top: 50%;
    margin-top: -0.2em;
    transform: rotate(45deg);
    right: 5%;
}


#underbar_wrap #about {
	background: var(--color3);
	padding: 8.0rem 0;
}

#underbar_wrap #about dl {
	margin: 5.0em auto;
}

#underbar_wrap #about dl:nth-of-type(2) {
	margin: 3.0em auto;
}

#underbar_wrap #about dt {
	font-family: "Noto Serif JP", "Yu Mincho", "YuMincho", "Hiragino Mincho ProN", "Hiragino Mincho Pro", Meiryo, serif;
	font-size: 140%;
	margin-bottom: 1.0em;
	line-height: 1.8;
	font-weight: 500;
}

#underbar_wrap #about dd {
	line-height: 2.0;
}


#underbar_wrap #stylist_voice {
	padding: 8.0rem 0;
}

#underbar_wrap #stylist_voice .box {
	text-align: left;
	margin-bottom: 8.0em;
}

#underbar_wrap #stylist_voice .box:last-child {
	margin-bottom: 0;
}

#underbar_wrap #stylist_voice .box1 {
	width: 75%;
	font-weight: 500;
}

#underbar_wrap #stylist_voice .box1 .ttl {
	color: var(--color1);
	font-size: 80%;	
	margin-bottom: 1.0em;
}

#underbar_wrap #stylist_voice .box1 .ttl span {
	border: 1px solid;
	padding: 0.1em 1.5em;
	display: inline-block;
	margin-right: 1.0em;
}

#underbar_wrap #stylist_voice .box1 .shop {
	font-size: 120%;
	letter-spacing: 0.1em;
	margin-bottom: 0.5em;
}

#underbar_wrap #stylist_voice .box1 .stylist_name {
	font-size: 140%;
}

#underbar_wrap #stylist_voice .box1 .stylist_name span {
	font-size: 70%;
	display: inline-block;
	margin-right: 1.0em;
}

#underbar_wrap #stylist_voice .box2 {
	width: 20%;
}

#underbar_wrap #stylist_voice p {
	line-height: 2.0;
	margin: 2.0em auto 2.5em;
}

#underbar_wrap #stylist_voice .box3 p {
	color: var(--color1);
	font-size: 120%;
	line-height: normal;
	margin-bottom: 2.0em;
}

#underbar_wrap #stylist_voice .box3 p:before {
	content: "■";
	margin-right: 0.5em;
}


#underbar_wrap #product_cate .box {
	margin-bottom: 10.0em;
}

#underbar_wrap #product_cate .logo {
	margin-bottom: 5.0em;
}

#underbar_wrap #product_cate .box1 {
	align-items: flex-start;
}

#underbar_wrap #product_cate .box1_1 {
	width: 50%;
}

#underbar_wrap #product_cate .box1_2 {
	width: 45%;
	position: relative;
}

#underbar_wrap #product_cate .box1_2 dl {
	text-align: left;
}

#underbar_wrap #product_cate .box1_2 dt {
	color: var(--color1);
	font-size: 80%;
	border: 1px solid;
	padding: 0.1em 1.5em;
	display: inline-block;
}

#underbar_wrap #product_cate .box1_2 .item_name {
	margin-bottom: 1.0em;
}

#underbar_wrap #product_cate .box1_2 .item_name span {
	display: block;
	color: var(--color1);
	font-size: 120%;
	font-weight: 500;
	letter-spacing: 0.1em;
	margin: 0.8em auto;
}


#underbar_wrap #product_cate .box1_2 .p_box .flavor {
	font-size: 80%;
}

#underbar_wrap #product_cate .box1_2 .p_box .price {
	display: inline-block;
}

#underbar_wrap #product_cate .box1_2 .p_box .price:after {
	content: "円（税込）";
	margin-left: 0.2em;
	font-size: 70%;
}

#underbar_wrap #product_cate .box1_2 .btn {
	position: absolute;
	left: 0;
	bottom: 0;
	width: 100%;
}

#underbar_wrap #product_cate .box2 {
	padding: 3.0em 0;
}

#underbar_wrap #product_cate .box2 dt {
	font-size: 120%;
	margin-bottom: 0.5em;
	font-weight: 500;
} 

#underbar_wrap #product_cate .box2 dd {
	line-height: 2.0;
}

#underbar_wrap #product_cate .box3 {
	background: var(--color3);
	padding: 2.0em 5%;
}

#underbar_wrap #product_cate .box3 ul {
	display: flex;
	justify-content: center;
	flex-wrap: wrap;
	text-align: left;
}

#underbar_wrap #product_cate .box3 li {
	width: 45%;
	margin: 0.5em auto;
}

#underbar_wrap #product_cate .box3 li:before {
	content: "■";
	margin-right: 0.5em;
}

#underbar_wrap #product_cate .box4 {
	align-items: flex-start;
	margin-top: 5.0em;
}

#underbar_wrap #product_cate .box4_1 {
	width: 50%;
	padding-left: 5%;
	text-align: left;
	box-sizing: border-box;
}

#underbar_wrap #product_cate .box4_1 dl {
	margin-bottom: 3.0em;
}

#underbar_wrap #product_cate .box4_1 dt {
	font-size: 120%;
	margin-bottom: 0.5em;
	font-weight: 500;
}

#underbar_wrap #product_cate .box4_1 dd {
	line-height: 2.0;
}

#underbar_wrap #product_cate .box4_2 {
	width: 45%;
}


#underbar_wrap #under_sns {
	padding: 8.0rem 0;
	background: var(--color3);
}

#underbar_wrap #under_sns .w1000 {
	background: #FFFFFF;
	padding: 5rem 0 0;
	box-sizing: border-box;
}

#underbar_wrap #under_sns h3 {
	margin-bottom: 1.0em;
}

#underbar_wrap #under_sns h3 span {
	display: block;
	font-family: "Noto Sans JP", YuGothic, "Yu Gothic medium", "Hiragino Sans", Meiryo, "sans-serif";
	font-size: clamp(1.125rem, 0.772rem + 1.76vw, 1.875rem);
	color: var(--color4);	
	letter-spacing: normal;
	font-weight: normal;
}

#underbar_wrap #user_voice	{
	background: var(--color1);
	color: #FFFFFF;
	padding: 8rem 0;
}

#underbar_wrap #user_voice h3 {
	color: #FFFFFF;
	margin-bottom: 1.0em;
}

#underbar_wrap #user_voice h3:after,#underbar_wrap #under_sns h3:after {
	display: none;
}

#underbar_wrap #user_voice h3 span {
	display: block;
	font-family: "Noto Sans JP", YuGothic, "Yu Gothic medium", "Hiragino Sans", Meiryo, "sans-serif";
	font-size: clamp(1.125rem, 0.772rem + 1.76vw, 1.875rem);
	letter-spacing: normal;
	font-weight: normal;
}

#underbar_wrap #user_voice ul {
	flex-wrap: wrap;
}

#underbar_wrap #user_voice li {
	width: 48%;
	padding: 1.5em 3%;
	text-align: left;
	margin-top: 2.0em;
	background: #FFFFFF;
	box-sizing: border-box;
}

#underbar_wrap #user_voice p a {
	background: var(--color1);
	color: #FFFFFF;
	padding: 0.1em 5%;
	display: inline-block;
	font-size: 85%;
}

#underbar_wrap #user_voice dl {
	color: var(--color4);
}

#underbar_wrap #user_voice dt {
	font-size: 120%;
	margin: 1.0em auto;
	line-height: 2.0;
}

#underbar_wrap #user_voice p.kome {
	font-size: 70%;
	margin-top: 3.0em;
}

#underbar_wrap .sp_only {
	display: none;
}



@media only screen and (max-width: 480px) {
#underbar_wrap .sp_only {
	display: block;
}
#underbar_wrap .pc_only {
	display: none;
}
	#underbar_wrap h3 {
		letter-spacing: 0.2em;
	}
	#underbar_wrap #fv #obi ul li a {
	padding: 0 1.0em;
    font-size: 90%;
}
	#underbar_wrap #ninsyo .comm_flex {
		flex-direction: column;
	}
	
	#underbar_wrap #ninsyo dl {
    width: 100%;
}
	#underbar_wrap #ninsyo .box_1 {
    width: 40%;
		margin-bottom: 2.0em;
}
	#underbar_wrap #ninsyo {
    padding: 4.0rem 0;
    text-align: left;
}
	#underbar_wrap #ninsyo dt {
    font-size: 120%;
    margin-bottom: 1.5rem;
}
	#underbar_wrap #award {
    padding: 4rem 0;
}
	#underbar_wrap h3 {
    margin-bottom: 1.5em;
}
#underbar_wrap #award .box p {
    font-size: 130%;
	line-height: normal;
	padding: 0;
}
	#underbar_wrap #award .box .span1 {
    font-size: 300%;
    margin-left: auto;
	letter-spacing: 0.05em;
}
	#underbar_wrap #award .box p:before {
    width: 12%;
    top: 11%;
}
	#underbar_wrap #award .box:before {
	left: -5%;
}

#underbar_wrap #award .box:after {
	right: -5%;
}
	#underbar_wrap #award .box .kome {
    vertical-align: text-bottom;
}
	#underbar_wrap #award p.sp_only {
    font-size: clamp(0.875rem, 0.6rem + 0.88vw, 1.25rem);
	}
	
	#underbar_wrap #award .box:before, #underbar_wrap #award .box:after {
    width: 15%;
    top: 58%;
}
	#underbar_wrap #award img {
    margin: 1.5em auto;
}
	#underbar_wrap #series,#underbar_wrap #about,#underbar_wrap #stylist_voice,#underbar_wrap #under_sns,#underbar_wrap #user_voice {
    padding: 4.0rem 0;
}
	#underbar_wrap #series ul {
		flex-wrap: wrap;
	}
	
	#underbar_wrap #series li {
		width: 48%;
	}
	#underbar_wrap #about dl {
    margin: 2.0em auto;
}
	#underbar_wrap #about dt {
    font-size: 135%;
}
	#underbar_wrap #about dl:nth-of-type(2) {
    margin: 2.0em auto auto;
}
	
	#underbar_wrap #stylist_voice .box1 .ttl span {
    margin-bottom: 1.0em;
}
	#underbar_wrap #stylist_voice .box1 {
		width: 65%;
	}
	#underbar_wrap #stylist_voice .box2 {
		width: 30%;
	}
	#underbar_wrap #stylist_voice .box {
    margin-bottom: 4.0em;
}
	#underbar_wrap #product_cate .logo {
    width: 25%;
    margin: auto auto 2em;
}
	#underbar_wrap #product_cate .box1 {
    flex-direction: column;
}
	#underbar_wrap #product_cate .box1_1 {
    width: 75%;
    margin: auto;
}
	#underbar_wrap #product_cate .box1_2 {
    width: 100%;
}
	#underbar_wrap #product_cate .box1_2 .btn {
		position: unset;
	}
	#underbar_wrap #product_cate .box1_2 dl {
    text-align: center;
    margin: 2.0em auto;
}
	#underbar_wrap #product_cate .p_box .comm_flex {
		justify-content: center;
	}
	#underbar_wrap #product_cate .p_box .comm_flex .flavor {
		margin-right: 1.0em;
	}
	#underbar_wrap #product_cate .box2 dd {
		text-align: left;
	}
	#underbar_wrap #product_cate .box3 ul {
		flex-direction: column;
	}
	#underbar_wrap #product_cate .box3 li {
    width: 100%;
}
	#underbar_wrap #product_cate .box4 {
    margin-top: 2.0em;
    flex-direction: column-reverse;
}
	#underbar_wrap #product_cate .box4_2 {
    width: 75%;
    margin: auto;
}
	#underbar_wrap #product_cate .box4_1 {
		width: 100%;
		padding: 0;
	}
	#underbar_wrap #product_cate .box4_1 dt {
    text-align: center;
}
	#underbar_wrap #product_cate .box4_1 dl {
    margin: 2.0em auto;
}
	#underbar_wrap #product_cate .box {
    margin-bottom: 5.0em;
}
	#underbar_wrap #under_sns .w1000 {
    padding: 2rem 0 0;
}
	#underbar_wrap #user_voice li {
    width: 100%;
}
	#underbar_wrap #user_voice h3 {
    margin-bottom: 0;
}
	#underbar_wrap #series li .view_more a:before {
    border-top: solid 1px #886C43;
    border-right: solid 1px #886C43;
}
	
}


.letroTabDisplay .letroTabDisplayTab {
		width: 90%;
	}