@charset "UTF-8";
@import url("https://fonts.googleapis.com/css2?family=Josefin+Sans:ital,wght@0,300;1,400&display=swap");
/*---------------------------- Contents PC  ----------------------------*/
.el-d-section {
		margin: 0 auto 30px;
		max-width: 100% !important;
		background-image: url(/_var/hyper-block/campaign/color_loveliner/img/bg.jpg);
		background-repeat: repeat-y;
		background-position: center top;
		background-size: auto;
}

#color_loveliner {
		max-width: 100%;
		font-family: "游ゴシック体", YuGothic, "游ゴシック", "Yu Gothic", "メイリオ", "Hiragino Kaku Gothic ProN", "Hiragino Sans", sans-serif;
		color: #0d0d0d;
		-webkit-text-size-adjust: 100%;
		/*アンカーボタン*/
}

#color_loveliner .josef {
		font-family: 'Josefin Sans', sans-serif;
}

#color_loveliner .it {
		font-style: italic;
}

#color_loveliner * {
		-webkit-box-sizing: border-box;
		-moz-box-sizing: border-box;
		box-sizing: border-box;
}

#color_loveliner a {
		text-decoration: underline;
		color: #1111cc;
}

#color_loveliner a:visited {
		color: #1111cc;
}

#color_loveliner sup {
		font-size: 1.1rem;
		line-height: 1;
		position: relative;
		bottom: 1ex;
		height: 0;
		vertical-align: baseline;
}

#color_loveliner b {
		font-weight: bold;
}

#color_loveliner hr {
		display: block;
		height: 1px;
		border: 0;
		border-bottom: 1px solid #C0B6B3;
		margin: 50px 0 50px 0;
		padding: 0px;
}

#color_loveliner .indent {
		padding-left: 1em;
		text-indent: -1em;
}

#color_loveliner .br-sp {
		display: none;
}

#color_loveliner .br-pc {
		display: block;
}

#color_loveliner .sp {
		display: none !important;
}

#color_loveliner .btn {
		position: relative;
		z-index: 1;
		display: block;
		width: 100%;
		margin: 0 auto 1.0rem;
		padding: 2.0rem 0;
		text-align: center;
		color: #fff;
}

#color_loveliner .btn:hover {
		zoom: 1;
		transition: all .9s;
		opacity: .7;
		filter: alpha(opacity=70);
		-ms-filter: 'alpha(opacity=70)';
		-moz-opacity: .7;
		-khtml-opacity: .7;
}

#color_loveliner .btn a {
		position: absolute;
		z-index: 2;
		top: 0;
		left: 0;
		width: 100%;
		height: 100%;
		text-indent: -999px;
}

#color_loveliner a:hover {
		filter: alpha(opacity=70);
		-ms-filter: "alpha(opacity=70)";
		-moz-opacity: 0.7;
		-khtml-opacity: 0.7;
		opacity: 0.7;
		zoom: 1;
		transition: all .9s;
}

#color_loveliner a:hover {
		zoom: 1;
}

#color_loveliner p {
		font-size: 15px;
		font-weight: normal;
		color: #1f1f1f;
}

#color_loveliner .inner {
		max-width: 960px;
		margin: 0 auto;
		text-align: center;
}

#color_loveliner .inner .kv {
		background-image: url(/_var/hyper-block/campaign/color_loveliner/img/kv.png);
		background-repeat: no-repeat;
		background-position: center;
		background-size: contain;
		width: 100%;
		height: 674px;
}

@media only screen and (-webkit-min-device-pixel-ratio: 2) {
		#color_loveliner .inner .kv {
				background-image: url(/_var/hyper-block/campaign/color_loveliner/img/kv@2x.png);
		}
}

#color_loveliner .inner h3 {
		font-size: 90px;
		font-weight: 300;
		line-height: 1;
		margin-bottom: 15px;
		text-align: left;
		margin-left: 48px;
}

#color_loveliner .inner h5 {
		font-size: 26px;
		font-weight: normal;
		letter-spacing: 0.2em;
		margin-left: 48px;
		text-align: left;
		position: relative;
		display: inline-block;
}

#color_loveliner .inner h5:after {
		content: "";
		background-color: #D06264;
		width: 32px;
		height: 1px;
		position: absolute;
		bottom: -35px;
		left: 0;
}

#color_loveliner .inner .s1 {
		margin-top: -50px;
}

#color_loveliner .inner .s1 h4 {
		font-size: 26px;
		line-height: 2.07;
		letter-spacing: 0.03em;
		font-weight: normal;
		text-align: left;
		margin-left: 16px;
}

