@charset "utf-8";

.pc {
	display: block;
}
.sp {
	display: none;
}

#col1_common_main_box {
    width:940px;
    margin:0 auto 40px;
    padding:10px;
    font-size:15px;
    background-color:rgba(255, 255, 255, 0.8);
}

#col1_common_main_box #page_title{
  width: 940px;
  height: auto;
  margin-bottom: 30px;
}

.main,
.main li {
  margin: 0;
  padding: 0;
  list-style: none;
}
.main {
  margin-bottom: 8px;
}
.main li {
  width: 940px;
  height: 529px;
  overflow: hidden;
}
.main li.item2,
.main li.item3,
.main li.item4 {
  display: none;
}
.main li:hover img {
  opacity: 0.8;
  filter: alpha(opacity=80);
  -ms-filter: "alpha(opacity=80)";
}
.thumb,
.thumb li {
  margin: 0;
  padding: 0;
  list-style: none;
}
.thumb li {
  float: left;
  display: inline-block;
  width: 229px;
  height: 129px;
  overflow: hidden;
  cursor: pointer;
  vertical-align: top;
  margin-left: 8px;
  margin-bottom: 30px;
}
.thumb li:first-child {
  margin-left: 0px;
}
.thumb li img {
  width: 100%;
  height: auto;
}
.thumb li:hover img {
  opacity: 0.8;
  filter: alpha(opacity=80);
  -ms-filter: "alpha(opacity=80)";
}

h3{
    margin:0 auto 30px;
    padding:10px;
    background-color:#000;
    color:#fff;
    font-size:18px;
    font-weight:bold;
}

.txt01,
#txt02{
    padding:5px;
    color:#000;
    font-size:16px;
    line-height:26px;
}
.txt01l{
    padding:5px;
    color:#000;
    font-size:25px;
    line-height:35px;
}

#txt01_txt{
  width: 760px;
  height: 104px;
  margin: 0 auto 30px;
}
.txt01 img,
#txt01_txt img{
  width: 100%;
  height: auto;
}

#txt01_img{
  position:relative;
  width: 940px;
  height: 620px;
  margin: 0 auto 60px;
}
#txt01_img img{
  position:absolute;
  width: 460px;
  height: auto;
}
#txt01_img img#img01{
  top:0;
  left:0;
}
#txt01_img img#img02{
  top:320px;
  left:0;
}
#txt01_img img#img03{
  top:0;
  right:0;
}

#txt01_img #img01txt{
  position:absolute;
  width: 450px;
  height: 20px;
  padding:5px;
  top:270px;
  left:0;
  text-align: right;
}
#txt01_img #img02txt{
  position:absolute;
  width: 450px;
  height: 20px;
  padding:5px;
  top:590px;
  left:0;
  text-align: right;
}
#txt01_img #img03txt{
  position:absolute;
  width: 450px;
  height: 20px;
  padding:5px;
  top:590px;
  right:0;
  text-align: right;
}

#txt02_txt{
  width: 410px;
  height: 58px;
  margin: 0 auto;
}
#txt02_txt img{
  width: 100%;
  height: auto;
}

#tel_img{
  width: 900px;
  height: 50px;
  margin: 0 auto 60px;
}
#tel_img img{
  width: 100%;
  height: auto;
}

.checkbox-input{
  display: none;
}
.checkbox-parts{
  padding-left: 20px;
  position:relative;
  margin-right: 20px;
}
.checkbox-parts::before{
  content: "";
  display: block;
  position: absolute;
  top: 0;
  left: 0;
  width: 15px;
  height: 15px;
  border: 1px solid #999;
  border-radius: 4px;
}
.checkbox-input:checked + .checkbox-parts{
  color: #11b85e;
}
.checkbox-input:checked + .checkbox-parts::after{
  content: "";
  display: block;
  position: absolute;
  top: -5px;
  left: 5px;
  width: 7px;
  height: 14px;
  transform: rotate(40deg);
  border-bottom: 3px solid #11b85e;
  border-right: 3px solid #11b85e;
}


@media screen and (max-width: 414px) {
	.pc {
		display: none;
	}
	.sp {
		display: block;
	}
	
	#col1_common_main_box {
	    width:90%;
	}
	#col1_common_main_box #page_title{
	  width: 100%;
	}
	
	.main {
	  width: 100%;
	  margin-bottom: 0px;
	}
	.main li {
	  width: 100%;
	  height: auto;
	  overflow: hidden;

	}
	.main li img {
	  width: 100%;
	}
	.thumb li {
	  float: left;
	  display: inline-block;
	  width: 25%;
	  height: auto;
	  margin-left: 0px;
	}
	.thumb li:first-child {
	  margin-left: 0px;
	}
	
	.txt01 img{
		width:100%;
		height:auto;
	}
	#txt01_txt{
	  width: 100%;
	  height: auto;
	}
	
	#txt01_img{
	  position:static;
	  width: 100%;
	  height: auto;
	  margin: 0 auto 60px;
	}
	#txt01_img img{
	  position:static;
	  width: 100%;
	  height: auto;
	}
	
	#txt01_img #img01txt,
	#txt01_img #img02txt,
	#txt01_img #img03txt{
	  position:static;
	  width: 100%;
	  height: auto;
	  padding:5px;
	  text-align: left;
	  color:#000;
	}
	
	#txt02_txt{
	  width: 100%;
	  height: auto;
	  margin: 0 auto;
	}
	#txt02_txt img{
	  width: 100%;
	  height: auto;
	}
	
	#tel_img{
	  width: 100%;
	  height: auto;
	  margin: 0 auto 60px;
	}
	#tel_img img{
	  width: 100%;
	  height: auto;
	}
}