body {
	text-align: center;
	font-family:"Hiragino Sans", "Hiragino Kaku Gothic ProN", Meiryo, "sans-serif";
	background-image: url("../images/paper_bg.gif")
}

.ev_top {
	background-color: #94c9dc;	

}

.ev_top img {
	width: 80%;
	
}

/* パソコンで見たときは"pc"のclassがついた画像が表示される */

.pc {
    width: 1690px;	
	display: block !important;
	margin: auto;

}


.sp {
	display: none !important;
}


/*/////////////////////////info/////////////////////////*/



.info {
	padding: 100px 0;
} 



.menu {
  display: inline-block;
  width: 250px;
  text-align: center;
  text-decoration: none;
  line-height: 60px;
  outline: none;
  color: #333;
  font-weight: 800;
  border:2px solid #333232;
  background-color: #fff;
  -webkit-transition: all .3s;
  transition: all .3s;
}
.menu:hover {
  color: #fff!important;
  border:2px solid #333232;
  background: #333232;
}


/*/////////////////////////index/////////////////////////*/


.index {
	margin: 50px 0;
	
}

.index h1 {
  margin: auto;
  width: 800px;
  line-height: 60px;
  outline: none;
  color: #333;
  font-size: 20px;
  font-weight: 800;
  border:2px solid #333232;
  background-color: #fff;
}

.index p {
  text-align: center;
  text-decoration: none;
	margin-top: 30px;
  line-height: 30px;
  outline: none;
  color: #333;
  font-size: 15px;
}


/*/////////////////////////  tab01  /////////////////////////*/


.tab {
  margin: auto;
	width:1100px;
 	border-radius:10px;
	padding: 80px 0;
	color: #333;
}

.tab img {
	display: block;
	text-align: center;
	margin: 50px auto;
	width:800px;
}


.tab-wrap {
  display: flex;
  flex-wrap: wrap;
  margin:20px 0;
  margin: auto;
	width:900px;
	
}
.tab-wrap:after {
  content: '';
  width: 100%;
  height: 3px;
  background: #FFFFFF;
  display: block;
  order: -1;
}

.tab-label {
  color: #333;
  background: LightGray;
  font-weight: bold;
  font-size: 20px;
  white-space: nowrap;
  text-align: center;
  padding: 30px .5em;
  order: -1;
  position: relative;
  z-index: 1;
  cursor: pointer;
  border-radius: 10px 10px 0 0;
  flex: 1;
}

.tab-label:not(:last-of-type) {
  margin-right: 5px;
}

.tab-content {
  width: 100%;
  border-radius: 10px;
  height: 0;
  overflow: hidden;
  opacity: 0;
 	background:#FFFFFF;
	
}
.tab-switch:checked+.tab-label {
  background: #FFFFFF;
}
.tab-switch:checked+.tab-label+.tab-content {
  height: auto;
  overflow: auto;
  padding: 15px 15px 50px 15px;
  opacity: 1;
  transition: .5s opacity;
}
.tab-switch {
  display: none;
}

/*/////////////////////////  tab02  /////////////////////////*/

.tab-wrap02 {
    display: flex;
    flex-wrap: wrap;
	margin: auto;
    width: 900px;
}
.tab-label02 {
    color: White;
    background: #333;
    padding: 15px 50px;
    order: -1;
	margin: 50px auto;
	width: 280px;

}
.tab-content02 {
    width: 100%;
    display: none;
}
/* アクティブなタブ */
.tab-switch02:checked+.tab-label02 {
    background: white;
	color: #333;
	border: solid 1px #333;
}
.tab-switch02:checked+.tab-label02+.tab-content02 {
     display: block;
}
/* ラジオボタン非表示 */
.tab-switch02 {
    display: none;
}






.tab-content03 {
    width: 100%;
    display: none;
}


/* アクティブなタブ */
.tab-switch03:checked+.tab-label02 {
    background: white;
	color: #333;
	border: solid 1px #333;
}
.tab-switch03:checked+.tab-label02+.tab-content03 {
     display: block;
}
/* ラジオボタン非表示 */
.tab-switch03 {
    display: none;
}




