@charset "utf-8";



/*============================
#header
============================*/

#siteheader div.header_inner div.header_container {
  background: -moz-linear-gradient(top, rgba(59, 57, 57, 10),rgba(59, 57, 57, 0)); 
  background: -webkit-linear-gradient(top, rgba(59, 57, 57, 10),rgba(59, 57, 57, 0)); 
  background: linear-gradient(to bottom, rgba(59, 57, 57, 10),rgba(59, 57, 57, 0));
	background-color: #3B3939;
  
}
.headerScroll #siteheader div.header_inner div.header_container{  
  background-color: rgba(57,57,57,0);
  transition: background-color 1s;

}
.headerScroll #siteheader.op div.header_inner div.header_container{  
  background-color: rgba(57,57,57,0.85);
  transition: background-color 1s;

}


/** TOPページ用 黒NAV 
#siteheader div.header_inner div.bg_header_container {
  width: 100%;
  height: 89px;
  display: block;
  background: -moz-linear-gradient(top, rgba(0, 0, 0, 10) 58%,rgba(0, 0, 0, 0)); 
  background: -webkit-linear-gradient(top, rgba(0, 0, 0, 10) 58%,rgba(0, 0, 0, 0)); 
  background: linear-gradient(to bottom, rgba(0, 0, 0, 10) 58%,rgba(0, 0, 0, 0));
  position: absolute;
  top: 0;
  left: 0;
  z-index: 100000;
  opacity: 1;
  transition: 0.3s;
}
/** END./TOPページ用 黒NAV **/

#siteheader div.header_inner div.header_container div.search_area {
  display: none;
}





div#FOOT_LINK.foot_top_btn {
  background-color: rgba(15, 56, 82, 0.86);
}


footer#sitefooter div.inner {
  width: auto;
  padding: 50px 0 16px 0;
}


/*============================
#KEY_container
============================*/
div#KEY_container {
  width: 100%;
  position: relative;
  background: #000;
  height: 178vw;
}

div#KEY_container p.cover{
  left: 0;
  position: absolute;
  top: 0;
  z-index: 10;
  width: 100%;
  height: 100%
}
div#KEY_container p.cover img{
  width: 100%;
  height: 100%
}
div#KEY_container iframe {
  height: 100%;
  left: 0;
  position: absolute;
  top: 0;
  width: 100%;
  z-index: 5
}


div#KEY_container .inner{
  text-align: center;
}
div#KEY_container video{
  width: 100%;
  object-fit: cover;
  object-position: center;
  margin: 0 auto
}
div#KEY_container iframe video{
  width: 100% !important;
}

/*.mainVisual {
  position: fixed;
  top: 0;
  left: 0;
  right: 0;
  margin: 0 auto;
  height: 100vh;
  width: 100%;
  overflow: hidden;
}

div#KEY_container div.inner {
  width: auto;
  position: relative;
}

div#KEY_container div.inner div.key_slider {
  width: auto;
}

div#KEY_container div.inner div.key_slider div.swiper-wrapper {
  width: auto;
}

div#KEY_container div.inner div.key_slider div.swiper-wrapper div.swiper-slide {
  width: 100%;
  height: 100%;
  -webkit-background-size: cover;
  background-size: cover;
}

div#KEY_container div.inner div.key_slider div.swiper-wrapper div.swiper-slide::before {
  content: "";
  width: 100%;
  height: 100%;
  background-color: rgba(0, 0, 0, 0.33);
  position: absolute;
  top: 0;
  left: 0;
}

.swiper-pagination {
  transition: 0.3s;
}

.swiper-horizontal > .swiper-pagination-bullets, .swiper-pagination-bullets.swiper-pagination-horizontal, .swiper-pagination-custom, .swiper-pagination-fraction {
  bottom: 80px;
  bottom: 15%;
}

.swiper-pagination-white .swiper-pagination-bullet {
  background: rgba(255, 255, 255, 0.45);
  border: 2px solid #797775;
}

.swiper-pagination-white .swiper-pagination-bullet-active {
  background: rgba(255, 255, 255, 0.83);
  border: 2px solid #71716E;
}
*/




div.main_container {
  width: 100%;
  position: relative;

  min-height: 100vh;
}










