@charset "utf-8";

/* from product.css*/

.nav-product-1st {
  margin: 0 0 30px;
  border-bottom: 5px solid #329071;
}

.nav-product-1st-list {
  display: -webkit-flex;
  display: flex;
  -webkit-justify-content: space-between;
          justify-content: space-between;
  list-style: none;
  height: 60px;
  overflow: hidden;
  margin: 0;
  padding: 0;
}

.nav-product-1st-list__item {
  display: table;
  width: 19%;
  margin: 0 0 10px;
}

.nav-product-1st-list__item.is-active {
  margin: 0;
}

.nav-product-1st-list__item a {
  display: table-cell;
  height: 50px;
  vertical-align: middle;
  padding: 0 10px;
  border-radius: 5px;
  font-size: 16px;
  text-align: center;
  text-decoration: none;
  background: #fff;
  box-sizing: border-box;
}

.nav-product-1st-list__item.is-active a {
  height: 60px;
  border-radius: 5px 5px 0 0;
  color: #fff;
  background: #329071;
}

.nav-product-1st-list__item a:hover {
  color: #fff;
  background: #329071;
}

.nav-product-1st-list__item a img {
  display: none;
}


@media screen and (max-width: 768px) {
  .nav-product-1st {
    margin: 0 0 10px;
    border: none;
  }
  
  .nav-product-1st-list {
    height: auto;
  }
  
  .nav-product-1st-list__item {
    display: none;
    width: auto;
    margin: 0;
  }
  
  .nav-product-1st-list__item.is-active {
    display: block;
  }
  
  .nav-product-1st-list__item a {
    display: flex;
    align-items: center;
    height: auto;
    padding: 0;
    border-radius: 0;
    font-size: 18px;
  }

  .nav-product-1st-list__item.is-active a {
    height: auto;
    border-radius: 0;
    color: inherit;
    background: none;
  }
  
  .nav-product-1st-list__item a span:first-child {
    display: block;
    padding: 0 15px 0 0;
  }
  
  .nav-product-1st-list__item a img {
    display: block;
    width: 120px;
  }
}





/* common.css*/

.cs-titlebar--type-b { display:none; }

.header-nav-01__item:nth-child(9) > span:after {
	left: 0;
	width: 100%;
	}

.clearfix:after,
.contents section:after {
	content:" ";
	display:block;
	clear:both;
	}

.contents {
	max-width: 1000px;
	}

.contents dd,
.contents ul,
.contents ol,
.contents li {margin: 0; padding: 0; list-style: none;}

.nav-product-1st {
	border-bottom: 5px solid #d0dce0;
	}
/*.nav-product-1st-list__item {
	width: 16%;
	}*/
.nav-product-1st-list__item a {
	font-size: 14px;
	background: #f4f9fd;
	line-height: 1.2;
	}
.nav-product-1st-list__item:last-child a {
	background: #e68511!important;
	color: #fff!important;
	}
.nav-product-1st-list__item.is-active a,
.nav-product-1st-list__item a:hover {
	color: #000;
	background: #d0dce0;
	}
.nav-product-1st-list__item:last-child a:hover {
	opacity: 0.8;
	}
@media screen and (max-width: 768px) {
.nav-product-1st {
	display: none;
	}
}


.contents section {
	margin: 0 auto 60px;
	}
@media screen and (max-width: 768px) {
.contents section {
	margin-bottom: 40px;
	width: 100%;
	}
}
.contents .bd_btm {
	border-bottom: 1px #ddd solid;
	}
.contents section.bd_btm {
	padding-bottom: 60px;
	}
@media screen and (max-width: 768px) {
.contents section.bd_btm {
	padding-bottom: 40px;
	}
}

.contents .w800 {
	padding: 0 100px;
	}
.contents .w700 {
	padding: 0 150px;
	}
@media screen and (max-width: 768px) {
.contents .w800,
.contents .w700 {
	padding: 0;
	}
}

@media screen and (max-width: 768px) {
.contents .wide {
	margin-right: -15px;
	margin-left: -15px;
	padding-right: 15px;
	padding-left: 15px;
	}
}

.contents .btn-01 {
	width: 320px;
	}
@media screen and (max-width: 768px) {
.contents .btn-01 {
	width: 90%;
	}
}

.contents h2:not(.ttl-01) {
	margin: 0 0 1em;
	font-size: 20px;
	text-align: center;
	font-weight: normal;
	}
@media screen and (max-width: 768px) {
.contents h2:not(.ttl-01) {
	font-size: 18px;
	}
}

.contents p {
	margin: 0 0 1em;
	}
.contents p:last-child,
.contents p.mb0 {
	margin: 0;
	}

.contents .t_c {
	text-align: center;
	}
.contents .t_r {
	text-align: right;
	}

.contents .cl_or {
	color: #f39700;
	}

.contents .kv {
	margin-bottom: 30px;
	}
@media screen and (max-width: 768px) {
.contents .kv {
	margin: -30px -15px 30px;
	}
}

.contents .note {
	text-align: right;
	}
@media screen and (max-width: 768px) {
.contents .note {
	text-align: left;
	}
}



/*.colum*/

@media screen and (min-width: 767px) {
.colum .clm2,
.colum .clm3 {
	display: flex;
	justify-content: space-between;
	margin-bottom: 1em;
	}
.colum .clm2 li {
	width: 49%;
	}
.colum .clm3 li {
	width: 32%;
	}
.colum .note {
	margin-top: 60px!important;
	}
}
@media screen and (max-width: 768px) {
.colum .clm2 li,
.colum .clm3 li {
	margin-bottom: 1em;
	}
.colum .note {
	margin-top: 40px!important;
	}
}

