#cleaning section {
	margin-bottom: 0;
}
@media (max-width: 767px) {
#cleaning section {
	width: 100%;
	}
}

#cleaning .main_banner {
	position: relative;
}

#cleaning .banner_background {
	position:absolute;
	width: 100%;
	height: 355px;
	}
@media (max-width: 767px) {
#cleaning .main_banner .banner_background {
	display: none;
	}
}

#cleaning .main_banner .banner_sp{
	display: none;
}
@media (max-width: 767px) {
#cleaning .main_banner .banner_sp {
	display: block;
	width: 100%;
	height: auto;
	}
}

#cleaning .main_banner img {
	position:absolute;
	width: 100%;
	height: 355px;
}
#cleaning .main_banner .banner_title {
	width: 1200px;
	height: 355px;
	left: 50%;
	transform: translate(-50%,0);
}
@media (max-width: 767px) {
#cleaning .main_banner .banner_title {
	display: none;
	}
}

/*キャッチコピー*/
#cleaning .cleaning_frame {
	padding: 400px 0 10px 0;
    background-color: #f7f7f7;
}
@media (max-width: 767px) {
#cleaning .cleaning_frame {
	padding: 80% 0 1% 0;
	}
}

#cleaning .cleaning_frame .cleaning_box .cleaning_title {
	font-size: 36px;
	font-weight: bold;
	line-height: 1.8;
	color: #005279;
}
#cleaning .cleaning_box p {
    margin-top: 10px;
	margin-bottom: 50px;
	font-size: 16px;
	font-weight: 300;
	line-height: 1.8;
}
@media (max-width: 767px) {
#cleaning .cleaning_box p {
	margin-bottom: 10%;
	font-size: 15px;
	}
}
#cleaning .cleaning_box {
	width: 1000px;
	margin: 0 auto;
	text-align:
	 center;
}
@media (max-width: 767px) {
#cleaning .cleaning_box {
	width: 100%;
	padding: 0 1%;
	}
#cleaning .cleaning_box img {
	width: 70%;
	}
#cleaning .cleaning_box span.cleaning_box_font {
	font-size: 15px;
	}
#cleaning .cleaning_box .cleaning_box_text {
	margin-bottom: 2%;
	}
#cleaning .cleaning_box span {
	font-size: 23px;
	}
#cleaning .cleaning_box .cleaning_box_chord {
	display: block;
	}
}

#cleaning .container {
	margin: 25px auto 75px;
}
@media (max-width: 767px) {
#cleaning .container {
	margin: 10% auto 0;
	}
}

#cleaning h2 {
	display: flex;
	align-items: center;
	font-size: 25px;
	padding-top: 90px;
}
@media (max-width: 767px) {
#cleaning h2 {
	padding-top: 15%;
}
#cleaning .heading {
	padding: 77% 0 5% 0;
	text-align: center;
	}
}

#cleaning h2::before, #cleaning h2:after {
	content: "";
	height: 1px;
	width: 50px;
	background-color: #666;
	margin: 0 auto;
}
#cleaning h2:before {
	margin-right: 10px;
}
#cleaning h2:after {
	margin-left: 10px;
}
#cleaning .container .row .itemArrange .itemArrange--typeB .col-pc-6 .col-sp-12 {
	margin: 0 auto;
}
#cleaning .itemArrange--typeB .itemArrange__wrap .itemArrange__text .button {
	max-width: 250px;
	line-height: 1;
}
@media (max-width: 767px) {
#cleaning .itemArrange--typeB .itemArrange__wrap .itemArrange__text .button {
	margin: 0 auto;
	}
}

#cleaning .itemArrange__wrap .bg--primary {
	width: 1200px;
}
#cleaning .bg--primary {
	background: #bbae6f !important;
	width: 1200px;
}
@media (max-width: 767px) {
#cleaning .bg--primary {
	width: 100%;
	}
}

#cleaning .bg--primary2 {
	background: #6A8A82 !important;
	width: 1200px;
}
@media (max-width: 767px) {
#cleaning .bg--primary2 {
	width: 100%;
	}
}

#cleaning .bg--primary3 {
	background: #DC9F95 !important;
	width: 1200px;
}
@media (max-width: 767px) {
#cleaning .bg--primary3 {
	width: 100%;
	}
}

