@charset 'UTF-8';

.contents .contents_inner{
padding-bottom: 0;
}

@media screen and (max-width:767px){
#footer {
padding-top: 0;
}
}

/*===========================================
relation
===========================================*/
.relation{
position: relative;
margin-top: 11%;
}
.relation:after{
transform: translateX(-50%);
content: '';
display: block;
position: absolute;
width: 100vw;
height: 100%;
top: 0;
bottom: 0;
left: 50%;
background: url(/products/image/relation_bg_01.jpg) center no-repeat;
background-size: cover;
}
.relation .relation_inner{
position: relative;
z-index: 1;
}
.relation .btnBlock{
position: relative;
padding: 2em 0;
}
.relation .btnBlock:after{
transform: translateX(-50%);
content: '';
display: block;
position: absolute;
width: 100vw;
height: 100%;
top: 0;
bottom: 0;
left: 50%;
margin: auto;
background: rgba(255,255,255,0.8);
}
.relation .btnBlock .column{
position: relative;
z-index: 1;
}
.relation .btnBlock .mod_btn_01{
border-radius: 3em;
background: #fff;
}
.relation .ttl{
margin-top: 7%;
}
.relation .ttl > *{
color: #fff;
font-size: 2.8rem;
font-weight: bold;
text-align: center;
}
.relation .bnrBlock{
padding: 3em 0 7% 0;
}
.relation .bnrBlock .mod_bnrBtn_01{
background: #fff;
}
.relation .bnrBlock a{
background: #fff;
}
.relation .mod_itemList_3_2{
  margin-top: 3em;
  }
.relation .mod_itemList_4_2{
margin-top: 3em;
}
.relation .mod_flex > * > *{
height: 100%;
}
.relation a{
height: 100%;
}
.relation .mod_itemList_3_2 a{
  padding: 1.5em 25px 1.5em 1em;
  font-size: 1.5rem;
  align-items: center!important;
}
.relation .mod_itemList_3_2 a:not([class*="mod_icon_"]):after{
right: 15px;
}
.relation .mod_itemList_3_2 a span{
display: inline-block;
}
.relation .mod_itemList_3_2 .mod_img{
flex-basis: 48px;
}
.relation .mod_itemList_3_2 .mod_txt{
flex-basis: calc(100% - (48px + 1em));
}

.relation .mod_itemList_4_2 a{
padding: 1.5em 25px 1.5em 1em;
font-size: 1.5rem;
}
.relation .mod_itemList_4_2 a:not([class*="mod_icon_"]):after{
right: 15px;
}
.relation .mod_itemList_4_2 a span{
display: inline-block;
}
.relation .mod_itemList_4_2 .mod_img{
flex-basis: 48px;
}
.relation .mod_itemList_4_2 .mod_txt{
flex-basis: calc(100% - (48px + 1em));
}

@media screen and (max-width:767px){
.relation {
margin-top: 8em;
}
.relation .ttl {
margin-top: 4em;
}
.relation .ttl > *{
font-size: 2.4rem;
}
.relation .bnrBlock {
padding: 2em 0 100px 0;
}
.relation .mod_itemList_2_1 .mod_flex > *:nth-of-type(n + 2){
margin-top: 10px;
}
.relation .mod_itemList_2_1 .mod_txt small{
font-size: 1.2rem;
}
.relation .mod_itemList_3_2{
  margin-top: 20px;
  }
  .relation .mod_itemList_3_2 .mod_flex > *:nth-of-type(n + 3) {
  margin-top: 20px;
  }
  .relation .mod_itemList_3_2 a{
  flex-wrap: wrap;
  justify-content: center;
  padding: 1em;
  }
  .relation .mod_itemList_3_2 .mod_txt{
  margin-top: 1em;
  flex-basis: 100%;
  }
  .relation .mod_itemList_3_2 .mod_txt p{
  font-size: 1.3rem;
  text-align: center;
  }
.relation .mod_itemList_3_2{
margin-top: 20px;
}
.relation .mod_itemList_4_2 .mod_flex > *:nth-of-type(n + 3) {
margin-top: 20px;
}
.relation .mod_itemList_4_2 a{
flex-wrap: wrap;
justify-content: center;
padding: 1em;
}
.relation .mod_itemList_4_2 .mod_txt{
margin-top: 1em;
flex-basis: 100%;
}
.relation .mod_itemList_4_2 .mod_txt p{
font-size: 1.3rem;
text-align: center;
}
}