#color_loveliner .inner .s1 h2 {
		font-size: 40px;
		letter-spacing: 0.03em;
		font-weight: normal;
		text-align: left;
		margin: 10px 0 140px 16px;
}

#color_loveliner .inner .s1 .s1_point_flex {
		display: flex;
		justify-content: space-between;
		align-items: flex-start;
		width: 928px;
		margin: 0 auto;
}

#color_loveliner .inner .s1 .s1_point_bx {
		text-align: left;
}

#color_loveliner .inner .s1 .s1_point_bx ul li {
		display: flex;
		align-items: center;
		font-size: 16px;
		letter-spacing: 0.03em;
		font-weight: normal;
		margin-bottom: 24px;
}

#color_loveliner .inner .s1 .s1_point_bx ul li span {
		color: #e35961;
		font-size: 32px;
		margin-right: 16px;
}

#color_loveliner .inner .s1 .s1_img_flex {
		display: flex;
		justify-content: space-between;
		width: 864px;
		margin-left: 16px;
		margin-top: 20px;
}

#color_loveliner .inner .s1 .s1_img_bx {
		flex-basis: 256px;
		max-width: 256px;
		text-align: center;
}

#color_loveliner .inner .s1 .s1_img_bx p {
		font-size: 14px;
		margin-top: 10px;
}

#color_loveliner .inner .s2 {
		padding-top: 200px;
		text-align: left;
}

#color_loveliner .inner .s2 .s2_img {
		margin: 80px auto 0;
}

#color_loveliner .inner .s3 {
		padding-top: 245px;
		text-align: left;
}

#color_loveliner .inner .s3 h5 {
		margin-bottom: 114px;
}

#color_loveliner .inner .s3 .s3_inner {
		width: 864px;
		margin: 0 auto;
}

#color_loveliner .inner .s3 .ttl {
		font-size: 22px;
		font-weight: bold;
		line-height: 1;
		margin-bottom: 10px;
}

#color_loveliner .inner .s3 .ttl .number {
		font-size: 22px;
		font-weight: bold;
		color: #e35961;
		border-right: 1px solid #e35961;
		margin-right: 32px;
		padding-right: 10px;
}

#color_loveliner .inner .s3 .ttl .info {
		font-size: 18px;
		font-weight: bold;
		line-height: 1;
}

#color_loveliner .inner .s3 p {
		font-size: 16px;
		line-height: 1.875;
		margin-bottom: 0;
}

#color_loveliner .inner .s4 {
		padding-top: 220px;
		text-align: left;
}

#color_loveliner .inner .s4 .s4_bx {
		background-image: url(/_var/hyper-block/campaign/color_loveliner/img/s4_bg.png);
		width: 960px;
		height: 624px;
		background-repeat: no-repeat;
		background-size: contain;
		position: relative;
		margin-top: 95px;
}

#color_loveliner .inner .s4 .s4_bx p {
		position: absolute;
		top: 500px;
		left: 680px;
		font-size: 14px;
		font-weight: normal;
		text-align: center;
}

#color_loveliner .inner .s4 .s4_bx .cpinfo {
		position: absolute;
		bottom: 20px;
		left: 50%;
		transform: translateX(-50%);
		-webkit-transform: translateX(-50%);
		-ms-transform: translateX(-50%);
		font-size: 14px;
		font-weight: normal;
		text-align: center;
		white-space: nowrap;
}

@media only screen and (-webkit-min-device-pixel-ratio: 2) {
		#color_loveliner .inner .s4 .s4_bx {
				background-image: url(/_var/hyper-block/campaign/color_loveliner/img/s4_bg@2x.png);
		}
}

#color_loveliner .inner .s5 {
		padding-top: 200px;
		text-align: left;
}

#color_loveliner .inner .s5 .s5_img {
		margin: 150px auto 50px;
		text-align: center;
}

#color_loveliner .inner .s5 .s5_base {
		background-color: rgba(252, 234, 233, 0.6);
		border-radius: 5px;
		width: 100%;
		padding: 50px 100px;
		text-align: left;
}

#color_loveliner .inner .s5 .s5_base p {
		font-size: 18px;
		font-weight: normal;
		margin-bottom: 20px;
}

#color_loveliner .inner .s5 .s5_base .s5_btn_flex {
		display: flex;
		justify-content: space-between;
		width: 100%;
		margin: 50px auto 0;
}

#color_loveliner .inner .s6 {
		padding-top: 200px;
		text-align: center;
		/* アコーディオン */
		/* :checked */
}

