@charset "utf-8";

/*----------------------------------------
    index
----------------------------------------*/
#contents {
  padding-top: 80px;
  background: none;
}
/*  .mainimg
----------------------------------------*/
#contents .mainimg {
  width: 100%;
  max-width: 1300px;
  margin: 0 auto;
}

/*  .news
----------------------------------------*/
#contents .news:after {
  content:".";display:block;visibility:hidden;height:0.1px;font-size:0.1em;line-height:0;clear:both;
}
#contents .news {
  width: 100%;
  max-width: 1300px;
  margin: 0 auto;
  background: #fff;
  position: relative;
}
#contents .news h2 {
  color: #fff;
  background-color: #9B8367;
  width: 10%;
  font-size: 134%;
  text-align: center;
  padding: 7px 0;
  float: left;
}
#contents .news .news_area {
  border-top: 1px solid #dddddd;
  width: 90%;
  float: left;
}
#contents .news .news_area .bxslider li a {
  color: #333333;
  text-decoration: none;
  padding-left: 20px;
  font-size: 109%;
}
#contents .news .news_area .bxslider li a span {
  display: inline-block;
}
#contents .news .news_area .bxslider li a span.date {
  margin-right: 35px;
  color: #666666;
}
#contents .news .news_area .to_list {
  max-width: 80px;
  width: 10%;
  float: left;
  position: absolute;
  right: 0;
  top: 10px;
}
#contents .news .news_area .to_list a {
  font-size: 109%;
  color: #333333;
  text-decoration: none;
  background: url(../../img/index/bg-arrow.png) no-repeat right center;
  padding-right: 13px
}
#contents .news .news_area .to_list a:hover,
#contents .news .news_area .bxslider li a:hover span {
  text-decoration: underline;
}
/*  .campain
----------------------------------------*/

#contents .campain {
  width: 100%;
  max-width: 1200px;
  margin: 0 auto;
}
#contents .campain h2 {
	margin: 60px 0 20px;
	text-align: center;
}
#contents .campain .campain_area li {
	width: 230px;
	float: left;
	padding: 15px 20px 25px;
	background: #ffffff;
    position: relative;
}
#contents .campain .campain_area li a {
	color: #333333;
	text-decoration: none;
}
#contents .campain .campain_area li:before {
    content: "";
    position: absolute;
    width: 9px;
    height: 7px;
    bottom: 25px;
    right: 10px;
	background: url(../../img/index/bg-arrow.png) no-repeat 98% 97%;
}
#contents .campain .campain_area li.common_campain:before {
    content: "";
    position: absolute;
    width: 9px;
    height: 7px;
    bottom: 25px;
    right: 10px;
	background: none !important;
}

#contents .campain .campain_area li:first-child {
	margin-left: 0;
}
#contents .campain .campain_area li .title {
	font-size: 150%;
	font-weight: normal;
	margin-bottom: 8px;
}
#contents .campain .campain_area li .tag span {
	color: #ffffff;
	padding: 4px 5px;
	font-size: 94%;
}
#contents .campain .campain_area li .blue {
	background: #00A3D9;
}
#contents .campain .campain_area li .red {
	background: #FF4000;
}
#contents .campain .campain_area li .green {
	background: #00B259;
}

#contents .campain .campain_area li .gray {
  background: #afafaf;
}

#contents .campain .campain_area li .txt {
	margin-top: 25px;
}
#contents .campain .campain_area li .txt p {
	margin-bottom: 15px;
}
#contents .campain .campain_area li .txt p.specail {
	font-size: 135%;
}

/*  .topics
----------------------------------------*/

#contents .topics {
  width: 100%;
  max-width: 1200px;
  margin: 0 auto 30px;
}
#contents .topics h2 {
	margin: 60px 0 20px;
	text-align: center;
}
#contents .topics_area {
  position: relative;
}
.topics_area .prev_area {
  position: absolute;
  top: 50%;
  left: -28px;
  width: 20px;
  margin-top: -20px;
  z-index: 1000;
  cursor: pointer;
}
.topics_area .next_area {
  position: absolute;
  top: 50%;
  right: -28px;
  width: 20px;
  margin-top: -20px;
  z-index: 1000;
  cursor: pointer;
}
#contents .topics .topics_area li {
	float: left;
}
#contents .topics .topics_area li img {
  width: 100%;
}
/*  .info
----------------------------------------*/

#contents .info {
  width: 100%;
  max-width: 1200px;
  margin: 0 auto;
	display: table;
	text-align: center;
}
#contents .info .title {
  font-size: 254%;
  margin-bottom: 10px;
  font-weight: normal;
}
#contents .info li {
	display: inline-block;
}
#contents .info li a {
	border: 1px #9C8365 solid;
	display: block;
	color: #9C8365;
	text-decoration: none;
	padding: 9px 0;
	margin: 0 2px;
	width: 200px;
  position: relative;
	font-size: 117%;
	background: #ffffff;
}
#contents .info li a span {
	background: url(../../img/index/bg-arrow02.png) no-repeat 94% center;
	background-size: 9px;
	display: block;
}
#contents .info p {
  font-size: 117%;
	line-height: 2;
	margin-bottom: 33px;
}
#contents .info .beginner_area {
  display: table-cell;
  vertical-align: middle;
	background: url(../../img/index/bg-beginner_area.jpg) no-repeat left top;
	width: 50%;
	padding: 45px 10px 40px;
}
#contents .info .company_area {
  display: table-cell;
  vertical-align: middle;
	background: url(../../img/index/bg-company_area.jpg) no-repeat left top;
	width: 50%;
	color: #ffffff;
}
#contents .info .company_area li a {
	border: 1px #ffffff solid;
	color: #ffffff;
	background: none;
}
#contents .info .company_area li a span {
	background: url(../../img/index/bg-arrow03.png) no-repeat 94% center;
	background-size: 9px;
}

/*  .customer
----------------------------------------*/

#contents .customer {
  width: 100%;
  max-width: 1200px;
  margin: 25px auto;
	text-align: center;
	padding: 55px 0;
	background: #ffffff url(../../img/index/bg-customer.jpg) no-repeat right bottom;
}
#contents .customer .img {
  margin-bottom: 30px;
}
#contents .customer .title {
	margin-bottom: 20px;
	font-size: 217%;
	line-height: 1.6;
	font-weight: normal;
}
#contents .customer p {
	font-size: 117%;
	line-height: 2.5;
}

/*  .sns
----------------------------------------*/

#contents .sns {
  width: 1030px;
  margin: 0 auto;
}
#contents .sns h2 {
	text-align: center;
	margin: 65px 0 30px;
}
/*#contents .sns .news_area {
	float: left;
	width: 460px;
	height: 320px;
	overflow-y: scroll;
	background: #ffffff;
	border:1px #DCDCD6 solid;
	padding: 20px;
}*/
#contents .sns .news_area {
	float: left;
	width: 500px;
}
#contents .sns .facebook {
	float: right;
	width: 500px
}
#contents .btn-mail {
	text-align: center;
	margin-top: 60px;
}

@media screen and (max-width: 1200px) {
#contents .campain {
  width: 100%;
  max-width: 1200px !important;
}
#contents .info li a {
	width: 150px;
}
#contents .customer {
	background-size: 170px;
}
#contents .sns {
  width: 100%;
}
#contents .sns .news_area {
	float: none;
	margin: 0 auto 20px;
}
#contents .sns .facebook {
	float: none;
	margin: 0 auto;
}
.topics_area .prev_area {
  left: 0;
}
.topics_area .next_area {
  right: 1px;
}
#contents .btn-mail img{
	width: 100%;
	max-width: 800px;
}
}