/*===========================================
otherCategory
===========================================*/
.otherCategory{
padding: 0 20px;
}
.otherCategory .otherCategory_wrap{
max-width: 1000px;
margin: auto;
}
.otherCategory .otherCategory_inner{
margin-top: 11%;
padding-bottom: 100px;
}
.otherCategory .ttl > *{
font-size: 2.8rem;
font-weight: bold;
text-align: center;
}
.otherCategory .column{
margin-top: 2.5em;
}
.otherCategory .data .ttl{
margin-top: 1em;
}
.otherCategory .data .ttl > *{
font-size: 1.8rem;
text-align: left;
font-weight: bold;
}
.otherCategory .data .ttl .mod_btn_04 a{
padding: 0;
}
.otherCategory .data .ttl .mod_btn_04 a:before{
content: normal;
}
.otherCategory .data .ttl .mod_btn_04 a:after{
top: 0.5em;
}
.otherCategory .data .box{
margin-top: 0.5em;
}
.otherCategory .data .box .mod_flex > * {
flex-basis: auto;
margin-right: 20px;
}
.otherCategory .data .box .mod_flex > *:nth-of-type(2n) {
margin-right: 0;
}
.otherCategory .btn{
width: 100%;
max-width: 300px;
margin: 2em auto 0 auto;
}

@media screen and (min-width:768px){
.otherCategory .data .box{
height: auto !important;
}
}

@media screen and (max-width:767px){
.otherCategory{
margin-top: 0;
background-color: #fef0f3;
background-image: linear-gradient(90deg, #fef0f3 0%, #fef7f0 100%);
}
.otherCategory .otherCategory_inner{
margin-top: 0;
padding: 4em 0 100px 0;
}
.otherCategory .mod_flex > *:nth-of-type(n + 2){
margin: 0;
}
.otherCategory .ttl > *{
font-size: 2.4rem;
}
.otherCategory .data + .data{
border-top: 1px solid #ddd;
}
.otherCategory .data .ttl{
position: relative;
margin: 0;
padding: 1em;
}
.otherCategory .data .ttl > *{
font-size: 1.5rem;
}
.otherCategory .data .ttl a.accordion{
position: absolute;
top: 0;
bottom: 0;
right: 0;
width: 100%;
padding: 0;
}
.otherCategory .data .ttl a.accordion:after{
content: '';
display: block;
position: absolute;
width: 12px;
height: 12px;
top: 0;
bottom: 0;
right: 20px;
margin: auto;
background: url(/shared/image/icon_plus.svg) center no-repeat;
background-size: contain;
}
.otherCategory .data .ttl a.accordion.open:after{
background-image: url(/shared/image/icon_minus.svg);
}
.otherCategory .data .ttl .mod_btn_04 a:after{
content: normal;
}
.otherCategory .data .box{
margin: 0;
}
.otherCategory .data .box > *{
padding: 0 1em 1em 2em;
}
.otherCategory .data .box li + li{
margin-top: 0.5em;
}
.otherCategory .data .box .mod_flex > *{
flex-basis: 100%;
}
.otherCategory .data .box .mod_flex > *:nth-of-type(2n){
margin-top: 0.5em;
}
.otherCategory .data .img{
display: none;
}
.otherCategory .column{
border: 1px solid #ddd;
background: #fff;
}
}
.tfa_btn{
  width: 50%;
  margin:5% auto 0;
}
@media screen and (max-width:767px){
  .tfa_btn{
  width: 100%;
  margin:4em auto 0;
}
}