/*============================
KEY_TITLE
============================*/
div#KEY_TITLE {
  width: auto;
  position: relative;
}

div#KEY_TITLE div.inner {
  width: auto;
  padding: 334px 0 315px 0;
}

div#KEY_TITLE div.inner h2 {
  width: 40.1%;
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
  -webkit-transform: translate(-50%, -50%);
  -ms-transform: translate(-50%, -50%);
  z-index: 1;
}







/*============================
concept_contents
============================*/
div.concept_contents {
  width: auto;
  position: relative;
}

/*
div.concept_contents::after {
  content: "";
  width: 100%;
  height: 55%;
  margin: 0 auto;
  background: transparent url(../../images/top/bg_line01_sp.png) no-repeat center bottom;
  -webkit-background-size: cover;
  background-size: cover;
  position: absolute;
  bottom: -1px;
  left: 0;
  right: 0;
  z-index: 1;
}
*/

div.concept_contents div.conts_inner {
  width: auto;
/*
  background: -moz-linear-gradient(top, rgba(0, 0, 0, 0), #333131); 
  background: -webkit-linear-gradient(top, rgba(0, 0, 0, 0), #333131); 
  background: linear-gradient(to bottom, rgba(0, 0, 0, 0), #333131);
*/
  position: relative;
  z-index: 2;
}

div.concept_contents div.conts_inner div.read_wrap {
  width: 84.5%;
  margin: 0 auto;
  padding: 90px 0 80px 0;
}

div.concept_contents div.conts_inner div.read_wrap h3 {
  width: auto;
  padding: 0 0 5px 0;
  font-size: 32px;
  color: rgba(255, 255, 255, 0.81);
  line-height: 1.37;
  font-family: 'Libre Baskerville', serif;
}

div.concept_contents div.conts_inner div.read_wrap div.text {
  width: auto;
}

div.concept_contents div.conts_inner div.read_wrap div.text p.read {
  width: auto;
  padding: 0 0 40px 0;
  font-size: 24px;
  color: rgba(255, 255, 255, 0.86);
  line-height: 1.5;
  font-family: "游明朝体", "Yu Mincho", YuMincho, "ヒラギノ明朝 Pro W3", "Hiragino Mincho Pro", "Noto Serif JP", "HG明朝E","ＭＳ Ｐ明朝", "MS PMincho", serif;
}

div.concept_contents div.conts_inner div.read_wrap div.text p.text {
  width: auto;
  font-size: 16px;
  color: #fff;
  line-height: 2.1;
  font-family: "游明朝体", "Yu Mincho", YuMincho, "ヒラギノ明朝 Pro W3", "Hiragino Mincho Pro", "Noto Serif JP", "HG明朝E","ＭＳ Ｐ明朝", "MS PMincho", serif;
}





/*============================
brand_contents
============================*/
div.brand_contents {
  width: auto;
  position: relative;
  z-index: 1;
}

/*
div.brand_contents::after {
  content: "";
  width: 100%;
  height: 100%;
  margin: 0 auto;
  background: transparent url(../../images/top/bg_line02_sp.png) no-repeat center top;
  -webkit-background-size: cover;
  background-size: cover;
  position: absolute;
  top: 0;
  left: 0;
  right: 0;
  z-index: 1;
}
*/

div.brand_contents div.conts_inner {
  width: auto;
  padding: 60px 0 70px 0;
  background-color: #333131;
}

div.brand_contents div.conts_inner h3 {
  width: auto;
  padding: 0 0 20px 0;
  font-size: 32px;
  color: #fff;
  text-align: center;
  font-family: 'Libre Baskerville', serif;
  position: relative;
  z-index: 2;
}

div.brand_contents div.conts_inner p.read {
  width: auto;
  padding: 0 0 24px 0;
  font-size: 14px;
  color: #fff;
  text-align: center;
  line-height: 1.5;
  font-family: "游明朝体", "Yu Mincho", YuMincho, "ヒラギノ明朝 Pro W3", "Hiragino Mincho Pro", "Noto Serif JP", "HG明朝E","ＭＳ Ｐ明朝", "MS PMincho", serif;
  position: relative;
  z-index: 2;
}

