@charset "UTF-8";
/*!*
	--------------------------------
	Created: 2022.01.31
	Last Modified:
	--------------------------------
	--------------------------------
*!*/

.quality-cleanliness { padding-bottom: 115px; padding-top: 30px; }
.quality-cleanliness img { width: auto; max-width: 100%; }
.quality-cleanliness .ttl_box { margin-bottom: 30px; }
.quality-cleanliness h3 { font-size: 1.5625em; text-align: center; }
.quality-cleanliness .ttl_box h3 span { font-size: 0.84em; position: relative; }
.quality-cleanliness .ttl_box h3 span::before { content: ""; display: inline-block; vertical-align: middle; width: 25px; height: 2px; background-color: #333333; margin-bottom: 0.2em; margin-right: 9px; }
.quality-cleanliness .ttl_box h3 span::after{ content: ""; display: inline-block; vertical-align: middle; width: 25px; height: 2px; background-color: #333333; margin-bottom: 0.2em; margin-left: 9px; }
.quality-cleanliness .note { font-size: 0.938em; padding-left: 1em; text-indent: -1em; }
.quality-cleanliness .list_box { margin-bottom: 72px; }
.quality-cleanliness .note_japan { margin-top: 36px; text-align: right; }
.quality-cleanliness a:hover {background-color: #c00;text-decoration: none;color: #fff;}

@media only screen and (max-width: 767px) {
	.quality-cleanliness { padding-bottom: 16vw; padding-top: 0; }
	.quality-cleanliness .section { margin-top: 16vw; }
	.quality-cleanliness .ttl_box h3 span { font-size: 0.74em;}
	.quality-cleanliness p { width: 94%; margin-left: auto; margin-right: auto; }
	.quality-cleanliness .list_box { margin-bottom: 10.667vw; margin-left: auto; margin-right: auto; }
	.quality-cleanliness .note { width: 92%; }
	.quality-cleanliness .note_japan { margin-top: 8vw; }
}

/* about */
.quality-cleanliness .about p { text-align: center; font-size: 1.25em; line-height: 1.8; }
.quality-cleanliness .about .ttl_box { margin-bottom: 115px; }
.quality-cleanliness .about .txt_box { margin-bottom: 105px; }
@media only screen and (max-width: 767px) {
	.quality-cleanliness .about .ttl_box { margin-bottom: 5.333vw; }
	.quality-cleanliness .about .txt_box { margin-bottom: 16vw; }
}

/* pure */
.quality-cleanliness .pure .ttl_box { margin-bottom: 28px; }
.quality-cleanliness .pure .illust_box { width: 311px; margin: 0 auto 18px auto; }
.quality-cleanliness .pure .list_box img { margin-bottom: 39px; }
.quality-cleanliness .pure .list_box img:first-child { margin-bottom: 20px; }
.quality-cleanliness .pure .list_box .note { text-align: right; }
@media only screen and (max-width: 767px) {
	.quality-cleanliness .pure .ttl_box { margin-bottom: 9.333vw; }
  .quality-cleanliness .pure .illust_box { max-width: 340px; width: 90.667vw; margin-bottom: 4.8vw; }
	.quality-cleanliness .pure .list_box img { margin-bottom: 2.667vw; }
	.quality-cleanliness .pure .list_box .note { text-align: left; }
}

/* yogoren */
.quality-cleanliness .yogoren .illust_box { width: 298px; margin: 0 auto 63px auto; }
.quality-cleanliness .yogoren .list_box { margin-bottom: 89px; }
@media only screen and (max-width: 767px) {
	.quality-cleanliness .yogoren .ttl_box { margin-bottom: 5.333vw; }
	.quality-cleanliness .yogoren .illust_box { max-width: 327px; width: 87.2vw; margin-bottom: 4vw; }
	.quality-cleanliness .yogoren .list_box { margin-bottom: 14.667vw; }
}

/* filter */
.quality-cleanliness .filter .ttl_box { margin-bottom: 25px; }
.quality-cleanliness .filter .illust_box { width: 309px; margin: 0 auto 15px auto; }
.quality-cleanliness .filter .list_box { max-width: 420px; margin: 0 auto 72px auto; }
.quality-cleanliness .filter .movie_parent { margin-bottom: 72px; }
@media only screen and (max-width: 767px) {
	.quality-cleanliness .filter .ttl_box { margin-bottom: 4.533vw; }
	.quality-cleanliness .filter .illust_box { max-width: 340px; width: 90.667vw; margin-bottom: 5.333vw; }
	.quality-cleanliness .filter .list_box { margin-bottom: 10.667vw; }
	.quality-cleanliness .filter .movie_parent { margin-bottom: 10.667vw; }
}

/* omakase */
.quality-cleanliness .omakase .ttl_box { margin-bottom: 28px; }
.quality-cleanliness .omakase .illust_box { width: 298px; margin: 0 auto 30px auto; }
.quality-cleanliness .omakase .list_box img { margin: 0 auto 40px auto; }
.quality-cleanliness .omakase .cleanliness_note_small { font-size: 0.7em; margin-top: 0.5em; margin-left: .5em; padding-left: 2.5em; text-indent: -2.5em; }
.quality-cleanliness .omakase .cleanliness_note_small_top { margin-top: 15px; }
.quality-cleanliness .omakase .movie_parent { margin-bottom: 72px; }
@media only screen and (max-width: 767px) {
	.quality-cleanliness .omakase .ttl_box { margin-bottom: 4.533vw; }
	.quality-cleanliness .omakase .illust_box { max-width: 329px; width: 87.733vw; margin-bottom: 5.333vw; }
	.quality-cleanliness .omakase .list_box{ margin-bottom: 13.333vw; }
	.quality-cleanliness .omakase .list_box img { margin-bottom: 5.333vw; }
	.quality-cleanliness .omakase .cleanliness_note_small { width: 89%; margin-left: auto; margin-right: auto; }
	.quality-cleanliness .omakase .cleanliness_note_small:last-child { padding-left: 0; text-indent: -1em; width: 90%; }
	.quality-cleanliness .omakase .movie_parent { margin-bottom: 10.667vw; }
}

/* raku */
.quality-cleanliness .raku { margin-bottom: 110px; }
.quality-cleanliness .raku .ttl_box { margin-bottom: 21px; }
.quality-cleanliness .raku .illust_box { width: 297px; margin: 0 auto 20px auto; }
.quality-cleanliness .raku .list_box { margin-bottom: 10px; }
.quality-cleanliness .raku .list_box:nth-of-type(4) { margin-bottom: 72px; }
.quality-cleanliness .raku .list_box:nth-of-type(3) img { margin-bottom: 0px; }
.quality-cleanliness .raku .list_box img { margin-bottom: 18px; }
.quality-cleanliness .raku .list_box p { font-size: 1.5625em; }
.quality-cleanliness .raku .note { margin-top: 65px; }
@media only screen and (max-width: 767px) {
	.quality-cleanliness .raku { margin-bottom: 15.2vw; }
	.quality-cleanliness .raku .ttl_box { margin-bottom: 4vw; }
	.quality-cleanliness .raku .illust_box { max-width: 323px; width: 86.133vw; margin-bottom: 5.333vw; }
	.quality-cleanliness .raku .list_box { margin-bottom: 0; }
	.quality-cleanliness .raku .list_box:nth-of-type(3) img { margin-bottom: 2.5vw; }
	.quality-cleanliness .raku .list_box img { margin-bottom: 3.467vw; }
	.quality-cleanliness .raku .list_box p.center { text-align: center; width: 100%; letter-spacing: -1px; }
	.quality-cleanliness .raku .note { margin-top: 5.333vw; }
}

/* function */
.quality-cleanliness .function .ttl_box { margin-bottom: 31px; }
.quality-cleanliness .function .table_box { overflow-x: scroll; position:relative; z-index: 1;}
.quality-cleanliness .function .table_box table { border-spacing: 0;}
.quality-cleanliness .function .table_box table, .quality-cleanliness .function .table_box th, .quality-cleanliness .function .table_box td { box-sizing: border-box; }
.quality-cleanliness .function .table_box table { margin: auto; border-collapse: separate; color: #244980;}
.quality-cleanliness .function .table_box th { background-color: #E6EEF3; padding: 9px 7px 7px 10px; border-left:1px solid #B2CBD9; border-bottom:1px solid #B2CBD9;}
.quality-cleanliness .function .table_box td { text-align: center; border:1px solid #B2CBD9; }
.quality-cleanliness .function .table_box th, .quality-cleanliness .function .table_box td { white-space: nowrap; letter-spacing: -0.5px; }

.quality-cleanliness .function .table_box th:nth-child(n+1), .quality-cleanliness .function .table_box td:nth-child(n+2){ border-top:none; border-right:none; }
.quality-cleanliness .function .table_box tr:first-child th, .quality-cleanliness .function .table_box tr:first-child td{ border-top:1px solid #B2CBD9; }
.quality-cleanliness .function .table_box td:first-of-type, .quality-cleanliness .function .table_box tr:first-child th:nth-child(2) { border-left: none;}
.quality-cleanliness .function .table_box td:last-child, .quality-cleanliness .function .table_box th:last-child { border-right:1px solid #B2CBD9; }

.quality-cleanliness .function .table_box table tr:nth-child(n+3) td:nth-child(n+2) { border-bottom-style: dashed;}
.quality-cleanliness .function .table_box table tr:nth-child(6) td:nth-child(n+2), .quality-cleanliness .function .table_box table tr:nth-child(10) td:nth-child(n+2),  .quality-cleanliness .function .table_box table tr:nth-child(n+13) td:nth-child(n+2){ border-bottom-style: solid;}

.quality-cleanliness .function .table_box .th_model { color: #ffffff; font-weight: bold; text-align: center; width: 101px; height: 32px; padding: 4px 7px 4px 10px; box-sizing: border-box; }
.quality-cleanliness .function .table_box .th_model.bg_color_x,.quality-cleanliness .function .table_box .th_model.bg_color_r,.quality-cleanliness .function .table_box .th_model.bg_color_s { padding-left: 3px; padding-right: 3px; letter-spacing: -1px; font-size: 15px; }
.quality-cleanliness .function .table_box .bg_color_fz { background-color: #709AAF; }
.quality-cleanliness .function .table_box .bg_color_z { background-color: #B9AF49; }
.quality-cleanliness .function .table_box .bg_color_fl { background-color: #231815; }
.quality-cleanliness .function .table_box .bg_color_x { background-color: #7AA55C; }
.quality-cleanliness .function .table_box .bg_color_r { background-color: #38908c; }
.quality-cleanliness .function .table_box .bg_color_s { background-color: #645159; }
.quality-cleanliness .function .table_box .bg_color_ge { background-color: #6D7CAA; }
.quality-cleanliness .function .table_box .bg_color_vxv { background-color: #d71618; }
.quality-cleanliness .function .table_box .bg_color_hxv { background-color: #de5410; }
.quality-cleanliness .function .table_box .bg_color_nxv { background-color: #e67f11; }
.quality-cleanliness .function .table_box .bg_color_kxv { background-color: #e4aa03; }

.quality-cleanliness .function .table_box th.th_ver { color: #ffffff; background-color: #B2CBD9; text-align: center; margin: 0 5px; letter-spacing: 0; font-weight: bold; border-top:1px solid #fff;}
.quality-cleanliness .function .table_box .th_ver img { width: 16px; }
.quality-cleanliness .function .table_box .th_ver.be_off::before { border-bottom-color: #B2CBD9; }
.quality-cleanliness .function .table_box th.th_beside { width: 1.5em; color: #ffffff; background-color: #B2CBD9; text-align: center; letter-spacing: 0; text-align: left; padding: 4px 7px 4px 10px; font-weight: bold; }

.quality-cleanliness .function .table_box .td_txt { line-height: 1; }
.quality-cleanliness .function .table_box .td_txt span { font-size: .88em; }

.quality-cleanliness .function .table_box th.sticky_first-row { position: sticky; left: 0; z-index: 1;}
.quality-cleanliness .function .table_box th.sticky_first-row-two-columns{ position: sticky; left: 0; z-index: 1; border-right:1px solid #B2CBD9;}
.quality-cleanliness .function .table_box th.sticky_second-row { position: sticky; left: 31px; z-index: 1; border-right:1px solid #B2CBD9;}
.quality-cleanliness .function .table_box tr:nth-child(n+3) .sticky_second-row { border-bottom-style: dashed; }
.quality-cleanliness .function .table_box tr:nth-child(6) .sticky_second-row, .quality-cleanliness .function .table_box tr:nth-child(10) .sticky_second-row, .quality-cleanliness .function .table_box tr:nth-child(13) .sticky_second-row { border-bottom-style: solid; }


@media only screen and (max-width: 767px) {
	.quality-cleanliness .function .table_box th { font-size: 3.2vw; padding: 2.4vw 0.533vw 1.867vw 1.6vw; }
	.quality-cleanliness .function .table_box .th_model { width: 18.667vw; height: 6.4vw; padding: 1.067vw 1.6vw 1.067vw 1.6vw; font-size: 3.2vw; }
	.quality-cleanliness .function .table_box .th_model.bg_color_x,.quality-cleanliness .function .table_box .th_model.bg_color_r,.quality-cleanliness .function .table_box .th_model.bg_color_s { padding: 1.067vw 1.6vw 1.067vw 1.6vw; font-size: 3.2vw; }
	.quality-cleanliness .function .table_box .th_ver { min-width: 6.667vw; min-height: 33.067vw; padding: 0 0.8vw; vertical-align: middle; padding: 0; }
	.quality-cleanliness .function .table_box .th_ver img { width: 3.733vw; }
	.quality-cleanliness .function .table_box .th_ver.be_off { padding-top: 1.333vw; }
	.quality-cleanliness .function .table_box .th_beside { padding: 1.067vw 1.867vw 1.067vw 1.867vw; }
	.quality-cleanliness .function .table_box td { font-size: 3.2vw; vertical-align: middle; }
	.quality-cleanliness .function .table_box td { min-height: 10.933vw; }
	.quality-cleanliness .function .table_box .td_txt_small { font-size: 2.8vw; letter-spacing: -0.267vw; padding-right: 0; }
	.quality-cleanliness .function .table_box .td_txt_size { padding-left: 1.333vw; }
	.quality-cleanliness .function .table_box th.sticky_second-row { left: 6.68vw;}
}

@media screen and (max-width: 920px){
	.quality-cleanliness .function .function_sp_swipe::before { display: block; content: "表はフリックで左右にスクロール出来ます"; width: 100%; margin-top: 10px; margin-bottom: 25px; padding-bottom: 55px; background: url(/home/kirigamine_setsubi/special/kirigamine-quality/cleanliness/img/icon_swipe.png) no-repeat center bottom; -webkit-background-size: 180px auto; background-size: 180px auto; text-align: center; font-size: .88em; }
}

/*!* -------------------------------
	content_bottom_area
	top_back_button
------------------------------- *!*/
.top_back_button {margin-top: 65px;text-align: center;}
.top_back_button a {width: 129px;margin: 0 auto;box-sizing: border-box;border: 1px solid grey;border-radius: 5px;color: #333;display: block;padding: 10px 0 10px 0; -webkit-transition: .25s ease-out; transition: .25s ease-out;font-size: 87.5%;}
.top_back_button a:hover {background-color: #c00; text-decoration: none; color: #fff;}

/*!* -------------------------------
	content_bottom_area
	霧ヶ峰の特長バナーエリア
------------------------------- *!*/
.content_bottom_area {margin-top: 0;}
.feature-bnr-area {margin-top: 59px;border-top: solid 1px #cfcfcf;border-bottom: solid 1px #cfcfcf;padding-top: 31px;padding-bottom: 38px;}
.feature-bnr-area .feature_icon {display:flex;justify-content:center}
.feature-bnr-area .feature_icon > li > a.feature-link-btn {display:flex;font-weight:700;font-size:.875em;text-align:center;line-height:1.14286;background-color:#fff;color:#ec1d00;border:1px solid #ec1d00;border-radius:20px;justify-content:center;align-items:center;-webkit-transition: .25s ease-out;transition: .25s ease-out;text-decoration: none;}
.feature-bnr-area .feature_icon > li > a.feature-link-btn:hover {background-color: #ec1d00;color: #ffffff;}
@media only screen and (min-width:768px) {
.feature-bnr-area .feature_icon > li > a {width:78px;height:78px}
.feature-bnr-area .feature_icon > li:not(:first-child) {margin-left:15px}
}
@media only screen and (max-width:767px) {
.feature-bnr-area {margin-top:65px}
.feature-bnr-area .feature_icon {margin:0 auto;max-width:345px}
.feature-bnr-area .feature_icon > li {width:21.95652%}
.feature-bnr-area .feature_icon > li > a.feature-link-btn:before {display:block;width:0;height:calc((100vw - 30px) * .2145);max-height:73.75px;content:''}
.feature-bnr-area .feature_icon > li:not(:first-child) {margin-left:4.05797%}
}

/*!* -------------------------------
	bottom_btn_area
	バナーエリア上ボタン
------------------------------- *!*/
.quality-cleanliness .bottom_btn_area {
	display: flex;
	justify-content:center;
	margin-top: 36px;
	text-align: center;
}
.quality-cleanliness .bottom_btn_area .button {
	min-width: 320px;
}
.quality-cleanliness .bottom_btn_area .btn_function_cleanliness {
	margin-left: 10px;
}
@media only screen and (max-width:767px) {
	.quality-cleanliness .bottom_btn_area {
		display: block;
	}
	.quality-cleanliness .bottom_btn_area .button {
		min-width: auto;
		width: 90%;
		max-width: 320px;
	}
	.quality-cleanliness .bottom_btn_area .button a {
		background-position: 10px center;
	}
	.quality-cleanliness .bottom_btn_area .btn_function_cleanliness {
		margin-left: 0;
		margin-top: 10px;
	}
}