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

#topImage {
background-image: url(images/topImage.jpg);
}
h2 {
background-image: url(/flechir-iwatuki/images/m03_on.png);
}
input[name="tab_item"] {
  display: none;
}
.tab_item {
  padding:15px 0;
  border-bottom: 3px solid #e2953d ;
  background-color: #f1f1f1;
  text-align: center;
  color: #e2953d;
  display: inline-block;
  font-weight: bold;
  transition: all 0.2s ease;
  margin-left: auto;
  margin-right: auto;
  margin-bottom: 20px;
  margin-top: 20px;
}
.tab_item:hover {
  opacity: 0.75;
}
.tab_content {
  display: none;
  padding: 1em 1em 0;
  clear: both;
  overflow: hidden;
}
#tab1:checked ~ #tab1_content,
#tab2:checked ~ #tab2_content,
#tab3:checked ~ #tab3_content {
  display: block;
}

.tab_container input:checked + .tab_item {
  background-color: #e2953d ;
  color: #fff;
}

@media print, screen and (min-width: 641px) {

.tab_item {
  width: calc(80%/3);
    font-size: 18px;
  }

#tab1_content {
margin-bottom: 50px;
}
#tab1_content dl {
margin-bottom: 50px;
overflow: hidden;
}
#tab1_content dt {
width: 20%;
float: left
}
#tab1_content dd {
float: right;
width: 76%;
}
#tab1_content dd p {
margin-bottom: 20px;
text-align: left;
}
#tab1_content dd ul {
clear: both;
}
#tab1_content dd li {
width: 48%;
text-align: left;
}
#tab1_content dl .btn {
width: 100%;
float: left;
margin-bottom: 20px;
margin-top: 20px;
}
#tab1_content dl .btn a {
background-color: #fbc300;
padding-top: 8px;
padding-bottom: 8px;
border-radius: 4px;
color: #fff;
text-align: center;
width: 100%;
float: left;
transition : all 0.3s ease 0s;
}
#tab1_content dl .btn a:before {
 content: url(images/icon_download.png);
 margin: 10px;
 position: relative;
top:2px;
}
#tab1_content dl .btn a:hover {
background-color: #e2953d;
}

#tab2_content .box {
margin-bottom: 50px;
}
#tab2_content .box dl.title {
text-align: center;
margin-bottom: 30px;
}
#tab2_content .box dl.title dt {
font-size: 42px;
padding: 0 40px;
}
#tab2_content .box dl.title dt:before {
content: url(/service/images/ttl_point_l.png);
margin: 10px;
position: relative;
top: 8px;
}
#tab2_content .box dl.title dt:after {
content: url(/service/images/ttl_point_r.png);
margin: 10px;
position: relative;
top: 8px;
}
#tab2_content .box dl.title dd.sub {
font-size: 18px;
color: #666666;
margin-top: 10px;
}
#tab2_content .box dl.title dd {
line-height: 1.8em;
}
#tab2_content ul.plan {
display: flex;
flex-wrap: wrap;
justify-content: space-between;
position: relative;
margin-bottom: 40px;
}
#tab2_content .plan li {
 width: 30%;
 border-radius: 4px 4px 4px 4px;
 border: 2px solid #e2953d;
 padding: 12px;
}
#tab2_content .plan dt {
font-size: 20px;
font-weight: bold;
border-bottom: 1px solid #e2953d;
margin-bottom: 10px;
}
	#tab2_content .plan .left {
 width: 30%;
 }
#tab2_content .plan .right {
 width: 68%;
 text-align: left;
 }
	#tab2_content .service {
 background-color: #efefef;
 padding: 40px;
 }
 #tab2_content .service h3 {
 border-bottom: 1px solid #CCCCCC;
 padding-bottom: 10px;
 margin-bottom: 20px;
 }
	#tab2_content .servicelist {
 display: flex;
flex-wrap: wrap;
justify-content: space-between;
position: relative;
margin-bottom: 30px;
 }
	#tab2_content .servicelist li {
  width: 30%;
  }
	#tab2_content .servicelist li h4,
 	#tab2_content .result h4{	
 font-size: 18px;
 text-align: left;
 }
 #tab1_content .servicelist li img {
 margin-bottom: 10px;
 }
 #tab2_content .servicelist li p {
 text-align: left
 }
	#tab2_content .arrow {
 width: 10%;
 margin-right: auto;
 margin-left: auto;
 margin-bottom: 40px;
  }
#tab2_content .result {
width: 50%;
margin-right: auto;
 margin-left: auto;
}
#tab2_content .result p {
text-align: left;
margin-bottom: 10px;
}
#tab3_content {
margin-bottom: 50px;
}
#tab3_content p {
text-align: left;
margin-bottom: 20px;
}
#tab3_content .torikumi {
margin-bottom: 50px;
}
#tab3_content .torikumi li {
width: 23%;
margin-bottom: 10px;
}
#tab3_content .event li {
width: 48%;
}
#tab3_content .event li dl {
line-height: 2em;
margin-bottom: 5px;
overflow: hidden;
}
#tab3_content .event li dl.title {
background-color: #E6E6E6;
}
#tab3_content .event li dl.bgc {
background-color: #fcf3d9;
}
#tab3_content .event li dt {
color: #e2953d;
width: 20%;
text-align: right;
float: left;
}
#tab3_content .event li dd {
width: 75%;
text-align: left;
float: right;
}
#tab3_content .event li .photos {
display: flex;
flex-wrap: wrap;
justify-content: space-between;
}
#tab3_content .event li .photos li {
width: 32%;
margin-bottom: 2rem;
}
#tab3_content .event li .photos li span {
display: block;
text-align: center;
line-height: 1;
}
#tab3_content .event li .photos:after {
 content: "";