div.brand_contents div.conts_inner ul {
  width: 90.4%;
  margin: 0 auto;
  position: relative;
  z-index: 2;
}

div.brand_contents div.conts_inner ul li {
  width: auto;
  padding: 0 0 10px 0;
}

div.brand_contents div.conts_inner ul li:last-child {
  padding: 0;
}

div.brand_contents div.conts_inner ul li a {
  width: auto;
}





/*============================
eventnews_contents
============================*/
div.eventnews_contents {
  width: auto;
  background-color: #fff;
  position: relative;
}

div.eventnews_contents div.conts_inner {
  width: auto;
}

div.eventnews_contents div.conts_inner div.post_wrap {
  width: auto;
  position: relative;
}

div.eventnews_contents div.conts_inner div.post_wrap div.com_box {
  width: auto;
  position: relative;
  z-index: 1;
}

div.eventnews_contents div.conts_inner div.post_wrap div.com_box.event {
  padding: 55px 0 68px 0;
  background-color: #fff;
}

/*
div.eventnews_contents div.conts_inner div.post_wrap div.com_box.event::after {
  content: "";  
  width: 100%;
  height: 100%;
  margin: 0 auto;
  background: transparent url(../../images/top/bg_line03_sp.png) no-repeat center top;
  -webkit-background-size: cover;
  background-size: cover;
  position: absolute;
  top: 0;
  left: 0;
  right: 0;
  z-index: 1;
}
*/

div.eventnews_contents div.conts_inner div.post_wrap div.com_box.news {
  padding: 60px 0 60px 0;
  background-color: #EDEDED;
}

/*
div.eventnews_contents div.conts_inner div.post_wrap div.com_box.news::after {
  content: "";
  width: 100%;
  height: 100%;
  margin: 0 auto;
  background: transparent url(../../images/top/bg_line04_sp.png) no-repeat center top;
  -webkit-background-size: cover;
  background-size: cover;
  position: absolute;
  top: 0;
  left: 0;
  right: 0;
  z-index: 1;
}
*/

div.eventnews_contents div.conts_inner div.post_wrap div.com_box div.title_wrap {
  width: auto;
  padding: 0 0 30px 0;
  position: relative;
  z-index: 2;
  opacity: 1;
  transition: 0.6s;
}

div.eventnews_contents div.conts_inner div.post_wrap div.com_box.news div.title_wrap {
  padding: 0 0 90px 0;
}

div.eventnews_contents div.conts_inner div.post_wrap div.com_box div.title_wrap.active {
  z-index: 3;
}


div.eventnews_contents div.conts_inner div.post_wrap div.com_box div.title_wrap h3 {
  width: auto;
  font-size: 32px;
  text-align: center;
  line-height: 1.5;
  font-family: 'Libre Baskerville', serif;
}

div.eventnews_contents div.conts_inner div.post_wrap div.com_box div.list_wrap {
  width: auto;
  margin: 0 6.5% 0 4.8%;
  height: 102vw;
  overflow: auto;
  scrollbar-width: thin;
  position: relative;
  z-index: 2;
}

div.eventnews_contents div.conts_inner div.post_wrap div.com_box div.list_wrap ul {
  width: 91.6%;
  margin: 0 auto 0 0;
  border-top: 1px solid #DBDBDB;
  box-sizing: border-box;
}

div.eventnews_contents div.conts_inner div.post_wrap div.com_box div.list_wrap ul li {
  width: auto;
  padding: 19px 0 20px 0;
  border-bottom: 1px solid #DBDBDB;
  box-sizing: border-box;
}

div.eventnews_contents div.conts_inner div.post_wrap div.com_box div.list_wrap ul li.is-hide {
  display: none;
}

div.eventnews_contents div.conts_inner div.post_wrap div.com_box div.list_wrap ul li a {
  width: auto;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  justify-content: flex-start;
}

div.eventnews_contents div.conts_inner div.post_wrap div.com_box div.list_wrap ul li a figure {
  width: 100px;
  margin: 0 5% 0 0;
  overflow: hidden;
}

div.eventnews_contents div.conts_inner div.post_wrap div.com_box div.list_wrap ul li a figure img {
  width: 100%;
}

