/* CSS Generated by Primer - primercss.com */
@charset "UTF-8";


/* --------------------------------
Style
-------------------------------- */
/* tab */
.tabs .mapImg { margin-bottom: 50px; }
.tabs { margin-top: 50px;padding-bottom: 40px;width: auto;padding: 0 15px;margin: 0 auto;}
.tab_item { width: calc(100%/3 - 20px);background-color: #363C33;text-align: center;display: block;float: left;text-align: center;transition: all 0.2s ease;border-radius: 50px;padding: 10px;letter-spacing: 0.05em; }
input[name="tab_item"] { display: none; }
.tab_content { display: none;padding: 30px 0 0;clear: both;overflow: hidden; position: relative; }
.tab_content::before {
  content: "";
  position: absolute;
  top: 0;
  left: 16%;
  margin-left: -10px;
  border: 10px solid transparent;
  border-top: 15px solid #476539;
}

#programming_content.tab_content::before { left: 49.5%; }
#design_content.tab_content::before { left: 83%; }


#all:checked ~ #all_content,
#programming:checked ~ #programming_content,
#design:checked ~ #design_content { display: block; }
.tabs input:checked + .tab_item { background-color: #476539; }
.route {}
.route li { display: flex;flex-wrap: wrap;justify-content: space-between;margin-bottom: 35px; }
.route li p { width: 48%; }
.route li p.txt { 
	text-align: left; 
	padding-top: 32px;
	padding-left: 2%;
    background: url(../images/icon_num01.png) 0 0 no-repeat;
    background-size: 15%;
}
.route li p.txt.num2 { 
	background-image: url(../images/icon_num02.png);
}
.route li p.txt.num3 { 
	background-image: url(../images/icon_num03.png);
}

.route li p.img {}
@media screen and (min-width: 768px) {
.tabs { width: 500px; }
.tabs .mapImg { background: #3A3C5A;padding: 15px; }
}

/* other */
.address { margin: 50px auto; }
.address p { line-height: 2; }