@charset "utf-8";
/* CSS Document */

/* 全てに適用するCSS */
.content{
	max-width: 1200px;
	text-align: center;
	margin: 0 auto;
}
.img_mainBOX{
	max-width: 1200px;
	text-align: center;
	margin: 0 auto;
}
.img_mainBOX img{
	width: 100%;
	height: auto;
	margin: 0;
	float: left;
}
.icon_BOX{
	max-width: 1200px;
	text-align: center;
	margin: 0 auto;
}
.icon_BOX img{
	width: 33%;
	height: auto;
	float: left;
}
.icbg{
	width: 1200px;
	margin: 0 auto;
	background-image: url(img/bg.gif);
	background-repeat: repeat-y;
	background-size:contain;
}

.container {
  margin: 0 auto;
  text-align: left;
}
.container input {
  display: none;
}
.container label {
  color: #4776AF;
  cursor: pointer;
  padding: 0 10px;
}
.container label:hover {
  color: #ccc;
}
.container .top {
  padding: 10px;
  background: #fff;
}
.container .btm {
  transition: 0.2s;
  height: 0;
  overflow: hidden;
  padding: 0 10px;
}
.container .btn {
  text-align: left;
  display: block;
  width: 80px;
  margin: 0;
}
.container .btn3 {
  text-align: left;
  display: block;
  width: 80px;
  margin: 0;
}
.container .btn4 {
  text-align: left;
  display: block;
  width: 80px;
  margin: 0;
}
.container .btn2 {
  text-align: center;
  display: block;
  width: 80px;
  margin: 0 auto;
}
.container input:checked + .btm {
  height: auto;
  padding: 0 10px 10px 10px;
  background: #fff;
}
/* ウィンドウ幅が0〜479pxの場合に適用するCSS */
@media screen and ( max-width:479px )
{
	.content{
	max-width: 100%;
	text-align: center;
	margin: 0 auto;
}
	.img_mainBOX{
	max-width: 100%;
	text-align: center;
}
.icon_BOX{
	max-width: 100%;
	text-align: center;
	margin: 0 auto;
}
	.icbg{
	width: 100%;
	margin: 0 auto;
	background-image: url(img/bg.gif);
	background-repeat: repeat-y;
	background-size:contain;
}
}