div.eventnews_contents div.conts_inner div.post_wrap div.com_box div.list_wrap ul li div.text_area {
  width: 58.1%;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  flex-flow: column;
  justify-content:space-between;
}


/*  調整前style
div.eventnews_contents div.conts_inner div.post_wrap div.com_box div.list_wrap ul li a {
  width: auto;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  justify-content: space-between;
}

div.eventnews_contents div.conts_inner div.post_wrap div.com_box div.list_wrap ul li a figure {
  width: 29.8%;
  overflow: hidden;
}

div.eventnews_contents div.conts_inner div.post_wrap div.com_box div.list_wrap ul li a figure span {
  width: 100%;
  height: 0;
  display: block;
  padding-top: 100%;
  background-position: center center;
  -webkit-background-size: cover;
  background-size: cover;
}

div.eventnews_contents div.conts_inner div.post_wrap div.com_box div.list_wrap ul li div.text_area {
  width: 63.1%;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  flex-flow: column;
  justify-content:space-between;
} */

div.eventnews_contents div.conts_inner div.post_wrap div.com_box div.list_wrap ul li div.text_area p.title {
  width: auto;
  font-size: 14px;
  line-height: 1.5;
  font-family: "游明朝体", "Yu Mincho", YuMincho, "ヒラギノ明朝 Pro W3", "Hiragino Mincho Pro", "Noto Serif JP", "HG明朝E","ＭＳ Ｐ明朝", "MS PMincho", serif;
}

div.eventnews_contents div.conts_inner div.post_wrap div.com_box div.list_wrap ul li div.text_area div.data {
  width: auto;
  padding: 10px 0 0 0;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
}

div.eventnews_contents div.conts_inner div.post_wrap div.com_box div.list_wrap ul li div.text_area div.data p.day {
  width: auto;
  padding: 0 9.4% 0 0;
  font-size: 14px;
  color: #848484;
  line-height: 1.0;
  font-weight: 500;
  position: relative;
}

div.eventnews_contents div.conts_inner div.post_wrap div.com_box div.list_wrap ul li div.text_area div.data p.day::after {
  content: "";
  width: 1px;
  height: 11px;
  background-color: #848484;
  position: absolute;
  top: 50%;
  right: 0;
  transform: translate(0, -50%);
  -webkit-transform: translate(0, -50%);
  -ms-transform: translate(0, -50%);
}

div.eventnews_contents div.conts_inner div.post_wrap div.com_box div.list_wrap ul li div.text_area div.data p.cate {
  width: 100%;
  padding: 0 0 0 4.7%;
  font-size: 14px;
  color: #848484;
  line-height: 1.0;
  font-weight: 500;
}

div.eventnews_contents div.conts_inner div.post_wrap div.com_box div.link_btn {
  width: auto;
  padding: 42px 0 0 0;
  position: relative;
  z-index: 2;
}

div.eventnews_contents div.conts_inner div.post_wrap div.com_box div.link_btn a {
  width: 80.7%;
  margin: 0 auto;
  display: block;
  background-color: #2c2c2c;
}

div.eventnews_contents div.conts_inner div.post_wrap div.com_box div.link_btn a span {
  width: 88%;
  display: block;
  margin: 0 auto;
  padding: 25px 0;
  font-size: 14px;
  color: #fff;
  line-height: 1.0;
  letter-spacing: 0.05em;
  font-weight: bold;
  position: relative;
}

div.eventnews_contents div.conts_inner div.post_wrap div.com_box div.link_btn a span::after {
  content: "";
  width: 33px;
  height: 23px;
  background: transparent url(../../images/common/arrow_search.png) no-repeat center center;
  -webkit-background-size: 100%;
  background-size: 100%;
  position: absolute;
  top: 50%;
  right: 0;
  transform: translate(0, -50%);
  -webkit-transform: translate(0, -50%);
  -ms-transform: translate(0, -50%);
}



/** cate_area **/
div.eventnews_contents div.conts_inner div.post_wrap div.com_box.news div.cate_area {
  width: 90.4%;
  height: 100vh;
  margin: 0 auto;
  position: absolute;
  top: 82px;
  left: 0;
  right: 0;
}