#color_loveliner .inner .s6 .cp_actab {
		width: 100%;
		margin: 0 auto 40px;
		position: relative;
		overflow: hidden;
		text-align: center;
}

#color_loveliner .inner .s6 .cp_actab input {
		position: absolute;
		z-index: -1;
		opacity: 0;
}

#color_loveliner .inner .s6 .cp_actab label {
		background-color: #0d0d0d;
		display: block;
		font-size: 24px;
		font-weight: bold;
		color: #fff;
		width: 100%;
		height: auto;
		padding: 25px 0;
		margin: 0 auto;
		position: relative;
}

#color_loveliner .inner .s6 .cp_actab-content__inner {
		width: 100%;
		background-color: rgba(252, 234, 233, 0.6);
		text-align: left;
		padding: 34px 64px;
		margin: 0 auto;
}

#color_loveliner .inner .s6 .cp_actab input:checked ~ .cp_actab-content {
		max-height: 8000px;
}

#color_loveliner .inner .s6 .cp_actab label::after {
		top: 5.5vw;
		right: 0;
}

#color_loveliner .inner .s6 .cp_actab label::after {
		line-height: 3;
		position: absolute;
		top: 6vw;
		right: 3vw;
		display: block;
		width: 5vw;
		height: 5vw;
		/* -webkit-transition: all 0.35s;
          transition: all 0.35s; */
		text-align: center;
}

#color_loveliner .inner .s6 .cp_actab input[type=checkbox] + label::after {
		content: "";
		background-size: contain;
		background-image: url(/_var/hyper-block/campaign/color_loveliner/img/ac_close.svg);
		background-repeat: no-repeat;
		background-position: center;
		width: 24px;
		height: 24px;
		position: absolute;
		top: calc(50% - 12px);
		right: 22px;
}

#color_loveliner .inner .s6 .cp_actab input[type=checkbox]:checked + label::after {
		content: "";
		background-size: contain;
		background-image: url(/_var/hyper-block/campaign/color_loveliner/img/ac_open.svg);
		background-repeat: no-repeat;
		background-position: center;
		width: 24px;
		height: 24px;
		position: absolute;
		top: calc(50% - 12px);
		right: 22px;
}

#color_loveliner .inner .s6 .cp_actab .cp_actab-content {
		max-height: 0;
		background: #fff;
}

#color_loveliner .inner .s6 .cp_actab-content__inner h6 {
		font-size: 16px;
		font-weight: bold;
		line-height: 1;
		margin: 45px auto 10px;
		color: #1f1f1f;
}

#color_loveliner .inner .s6 .cp_actab-content__inner p {
		font-size: 16px;
		line-height: 1.8;
		color: #1f1f1f;
		margin-bottom: 0;
}

#color_loveliner .inner .s6 label {
		display: flex;
		align-items: center;
}

#color_loveliner .inner .s6 .caution {
		text-align: center;
		font-size: 22px;
		line-height: 1;
		font-weight: bold;
		color: #d93845;
		margin: 40px auto 0;
}

#color_loveliner .inner .s6 .checkbox-input {
		display: none !important;
}

#color_loveliner .inner .s6 .checkbox-input:checked + .checkbox-parts::after {
		content: "";
		display: block;
		position: absolute;
		top: 0;
		left: 11px;
		width: 13px;
		height: 26px;
		transform: rotate(40deg);
		border-bottom: 3px solid #d93845;
		border-right: 3px solid #d93845;
}

#color_loveliner .inner .s6 .checkbox-parts {
		padding-left: 60px;
		position: relative;
		margin: 0 auto;
		font-size: 16px;
		line-height: 2.4;
		font-weight: bold;
		color: #1f1f1f;
		vertical-align: middle;
}

#color_loveliner .inner .s6 .checkbox-parts::before {
		content: "";
		display: block;
		position: absolute;
		top: 0;
		left: 0;
		width: 36px;
		height: 36px;
		border-radius: 1px;
		margin-right: 10px;
		background-color: #fff;
		border: 1px solid #999;
}

#color_loveliner .inner .s6 input[type="button"][disabled] {
		height: 123px;
		width: 764px;
		background-image: url(/_var/hyper-block/campaign/color_loveliner/img/s6_btn_off.png);
		background-repeat: no-repeat;
		background-size: contain;
		background-position: top center;
		cursor: default;
}

#color_loveliner .inner .s6 input[type="button"] {
		height: 123px;
		width: 764px;
		background-image: url(/_var/hyper-block/campaign/color_loveliner/img/s6_btn.png);
		background-repeat: no-repeat;
		background-size: contain;
		background-position: top center;
		margin: 20px auto;
		cursor: pointer;
}

