@charset "utf-8";
/* 配下visual-----------------------------*/
#visual {
  padding: 0;
}
#visual:after {
  display: none;
}
#visual h1 {
  color: #050505;
}
#visual h1 .cate {
  display: block;
}
#visual h1 .cate span {
  color: #FFFFFF;
  background-color: #0057a2;
  display: inline-block;
}
#visual .visual_img {
  background-position: center;
  background-size: cover;
  background-repeat: no-repeat;
  position: absolute;
  right: 0px;
  top: 0px;
  bottom: 0px;
  z-index: -1;
  display: block;
  content: "";
}
body#products .genre_list h3 {
  color: #191919;
  text-align: center;
}
/* products-----------------------------*/
.prdct_mov {
  position: relative;
  width: 100%;
  height: 0;
  padding-top: 56.25%;
}
.prdct_mov iframe {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
}
body.products #visual:before, body.products #visual:after {
  display: block;
  position: absolute;
  top: 0px;
  bottom: 0px;
  content: "";
}
body.products #visual:before {
  background-color: rgba(0, 87, 162, 0.63);
  left: 0px;
  right: auto;
  height: 100%;
  z-index: auto;
}
body.products #visual:after {
  height: 100%;
  box-sizing: border-box;
}
body.products #visual .container {
  padding: 0;
  position: static;
  background-color: transparent;
}
body.products #visual .container:before {
  display: none;
}
body.products #visual .bg_white {
  padding: 0;
  margin: 0;
  background-color: transparent;
  min-height: 0px;
}
body.products #visual h1 {
  margin: 0;
  color: #FFFFFF;
}
body.products .products_list ul li a {
  text-decoration: none;
  display: block;
}
body.products .products_list h2 {
  font-family: source-han-sans-japanese, sans-serif;
  font-weight: 500;
  font-style: normal;
  margin: 15px 0;
  color: #191919;
}
body.products .products_list .thumbnail {
  width: 100%;
  background-position: center;
  background-size: cover;
  background-repeat: no-repeat;
}
body.products .products_list p {
  color: #000000;
}

body#products .show_next_area {
	text-align: right;
	color: #121212;
}
body#products .show_next_area span {
	cursor:pointer;
}
body#products .show_next_area span:hover {
	opacity: 0.7;
}


