main{
 width: 100%;
 margin: 0;
}

.newsTab li a.active::after{
 content: '';
 position: absolute;
 left: calc(50% - 7.5px);
 bottom: -9px;
 width: 0;
 height: 0;
 border-style: solid;
 border-width: 9px 5px 0 5px;
 border-color: #e60012 transparent transparent transparent;
}

h2,
.rankingBox,
.searchForm,
.tab-content-wrap,
.etcFAQBox,
.contactBox{
 width: calc(100% - 30px);
 margin: 0 auto;
}
.contactBox{
 margin-bottom: 100px;
}
main h2{
 font-size: 1.4rem;
 font-weight: normal;
 color: #333;
 text-align:left;
 margin: 40px auto;
}
main h2 span {
  display: block;
  color: #e60012;
  font-size: 3.4rem;
 line-height: 3.4rem;
 font-weight: bold;
 margin-bottom: 20px;
 text-align: center;
}

/*

rankingBox

*/

  /*JS*/
.rankingContents .rankingContentsWrap > li {
  max-height: 310px;
  transition: max-height 0.4s, margin 0.4s, opacity 0.4s 0.1s;}
  .rankingContents.is-hide-content .rankingContentsWrap > li:nth-child(n+4) {
    max-height: 0;
    margin-bottom: 0;
    opacity: 0;
    overflow: hidden;}

.rankingMoreBtn {
  display: block;}
.rankingMoreBtn button {
  display: block;
  position: relative;
  width: 160px;
  margin: 20px auto 0 auto;
  background-color: #e1e5e8;
  text-align: center;
  font-size: 1.2rem;
  line-height: 35px;
  text-indent: -1rem;
  transition-property: color, background-color;
  transition-duration: 0.12s;
  -webkit-tap-highlight-color: rgba(0, 0, 0, 0);}
.rankingMoreBtn button .redArrowS {
  top: calc(50% - 6px);
  transform: rotate(45deg);
  right: 30px;}
.rankingMoreBtn button.is-close-btn .redArrowS {
  top: calc(50% - 3px);
  transform: rotate(225deg);}
.rankingContents .rankingMoreBtn button.is-hide-content {
  display: none;}

.rankingBox{
 background-color: #f3f5f7;
 padding-top: 40px;
 padding-bottom: 20px;
 color: #333;
 display: table;
  position: relative;
}
.rankingBox h3{
 text-align:center;
 font-size: 2.0rem;
 line-height: 2.0rem;
 font-weight: normal;
 margin-bottom: 20px;
}
.rankingBox h4{
 font-size: 1.4rem;
 line-height: 2.2rem;
 font-weight: normal;
}
.rankingBox .rankingContents {
  counter-reset: number 0;
 padding: 0 10px;
  display: inherit;
height: auto;}

 .rankingBox .list {
  list-style-type: none;
  position: relative;
 border-top: none;
 width: 100%;
 height:auto;
}
.rankingBox .list:nth-child(6){
 border-top: none;
}

.rankingBox .list:before {
 counter-increment: number 1;
  content: counter(number) " ";
  color: #e60012;
 text-align: center;
 letter-spacing: -0.4rem;
  font-size: 3.0rem;
  line-height: 30px;
  position: absolute;
 display: block;
 width: 30px;
 height: 30px;
 font-family: Arial, Helvetica, "sans-serif";
  top: 20px;
  left: 0;
 z-index: 0;
}
.rankingBox .list a{
 display: block;
 height: 100%;
 padding: 20px 0 20px 40px;
 z-index: 10;
 min-height: 70px;
 border-bottom: 1px solid #e1e5e8;
}
.rankingBox .list a.hover{
 color: #e60012;
}
.rankingBox div{
}
.rankingBox p{
 background-color: #e1e5e8;
 font-size: 1.0rem;
 line-height: 35px;
 width: 160px;
 margin: 0 auto;
 text-align: center;
}
  
/*.rankingBox .moreList{
 display: none;
}*/


