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

#contents h1 {
	background-image:url(img/title.png);
	background-repeat:no-repeat;
	background-position:left top;
}
#contents h2 {
	width:100%; height:43px;
	margin: 2em auto 1em;
	background-repeat:no-repeat;
	background-position:center top;
	text-align:center;
	text-indent:-9999px;
	display:block;
}
h2.catch01 {
	background-image:url(img/catch01.png);
}
h2.catch02 {
	background-image:url(img/catch02.png);
}
h2.catch03 {
	background-image:url(img/catch03.png);
}
h2.catch04 {
	background-image:url(img/catch04.png);
}
h2.catch05 {
	background-image:url(img/catch05.png);
}
h2.catch06 {
	background-image:url(img/catch06.png);
}
h2.catch07 {
	background-image:url(img/catch07.png);
}
h2.catch08 {
	background-image:url(img/catch08.png);
}
h2.catch09 {
	background-image:url(img/catch09.png);
}
h2.catch10 {
	background-image:url(img/catch10.png);
}
#contents h3 {
	clear:both;
	width:100%; height:50px;
	margin:10px 0 5px 0;
	background-repeat:no-repeat;
	background-position:left top;
	text-indent:-9999px;
	display:block;
}
#contents h3.head01 {
	background-image:url(img/head01.png);
}
#contents h3.head02 {
	background-image:url(img/head02.png);
}
#contents p {
 text-align: justify;
 line-height: 1.8em;
 margin: 0 1em 1em;
}

/* tab menu */

.tab {
 width: 100%;
 margin-top: 1em;
}
.tab_item {
 width: calc(90%/5);
 margin: 0 0.2em; margin-bottom: -1px;
 padding: 1em 0;
 background-color: #e2d2c4;
 background: linear-gradient(#FFF, #e2d2c4);
 font-size: 1.2em; line-height:1em;
	color: #333;
	text-align:center;
	border:solid 1px #999;
 border-radius: 4px 4px 0 4px / 4px 4px 0 4px;
	-webkit-border-top-left-radius: 4px;  
 -webkit-border-top-right-radius: 4px; 
 -webkit-border-bottom-right-radius:0; 
 -webkit-border-bottom-left-radius:0;  
 -moz-border-radius-topleft: 4px; 
 -moz-border-radius-topright: 4px;
 -moz-border-radius-bottomright:0; 
 -moz-border-radius-bottomleft:0;
	outline:none;
	display: inline-block;
 overflow: hidden;
 transition: all 0.2s ease;
}
.tab1 { margin-left: 0.5em;}
.tab_item:hover {
  opacity: 0.75;
}

/*ラジオボタンを全て消す*/
input[name="tab_item"] {
  display: none;
}

/* tab contents */
.tab_contents {
 padding: 2em 1em 4em;
	border:1px solid #999;
 display: none;
}
#tab1:checked ~ #tab1_contents,
#tab2:checked ~ #tab2_contents,
#tab3:checked ~ #tab3_contents,
#tab4:checked ~ #tab4_contents,
#tab5:checked ~ #tab5_contents {
  display: block;
}

/* tab contentsの表示切替え */
.tab input:checked + .tab_item {
  background-color: #e2d2c4;
  background: linear-gradient(#e2d2c4, #FFF);
  color: #777; border-bottom:none;
} .tab input:checked + .tab_item:hover {
  opacity: 1;
}

/* etc. */

#contents #column {
	position:relative;
	float:right;
	width:480px; height:auto;
	margin:20px 50px;
	padding:10px;
	background-color:#F0E6D2;
	text-align:left;
	display:block;
}
#contents #column h4, #contents #column p {
	margin:0; padding:0;
}
#contents #column img {
	position:absolute;
	top:-15px; right:0;
}

#contents #shop a {
	position: absolute;
	top:185px;	right:95px;
	text-indent:-9999px;
	display:block;
}

#contents #koka { float: left; }
#contents #yobo { display: flex; }
#contents #koka div, #contents #yobo div {
	min-height:40px;
	padding:10px 10px 10px 40px;
	background-repeat:no-repeat;
	background-position:left top;
	text-align: justify;
	display:block;
	border:1px solid #999;
}
#contents #koka div {
	margin-top:4px;
	margin-right:10px;
	width:110px; height:auto;
}
#contents #yobo div {
	margin:8px;
	width:115px; height:auto;
}
#koka .no1, #yobo .no1 {
	background-image:url(../images/no1.png);
}
#koka .no2, #yobo .no2 {
	background-image:url(../images/no2.png);
}
#koka .no3, #yobo .no3 {
	background-image:url(../images/no3.png);
}
#koka div span, #yobo div span {
	display:none;
}
