@charset "utf-8";

/*===================================================================
	index.htm
===================================================================*/

/* ------ mainSection ------ */
#contents .mainSection {
  width: 960px;
  margin: 0 auto 40px; }

#contents .mainSection .mainvisual_guide {
  position: relative;
  z-index: 500;
  width: 1200px;
  height: 256px;
  margin: 0 -120px;
  overflow: hidden; }

#contents .mainSection .mainvisual_guide #pagination_guide {
  position: absolute;
  top: 72px;
  z-index: 990;
  width: 1200px; }

#contents .mainSection .mainvisual_guide #pagination_guide li {
  position: absolute;
  z-index: 999;
  width: 40px;
  cursor: pointer; }

#contents .mainSection .mainvisual_guide #pagination_guide li#mainPrev {
  left: 0; }

#contents .mainSection .mainvisual_guide #pagination_guide li#mainNext {
  right: 0; }

#contents .mainSection .mainvisual_guide #slide_guide {
  position: relative;
  left: -1200px;
  top: 0;
  z-index: 980;
  width: 3600px;
  height: 256px;
  overflow: hidden;
  }

#contents .mainSection .mainvisual_guide #slide_guide li {
  float: left; }
#contents .mainSection .mainvisual_guide .slide_guide_s{
  display: none;
}
.mainSection #mainList {
  text-align: center; }

.mainSection #mainList li {
	z-index:970;
	display:inline-block;
	/display:inline;
	/zoom:1;

	width:15px;
	height:15px;
	padding:0 5px;
	cursor:pointer;
}


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

	#contents {
	width: 100%;
	overflow-x: hidden;
	}

}


/*幅狭対応部分も残しておく*/

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

	body {
		width: 100% !important;
	}

	#contents {
		/*padding: 0 2%;*/
		padding: 0;
	}
	#contents .mainSection{
	  width: auto;
	  /*margin: 0 -2%;*/
	  margin: 0 auto;
	}

}

@media only screen and (max-width: 666px) {
	#contents .mainSection .mainvisual_guide{
	  width: 100%;
	  height: auto;
        max-height: 260px;
	  margin: 0; 
	}
	#contents .mainSection .mainvisual_guide #pagination_guide{
	  display: none;
	}
	#contents .mainSection .mainvisual_guide #slide_guide{
	  display: none;
	}
	#contents .mainSection #mainList{
	  display: none;
	}
	#contents .mainSection .mainvisual_guide .slide_guide_s{
		display: block;
	  position: relative;
	  width: 9999px;
	}
	#contents .mainSection .mainvisual_guide .slide_guide_s li{
	  float: left;
	  height: 100%;
	}
	#contents .mainSection .mainvisual_guide .slide_guide_s li img{
		width: 100%;
	  max-width: 100%;
	  height: auto;
	}

}