.button{
 display: block;
 position:relative;
 width: 160px;
 margin: 20px auto 0 auto;
 background-color: #e1e5e8;
 text-align: center;
 font-size: 1.2rem;
 line-height: 35px;
 text-indent: -1rem;
 transition-property: color, background-color;
 transition-duration: 0.12s;
 -webkit-tap-highlight-color: rgba(0, 0, 0, 0);
}
.button .redArrowS{
 top: calc(50% - 6px);
 transform: rotate(45deg);
 right: 30px;
}
.button.close .redArrowS{
 top: calc(50% - 2px);
 transform: rotate(-135deg);
 right: 30px;
}
.button.hover{
 background-color: #e60012;
 color: #fff;
}
.button.hover .redArrowS,
.button.hover .redArrowS{ border-color: #fff;}
/*.button.open{ display: none;}*/

/*

searchBox

*/
.searchForm {
 margin: 40px auto 100px auto;
}
.searchForm h3{
 font-size: 1.8rem;
 line-height: 1.8rem;
 font-weight: normal;
 margin-bottom: 20px;
 text-align: center;
}




.searchForm .localNav-search{
 display: flex;
		justify-content: center;
}
.searchForm .localNav-search form{
 margin: 0;
 width: 100%;
}
.searchForm .localNav-search input {
	min-width:  calc(100% - 74px);
	font-size: 1.6rem;
display: flex;
align-items: center;}
.searchForm .localNav-search button {
	width: 74px;}
	.searchForm .localNav-search button:hover {opacity: 0.7;}
.searchForm .localNav-search button .icon-search {
		background-size: 20px;}
.searchForm article{
 font-size: 1.4rem;
 padding-top: 20px;
 width: 100%;
 margin: 0 auto;
}
.searchForm h4{
 font-weight:bold;
}
.searchForm ul{
 color: #333;
 display: flex;
 flex-wrap: wrap;
}
.searchForm ul li{
 margin-right: 10px;
 margin-top: 10px;
}
.searchForm ul a{
 display: inline-block;
 position: relative;
 padding-left: 0;
 background-color: #f3f5f7;
 border: 1px solid #e9ecee;
 font-size: 1.0rem;
 line-height: 30px;
 padding: 0 10px;
 -webkit-tap-highlight-color:rgba(0, 0, 0, 0);
}
.searchForm ul a .redArrowS{
 left:0px;
 display: none;
}
.searchForm ul a.hover{
 background-color: #e60012;
 color: #FFF;}

/*

etcFAQBox

*/
.etcFAQBox{
 color: #333;
margin-bottom: 80px;}
.etcFAQBox h5{
 color: #000;
 font-size: 2.0rem;
 line-height: 2.0rem;
 font-weight: normal;
 border-top: 1px solid #d0d5da;
 padding: 40px 0 40px 0;
}
.etcFAQBox ul{
 display:inherit;
font-size: 1.4rem;
line-height: 1.4rem;}
.etcFAQBox ul li{
 margin-right: 0;
 display: block;
 position: relative;
 padding-left: 20px;
 margin-bottom: 20px;
}
.etcFAQBox ul li a{
}
.etcFAQBox ul li .redArrowS{
 left:0px;
}
.etcFAQBox ul li a.hover{ color: #e60012;}
.etcFAQBox ul li a.linkC{
 color: #e60012;
 text-decoration: underline;
}
.etcFAQBox ul li a.linkC.hover{text-decoration:none;}
/*

contactBox

*/
.contactBox{
 color: #333;
}
.contactBox h5{
 color: #000;
 font-size: 2.0rem;
 line-height: 2.0rem;
 font-weight: normal;
 border-top: 1px solid #d0d5da;
 padding: 40px 0;
}
.contactBox h6{
 font-size: 1.8rem;
 line-height: 1.8rem;
 margin-bottom: 0;
}
.contactBox .telArea{
 margin-bottom: 60px;
}
.contactBox .telArea h6::before{
 content:  '';
    height: 18px;
    width: 18px;
    display:  inline-block;
    background-image:  url("/support/images/ico_tel.gif");
    background-size:  contain;
    background-repeat:  no-repeat;
    background-position:  center;
    vertical-align:  bottom;
    margin-right:  10px; 

}
.contactBox .mailArea h6::before{
 content:  '';
    height: 14px;
    width: 20px;
    display:  inline-block;
    background-image:url("/support/images/icon_mail.gif");
    background-size:  contain;
    background-repeat:  no-repeat;
    background-position:  center;
    vertical-align:  baseline;
    margin-right:  10px;
}


.contactBox .telNum{
 font-size: 2.0rem;
 line-height: 2.0rem;
 margin: 40px 0;
 display: inline-block;
}
.contactBox .telNum a{
 display: block;
}
.contactBox .telNum a[href^="tel:"] {
    pointer-events:inherit;
}
.contactBox .telNum > a:first-child::after{
 content:none;
}
.contactBox .telNum > a:first-child{
 margin-bottom: 20px;
}
.contactBox .telNum a.hover{color: #e60012;}
.contactBox address{
 font-style:normal !important;
 font-size: 1.2rem;
 line-height: 1.8rem;
}
.contactBox .notice{
 font-size: 1.2rem;
 line-height: 1.8rem;
 margin-top: 20px;
 display: block;
 text-indent: -1.4rem;
 padding-left: 1.4rem;
}
.contactBox .mailArea ul{
 margin-top: 30px;
 display:inherit;
 border-top: 1px solid #e9ecee;
 /*justify-content:space-between;
 flex-wrap: wrap;*/
}
.contactBox .mailArea ul:after{
    /*content:"";
    display:block;
    width: 375px;
    height:0;*/
  }
.contactBox .mailArea ul li{
 width: 100%;
    height: 60px;
 margin-top: 0;
 border-bottom: 1px solid #e9ecee;
}
.contactBox .mailArea ul li a{
 display: flex;
    justify-content:flex-start;
    align-items: center;
    width: 100%;
    height: 100%;
 text-align: left;
    box-sizing: border-box;
    border: none;
    color: #e60012 !important;
    font-size: 1.6rem;
 line-height: 2.2rem;
    position: relative;
 -webkit-tap-highlight-color: rgba(0, 0, 0, 0);
 padding-left: 20px;
}

.contactBox .mailArea ul li a .redArrowS{ 
 right: 25px;
 width: 12px;
 height: 12px;
 border-right: 2px solid #e60012;
 border-bottom: 2px solid #e60012;
 transition-property: border-color, margin-right;}
.contactBox .mailArea ul li a.hover{
 color: #e60012 !important;
 background-color:inherit;
 box-shadow: 0 10px 10px -4px rgba(0,0,0,0.1);
}

.contactBox .mailArea ul li a.hover .redArrowS{ 
 border-color: #e60012;
 margin-right: 0px;}

.contactBox .mailArea ul li a span > span{
 font-size: 1.2rem;
}

/*

tab
 to common.css
*/
.newsTab li{
 flex: 1;
 border-right:1px solid #FFF;
}
.newsTab li:nth-child(n+3){
 margin-top: 0px;
}
.newsTab li:last-child{
 border-right: none;
}
/*content*/
.tab-content-wrap {
padding-bottom: 0;}
.tab-content {
 color: #333;}





/*

product tab area
purpose tab area
case tab ara

common
*/
main #Product .contentWrap,
main #Case .contentWrap{
 display:inherit;
 /*justify-content:space-between;
 flex-wrap:wrap;*/}
/*main #Product .contentWrap:after,
main #Purpose .contentWrap ul:after,
main #Case .contentWrap:after{
    content:"";
    display:block;
    width: 366px;
    height:0;
  }*/
main #Product dl,
main #Purpose dl,
main #Case dl{
 width: 100%;
}
main #Product dl dt,
main #Purpose dl dt,
main #Case dl dt{
 font-weight: bold;
 font-size: 1.6rem;
 line-height: 1.6rem;
}
main #Product dl dt img{
 display: block;
 width: 100%;
 margin-bottom: 20px;
 transition: opacity 0.12s;
}
main #Product dl dt img{
 border: 1px solid #e9ecee;
}

main #Product dl:last-of-type{
	margin-bottom: 80px;
}
main #Product ul,
main #Purpose ul
main #Case ul{
 display: flex;
 flex-wrap:wrap;
}
main #Product ul li,
main #Purpose ul li,
main #Case ul li{
 font-size: 1.4rem;
 line-height: 1.8rem;
 width: 50%;
 padding-right: 10px;
 margin-top: 15px;
}
main #Product ul li a,
main #Purpose ul li a,
main #Case ul li a{
 display: block;
 position: relative;
 padding-left: 20px;
}
main #Product ul li .redArrowS,
main #Purpose ul li .redArrowS,
main #Case ul li .redArrowS{
 left:0px;
 top:5px;
}
main #Product ul li a.hover,
main #Purpose ul li a.hover,
main #Case ul li a.hover{
 color: #e60012;
}






main #Product h3{
 font-size:2.0rem;
 line-height: 2.0rem;
 width: 100%;
 margin-top: 80px;
 margin-bottom: 20px;
 font-weight: normal;
}