/*=========================================================================
 shared.css
=========================================================================*/
body {
  font-size:82%;
}
html>/**/body {
  font-size:13px;
}

body {
 line-height:1.4;
 font-family:"ヒラギノ角ゴ Pro W3", "Hiragino Kaku Gothic Pro", "メイリオ", Meiryo, Osaka, "ＭＳ Ｐゴシック", "MS PGothic", sans-serif;
 text-align:center;
 color:#333;
}

html, body, div, span, h1, h2, h3, h4, h5, h6, p, img, dl, dt, dd, ol, ul, li, form, table,tr, th, td {
 margin:0;
 padding:0; 
 border:0; 
 font-style:inherit; 
 vertical-align:baseline;
}

h1, h2, h3, h4, h5, h6 {
 font-size:100%;
 font-weight:normal;
}

select,input,button,textarea {
 font:99%;
}

table {
 border-collapse:collapse;
 font-size:inherit;
 font:100%;
}

img {
 vertical-align:bottom;
 border:none;
}

a img {
 border:0;
}

a {
 text-decoration:none;
 cursor:pointer;
}

a:focus {
 -moz-outline-style: none;
}

a:link,
a:visited {
 color:#c30;
}

a:hover,
a:active {
	color:#ccc;
}

div {
 /*margin:auto;*/
 word-break:break-all;
}

ul {
 list-style-type:none;
}

.anchor {
	display:none;
}

/*-------------------------------------------------------------------------
 clearFix
-------------------------------------------------------------------------*/
div:after {
	content: "";
 display: block;
 clear: both;
}

.bg-orange {
	display: block;
	background: #bf5b16;
	color: #fff;
	padding: 6px;
	border:double 3px rgb(255, 255, 255);
	border-radius:5px;
}


.has-background{
	display: block;
	background: #cc3300;
	color: #fff;
	padding: 6px;
	border:double 3px rgb(255, 255, 255);
	border-radius:5px;
}
.font-16{
	font-size: 16px;
}
.font-22{
	font-size: 22px;
}
.font-bold{
	font-weight: bold;
}

.mt10 {
margin-top: 10px;
}

.mb10 {
margin-bottom: 10px;
}

.text-center {
text-align: center;
}

/*-------------------------------------------------------------------------
 columns
-------------------------------------------------------------------------*/
.col-2 {
float: right;
width: 210px;
}

.col-8 {
float: left;
width: 450px;
}


@media screen and (max-width: 768px) {
.col-2 {
float: none;
width: 100%;
}

.col-8 {
float: none;
width: 100%;
}
}




.fee {
  width: 660px;
  border-collapse: collapse;
}
.fee th, .fee td {
  border: 1px solid #ccc;
  vertical-align: middle;
  word-break: break-all;
}
.fee th {
  width: 25%;
  padding: 6px 4px 6px 8px;
  background: #bf5b16;
  text-align: center;
  color: #fff;
}
.fee td {
  padding: 6px 4px 6px 8px;
  text-align: left;
}
.fee td.price {
  text-align: right;
  width: 15%;
}
.fee td p.note {
  margin: 0 0 3px 1em;
  text-indent: -1em;
  color: #C30;
}



@media screen and (max-width: 768px) {
.fee {
width: 100%;
}

.fee th {
padding: 6px 0;
}

.fee td.price {
width: 27%;
}
    
}


.detPicLag {
  margin: 20px 20px 0 !important;
  display: flex;
  flex-wrap: wrap;
  justify-content: center;
  align-items: center;
}
.detPicLag li {
  list-style: none;
  padding: 0 15px 15px;
}
.detPicLag li img {
  padding: 3px;
  border: 1px solid #CDCDCD;
}