#cleaning .bg--primary4 {
	background: #769CBF !important;
	width: 1200px;
}
@media (max-width: 767px) {
#cleaning .bg--primary4 {
	width: 100%;
	}
}

#cleaning .bg--primary5 {
	background: #758B99 !important;
	width: 1200px;
}
@media (max-width: 767px) {
#cleaning .bg--primary5 {
	width: 100%;
	}
}

#cleaning .button--typeB, a.button--typeB, .button--typeB {
	border: #bbae6f;
	background-color: #FFF;
	color: #bbae6f;
	border-radius: 0px;
}
#cleaning .button--typeB2, a.button--typeB2, .button--typeB2 {
	border: #6A8A82;
	background-color: #FFF;
	color: #6A8A82;
	border-radius: 0px;
}
#cleaning .button--typeB3, a.button--typeB3, .button--typeB3 {
	border: #DC9F95;
	background-color: #FFF;
	color: #DC9F95;
	border-radius: 0px;
}
#cleaning .button--typeB4, a.button--typeB4, .button--typeB4 {
	border: #769CBF;
	background-color: #FFF;
	color: #769CBF;
	border-radius: 0px;
}
#cleaning .button--typeB5, a.button--typeB5, .button--typeB5 {
	border: #758B99;
	background-color: #FFF;
	color: #758B99;
	;
	border-radius: 0px;
}
#cleaning .button--typeB.arrow:after {
	border-color: #bbae6f;
}
#cleaning .button--typeB2.arrow:after {
	border-color: #6A8A82;
}
#cleaning .button--typeB3.arrow:after {
	border-color: #DC9F95;
}
#cleaning .button--typeB4.arrow:after {
	border-color: #769CBF;
}
#cleaning .itemArrange__textWrap {
	width: 450px;
}
@media (max-width: 767px) {

#cleaning .itemArrange__textWrap {
	width: 100%;
	}
}

#cleaning .button--typeB5.arrow:after {
	border-color: #758B99;
}
#cleaning .itemArrange__textWrap p {
	color: #FFF;
}
#cleaning .itemArrange__textWrap h3 {
	color: #FFF;
}
#cleaning .see_more {
	margin: 45px auto 60px;
	cursor: pointer;
	text-align: center;
}
@media (max-width: 767px) {

#cleaning .see_more {
	margin: 10% auto 5%;
	}
}

#cleaning .see_more2 {
	margin: 45px auto 60px;
	cursor: pointer;
	text-align: center;
}
@media (max-width: 767px) {

#cleaning .see_more2 {
	margin: 10% auto 5%;
	}
}

#cleaning .see_more3 {
	margin: 45px auto 60px;
	cursor: pointer;
	text-align: center;
}
@media (max-width: 767px) {

#cleaning .see_more3 {
	margin: 10% auto 5%;
	}
}

#cleaning .see_more4 {
	margin: 45px auto 60px;
	cursor: pointer;
	text-align: center;
}
@media (max-width: 767px) {

#cleaning .see_more4 {
	margin: 10% auto 5%;
	}
}

#cleaning .see_more5 {
	margin: 45px auto 60px;
	cursor: pointer;
	text-align: center;
}
@media (max-width: 767px) {

#cleaning .see_more5 {
	margin: 10% auto 5%;
}
.spRanking > .itemList__unit:first-child {
	flex: 0 0 100%;
	max-width: 100%;
	}
}

