@charset "utf-8";
.main{padding-top:85px;font-size: 16px;}
.cont_kodawari {
	line-height: 2.15;
	position: relative;
	background-color: #fff2e5;}
.cont_kodawari img{max-width: 100%;}

/*　メインイメージ &　ページタイトル */
.main_img{width:100%;height:0;padding-top:37.81%;background:url('../images/kodawari/main_image_pc.jpg') 0 0 no-repeat;background-size:contain;display:flex;justify-content:center;align-items:center;line-height:1;position:relative}
.pageTtl{position:absolute;top:20%;left:0;bottom:0;right:0;width:100%;text-align:center}
.pageTtl .icon{display:inline-block;margin:0 0 40px;width:105px}
.pageTtl .catch{font-size:24px;margin-bottom:50px;font-weight:700}
.pageTtl .pagettl{width:35%;min-width:600px;margin:0 auto}
#breadcrumbList{position:absolute;top:60px;left:4.6875%}


@media screen and (max-width: 1100px) {
  .pageTtl .icon{margin:0 0 20px;}
  .pageTtl .catch{font-size:15px;margin-bottom:15px;}
  .pageTtl .pagettl{width:30%;min-width:400px;}
}

@media screen and (max-width: 750px) {
	img{width: 100%}
	.main{padding-top:0}
.main_img{padding-top:81.14%;background:url('../images/kodawari/main_image_sp.jpg') 0 0 no-repeat;background-size:contain}
	.pageTtl{top: 16%;}
	.pageTtl .icon{width: 100px;margin: 0 0 10px;}
	.pageTtl .catch{font-size: 18px;margin-bottom: 15px;}
	.pageTtl .pagettl{min-width:60%;}
	#breadcrumbList {top:0;}
}


/*  こだわり  */
.bg_wall{background:url('../images/kodawari/bodyBg.jpg');text-align:center}
.w1100{width:1100px;margin:0 auto;position:relative}

.kodawari{padding:100px 0;}
.kodawari h2{font-size: 30px;margin-bottom: 20px}
.kodawari h3{font-size: 20px;line-height: 1.6; margin-bottom: 30px}
.kodawari .catch{font-size: 20px;font-weight: bold; margin-bottom: 80px}
.kodawari .box_1,
.kodawari .box_2{
	position: relative;
	text-align: left}
.kodawari .box_1{margin-bottom: 100px}
.kodawari .box_1 .fl_l{width: 450px}
.kodawari .box_1 .fl_r{width: 580px}
.kodawari .box_2 .fl_l{width: 580px;}
.kodawari .box_2 .fl_r{width: 450px}

.kodawari .ill_1{
	width: 66px;
	position: absolute;
	top:-20px;left:100px}
.kodawari .ill_2{
	width: 57px;
	position: absolute;
	top:-110px;right:30px}
.kodawari .ill_3{
	width: 66px;
	position: absolute;
	top:-60px;right:-30px}
.kodawari .ill_4{
	width: 165px;margin: 80px 0 0 50px}

@media screen and (max-width:1100px) {
	.w1100{width:90%;}
}
@media screen and (max-width: 750px) {
	.w1100{width: 90%;}
	.kodawari{padding:100px 0 50px;}
	.kodawari .box_1,
	.kodawari .box_2{
		text-align: none}
	.kodawari .box_1 .fl_l,
	.kodawari .box_1 .fl_r,
	.kodawari .box_2 .fl_l,
	.kodawari .box_2 .fl_r{width: 100%}
	.kodawari .ill_1{
		width: 55px;
		top:-80px;left:-10px}
	.kodawari .ill_2{
		width: 50px;
		top:-90px;right:0}
	.kodawari .ill_3{
		width: 55px;
		top:-60px;right:0}
	.kodawari .ill_4{
		width: 100%;margin: 30px 0 0 0;text-align: right}
	.kodawari .ill_4 img{width: 130px;}
}

/*  ラインナップ  */
.lineup{
	text-align: center;
	padding:80px 0 50px;
	margin-bottom:100px}
.lineup .ill_5{
	width: 78px;
	position: absolute;
	top:-40px;right:300px}
.lineup h2{font-size: 30px;margin-bottom: 60px}
.lineup h3{
	background: url('../images/kodawari/h4_line1.svg') no-repeat center;
    background-size: 230px;
	font-size: 25px;
	padding-bottom:30px;
	margin-bottom: 20px}
.lineup h3.line2{
	background: url('../images/kodawari/h4_line2.svg') no-repeat center;
    background-size: 487px;
	padding:30px 0 30px
}

ul.lineup_box{
	width: 1186px;
	display: inline-block;
	text-align: center;
	padding: 0;
	margin:0 auto 80px}
.lineup_box li{
	display: inline-block;
	width: 360px;
	margin:0 16px}
.lineup_ttl{
	width: 100%;
	height: 112px;
	box-sizing: border-box;
	padding-top:12px;
	line-height: 1.6;
	text-align: center
}
.lineup_ttl h4{font-size: 20px;margin-bottom: 5px; color: #fff}
.lineup_ttl p.line1{margin-top:12px}
.mama .lineup_ttl{background: var(--color10)}
.tsunagu .lineup_ttl{background:var(--color_b_tsunagu)}
.peppermint .lineup_ttl{background: #a8ba72}
.kokochi .lineup_ttl,
.sagasu .lineup_ttl{background:var(--color20)}
.lixil .lineup_ttl{background: #ff6000}
.lineup_box p{margin:0;padding: 0}
.trettio{background: #BAD0D7;}

@media screen and (max-width:1120px) {
  ul.lineup_box{width:90%}
  .lineup_box li{width:calc(30% - 16px);}
}
@media screen and (max-width: 750px) {
	ul.lineup_box{width: 100%;margin:0 auto 40px}
	.lineup .ill_5{
		position: static;
		margin:-30px auto 0}
	.lineup_box li{width: 90%;margin:0 auto 30px}
	.line2 span{display: block;line-height: 1.4}
	.lineup h3.line2{
	background: url('../images/kodawari/h4_line2_sp.svg') no-repeat center;
    background-size: 300px;
	padding:30px 0 30px
}
}

.xxx{background: red ;width: 1160px;margin: 10px auto}



.kodawari_section{background:#fff}
.kodawari_section:nth-child(odd){background:url(../images/kodawari/bodyBg.jpg);}
.kodawari_sec_innner{width:1100px;margin:0 auto;padding:60px 0}

.kodawari_sec_title{display:flex;text-align: center;line-height:1;justify-content:center;align-items:center;flex-wrap:wrap;margin:0 auto 20px;}
.kodawari_sec_No{display:flex;border:2px solid var(--color10);background:#fff;padding:0 0 0 .5em;justify-content:center;align-items:center;}
.kodawari_sec_No dt{font-size:22px;font-weight:700;}
.kodawari_sec_No dd{font-size:17px;font-weight:700;background:var(--color10);color:#fff;margin:0 0 0 .5em;height:43px;width:43px;line-height:43px;}
.kodawari_sec_hTtitle{font-size:32px;font-weight:700;margin:0 0 0 .7em;display:inline-block;line-height:1.5;}

.kodawari_ul{letter-spacing:-.4em;}
.kodawari_ul li{letter-spacing:normal;margin:30px auto;}
.kodawari_ul p{margin:0;}
.kodawari_ul article{display:flex;flex-wrap:wrap;}
.kodawari_ul p.kodawari_li_img{margin:0 auto 10px;}
.kodawari_ul p.kodawari_li_img img{width:100%;}
.kodawari_ul .kodawari_li_hTtitle{margin:0 auto 10px;font-size:18px;font-weight:700;line-height:1.5;}
.kodawari_ul p.kodawari_li_txt{margin:0 auto 10px;font-size:14px;text-align:justify;}


.kodawari_section_typeA .kodawari_ul li,
.kodawari_section_typeD .kodawari_ul li{background:#fff;border-radius:10px;margin:20px auto;padding:20px;}
.kodawari_section_typeA .kodawari_li_img{order:2;width:100%;}
.kodawari_section_typeA .kodawari_li_hTtitle{order: 1;width:100%;text-align:center;}
.kodawari_section_typeA .kodawari_li_txt{order:3;width:100%}
.kodawari_section_typeD .kodawari_li_img{order:3;width:100%;}
.kodawari_section_typeD .kodawari_li_hTtitle{order: 1;width:100%;text-align:center;}
.kodawari_section_typeD .kodawari_li_txt{order:2;width:100%}

.kodawari_section_typeC .kodawari_ul li{margin:30px auto 50px;}

@media screen and (min-width: 751px) {
	.kodawari_section_typeA .kodawari_ul,
	.kodawari_section_typeD .kodawari_ul{display:flex;align-items:stretch;}
	.kodawari_section_typeA .kodawari_ul li,
	.kodawari_section_typeD .kodawari_ul li{width:32%;margin:20px 2% 20px 0;}
  .kodawari_section_typeA .kodawari_ul li:nth-child(3n),
  .kodawari_section_typeA .kodawari_ul li:nth-child(3n){margin-right:0;}

  .kodawari_section_typeB .kodawari_ul li:not(:first-child){width:47%;display:inline-block;margin:30px 0 30px 6%;}
  .kodawari_section_typeB .kodawari_ul  li:not(:first-child):nth-child(2n){margin-left:0;}

  .kodawari_section_typeB .kodawari_ul li:first-child  article{display:block}
  .kodawari_section_typeB .kodawari_ul li:first-child::after{content:"";display:block;clear:both}
  .kodawari_section_typeB .kodawari_ul li:first-child .kodawari_li_img{width:60%;float:right;}
  .kodawari_section_typeB .kodawari_ul li:first-child .kodawari_li_hTtitle,
  .kodawari_section_typeB .kodawari_ul li:first-child .kodawari_li_txt{width:35%;margin:0 0 10px;}

  .kodawari_section_typeB .kodawari_ul li:not(:first-child) .kodawari_li_img{order:2;width:100%;}
  .kodawari_section_typeB .kodawari_ul li:not(:first-child) .kodawari_li_hTtitle{order: 1;width:100%;}
  .kodawari_section_typeB .kodawari_ul li:not(:first-child) .kodawari_li_txt{order:3;width:100%}

  .kodawari_section_typeC .kodawari_ul li:nth-child(odd) article{display:block}
  .kodawari_section_typeC .kodawari_ul li:nth-child(odd)::after{content:"";display:block;clear:both}
  .kodawari_section_typeC .kodawari_ul li:nth-child(odd) .kodawari_li_img{width:55%;float:right;}
  .kodawari_section_typeC .kodawari_ul li:nth-child(odd) .kodawari_li_hTtitle,
  .kodawari_section_typeC .kodawari_ul li:nth-child(odd) .kodawari_li_txt{width:35%;margin:0 0 10px;}
  .kodawari_section_typeC .kodawari_ul li:nth-child(even) article{display:block}
  .kodawari_section_typeC .kodawari_ul li:nth-child(even)::after{content:"";display:block;clear:both}
  .kodawari_section_typeC .kodawari_ul li:nth-child(even) .kodawari_li_img{width:55%;float:left;}
  .kodawari_section_typeC .kodawari_ul li:nth-child(even) .kodawari_li_hTtitle,
  .kodawari_section_typeC .kodawari_ul li:nth-child(even) .kodawari_li_txt{width:35%;margin:0 0 10px;float:right;}

}

@media screen and (max-width:1100px) {
	.kodawari_sec_innner{width:90%;}
  .kodawari_section_typeA .kodawari_ul li,
  .kodawari_section_typeD .kodawari_ul li{width:90%;}

  .kodawari_section_typeD .kodawari_li_img{order:1;}
  .kodawari_section_typeD .kodawari_li_hTtitle{order: 2;text-align: left;}
  .kodawari_section_typeD .kodawari_li_txt{order:3;}


  .kodawari_section_typeB .kodawari_li_hTtitle,
  .kodawari_section_typeB .kodawari_li_txt,
  .kodawari_section_typeC .kodawari_li_hTtitle,
  .kodawari_section_typeC .kodawari_li_txt{width:90%;}


.kodawari_li_img{order:2!important}
.kodawari_li_hTtitle{order: 1!important;}
.kodawari_li_txt{order:3!important;}
}
@media screen and (max-width:750px) {
	.kodawari_sec_innner{width:100%;}
  .kodawari_sec_No dt{font-size:18px;}
  .kodawari_sec_No dd{font-size:14px;}
  .kodawari_sec_hTtitle{font-size:22px;}


}

.kodawari_btn{margin:30px auto;letter-spacing:.1em;text-align: center}
.kodawari_btn a{min-width:260px;font-size:14px;font-weight:700;position:relative;display:inline-block;padding:9px 20px;color:#fff;background-color:#3c3c3c;border-radius:18px;line-height: 1;text-align: center;}
.kodawari_btn a::after{content:"";display:inline-block;width:6px;height:6px;border-left:solid 2px #fff;border-bottom:solid 2px #fff;-moz-transform:rotate(225deg);-webkit-transform:rotate(225deg);-o-transform:rotate(225deg);-ms-transform:rotate(225deg);transform:rotate(225deg);position:absolute;top:38%;right:15px}
.kodawari_btn a:hover{opacity:.7;-webkit-transition:opacity .4s ease-out;-moz-transition:opacity .4s ease-out;-ms-transition:opacity .4s ease-out;transition:opacity .4s ease-out}