div.eventnews_contents div.conts_inner div.post_wrap div.com_box.news div.cate_area p.category {
  width: auto;
  padding: 0 0 5px 0;
  border-bottom: 1px solid #C3C3C3;
  box-sizing: border-box;
}

div.eventnews_contents div.conts_inner div.post_wrap div.com_box.news div.cate_area p.category span {
  width: 89.6%;
  display: block;
  padding: 0 auto;
  font-size: 16px;
  line-height: 1.3;
  font-weight: bold;
  position: relative;
}

div.eventnews_contents div.conts_inner div.post_wrap div.com_box.news div.cate_area p.category span::after {
  content: "";
  width: 16px;
  height: 10px;
  background: transparent url(../../images/common/arrow_cate_gray.png) no-repeat center center;
  -webkit-background-size: 100%;
  background-size: 100%;
  position: absolute;
  top: 50%;
  right: 0;
  transform: translate(0, -50%);
  -webkit-transform: translate(0, -50%);
  -ms-transform: translate(0, -50%);
}

div.eventnews_contents div.conts_inner div.post_wrap div.com_box.news div.cate_area ul.cate_list {
  width: auto;
  background-color: rgba(255, 255, 255, 0.9);
}

div.eventnews_contents div.conts_inner div.post_wrap div.com_box.news div.cate_area ul.cate_list li {
  width: auto;
  padding: 7px 0;
  border-bottom: 1px solid #C3C3C3;
  box-sizing: border-box;
}

div.eventnews_contents div.conts_inner div.post_wrap div.com_box.news div.cate_area ul.cate_list li span {
  width: auto;
  padding: 0 0 0 8px;
  font-size: 14px;
  line-height: 1.5;
  font-weight: 500;
}





/*============================
bg_contents
============================*/
div.bg_contents {
  width: auto;
  /*background: -moz-linear-gradient(to bottom, rgba(51, 49, 59, 0),rgba(51, 49, 59, 0.82) 16.6%,rgba(49, 49, 49, 0.82)); 
  background: -webkit-linear-gradient(to bottom, rgba(51, 49, 59, 0),rgba(51, 49, 59, 0.82) 16.6%,rgba(49, 49, 49, 0.82)); 
  background: linear-gradient(to bottom,rgba(51, 49, 59, 0),rgba(51, 49, 59, 0.82) 16.6%,rgba(49, 49, 49, 0.82));
  
  background: transparent url(../../images/top/how_bg_pc.png) no-repeat center center;
  -webkit-background-size: cover;
  background-size: cover;*/
  position: relative;
  z-index: 1;
}

div.bg_contents div.bg_contents_inner {
  width: auto;
}

/*============================
howto_contents
============================*/
div.bg_contents div.bg_contents_inner div.howto_contents {
  width: auto;
  position: relative;
}

/*
@media (max-width:408px){
  div.bg_contents div.bg_contents_inner div.howto_contents::before {
    content: "";
    width: 100%;
    height: 5%;
    margin: 0 auto;
    background: rgba(51, 49, 49, 0.9) url(../../images/top/bg_line05_bottom_sp.png) repeat-y center bottom;
    -webkit-background-size: 100% auto;
    background-size: 100% auto;
    position: absolute;
    bottom: 0;
    left: 0;
    right: 0;
    z-index: 2;
  }
}

div.bg_contents div.bg_contents_inner div.howto_contents::after {
  content: "";
  width: 100%;
  height: 100%;
  margin: 0 auto;
  background: rgba(51, 49, 49, 0.9) url(../../images/top/bg_line05_sp.png) no-repeat center top;
  -webkit-background-size: 100% auto;
  background-size: 100% auto;
  position: absolute;
  top: 0;
  left: 0;
  right: 0;
  z-index: 1;
}
*/

div.bg_contents div.bg_contents_inner div.howto_contents div.conts_inner {
  width: auto;
  padding: 90px 0 0 0;
  position: relative;
  z-index: 2;
}

div.bg_contents div.bg_contents_inner div.howto_contents div.conts_inner h3 {
  width: auto;
  padding: 0 0 15px 0;
  font-size: 32px;
  color: #fff;
  text-align: center;
  line-height: 1.25;
  font-family: 'Libre Baskerville', serif;
}