#cleaning .see_more a {
	cursor: pointer;
	color: #4f4f4f;
	font-weight: bold;
	font-size: 16px;
	background: #ffffff;
	padding: 10px 100px;
	text-decoration: none;
	transition: background-color 0.2s, opacity 0.2s;
	border: 1px solid #4f4f4f;
}
#cleaning .see_more a:hover {
	padding: 10px 100px;
	color: #ffffff;
	background: #bbae6f;
	border: 1px solid #ffffff;
}
#cleaning .see_more2 a {
	cursor: pointer;
	color: #4f4f4f;
	font-weight: bold;
	font-size: 16px;
	background: #ffffff;
	padding: 10px 100px;
	text-decoration: none;
	transition: background-color 0.2s, opacity 0.2s;
	border: 1px solid #4f4f4f;
}
#cleaning .see_more2 a:hover {
	padding: 10px 100px;
	color: #ffffff;
	background: #6A8A82;
	border: 1px solid #ffffff;
}
#cleaning .see_more3 a {
	cursor: pointer;
	color: #4f4f4f;
	font-weight: bold;
	font-size: 16px;
	background: #ffffff;
	padding: 10px 100px;
	text-decoration: none;
	transition: background-color 0.2s, opacity 0.2s;
	border: 1px solid #4f4f4f;
}
#cleaning .see_more3 a:hover {
	padding: 10px 100px;
	color: #ffffff;
	background: #DC9F95;
	border: 1px solid #ffffff;
}
#cleaning .see_more4 a {
	cursor: pointer;
	color: #4f4f4f;
	font-weight: bold;
	font-size: 16px;
	background: #ffffff;
	padding: 10px 100px;
	text-decoration: none;
	transition: background-color 0.2s, opacity 0.2s;
	border: 1px solid #4f4f4f;
}
#cleaning .see_more4 a:hover {
	padding: 10px 100px;
	color: #ffffff;
	background: #769CBF;
	border: 1px solid #ffffff;
}
#cleaning .see_more5 a {
	cursor: pointer;
	color: #4f4f4f;
	font-weight: bold;
	font-size: 16px;
	background: #ffffff;
	padding: 10px 100px;
	text-decoration: none;
	transition: background-color 0.2s, opacity 0.2s;
	border: 1px solid #4f4f4f;
}
#cleaning .see_more5 a:hover {
	padding: 10px 100px;
	color: #ffffff;
	background: #758B99;
	border: 1px solid #ffffff;
}
#cleaning .ranking .container {
	margin: 0 auto 0;
}
#cleaning .induction {
	margin-top: 50px;
	text-align: center;
}
#cleaning .induction p {
	font-size: 28px;
	font-weight: bold;
}
.itemList--ranking .itemList__unit:nth-child(1) .itemWrap::before, .keywordRanking li:nth-child(1) a::before {
	width: 50px;
	height: 40px;
	background: url(https://gigaplus.makeshop.jp/fmdirect01/feature/rank_a1.png) 0% 0% / contain;
	margin-bottom: 10px;
}
.itemList--ranking .itemList__unit:nth-child(2) .itemWrap::before, .keywordRanking li:nth-child(2) a::before {
	width: 50px;
	height: 40px;
	background: url(https://gigaplus.makeshop.jp/fmdirect01/feature/rank_a2.png) 0% 0% / contain;
	margin-bottom: 10px;
}
.itemList--ranking .itemList__unit:nth-child(3) .itemWrap::before, .keywordRanking li:nth-child(3) a::before {
	width: 50px;
	height: 40px;
	background: url(https://gigaplus.makeshop.jp/fmdirect01/feature/rank_a3.png) 0% 0% / contain;
	margin-bottom: 10px;
}
.itemList--ranking .itemList__unit:nth-child(4) .itemWrap::before, .keywordRanking li:nth-child(4) a::before {
	width: 50px;
	height: 40px;
	background: url(https://gigaplus.makeshop.jp/fmdirect01/feature/rank_a4.png) 0% 0% / contain;
	margin-bottom: 10px;
}
.itemList--ranking .itemList__unit:nth-child(5) .itemWrap::before, .keywordRanking li:nth-child(5) a::before {
	width: 50px;
	height: 40px;
	background: url(https://gigaplus.makeshop.jp/fmdirect01/feature/rank_a5.png) 0% 0% / contain;
	margin-bottom: 10px;
}
.itemList--ranking .itemList__unit:nth-child(4) .itemWrap:before, .keywordRanking li:nth-child(4) a:before {
	content: " ";
}
.itemList--ranking .itemList__unit:nth-child(5) .itemWrap:before, .keywordRanking li:nth-child(5) a:before {
	content: " ";
}
.itemList--ranking .itemList__unit .itemWrap:before {
	position: static;
	border-radius: 0;
}
#cleaning .ranking {
	margin-top: 120px;
}
@media (max-width: 767px) {
#cleaning .ranking {
	margin-top: 20%;
	}
}

#cleaning .ranking .container_title {
	font-size: 20px;
	line-height: 1.8;
	border-bottom: 1px solid;
}
#cleaning .campaign_matters_frame .campaign_matters_box {
	margin-bottom: 20px;
}
#cleaning .campaign_matters_frame .campaign_matters_box span {
	font-size: 13px;
}
#cleaning .campaign_matters_frame {
	width: 750px;
	margin: 100px auto 0;
}
@media (max-width: 767px) {
#cleaning .campaign_matters_frame {
	width: 100%;
	padding: 10% 1%;
	margin: 0;
	}
}