/*/////////////////////////  素材-リスト  /////////////////////////*/


.large{
	margin: 50px;
	width: 650px;

}

.three-list {
	display: inline-block;
	margin: 10px;
}

.three-list img {
	width: 250px;
	
}

.three-list h2 {
	font-size: 18px;
	font-weight: 700;
	margin: 20px 0 10px 0;
	text-align: center;
}

.three-list h3 {
	font-size: 13px;
	font-weight: 600;
	margin: 20px 0 10px 0;
	line-height: 22px;
	text-align: center;
	border-bottom: 1px solid #FFF;
}

.three-list p {
	font-size: 15px;
	line-height: 25px;
}

.float {
	float: left;
	
}



.icon {
	margin-bottom: 20px;
	 white-space:normal;
}


.part {
	background-color: #FFF;
	padding: 8px;
	font-weight: bold;
	color: #333;	
	
}


.l-list {
	display: inline-block;
	margin: 50px 10px;
}

.l-list img {
	width: 300px;
	
}

.l-list h2 {
	font-size: 20px;
	font-weight: 700;
	text-align: left;
	margin: 20px;
}

.l-list p {
	font-size: 15px;
	text-align: left;
	margin: 20px;
	line-height: 2;
}

/***マスク有リスト****/

.s-list {
	width:			250px;
	height:			250px;
	overflow:		hidden;
	margin:			10px 8px 10px 16px;
	position:		relative;
}

.s-list img {
	width:			250px;
}


.s-list .caption {
	font-size:		130%;
	text-align: 		center;
	color:			#fff;
}
.s-list .mask {
	width:			100%;
	height:			100%;
	position:		absolute;
	top:			0;
	left:			0;
	opacity:		0;	/* マスクを表示しない */
	background-color:	rgba(0,0,0,0.4);
	-webkit-transition:	all 0.6s ease;
	transition:		all 0.6s ease;
}
.s-list:hover .mask {
	opacity:		1;	/* マスクを表示する */
	padding-top:		60px;	/* ホバーで下にずらす */
}



/*/////////////////////////  素材-表  /////////////////////////*/

.table-scroll {
  overflow-x: auto;
  margin: auto;
	width:700px;
	padding: 10px 0 80px 0;
	
}
.table_design11 {
  border-collapse: collapse;
	text-align: center;
}
.table_design11 th, .table_design11 td {
  padding: .8em 2em;
	text-align: center;
	font-size: 16px;
	
}
.table_design11 th {
  border-top: 3px solid #333;
  border-bottom: 2px solid #333;
  color: #333;
}


.table-line {
  border-bottom: 2px solid #333;
}

.table-bold {
  border-bottom: 3px solid #333;
	
}

/*/////////////////////////  WhitBOX  /////////////////////////*/


.radius{
	margin-bottom: 100px;
	
}

.whitebox {
	width:1100px;
 	background:#FFFFFF;
 	border-radius:10px;
	padding: 20px 0;
 	margin: 60px auto 150px auto;
}  


.white-index {
	margin: 50px 0;
}

.bold {
	font-weight: 700;
	
}

.white-index h1 {
  margin: auto;
  width: 800px;
  line-height: 60px;
  outline: none;
  color: #fff;
  font-size: 20px;
  font-weight: 800;
  background-color: #4fa5bb;
}


.white-index p {
  text-align: center;
  text-decoration: none;
	margin-top: 30px;
  line-height: 30px;
  outline: none;
  color: #333;
  font-size: 15px;
}






/*///////////////////fotter//////////////////////*/

#page-top {
    position: fixed;
    bottom: 20px;
    right: 20px;
    font-size: 77%;
}
#page-top a {
    background: #666;
    text-decoration: none;
    color: #fff;
    width: 100px;
    padding: 30px 0;
    text-align: center;
    display: block;
    border-radius: 5px;
}
#page-top a:hover {
    text-decoration: none;
    background: #999;
}


.footer {
	background-color:#1e1e1e;
	padding:20px 0;
}

.footer img {
	width:8%;
	margin: auto;
}


#fotter{
	font-size:10px;
	text-align:center;
	color:#FFF;
	margin:8px 0 18px 0;
}