div.bg_contents div.bg_contents_inner div.howto_contents div.conts_inner p.detail {
  width: auto;
  padding: 0 0 45px 0;
  font-size: 14px;
  color: #fff;
  text-align: center;
  line-height: 1.7;
  letter-spacing: 0.05em;
  font-family: "游明朝体", "Yu Mincho", YuMincho, "ヒラギノ明朝 Pro W3", "Hiragino Mincho Pro", "Noto Serif JP", "HG明朝E","ＭＳ Ｐ明朝", "MS PMincho", serif;
  font-weight: 500;
}


/*** instructor_wrap ***/
div.bg_contents div.bg_contents_inner div.howto_contents div.conts_inner div.instructor_wrap {
  width: auto;
  padding: 0 0 75px 0;
}

div.bg_contents div.bg_contents_inner div.howto_contents div.conts_inner div.instructor_wrap div.img_area {
  width: auto;
  padding: 0 0 30px 0;
}

div.bg_contents div.bg_contents_inner div.howto_contents div.conts_inner div.instructor_wrap div.img_area figure {
  width: auto;
  margin: 0 10px;
}

div.bg_contents div.bg_contents_inner div.howto_contents div.conts_inner div.instructor_wrap div.img_area figure span.pic {
  width: 100%;
  height: 0;
  display: block;
  padding-top: 71.9%;
  background-position: center center;
  -webkit-background-size: cover;
  background-size: cover;
}



div.bg_contents div.bg_contents_inner div.howto_contents div.conts_inner div.instructor_wrap div.text_area {
  width: auto;
}

div.bg_contents div.bg_contents_inner div.howto_contents div.conts_inner div.instructor_wrap div.text_area p.read {
  width: auto;
  padding: 0 0 25px 0;
  font-size: 20px;
  color: #fff;
  text-align: center;
  line-height: 1.75;
  font-family: "游明朝体", "Yu Mincho", YuMincho, "ヒラギノ明朝 Pro W3", "Hiragino Mincho Pro", "Noto Serif JP", "HG明朝E","ＭＳ Ｐ明朝", "MS PMincho", serif;
}

/*
div.bg_contents div.bg_contents_inner div.howto_contents div.conts_inner div.instructor_wrap div.text_area p.text {
  width: auto;
  padding: 0 0 30px 0;
  font-size: 14px;
  color: #fff;
  line-height: 1.7;
  letter-spacing: 0.05em;
  font-family: "游明朝体", "Yu Mincho", YuMincho, "ヒラギノ明朝 Pro W3", "Hiragino Mincho Pro", "Noto Serif JP", "HG明朝E","ＭＳ Ｐ明朝", "MS PMincho", serif;
}
*/

div.bg_contents div.bg_contents_inner div.howto_contents div.conts_inner div.instructor_wrap div.text_area p.btn {
  width: 80.7%;
  margin: 0 auto;
}

div.bg_contents div.bg_contents_inner div.howto_contents div.conts_inner div.instructor_wrap div.text_area p.btn a {
  width: 100%;
  display: block;
  padding: 22px 0 21px 0;
  background-color: #EAEAEA;
  position: relative;
}

div.bg_contents div.bg_contents_inner div.howto_contents div.conts_inner div.instructor_wrap div.text_area p.btn a::after {
  content: "";
  width: 33px;
  height: 22px;
  background: transparent url(../../images/common/arrow_search_bk.png) no-repeat center center;
  -webkit-background-size: 100%;
  background-size: 100%;
  position: absolute;
  top: 50%;
  right: 5.8%;
  transform: translate(0, -50%);
  -webkit-transform: translate(0, -50%);
  -ms-transform: translate(0, -50%);
}

div.bg_contents div.bg_contents_inner div.howto_contents div.conts_inner div.instructor_wrap div.text_area p.btn a span {
  width: auto;
  display: block;
  margin: 0 5.9% 0 5.6%;
  font-size: 14px;
  line-height: 1.5;
  letter-spacing: 0.05em;
  font-weight: bold;
}



/*** style_wrap ***/
div.bg_contents div.bg_contents_inner div.howto_contents div.conts_inner div.style_wrap {
  width: auto;
  padding: 0 0 46px 0;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  flex-direction: column;
}