#cleaning .campaign_matters .campaign_matters_frame .campaign_matters_title {
	font-size: 28px;
	text-align: center;
	margin-bottom: 30px;
	font-weight: 300;
}
@media (max-width: 767px) {
#cleaning .campaign_matters .campaign_matters_frame .campaign_matters_title {
	font-size: 20px;
	}
}

#cleaning .campaign_matters .campaign_matters_frame .campaign_matters_box p {
	font-size: 15px;
	font-weight: 300;
}
#cleaning .campaign_matters .campaign_matters_frame .campaign_matters_box .item_title {
	color: #3676a1;
	margin-bottom: 0;
	font-size: 16px;
	line-height: 1.8;
	border-bottom: solid;
	font-weight: bold;
}
#cleaning .campaign_matters .campaign_matters_frame .campaign_matters_box .item_title2 {
	background-color: #f2f2f2;
	padding: 10px;
}
/*豆知識*/
.trivia {
	margin: 0 auto;
	padding: 50px 0;
	background: repeating-linear-gradient(-45deg, #9ed0ef, #9ed0ef 3px, #bedbed 3px, #bedbed 7px);
}
@media (max-width: 767px) {
.trivia {
	margin-top: 80px;
	}
}

#cleaning .trivia .container .col-pc-3, .itemList-pc--4 .itemList__unit {
    margin: 0 auto;
}

.trivia .trivia_frame {
	background: white;
	width: 1000px;
	padding: 0 50px 60px;
	margin: 0 auto;
}
@media (max-width: 767px) {
.trivia .trivia_frame {
	width: 100%;
	padding: 1% 5% 5%;
	}
}

.trivia h3 {
	width: 500px;
	margin: 0 auto;
	text-align: center;
	font-size: 30px;
	font-weight: bold;
	padding-bottom: 50px;
	color: white;
}
.trivia h3 span {
	color: #2074cb;
}
.trivia .trivia_frame .icon {
	text-align: center;
	line-height: 1.5;
}
.trivia .trivia_frame .icon img {
	width: 30px;
}
.trivia .trivia_frame .icon h4 {
	font-size: 24px;
	font-weight: bold;
}
.trivia .trivia_frame .sentence2 {
	text-align: left;
	line-height: 2;
	margin-top: 20px;
}
.trivia .trivia_frame .trivia_box {
	width: 895px;
	margin: 0 auto;
	padding-top: 30px;
	opacity: 0; /* 透明 */
	transform: translateY(30px); /* 下に30px移動 */
	transition: opacity 1s ease-out, transform 1s ease-out; /* 変化に1秒かける */
}
@media (max-width: 767px) {
.trivia .trivia_frame .trivia_box {
	width: 100%;
	padding-top: 10%;
}
.trivia h3 {
	width: 100%;
	padding-bottom: 5%;
}
.trivia {
	padding: 5%;
}

.trivia .itemList__unit {
	max-width: 50%;
	}
}

/* is-animatedクラスが付与された時のスタイル */
.trivia .trivia_frame .trivia_box.is-animated {
	opacity: 1; /* 不透明 */
	transform: translateY(0); /* 元の位置に戻る */
}
/* ボックスごとに遅延を持たせるためのスタイル */
/* jQuery側でdata属性などで制御することも可能ですが、CSSで指定することもできます */
.trivia .trivia_frame .trivia_box:nth-child(1).is-animated {
	transition-delay: 0.2s; /* 最初のボックスは0.2秒遅れて開始 */
}
.trivia .trivia_frame .trivia_box:nth-child(2).is-animated {
	transition-delay: 0.4s; /* 2番目のボックスは0.4秒遅れて開始 */
}

.trivia .trivia_frame .trivia_box:nth-child(3).is-animated {
	transition-delay: 0.6s; /* 2番目のボックスは0.4秒遅れて開始 */
}