/* smell-----------------------------*/
#header.fixedh2 {
  color: #000000;
  text-align: center;
  letter-spacing: 0;
}
/* facility-----------------------------*/
body.facility #visual:before {
  background-color: rgba(0, 87, 162, 0.63);
  left: 0px;
  right: auto;
  height: 100%;
  z-index: auto;
}
body.facility #visual .bg_white {
  padding: 0;
  margin: 0;
  background-color: transparent;
  min-height: 0px;
}
body.facility #visual:before, body.facility #visual:after {
  display: block;
  position: absolute;
  top: 0px;
  bottom: 0px;
  content: "";
}
body.facility #visual h1 {
  margin: 0;
  color: #FFFFFF;
}
body.facility #visual .container {
  padding: 0;
  position: static;
  background-color: transparent;
}
body.facility #sec01 h2:first-child {
  margin-top: 0px;
}
/* ━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━

PC Setting

━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━ */
@media screen and (min-width: 768px) {
  .prdct_movPc {
    display: block;
    width: 560px;
    height: 315px;
    margin: 20px auto 50px;
  }
  #visual {
    padding: 0 0 30px;
  }
  #visual:before {
    width: 100%;
    left: 0px;
    right: 0px;
    top: auto;
    bottom: 0px;
    height: 300px;
    background-color: #f8f8f8;
    z-index: -1;
  }
  #visual .container {
    position: relative;
    max-width: 1280px;
    padding: 30px 0;
  }
  #visual .container:before {
    background-position: center;
    background-size: cover;
    background-repeat: no-repeat;
    width: 55.5%;
    height: 100%;
    position: absolute;
    right: 0px;
    top: 0px;
    bottom: 0px;
    z-index: -1;
    display: block;
    content: "";
  }
  #visual .visual_img {
    width: 55.5%;
  }
  #visual .bg_white {
    padding: 42px 90px 35px 90px;
    margin-right: 41%;
    background-color: rgba(255, 255, 255, 0.92);
    min-height: 240px;
  }
  #visual h1 {
    margin-bottom: 30px;
  }
  #visual h1 .cate {
    font-size: 1.4rem;
  }
  #visual h1 .cate span {
    padding: 0 8px;
  }
  #visual .visual_text {
    line-height: 2.2;
  }
  body#products .genre_list {
    padding-bottom: 60px;
  }
  body#products .genre_list h2 {
    font-size: 3.5rem;
    margin-bottom: 45px;
    letter-spacing: 0px;
  }
  body#products .genre_list ul.flexbox {
    margin: 0 -1%;
  }
  body#products .genre_list ul.flexbox li {
    margin: 0 1% 80px;
    flex-basis: 31.3333%;
  }
  body#products .genre_list h3 {
    margin: 50px 0 25px;
    font-size: 2rem;
  }
  body#products .genre_list .txt {
    margin-bottom: 40px;
  }
  /* single-----------------------------*/
  body.single #visual {
    min-height: 417px;
  }
  body.single #visual .bg_white {
    padding: 60px 90px 85px 90px;
    min-height: 72px;
  }
  /*body.single #visual .container:before {
    height: 382px;
  }*/
  /* products-----------------------------*/
  body.products #visual {
    padding: 116px 0;
    background-image: url(/img/products/mv_products_01_pc.png);
  }
  body.products #visual:before {
    width: 44.5%;
  }
  body.products #visual .container {
    max-width: 1100px;
  }
  body.products .products_list {
    padding-bottom: 40px;
  }
  body.products .products_list ul {
    margin: 0 -0.75%;
  }
  body.products .products_list ul li {
    margin: 0 0.75% 65px;
    flex-basis: 23.5%;
  }
  body.products .products_list ul li:hover {
    cursor: pointer;
  }
  body.products .products_list ul li a:hover {
    opacity: 1;
  }
  body.products .products_list h2 {
    font-size: 1.6rem;
  }
  body.products .products_list .thumbnail {
    position: relative;
    height: 172px;
  }
  body.products .products_list ul li .thumbnail:before {
    width: 100%;
    height: 100%;
    display: block;
    position: absolute;
    top: 0px;
    right: 0px;
    bottom: 0px;
    left: 0px;
    content: "";
    opacity: 1;
    transition: all .3s ease;
    background-color: transparent;
  }
  body.products .products_list ul li:hover .thumbnail:before {
    background-color: rgba(0, 87, 162, 0.49);
    opacity: 1;
  }
  body.products .products_list ul li:hover .txt {
    opacity: 0.6;
    transition: all .3s ease;
    background-color: transparent;
  }
  body.products .products_list p {
    letter-spacing: 0.5px;
  }

  #header.fixed .btn a:after {
    margin-top: -3px;
  }

  /*facility*/
  body.facility #visual {
    padding: 116px 0;
    background-image: url(/img/products/mv_products_01_pc.png);
  }
  body.facility #visual:after {
    width: 4px;
    left: 44.5%;
    border: 160px solid transparent;
    border-left: 120px solid rgba(0, 87, 162, 0.63);
  }
  body.facility #visual:before {
    width: 44.5%;
  }
  body.facility #visual .container {
    max-width: 1100px;
  }
  body.facility #sec01 {
    padding-bottom: 70px;
  }
  body.facility #sec01 .container {
    max-width: 900px;
  }
  body.facility #sec01 .tbl_style01 th {
    width: 22.2%;
  }
  body.facility #sec01 .tbl_style01 .th_onecol {
    display: none;
  }
  body.facility #sec01 .tbl_style01 td:last-child {
    width: 10.5%;
    text-align: center;
  }
  body.facility #sec01 .tbl_style01 td:first-child {
    width: 67.3%;
    text-align: left;
  }
  body.facility #sec01 h2 {
    font-size: 2.5rem;
    margin: 55px 0 15px;
  }
}
/* ━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━

TABLET Setting

━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━ */
@media screen and (min-device-width: 768px) and (max-device-width: 1024px) {
  body#products .genre_list .txt {
    letter-spacing: 0.5px;
  }
  body.single #sec01 .txt {
    letter-spacing: 1px;
  }
}
/*━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━

SP Setting

━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━ */
@media (max-width: 767px) {
  /*#visual:before {
    background-size: cover;
    background-repeat: no-repeat;
    width: 100%;
    height: 42vw;
    position: static;
    background-color: transparent;
    background-position: center top;
  }*/
  #visual {
    padding-top: 42vw;
  }
  #visual:before {
    display: none;
  }
  #visual .container {
    padding: 15px 6%;
    background-color: #f8f8f8;
  }
  #visual .visual_img {
    width: 100%;
    height: 42vw;
    background-size: cover;
    background-repeat: no-repeat;
    background-position: center top;
  }
  #visual .bg_white {
    padding: 15px 4.5%;
    background-color: rgba(255, 255, 255, 1.00);
  }
  #visual h1 {
    margin-bottom: 15px;
  }
  #visual h1 .cate {
    font-size: 4vw;
  }
  #visual h1 .cate span {
    padding: 1px 5px;
  }
  #visual .visual_text {
    line-height: 1.8;
  }
  body#products .genre_list {
    padding: 30px 6%;
  }
  body#products .genre_list h2 {
    font-size: 7.25vw;
    margin-bottom: 30px;
  }
  body#products .genre_list ul.flexbox {
    display: block;
  }
  body#products .genre_list ul.flexbox li + li {
    margin-top: 30px;
  }
  body#products .genre_list h3 {
    margin: 15px 0;
    font-size: 5vw;
  }
  body#products .genre_list .txt {
    margin-bottom: 15px;
  }
  body.smell.single #visual:before {
    background-image: url(/img/products/smell/mv_smell_02_pc.png);
  }
  /* products-----------------------------*/
  body.products #visual {
    padding: 16vw 6%;
    background-image: url(/img/products/mv_products_01_sp.png);
  }
  body.products #visual:before {
    width: 54%;
  }
  body.products .products_list {
    padding: 30px 6% 0;
  }
  body.products .products_list ul {
    margin: 0 -1.5%;
  }
  body.products .products_list ul li {
    margin: 0 1.5% 30px;
    flex-basis: 47%;
  }
  body.products .products_list h2 {
    letter-spacing: 0px;
  }
  body.products .products_list .thumbnail {
    height: 28.5vw;
  }
  /* facility */
  body.facility #visual {
    padding: 16vw 6%;
    background-image: url(/img/products/mv_products_01_sp.png);
  }
  body.facility #visual:before {
    width: 54%;
  }
  body.facility #sec01 {
    padding: 30px 0;
  }
  body.facility #sec01 .container {
    margin: 0 6%;
  }
  body.facility #sec01 *:last-child {
    margin-bottom: 0px;
  }
  body.facility #sec01 .tbl_style01 thead th:nth-child(2) {
    display: none;
  }
  body.facility #sec01 .tbl_style01 tbody th {
    display: none;
  }
  body.facility #sec01 .tbl_style01 .th_onecol {
    display: table-row;
  }
  body.facility #sec01 .tbl_style01 .th_onecol th {
    display: table-cell;
  }
  body.facility #sec01 .tbl_style01 td:last-child {
    width: 20%;
    text-align: center;
  }
  body.facility #sec01 .tbl_style01 td:first-child {
    width: 80%;
    text-align: left;
  }
  body.facility #sec01 h2 {
    font-size: 5vw;
    margin: 30px 0 15px;
  }
}