div.bg_contents div.bg_contents_inner div.howto_contents div.conts_inner div.style_wrap div.img_area {
  width: 80.7%;
  margin: 0 auto;
  order: 2;
}

div.bg_contents div.bg_contents_inner div.howto_contents div.conts_inner div.style_wrap div.img_area figure {
  width: auto;
}

div.bg_contents div.bg_contents_inner div.howto_contents div.conts_inner div.style_wrap div.img_area figure span.pic {
  width: 100%;
  height: 0;
  display: block;
  padding-top: 71.9%;
  background-position: center center;
  -webkit-background-size: cover;
  background-size: cover;
}


div.bg_contents div.bg_contents_inner div.howto_contents div.conts_inner div.style_wrap div.img_area figure span.caption {
  width: auto;
  display: block;
  padding: 10px 0 0 0;
  font-size: 14px;
  color: #fff;
  text-align: center;
  line-height: 1.7;
  letter-spacing: 0.05em;
  font-family: "游明朝体", "Yu Mincho", YuMincho, "ヒラギノ明朝 Pro W3", "Hiragino Mincho Pro", "Noto Serif JP", "HG明朝E","ＭＳ Ｐ明朝", "MS PMincho", serif;
}



div.bg_contents div.bg_contents_inner div.howto_contents div.conts_inner div.style_wrap div.text_area {
  width: auto;
  display: contents;
}

div.bg_contents div.bg_contents_inner div.howto_contents div.conts_inner div.style_wrap div.text_area p.read {
  width: auto;
  padding: 0 0 20px 0;
  font-size: 20px;
  color: #fff;
  text-align: center;
  line-height: 1.6;
  font-family: "游明朝体", "Yu Mincho", YuMincho, "ヒラギノ明朝 Pro W3", "Hiragino Mincho Pro", "Noto Serif JP", "HG明朝E","ＭＳ Ｐ明朝", "MS PMincho", serif;
  order: 1;
}

/*
div.bg_contents div.bg_contents_inner div.howto_contents div.conts_inner div.style_wrap div.text_area p.text {
  width: auto;
  padding: 0 0 20px 0;
  font-size: 14px;
  color: #fff;
  line-height: 1.7;
  letter-spacing: 0.05em;
  font-family: "游明朝体", "Yu Mincho", YuMincho, "ヒラギノ明朝 Pro W3", "Hiragino Mincho Pro", "Noto Serif JP", "HG明朝E","ＭＳ Ｐ明朝", "MS PMincho", serif;
}
*/

div.bg_contents div.bg_contents_inner div.howto_contents div.conts_inner div.style_wrap div.text_area ul.style {
  width: 90.4%;
  margin: 0 auto;
  padding: 40px 0 0 0;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  flex-wrap: wrap;
  order: 3;
}

div.bg_contents div.bg_contents_inner div.howto_contents div.conts_inner div.style_wrap div.text_area ul.style li {
  width: 46.8%;
  padding: 0 0 24px 0;
}

div.bg_contents div.bg_contents_inner div.howto_contents div.conts_inner div.style_wrap div.text_area ul.style li:nth-child(even) {
  margin: 0 0 0 6.4%;
}

div.bg_contents div.bg_contents_inner div.howto_contents div.conts_inner div.style_wrap div.text_area ul.style li a {
  width: 100%;
  display: block;
  border-radius: 5px;
  position: relative;
}

div.bg_contents div.bg_contents_inner div.howto_contents div.conts_inner div.style_wrap div.text_area ul.style li a::before {
  content: "";
  width: 14.3%;
  height: 14.2%;
  background: transparent url(../../images/common/arrow_search.png) no-repeat center center;
  -webkit-background-size: 100%;
  background-size: 100%;
  position: absolute;
  bottom: 9px;
  right: 7px;
  z-index: 1;
}

div.bg_contents div.bg_contents_inner div.howto_contents div.conts_inner div.style_wrap div.text_area ul.style li a::after {
  content: "";
  width: 100%;
  height: 100%;
  background-color: rgba(0, 0, 0, 0.5);
  border-radius: 5px;
  position: absolute;
  top: 0;
  left: 0;
}