display: block;
width: 32%; 
height: 0;
}

}

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

.tab_item {
  width: calc(90%/3);
    font-size: 16px;
  }
#tab1_content {
margin-bottom: 50px;
}
#tab1_content dl {
margin-bottom: 50px;
overflow: hidden;
}
#tab1_content dt {
width: 40%;
margin-left: auto;
margin-right: auto;
}
#tab1_content dd {
width: 100%;
}
#tab1_content dd p {
margin-bottom: 20px;
text-align: left;
}
#tab1_content dd ul {
clear: both;
}
#tab1_content dd li {
width: 100%;
text-align: left;
}
#tab1_content dl .btn {
width: 80%;
margin-left: auto;margin-right: auto;
}
#tab1_content dl .btn a {
background-color: #fbc300;
padding-top: 8px;
padding-bottom: 8px;
border-radius: 4px;
color: #fff;
text-align: center;
width: 100%;
float: left;
transition : all 0.3s ease 0s;
display: block;
margin-bottom: 20px;
}
#tab1_content dl .btn a:before {
 content: url(images/icon_download.png);
 margin: 10px;
 position: relative;
top:2px;
}
#tab1_content dl .btn a:hover {
background-color: #e2953d;
}
#tab2_content .box {
margin-bottom: 50px;
}
 #tab2_content .box h3 {
 border-bottom: 1px solid #CCCCCC;
 padding-bottom: 10px;
 margin-bottom: 20px;
 text-align: center;
 line-height: 1.5em;
 }
 #tab2_content .box dl.title {
text-align: center;
margin-bottom: 30px;
}
#tab2_content .box dl.title dt {
font-size: 24px;
padding: 0 0px;
}
#tab2_content .box dl.title dd.sub {
font-size: 16px;
color: #666666;
margin-bottom: 10px;
}
#tab2_content .box dl.title dd {
line-height: 1.8em;
}
#tab2_content ul.plan {
display: flex;
flex-wrap: wrap;
justify-content: space-between;
position: relative;
margin-bottom: 40px;
}
#tab2_content .plan li {
 width: 100%;
 border-radius: 4px 4px 4px 4px;
 border: 2px solid #e2953d;
 padding: 12px;
 margin-bottom: 20px;
}
#tab2_content .plan dt {
font-size: 20px;
font-weight: bold;
border-bottom: 1px solid #e2953d;
margin-bottom: 10px;
}
	#tab2_content .plan .left {
 width: 30%;
 }
#tab2_content .plan .right {
 width: 68%;
 text-align: left;
 }
	#tab2_content .service {
 background-color: #efefef;
 padding: 12px;
 }
 #tab2_content .service h3 {
 border-bottom: 1px solid #CCCCCC;
 padding-bottom: 10px;
 margin-bottom: 20px;
 text-align: center;
 line-height: 1.5em;
 }
	#tab2_content .servicelist {
 display: flex;
flex-wrap: wrap;
justify-content: space-between;
position: relative;
margin-bottom: 30px;
 }
	#tab2_content .servicelist li {
  width: 100%;
  margin-bottom: 1rem;
  }
	#tab2_content .servicelist li h4,
 	#tab2_content .result h4{	
 font-size: 18px;
 text-align: left;
 }
 #tab1_content .servicelist li img {
 margin-bottom: 10px;
 }
 #tab2_content .servicelist li p {
 text-align: left
 }
	#tab2_content .arrow {
 width: 30%;
 margin-right: auto;
 margin-left: auto;
 margin-bottom: 40px;
  }
#tab2_content .result {
width: 80%;
margin-right: auto;
 margin-left: auto;
}
#tab2_content .result p {
text-align: left;
margin-bottom: 10px;
}
#tab3_content {
margin-bottom: 50px;
}
#tab3_content p {
text-align: left;
margin-bottom: 20px;
}
#tab3_content .torikumi {
margin-bottom: 50px;
}
#tab3_content .torikumi li {
width: 48%;
margin-bottom: 20px;
}
#tab3_content .event li {
width: 100%;
margin-bottom: 20px;
}
#tab3_content .event li dl {
line-height: 2em;
margin-bottom: 5px;
overflow: hidden;
}
#tab3_content .event li dl.title {
background-color: #E6E6E6;
}
#tab3_content .event li dl.bgc {
background-color: #fcf3d9;
}
#tab3_content .event li dt {
color: #e2953d;
width: 20%;
text-align: right;
float: left;
}
#tab3_content .event li dd {
width: 75%;
text-align: left;
float: right;
}
#tab3_content .event li .photos {
display: flex;
flex-wrap: wrap;
justify-content: space-between;
}
#tab3_content .event li .photos li {
width: 48%;
margin-bottom: 2rem;
}
#tab3_content .event li .photos li span {
display: block;
text-align: center;
}
#tab3_content .event li .photos:after {
 content: "";
display: block;
width: 48%; 
height: 0;
}

}