#color_loveliner .inner p {
		font-size: 16px;
		line-height: 1.8;
		margin-bottom: 60px;
		color: #1f1f1f;
}

#color_loveliner .s7 {
		width: 100%;
		background-color: #db7fa2;
		padding: 50px 0;
		text-align: center;
}

#color_loveliner .s7 h3 {
		width: 416px;
		background-color: #fff;
		font-size: 22px;
		font-weight: bold;
		line-height: 1;
		color: #db7fa2;
		border-radius: 5px;
		padding: 10px 0;
		text-align: center;
		margin: 0 auto 25px;
}

#color_loveliner .s7 h4 {
		font-size: 22px;
		font-weight: bold;
		color: #fff;
		line-height: 1.6;
		text-align: center;
		margin-bottom: 10px;
}

#color_loveliner .s7 h2 {
		font-size: 34px;
		font-weight: bold;
		color: #fff;
		text-align: center;
		margin-bottom: 10px;
}

#color_loveliner .s7 h2 a {
		text-decoration: none;
		color: #fff;
}

#color_loveliner .s7 p {
		font-size: 16px;
		font-weight: normal;
		color: #fff;
		line-height: 1;
		text-align: center;
		margin-bottom: 10px;
}

#color_loveliner .teaser {
		margin: 0 auto 100px;
}

#color_loveliner .modal-wrapper {
		z-index: 9999;
		position: fixed;
		top: 0;
		right: 0;
		bottom: 0;
		left: 0;
		padding: 20px 0;
		text-align: center;
}

#color_loveliner .modal-wrapper:not(:target) {
		opacity: 0;
		visibility: hidden;
		transition: opacity 0.3s, visibility 0.3s;
}

#color_loveliner .modal-wrapper:target {
		opacity: 1;
		visibility: visible;
		transition: opacity 0.4s, visibility 0.4s;
}

#color_loveliner .modal-wrapper::after {
		display: inline-block;
		height: 100%;
		margin-left: -.05em;
		vertical-align: middle;
		content: "";
}

#color_loveliner .modal-wrapper .modal-window {
		box-sizing: border-box;
		display: inline-block;
		z-index: 102;
		position: relative;
		max-width: 800px;
		width: 100%;
		height: 50vh;
		padding: 0;
		vertical-align: middle;
		overflow-y: scroll;
}

#color_loveliner .modal-wrapper .modal-window .modal-content {
		max-height: 90vh;
		padding: 0;
}

#color_loveliner .modal-overlay {
		z-index: 100;
		position: absolute;
		top: 0;
		right: 0;
		bottom: 0;
		left: 0;
		background: rgba(0, 0, 0, 0.85);
}

#color_loveliner .modal-wrapper .modal-close:hover {
		color: #2b2e38 !important;
}

#color_loveliner .up_close_btn {
		position: absolute;
		top: 10px;
		right: 10px;
		background-image: url(/_var/elis/compact-guard/campaign/natura_attennto_2021/img/md_close_btn.svg);
		background-repeat: no-repeat;
		background-size: contain;
		width: 40px;
		height: 40px;
		z-index: 101;
}

#color_loveliner .up_close_btn a {
		position: absolute;
		width: 100%;
		height: 100%;
		top: 0;
		left: 0;
}

#color_loveliner .modal-content {
		height: auto;
		width: 100%;
}

#color_loveliner .modal-content #md01 {
		background-color: #f4f4f4;
		border-radius: 0;
		margin: 0 auto;
		padding: 100px 50px;
		box-sizing: border-box;
}

#color_loveliner .modal-content #md01 .md_inner {
		width: 100%;
		padding: 0;
}

#color_loveliner .modal-content #md01 .logo {
		margin: 40px auto;
}

#color_loveliner .modal-content #md01 .btn_flex {
		display: flex;
		justify-content: space-between;
		flex-wrap: wrap;
}

#color_loveliner .modal-content #md01 .btn_bx {
		flex-basis: 335px;
		max-width: 335px;
		margin-bottom: 20px;
}

