@charset "UTF-8";

/*===========================
ui2018
===========================*/

.ui2018 .seriesBanner-protrude .seriesBanner_img {
  margin-top: 0;
}

.seriesBanner-protrude .seriesBanner_note {
  margin-top: 10px;

}

.ui2018 .seriesRecommend_product {
  height: auto;
}

/* 共通
------------------------------------- */
.ui2018 .seriesFeature .contentsArea {
  width: 1160px;
  margin: 0 auto;
}

.ui2018 .seriesFeature .contentsArea .readTxt {
  margin-top: 30px;
  font-size: 1.6rem;
}

.ui2018 .colImgTxt {
  display: flex;
  justify-content: space-between;
}

.ui2018 .colImgTxt .txtBox,
.ui2018 .colImgTxt .imgBox {
  width: 48%;
}

.ui2018 .colTwoTxt {
  display: flex;
  justify-content: space-between;
  margin-top: 50px;
}

.ui2018 .colTwoTxt li {
  width: 48%;
  text-align: center;
}

.ui2018 .colTwoTxt li dt {
  margin-bottom: 5px;
  font-size: 160%;
  color: #666;
}

.ui2018 .colTwoTxt li dd {
  font-size: 3rem;
}

.ui2018 .colTwoTxt li dd .bigTxt {
  font-size: 5rem;
}

.ui2018 .colTwoTxt li dd .smlTxt {
  font-size: 1.4rem;
}

.ui2018 .cauTxt {
  display: flex;
  margin-top: 25px;
  font-size: 1.2rem;
}

.ui2018 h3 .smlTxt {
  font-size: 1.3rem;
}

.ui2018 .seriesFeature .contentsArea .acdBtn {
  display: inline-block;
  padding: 10px 40px 7px;
  border-radius: 3px;
  background: #666;
  color: #fff;
  font-size: 1.8rem;
  cursor: pointer;
}

.ui2018 .seriesFeature .contentsArea .acdBtn::after {
  display: inline-block;
  content: "";
  width: 0;
  height: 0;
  margin: 0 0 -5px 10px;
  border: 7px solid transparent;
  border-top: 11px solid #fff;
}

.ui2018 .seriesFeature .contentsArea .acdBtn.active::after {
  margin: 0 0 2px 10px;
  border-top: none;
  border-bottom: 11px solid #fff;
}

.ui2018 .seriesFeature .contentsArea .midSection {
  display: none;
  text-align: left;
}

.ui2018 .seriesFeature .contentsArea .midSection h4 {
  margin-bottom: 10px;
  font-weight: bold;
  font-size: 1.8rem;
}

.ui2018 .seriesFeature .contentsArea .midSection h4::before {
  display: inline-block;
  content: "";
  width: 13px;
  height: 13px;
  margin: 0 5px -1px 0;
  background: #333;
}

.ui2018 .seriesFeature .minSection {
  padding-top: 40px;
}

.ui2018 .seriesFeature .contentsArea .midSection > p,
.ui2018 .seriesFeature .contentsArea .minSection > p {
  font-size: 1.4rem;
}

.ui2018 .seriesFeature .contentsArea .midSection .figure {
  margin-top: 25px;
}

.ui2018 .seriesFeature .minSection h4,
.ui2018 .seriesFeature .minSection p,
.ui2018 .seriesFeature .minSection .figure,
.ui2018 .seriesFeature .midSection .cautionList {
  width: 950px;
  margin-left: auto;
  margin-right: auto;
}

.ui2018 .seriesFeature .minSection .figure img {
  width: 100%;
}

.ui2018 .seriesFeature .midSection .cautionList {
  display: flex;
  flex-wrap: wrap;
  margin-top: 25px;
  font-size: 85%;
}

.ui2018 .seriesFeature .midSection .cautionList dt {
  width: 5%;
}

.ui2018 .seriesFeature .midSection .cautionList dd {
  width: 95%;
}

.ui2018 .seriesFeature .midSection .cautionList dd:not(:last-child) {
  margin-bottom: 5px;
}

.ui2018 .seriesFeature .midSection .cautionList dd::before {
  content: " : ";
  margin-left: -8px;
}

.ui2018 .seriesFeature .imgBox {
  z-index: 10;
}

.ui2018 .seriesFeature .txtBox {
  z-index: 20;
}

.ui2018 .seriesFeature .contentsArea p.smalltxt {
  font-size: 1.3rem;
  padding-top: 30px;
}

/* section1
------------------------------------- */
.ui2018 .seriesFeature .subSection:nth-of-type(1) .contentsArea {
  width: 100%;
  margin-top: 20px;
}