div.bg_contents div.bg_contents_inner div.howto_contents div.conts_inner div.style_wrap div.text_area ul.style li a img {
  border-radius: 5px;
}

div.bg_contents div.bg_contents_inner div.howto_contents div.conts_inner div.style_wrap div.text_area ul.style li a span {
  width: 100%;
  display: block;
  font-size: 14px;
  color: #fff;
  text-align: center;
  line-height: 1.0;
  font-family: "游明朝体", "Yu Mincho", YuMincho, "ヒラギノ明朝 Pro W3", "Hiragino Mincho Pro", "Noto Serif JP", "HG明朝E","ＭＳ Ｐ明朝", "MS PMincho", serif;
  font-weight: 600;
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
  -webkit-transform: translate(-50%, -50%);
  -ms-transform: translate(-50%, -50%);
  z-index: 1;
}




/*============================
service_contents
============================*/
div.bg_contents div.bg_contents_inner div.service_contents {
  width: auto;
  position: relative;
}

/*
div.bg_contents div.bg_contents_inner div.service_contents::after {
  content: "";
  width: 100%;
  height: 100%;
  margin: 0 auto;
  background: transparent url(../../images/top/bg_line06_sp.png) no-repeat center top;
  -webkit-background-size: cover;
  background-size: 100% auto;
  position: absolute;
  top: 0;
  left: 0;
  right: 0;
  z-index: 1;
}
*/

div.bg_contents div.bg_contents_inner div.service_contents div.conts_inner {
  width: auto;
  padding: 55px 0 0 0;
  position: relative;
  z-index: 2;
}

div.bg_contents div.bg_contents_inner div.service_contents div.conts_inner h3 {
  width: auto;
  padding: 0 0 25px 0;
  font-size: 28px;
  color: #fff;
  text-align: center;
  line-height: 1.2;
  font-family: 'Libre Baskerville', serif;
}

div.bg_contents div.bg_contents_inner div.service_contents div.conts_inner ul {
  width: auto;
}

div.bg_contents div.bg_contents_inner div.service_contents div.conts_inner ul li {
  width: auto;
}

div.bg_contents div.bg_contents_inner div.service_contents div.conts_inner ul li a {
  width: auto;
  display: block;
  position: relative;
}

div.bg_contents div.bg_contents_inner div.service_contents div.conts_inner ul li a:hover {
  opacity: 1;
}

div.bg_contents div.bg_contents_inner div.service_contents div.conts_inner ul li a div.bg_img_bk {
  width: 100%;
  height: 100%;
  background-color: rgba(0, 0, 0, 0.42);
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  justify-content: center;
  align-items: center;
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
  -webkit-transform: translate(-50%, -50%);
  -ms-transform: translate(-50%, -50%);
}

div.bg_contents div.bg_contents_inner div.service_contents div.conts_inner ul li a dl {
  width: 90.3%;
  margin: 0 auto;
  position: relative;
}

div.bg_contents div.bg_contents_inner div.service_contents div.conts_inner ul li a dl::after {
  content: "";
  width: 33px;
  height: 23px;
  background: transparent url(../../images/common/arrow_search.png) no-repeat center center;
  -webkit-background-size: 100%;
  background-size: 100%;
  position: absolute;
  top: 50%;
  right: 0;
  transform: translate(0, -50%);
  -webkit-transform: translate(0, -50%);
  -ms-transform: translate(0, -50%);
}

div.bg_contents div.bg_contents_inner div.service_contents div.conts_inner ul li a dl dt {
  width: auto;
  padding: 0 0 5px 0;
  font-size: 22px;
  color: #fff;
  line-height: 1.4;
  letter-spacing: 0.1em;
  font-family: 'Libre Baskerville', serif;
}

div.bg_contents div.bg_contents_inner div.service_contents div.conts_inner ul li a dl dd {
  width: auto;
  font-size: 14px;
  color: #fff;
  line-height: 1.0;
  font-family: "游明朝体", "Yu Mincho", YuMincho, "ヒラギノ明朝 Pro W3", "Hiragino Mincho Pro", "Noto Serif JP", "HG明朝E","ＭＳ Ｐ明朝", "MS PMincho", serif;
}