/*---------------------------- Contents SP  ----------------------------*/
@media screen and (max-width: 699px) {
		.el-d-section {
				padding: 0;
				margin: 0 auto;
				max-width: 100% !important;
				background-image: url(/_var/hyper-block/campaign/color_loveliner/img/bg-s.jpg);
				background-repeat: repeat-y;
				background-size: contain;
		}
		#color_loveliner {
				max-width: 100%;
				font-family: "游ゴシック体", YuGothic, "游ゴシック", "Yu Gothic", "メイリオ", "Hiragino Kaku Gothic ProN", "Hiragino Sans", sans-serif;
				color: #0d0d0d;
				-webkit-text-size-adjust: 100%;
				/*アンカーボタン*/
		}
		#color_loveliner .josef {
				font-family: 'Josefin Sans', sans-serif;
		}
		#color_loveliner .it {
				font-style: italic;
		}
		#color_loveliner * {
				-webkit-box-sizing: border-box;
				-moz-box-sizing: border-box;
				box-sizing: border-box;
		}
		#color_loveliner a {
				text-decoration: underline;
				color: #1111cc;
		}
		#color_loveliner a:visited {
				color: #1111cc;
		}
		#color_loveliner sup {
				font-size: 1.1rem;
				line-height: 1;
				position: relative;
				bottom: 1ex;
				height: 0;
				vertical-align: baseline;
		}
		#color_loveliner b {
				font-weight: bold;
		}
		#color_loveliner hr {
				display: block;
				height: 1px;
				border: 0;
				border-bottom: 1px solid #C0B6B3;
				margin: 8vw 0 8vw 0;
				padding: 0px;
		}
		#color_loveliner .indent {
				padding-left: 1em;
				text-indent: -1em;
		}
		#color_loveliner .br-sp {
				display: block;
		}
		#color_loveliner .br-pc {
				display: none;
		}
		#color_loveliner .sp {
				display: block !important;
		}
		#color_loveliner .pc {
				display: none !important;
		}
		#color_loveliner .btn {
				position: relative;
				z-index: 1;
				display: block;
				width: 100%;
				margin: 0 auto 1.0rem;
				padding: 2.0rem 0;
				text-align: center;
				color: #fff;
		}
		#color_loveliner .btn:hover {
				zoom: 1;
				transition: all .9s;
				opacity: .7;
				filter: alpha(opacity=70);
				-ms-filter: 'alpha(opacity=70)';
				-moz-opacity: .7;
				-khtml-opacity: .7;
		}
		#color_loveliner .btn a {
				position: absolute;
				z-index: 2;
				top: 0;
				left: 0;
				width: 100%;
				height: 100%;
				text-indent: -999px;
		}
		#color_loveliner a:hover {
				filter: alpha(opacity=70);
				-ms-filter: "alpha(opacity=70)";
				-moz-opacity: 0.7;
				-khtml-opacity: 0.7;
				opacity: 0.7;
				zoom: 1;
				transition: all .9s;
		}
		#color_loveliner a:hover {
				zoom: 1;
		}
		#color_loveliner .inner {
				max-width: 100%;
				margin: 0 auto;
				text-align: center;
		}
		#color_loveliner .inner .kv {
				background-image: url(/_var/hyper-block/campaign/color_loveliner/img/kv-s.png);
				background-repeat: no-repeat;
				background-position: center;
				background-size: contain;
				width: 100%;
				height: auto;
				padding-top: 108.7692%;
		}
		#color_loveliner .inner h3 {
				font-size: 16.66667vw;
				font-weight: 300;
				line-height: 1;
				margin-bottom: 2vw;
				text-align: left;
				margin-left: 5vw;
		}
		#color_loveliner .inner h5 {
				font-size: 4.61538vw;
				font-weight: normal;
				letter-spacing: 0.2em;
				margin-left: 5vw;
				text-align: left;
				position: relative;
				display: inline-block;
		}
		#color_loveliner .inner h5:after {
				content: "";
				background-color: #D06264;
				width: 4vw;
				height: 1px;
				position: absolute;
				bottom: -3vw;
				left: 0;
		}
		#color_loveliner .inner .s1 {
				margin-top: 20vw;
		}
		#color_loveliner .inner .s1 h4 {
				font-size: 3.84615vw;
				line-height: 2;
				letter-spacing: 0.03em;
				font-weight: normal;
				text-align: left;
				margin-left: 5vw;
		}
		#color_loveliner .inner .s1 h2 {
				font-size: 5.89744vw;
				letter-spacing: 0.03em;
				line-height: 1.6;
				font-weight: normal;
				text-align: left;
				margin: 8vw 0 22vw 5vw;
		}
		#color_loveliner .inner .s1 .s1_point_flex {
				display: flex;
				justify-content: space-between;
				align-items: flex-start;
				flex-wrap: wrap;
				width: 80vw;
				margin: 0 auto;
		}
		#color_loveliner .inner .s1 .s1_point_bx {
				text-align: left;
		}
		#color_loveliner .inner .s1 .s1_point_bx ul li {
				display: flex;
				justify-content: flex-start;
				align-items: flex-start;
				font-size: 3.58974vw;
				line-height: 1.6;
				letter-spacing: 0.03em;
				font-weight: normal;
				margin-bottom: 6vw;
		}
		#color_loveliner .inner .s1 .s1_point_bx ul li span {
				color: #e35961;
				font-size: 4.61538vw;
				line-height: 1.4;
				margin-right: 4vw;
		}
		#color_loveliner .inner .s1 .s1_img_flex {
				display: flex;
				justify-content: space-between;
				flex-wrap: wrap;
				width: 90vw;
				margin-left: 5vw;
				margin-top: 10vw;
		}
		#color_loveliner .inner .s1 .s1_img_bx {
				flex-basis: 100%;
				max-width: 100%;
				text-align: right;
				margin-bottom: 5vw;
		}
		#color_loveliner .inner .s1 .s1_img_bx p {
				font-size: 2.5641vw;
				margin-top: 1.5vw;
		}
		#color_loveliner .inner .s2 {
				padding-top: 30vw;
				text-align: left;
		}
		#color_loveliner .inner .s2 .s2_img {
				margin: 10vw 5vw 0;
		}
		#color_loveliner .inner .s3 {
				padding-top: 30vw;
				text-align: left;
		}
		#color_loveliner .inner .s3 h5 {
				margin-bottom: 10vw;
		}
		#color_loveliner .inner .s3 .s3_inner {
				width: 90vw;
				margin: 0 auto;
		}
		#color_loveliner .inner .s3 .ttl {
				font-size: 3.84615vw;
				font-weight: bold;
				line-height: 1;
				margin-bottom: 2vw;
		}
		#color_loveliner .inner .s3 .ttl .number {
				font-size: 3.84615vw;
				font-weight: bold;
				color: #e35961;
				border-right: 1px solid #e35961;
				margin-right: 5vw;
				padding-right: 2vw;
		}
		#color_loveliner .inner .s3 .ttl .info {
				font-size: 3.33333vw;
				font-weight: bold;
				line-height: 1;
		}
		#color_loveliner .inner .s3 p {
				font-size: 3.33333vw;
				line-height: 1.875;
		}
		#color_loveliner .inner .s4 {
				padding-top: 30vw;
				text-align: left;
		}
		#color_loveliner .inner .s4 .s4_bx {
				background-image: url(/_var/hyper-block/campaign/color_loveliner/img/s4_bg-s.png);
				width: 90vw;
				height: auto;
				padding-top: 257.7777%;
				background-repeat: no-repeat;
				background-size: contain;
				position: relative;
				margin: 10vw 5vw 0 5vw;
		}
		#color_loveliner .inner .s4 .s4_bx p {
				position: absolute;
				top: inherit;
				bottom: 26vw;
				left: 50%;
				ransform: translateX(-50%);
				-webkit-transform: translateX(-50%);
				-ms-transform: translateX(-50%);
				font-size: 3.07692vw;
				line-height: 1.3;
				margin-bottom: 0;
				font-weight: normal;
				text-align: center;
		}
		#color_loveliner .inner .s4 .s4_bx .cpinfo {
				position: absolute;
				bottom: 10vw;
				left: 50%;
				transform: translateX(-50%);
				-webkit-transform: translateX(-50%);
				-ms-transform: translateX(-50%);
				font-size: 3.07692vw;
				line-height: 1.3;
				text-align: center;
				white-space: nowrap;
		}
		#color_loveliner .inner .s5 {
				padding-top: 30vw;
				text-align: left;
		}
		#color_loveliner .inner .s5 .s5_img {
				margin: 10vw 20vw;
				text-align: center;
		}
		#color_loveliner .inner .s5 .s5_base {
				background-color: rgba(252, 234, 233, 0.6);
				border-radius: 5px;
				width: 90vw;
				margin: 0 auto;
				padding: 10vw;
				text-align: left;
		}
		#color_loveliner .inner .s5 .s5_base p {
				font-size: 3.33333vw;
				line-height: 1.3;
				font-weight: normal;
				margin-bottom: 4vw;
		}
		#color_loveliner .inner .s5 .s5_base .s5_btn_flex {
				display: flex;
				justify-content: space-between;
				flex-wrap: wrap;
				width: 55vw;
				margin: 7vw auto 0;
		}
		#color_loveliner .inner .s5 .s5_base .s5_btn_flex img {
				margin-bottom: 4vw;
		}
		#color_loveliner .inner .s6 {
				padding-top: 25vw;
				text-align: center;
				/* アコーディオン */
				/* :checked */
		}
		#color_loveliner .inner .s6 .cp_actab {
				width: 90vw;
				margin: 0 auto 40px;
				position: relative;
				overflow: hidden;
				text-align: center;
		}
		#color_loveliner .inner .s6 .cp_actab input {
				position: absolute;
				z-index: -1;
				opacity: 0;
		}
		#color_loveliner .inner .s6 .cp_actab label {
				background-color: #0d0d0d;
				display: block;
				font-size: 3.84615vw;
				font-weight: bold;
				color: #fff;
				width: 100%;
				height: auto;
				padding: 4vw 0;
				margin: 0 auto;
				position: relative;
		}
		#color_loveliner .inner .s6 .cp_actab-content__inner {
				width: 100%;
				background-color: rgba(252, 234, 233, 0.6);
				text-align: left;
				padding: 5vw;
				margin: 0 auto;
		}
		#color_loveliner .inner .s6 .cp_actab input:checked ~ .cp_actab-content {
				max-height: 8000px;
		}
		#color_loveliner .inner .s6 .cp_actab label::after {
				top: 5.5vw;
				right: 0;
		}
		#color_loveliner .inner .s6 .cp_actab label::after {
				line-height: 3;
				position: absolute;
				top: 6vw;
				right: 3vw;
				display: block;
				width: 4vw;
				height: 4vw;
				/* -webkit-transition: all 0.35s;
          transition: all 0.35s; */
				text-align: center;
		}
		#color_loveliner .inner .s6 .cp_actab input[type=checkbox] + label::after {
				content: "";
				background-size: contain;
				background-image: url(/_var/hyper-block/campaign/color_loveliner/img/ac_close.svg);
				background-repeat: no-repeat;
				background-position: center;
				width: 4vw;
				height: 4vw;
				position: absolute;
				top: calc(50% - 2vw);
				right: 3vw;
		}
		#color_loveliner .inner .s6 .cp_actab input[type=checkbox]:checked + label::after {
				content: "";
				background-size: contain;
				background-image: url(/_var/hyper-block/campaign/color_loveliner/img/ac_open.svg);
				background-repeat: no-repeat;
				background-position: center;
				width: 4vw;
				height: 4vw;
				position: absolute;
				top: calc(50% - 2vw);
				right: 3vw;
		}
		#color_loveliner .inner .s6 .cp_actab .cp_actab-content {
				max-height: 0;
				background: #fff;
		}
		#color_loveliner .inner .s6 .cp_actab-content__inner h6 {
				font-size: 3.33333vw;
				font-weight: bold;
				line-height: 1;
				margin: 8vw auto 1.5vw;
				color: #1f1f1f;
		}
		#color_loveliner .inner .s6 .cp_actab-content__inner p {
				font-size: 3.33333vw;
				line-height: 1.8;
				color: #1f1f1f;
		}
		#color_loveliner .inner .s6 label {
				display: flex;
				align-items: center;
		}
		#color_loveliner .inner .s6 .caution {
				text-align: center;
				font-size: 4.61538vw;
				line-height: 1;
				font-weight: bold;
				color: #d93845;
				margin: 10vw auto 0;
		}
		#color_loveliner .inner .s6 .checkbox-input {
				display: none !important;
		}
		#color_loveliner .inner .s6 .checkbox-input:checked + .checkbox-parts::after {
				content: "";
				display: block;
				position: absolute;
				top: 0.5vw;
				left: 1.5vw;
				width: 1.6vw;
				height: 3vw;
				transform: rotate(40deg);
				border-bottom: 3px solid #d93845;
				border-right: 3px solid #d93845;
		}
		#color_loveliner .inner .s6 .checkbox-parts {
				padding-left: 8vw;
				position: relative;
				margin: 0 auto;
				font-size: 3.33333vw;
				line-height: 1.6;
				font-weight: bold;
				color: #1f1f1f;
				vertical-align: middle;
		}
		#color_loveliner .inner .s6 .checkbox-parts::before {
				content: "";
				display: block;
				position: absolute;
				top: 0;
				left: 0;
				width: 5vw;
				height: 5vw;
				border-radius: 1px;
				margin-right: 10px;
				background-color: #fff;
				border: 1px solid #999;
		}
		#color_loveliner .inner .s6 input[type="button"][disabled] {
				height: 17.5vw;
				width: 90vw;
				background-image: url(/_var/hyper-block/campaign/color_loveliner/img/s6_btn_off-s.png);
				background-repeat: no-repeat;
				background-size: contain;
				background-position: top center;
				cursor: default;
		}
		#color_loveliner .inner .s6 input[type="button"] {
				height: 17.5vw;
				width: 90vw;
				background-image: url(/_var/hyper-block/campaign/color_loveliner/img/s6_btn-s.png);
				background-repeat: no-repeat;
				background-size: contain;
				background-position: top center;
				margin: 2vw auto 5vw;
				cursor: pointer;
		}
		#color_loveliner .s7 {
				width: 100%;
				background-color: #db7fa2;
				padding: 50px 0;
				text-align: center;
		}
		#color_loveliner .s7 h3 {
				width: 64vw;
				background-color: #fff;
				font-size: 4.61538vw;
				font-weight: bold;
				line-height: 1;
				color: #db7fa2;
				border-radius: 5px;
				padding: 2vw 0;
				text-align: center;
				margin: 0 auto 3vw;
		}
		#color_loveliner .s7 h4 {
				font-size: 3.84615vw;
				font-weight: bold;
				color: #fff;
				line-height: 1.6;
				text-align: center;
				margin-bottom: 1vw;
		}
		#color_loveliner .s7 h2 {
				font-size: 5.64103vw;
				font-weight: bold;
				color: #fff;
				text-align: center;
				margin-bottom: 1vw;
		}
		#color_loveliner .s7 h2 a {
				text-decoration: none;
				color: #fff;
		}
		#color_loveliner .s7 p {
				font-size: 3.33333vw;
				font-weight: normal;
				color: #fff;
				line-height: 1;
				text-align: center;
				margin-bottom: 1vw;
				font-feature-settings: "palt";
		}
		#color_loveliner .teaser {
				margin: 0 auto 100px;
		}
		#color_loveliner .modal-wrapper {
				z-index: 9999;
				position: fixed;
				top: 0;
				right: 0;
				bottom: 0;
				left: 0;
				padding: 20px 0;
				text-align: center;
		}
		#color_loveliner .modal-wrapper:not(:target) {
				opacity: 0;
				visibility: hidden;
				transition: opacity 0.3s, visibility 0.3s;
		}
		#color_loveliner .modal-wrapper:target {
				opacity: 1;
				visibility: visible;
				transition: opacity 0.4s, visibility 0.4s;
		}
		#color_loveliner .modal-wrapper::after {
				display: inline-block;
				height: 100%;
				margin-left: -.05em;
				vertical-align: middle;
				content: "";
		}
		#color_loveliner .modal-wrapper .modal-window {
				box-sizing: border-box;
				display: inline-block;
				z-index: 102;
				position: relative;
				max-width: 90vw;
				width: 100%;
				height: 60vh;
				padding: 0;
				vertical-align: middle;
				overflow-y: scroll;
		}
		#color_loveliner .modal-wrapper .modal-window .modal-content {
				max-height: 60vh;
				padding: 0;
		}
		#color_loveliner .modal-overlay {
				z-index: 100;
				position: absolute;
				top: 0;
				right: 0;
				bottom: 0;
				left: 0;
				background: rgba(0, 0, 0, 0.85);
		}
		#color_loveliner .modal-wrapper .modal-close:hover {
				color: #2b2e38 !important;
		}
		#color_loveliner .up_close_btn {
				position: absolute;
				top: 10px;
				right: 10px;
				background-image: url(/_var/elis/compact-guard/campaign/natura_attennto_2021/img/md_close_btn.svg);
				background-repeat: no-repeat;
				background-size: contain;
				width: 40px;
				height: 40px;
				z-index: 101;
		}
		#color_loveliner .up_close_btn a {
				position: absolute;
				width: 100%;
				height: 100%;
				top: 0;
				left: 0;
		}
		#color_loveliner .modal-content {
				height: auto;
				width: 100%;
		}
		#color_loveliner .modal-content #md01 {
				background-color: #fff;
				border-radius: 0;
				margin: 0 auto;
				padding: 20vw 10vw;
				box-sizing: border-box;
		}
		#color_loveliner .modal-content #md01 .md_inner {
				width: 100%;
				padding: 0;
		}
		#color_loveliner .modal-content #md01 .logo {
				margin: 40px auto;
		}
		#color_loveliner .modal-content #md01 .btn_flex {
				display: flex;
				justify-content: space-between;
				flex-wrap: wrap;
		}
		#color_loveliner .modal-content #md01 .btn_bx {
				flex-basis: 70vw;
				max-width: 70vw;
				margin-bottom: 4vw;
		}
}