.ui2018 .seriesFeature .subSection:nth-of-type(1) .contentsArea .figure {
  width: 100%;
  text-align: center;
}

/* section2
------------------------------------- */
.ui2018 .seriesFeature .subSection:nth-of-type(2) {
  padding: 40px 0;
  background: url(ui2018_im02_1.png) no-repeat center top;
  text-align: center;
  background-color: #f0f0f0;
}

.ui2018 .seriesFeature .subSection:nth-of-type(2) .contentsArea {
  width: 100%;
  margin: 0;
}

.ui2018 .seriesFeature .subSection:nth-of-type(2) .txtBox {
  width: 1160px;
  margin: 300px auto 0;
}

.ui2018 .seriesFeature .subSection:nth-of-type(2) .txtBox h3,
.ui2018 .seriesFeature .subSection:nth-of-type(2) .txtBox p {
  width: 45%;
}

.ui2018 .seriesFeature .subSection:nth-of-type(2) .txtBox p {
  text-align: left;
}

/* section3
------------------------------------- */
.ui2018 .seriesFeature .subSection:nth-of-type(3) {
  text-align: center;
}

.ui2018 .seriesFeature .subSection:nth-of-type(3) .box_01 {
  background: url(ui2018_im03_1.png) no-repeat center top;
  height: 750px;
}

.ui2018 .seriesFeature .subSection:nth-of-type(3) .box_02 {
  margin-top: -80px;
}

.ui2018 .seriesFeature .subSection:nth-of-type(3) .contentsArea {
  width: 100%;
  margin: 0;
}

.ui2018 .seriesFeature .subSection:nth-of-type(3) .txtBox {
  width: 1160px;
  margin: 0 auto;
  padding: 60px 0 0;
}

.ui2018 .seriesFeature .subSection:nth-of-type(3) .txtBox h3,
.ui2018 .seriesFeature .subSection:nth-of-type(3) .txtBox p {
  width: 45%;
  margin-left: 600px;
}

.ui2018 .seriesFeature .subSection:nth-of-type(3) .txtBox p {
  text-align: left;
}

.ui2018 .seriesFeature .subSection:nth-of-type(3) .acdBtn {
  margin-bottom: 40px;
}

.ui2018 .seriesFeature .subSection:nth-of-type(3) .midSection {
  text-align: left;
  margin-bottom: 40px;
}

.ui2018 .seriesFeature .subSection:nth-of-type(3) .minSection {
  padding-top: 30px;
}

.ui2018 .seriesFeature .subSection:nth-of-type(3) .minSection .figure img {
  width: 100%;
}


/* section4
------------------------------------- */
.ui2018 .seriesFeature .subSection:nth-of-type(4) {
  padding: 40px 0;
  text-align: center;
  background: url(ui2018_im04_2.png) no-repeat center top;
}

.ui2018 .seriesFeature .subSection:nth-of-type(4) .contentsArea {
  width: 100%;
  margin: 0;
}

.ui2018 .seriesFeature .subSection:nth-of-type(4) .contentsArea > .figure {
  margin: 30px 0;
}

.ui2018 .seriesFeature .subSection:nth-of-type(4) .midSection {
  text-align: left;
  margin-bottom: 40px;
  padding-top: 30px;
}

.ui2018 .seriesFeature .subSection:nth-of-type(4) .minSection {
  padding-top: 30px;
}

.ui2018 .seriesFeature .subSection:nth-of-type(4) .minSection .figure img {
  width: 100%;
}

.ui2018 .seriesFeature .subSection:nth-of-type(4) .midSection .cautionList {
  display: flex;
  flex-wrap: wrap;
  margin-top: 25px;
  font-size: 1.2rem;
}

.ui2018 .seriesFeature .subSection:nth-of-type(4) .minSection .figureBox {
  display: flex;
  justify-content: space-between;
  width: 950px;
  margin: 10px auto 0;
}

.ui2018 .seriesFeature .subSection:nth-of-type(4) .minSection .figureBox > div {
  width: 450px;
  text-align: center;
}

/* section5
------------------------------------- */
.ui2018 .seriesFeature .subSection:nth-of-type(5) {
  background: #F0F0F0;
  text-align: center;
}

.ui2018 .seriesFeature .subSection:nth-of-type(5) .acdBtn {
  margin-bottom: 40px;
}

.ui2018 .seriesFeature .subSection:nth-of-type(5) .colTwoBox {
  display: flex;
  justify-content: space-between;
  align-items: center;
  flex-direction: row-reverse;
}

