@charset "UTF-8";
/*---------------------------------------------------------------*\
	$INDEX
\*---------------------------------------------------------------*/
/*
・共通
・◯◯◯◯◯
・◯◯◯◯◯
*/

/*---------------------------------------------------------------*\
	$共通
\*---------------------------------------------------------------*/

/* Common */

body {
	min-width: 1000px;
}
.b_color {
	background-color: #fcae07;
}
.t_color {
	color:  #fcae07;
}

.spf {
    padding: 3px 5px;
    border: 1px solid #fcae07;
	color: #fcae07;
    width: 165px;
    text-align: center;
    margin-bottom: 15px;
    font-weight: 500;
    font-size: 1.2rem;
}

/* Top */

#top .box_left_top {
	background: #ad96a5;
}
#top .box_right_top {
	background: #305155;
}

/* Catch */


#catch .factor_catch:nth-of-type(1) {
    display: block;
    margin: 70px auto 0;
    width: 700px;
}

#catch .factor_catch > span {
	font-size: 1.8rem;
	font-weight: bold;
	font-family: "ヒラギノ明朝 ProN W6", "HiraMinProN-W6", "HG明朝E", "ＭＳ Ｐ明朝", "MS PMincho", "MS 明朝", serif;
	padding-bottom: 19px;
	display: block;
}
#catch .detail_factor_catch {
	font-size: 1.3rem;
	padding-top: 16px;
	line-height: 26px;
}
#catch .wrapper_content_catch:nth-of-type(2) {
	padding-top: 50px;
}
#catch .wrapper_content_catch > p {
	font-size: 1.7rem;
	padding: 30px 0 0 21px;
}
#catch .factor_catch {
    width: 44%;
}
#catch .factor_catch:nth-of-type(2) {
	margin-top: 0;
}
#catch .figure_catch:nth-of-type(1) {
	padding-top: 0;
	width: 46%;
	margin: 0 auto;
}

/* Outcome */

#outcome .wrapper_catch_outcome {
	background-image: url(../img/daylight/back_daylight.png);
}

/* Figure */

#figure .figure_outcome {
	width: 70%;
	margin: 0 auto;
}
#figure .wrapper_title_content {
	border-bottom: solid 1px #000;
	letter-spacing: -.4em;
	text-align: left;
	padding-bottom: 12px;
}
#figure .uv_icon {
	display: inline-block;
	letter-spacing: normal;
	color: #fff;
	font-weight: bold;
	font-size: 1.6rem;
	padding: 8px 30px 6px 30px;
}
#figure .title_content {
	display: inline-block;
	font-size: 1.9rem;
	font-weight: bold;
	letter-spacing: 1px;
	padding: 0 0 0 36px;
	vertical-align: middle;
}
#figure .wrapper_step_content_top {
	padding-top: 16px;
	text-align: left;
}
#figure .wrapper_step_content_bottom {
	padding-top: 0px;
	text-align: left;
}
#figure .step_content {
	display: inline-block;
	font-size: 1.5rem;
	font-weight: bold;
	vertical-align: middle;
	color: #444;
	padding: 0 0 0 12px;
}
#figure .number_step_content {
	font-style: italic;
	color: #ccc;
	font-size: 3.9rem;
	font-family: 'Libre Baskerville', serif;
	vertical-align: middle;
}
#figure .wrapper_figure_content {
	letter-spacing: -.4em;
	padding-top: 20px;
}
#figure .figure_content {
	display: inline-block;
	letter-spacing: normal;
	margin: 0 73px 0 0;
}
#figure .figure_content:nth-of-type(2) {
	margin: 0;
}
#figure .figure_content img {
	width: auto;
	height: auto;
}

/* Fragrance */

#fragrance .flower_outcome {
	bottom: 3px;
	left: 0;
}

/* Care */

#care .step_salon_care:nth-of-type(2):after {
	display: none;
}
#care .step_salon_care {
	width: 40%;
}
#care .step_salon_care:nth-of-type(2) {
	width: 52%;
	margin: 0;
}
#care .notify_step_care {
	padding: 12px 0 0 0;
}
#care .notify_step_care:after {
	display: block;
	content:"";
	border-bottom: solid 1px #ccc;
	padding-top: 15px;
}
#care .hair_care {
  padding: 183px 0;
}
#care .step_salon_care {
	margin: 0 8% 0 0;
}
#care .step_care {
	font-size: 1.8rem;
	font-weight: bold;
	font-family: inherit;
}
#care .wrapper_box_bottom_care {
	width: 64%;
	margin: 2% 0 0 2%;
}
#care .product_name_care {
	width: 96%;
}
#care .icon-arrow {
	vertical-align: top;
	display: inline-block;
	padding-top: 19px;
}
#care .box_salon_care {
	text-align: center;
}
#care .wrapper_step_care {
	padding: 50px 0;
}
#care .wrapper_salon_care:before,
#care .wrapper_salon_care:after {
	display: none;
}
#care .uv_icon_care {
	padding: 7px 0;
	text-align: center;
	color: #fff;
	font-weight: bold;
	min-width: 124px;
	position: absolute;
	top: 0;
	left: 0;
}
/* How */

#how .title_how > span {
	padding: 0 0 0 36px;
}
#how .ex_sub {
		color: #fff;
		display: block;
		width: 150px;
		padding: 1%;
}
#how .product_how {
	font-size: 1.9rem;
	display: inline-block;
	padding-top: 8px;
}

.catch_daylight {
	background-image: url(../img/daylight/shadow_color.jpg);
	background-position: bottom center;
	background-size: contain;
	background-repeat: no-repeat;
}