.ui2018 .seriesFeature .subSection:nth-of-type(5) .colTwoBox .txtBox {
  width: 50%;
}

.ui2018 .seriesFeature .subSection:nth-of-type(5) .colTwoBox .txtBox p {
  text-align: left;
}

.ui2018 .seriesFeature .subSection:nth-of-type(5) .colTwoBox .imgBox {
  width: 50%;
  height: 720px;
  position: relative;
}

.ui2018 .seriesFeature .subSection:nth-of-type(5) .colTwoBox .figure {
  position: absolute;
  right: 0;
  top: 0;
}

.ui2018 .seriesFeature .subSection:nth-of-type(5) .minSection {
  padding-top: 30px;
}

.ui2018 .seriesFeature .subSection:nth-of-type(5) .minSection .figure img {
  width: 100%;
}

.ui2018 .seriesFeature .subSection:nth-of-type(5) .imgBox img {
  max-width: none;
}

/* section6
------------------------------------- */
.ui2018 .seriesFeature .subSection:nth-of-type(6) .contentsArea {
  padding: 60px 0 0;
  text-align: center;
}

.ui2018 .seriesFeature .subSection:nth-of-type(6) p {
  text-align: left;
}

.ui2018 .seriesFeature .subSection:nth-of-type(6) a {
  text-decoration: underline;
}

.ui2018 .seriesFeature .subSection:nth-of-type(6) a:hover {
  text-decoration: none;
}

.ui2018 .seriesFeature .subSection:nth-of-type(6) .colTwoBox {
  display: flex;
  justify-content: space-between;
  align-items: center;
}

.ui2018 .seriesFeature .subSection:nth-of-type(6) .colTwoBox img {
  max-width: none;
  margin-left: 20px;
}

.ui2018 .seriesFeature .subSection:nth-of-type(6) .imgBox {
  margin-top: 30px;
}

.ui2018 .seriesFeature .subSection:nth-of-type(6) .imgBox a:hover {
  opacity: 0.7;
}


@media screen and (max-width: 767px) {

  /* 共通
------------------------------------- */
  .ui2018 .seriesFeature .subSection:nth-of-type(1) .contentsArea,
  .ui2018 .seriesFeature .subSection:nth-of-type(2) .contentsArea,
  .ui2018 .seriesFeature .subSection:nth-of-type(3) .contentsArea,
  .ui2018 .seriesFeature .subSection:nth-of-type(4) .contentsArea,
  .ui2018 .seriesFeature .subSection:nth-of-type(5) .contentsArea,
  .ui2018 .seriesFeature .subSection:nth-of-type(6) .contentsArea {
    width: 100%;
    padding: 0 10px;
  }

  .ui2018 .colImgTxt {
    display: block;
  }

  .ui2018 .colImgTxt .txtBox,
  .ui2018 .colImgTxt .imgBox {
    width: 100%;
  }

  .ui2018 .seriesFeature .subSection {
    padding: 30px 0;
  }

  .ui2018 .seriesFeature .subSection h3 {
    text-align: left;
  }

  .ui2018 .seriesFeature .contentsArea .readTxt {
    margin-top: 15px;
    font-size: 1.4rem;
    text-align: left;
  }

  .ui2018 .colImgTxt .imgBox {
    margin-top: 15px;
  }

  .ui2018 .seriesFeature .subSection .imgBox img {
    max-width: 100%;
  }

  .ui2018 .colTwoTxt {
    margin-top: 20px;
  }

  .ui2018 .colTwoTxt li dt {
    margin-bottom: 5px;
    font-size: 1.6rem;
    color: #666;
  }

  .ui2018 .colTwoTxt li dd {
    font-size: 1.8rem;
  }

  .ui2018 .colTwoTxt li dd .bigTxt {
    font-size: 3.4rem;
  }

  .ui2018 .colTwoTxt li dd .smlTxt {
    font-size: 1.2rem;
  }

  .ui2018 .cauTxt {
    display: block;
    font-size: 1.2rem;
  }

  .ui2018 .seriesFeature .contentsArea .acdBtn {
    padding: 12px 50px 9px;
    font-size: 1.4rem;
    margin: 0;
  }

  .ui2018 .seriesFeature .contentsArea .midSection h4 {
    font-size: 1.6rem;
  }

  .ui2018 .seriesFeature .contentsArea .minSection h4,
  .ui2018 .seriesFeature .contentsArea .minSection p,
  .ui2018 .seriesFeature .contentsArea .figure {
    width: 100%;
    position: initial;
  }

  .ui2018 .seriesFeature .contentsArea p.smalltxt {
    font-size: 1.2rem;
  }
    .ui2018 .seriesFeature .contentsArea img {
    width: 100%;
  }

  /* section1
------------------------------------- */
  .ui2018 .seriesFeature .subSection:nth-of-type(1) {
    padding-bottom: 0
  }
  .ui2018 .seriesFeature .subSection:nth-of-type(1) .contentsArea{
    margin: 0;
  }

  /* section2
------------------------------------- */
  .ui2018 .seriesFeature .subSection:nth-of-type(2) {
    background-size: contain;
    height: auto;
    
    margin-top: 20px;
    padding: 30px 0;
  }

  .ui2018 .seriesFeature .subSection:nth-of-type(2) .txtBox {
    width: 100%;
    margin: 35% 0 0;
  }

  .ui2018 .seriesFeature .subSection:nth-of-type(2) .txtBox h3,
  .ui2018 .seriesFeature .subSection:nth-of-type(2) .txtBox p {
    width: 100%;
    margin-left: 0;
  }

  /* section3
------------------------------------- */
  .ui2018 .seriesFeature .subSection:nth-of-type(3) .box_01 {
    background-size: contain;
    height: auto;
    padding: 0 10px;
  }

  .ui2018 .seriesFeature .subSection:nth-of-type(3) .txtBox {
    width: 100%;
    padding: 55% 0 0;
  }

  .ui2018 .seriesFeature .subSection:nth-of-type(3) .txtBox h3,
  .ui2018 .seriesFeature .subSection:nth-of-type(3) .txtBox p {
    width: 100%;
    margin: 0;
  }
  .ui2018 .seriesFeature .subSection:nth-of-type(3) .txtBox p{
   margin-top:  15px;
  }
  .ui2018 .seriesFeature .subSection:nth-of-type(3) .box_02 {
    margin-top: 10px;
  }
  .ui2018 .seriesFeature .subSection:nth-of-type(3) .acdBtn{
    margin: 0;
  }
  .ui2018 .seriesFeature .subSection:nth-of-type(3) .midSection{
    margin: 0;
  }
  
  /* section4
------------------------------------- */
  .ui2018 .seriesFeature .subSection:nth-of-type(4) {
    padding: 30px 0;
  }
  .ui2018 .seriesFeature .subSection:nth-of-type(4) .box_01 {
    background: url(/image/ui2018/ui2018_im04_2.png) no-repeat center;
    background-size: contain;
    background-position: bottom;
    height: auto;
  }

  .ui2018 .seriesFeature .subSection:nth-of-type(4) .minSection .figureBox {
    display: block;
    width: 100%;
  }

  .ui2018 .seriesFeature .midSection .cautionList {
    font-size: 115%;
    width: 100%;
  }

  .ui2018 .seriesFeature .midSection .cautionList dt {
    width: 10%;
  }

  .ui2018 .seriesFeature .midSection .cautionList dd {
    width: 90%;
  }
  .ui2018 .seriesFeature .subSection:nth-of-type(4) .minSection .figureBox > div{
    width: 100%;
  }

  /* section5
------------------------------------- */
  .ui2018 .seriesFeature .subSection:nth-of-type(5) .colTwoBox {
    display: block;
  }

  .ui2018 .seriesFeature .subSection:nth-of-type(5) .colTwoBox .txtBox,
  .ui2018 .seriesFeature .subSection:nth-of-type(5) .colTwoBox .imgBox {
    width: 100%;
  }

  .ui2018 .seriesFeature .subSection:nth-of-type(5) .colTwoBox .imgBox {
    margin-top: 20px;
    height: 100%;
    position: initial;
  }
  .ui2018 .seriesFeature .subSection:nth-of-type(5) .acdBtn{
    margin: 0;
  }
  .ui2018 .seriesFeature .subSection:nth-of-type(5) .colTwoBox .figure{
   position: initial;
  }
  
  /* section6
------------------------------------- */
  .ui2018 .seriesFeature .subSection:nth-of-type(6) .colTwoBox {
    display: block;
  }

  .ui2018 .seriesFeature .subSection:nth-of-type(6) .colTwoBox .imgBox {
    max-width: 150px;
    margin: 10px auto;
  }
  .ui2018 .seriesFeature .subSection:nth-of-type(6) .colTwoBox img{
    margin: 0;
  }
  .ui2018 .seriesFeature .subSection:nth-of-type(6) p {
    padding: 0;
  }


  .ui2018 .seriesFeature_bottomNote {
    font-size: 1.4rem;
  }
}
