/* ==== align === */
.align-C { text-align:center!important; }
.align-L { text-align:left!important; }
.align-R { text-align:right!important; }
.ver-align-T { vertical-align:top!important; }
.ver-align-M { vertical-align:middle!important; }
.ver-align-M { vertical-align:bottom!important; }
/* ==== bg === */
.bg-B { background: #669ACA!important; }
.bg-P { background: #EAE8DC!important; }
.bg-GLY { background: #d5c09f!important; }
.bg-O { background: #F4A766!important; }
.bg-GRN { background: #EAE8DC!important; }
.bg-BK { background: #333!important; }
/* ==== box === */
.box {
	table-layout:fixed;
	display: table;
	width: 100%;
}
.box > div {
	display: table-cell;
	vertical-align: top;
	padding: 0 10px;
}
.box > div img {
	max-width: 100%;
	height: auto;
}
.box-flex {
	display: -webkit-flex;
	display: -moz-flex;
	display: -ms-flex;
	display: -o-flex;
	display: flex;
	flex-wrap: wrap;
}
.box > div img {
	max-width: 100%;
	height: auto;
}
.btn {
	background-color: #EFEFEF;
	-webkit-border-radius: 4px;
	-moz-border-radius: 4px;
	border-radius: 4px;
	border:none;
	color: #222!important;
	display: block;
	font-weight: bold;
	padding: 10px;
	margin: 0 auto;
	text-align:center;
	text-decoration: none;
}
.btn-IB {
	background-color: #635D54;
	border: 1px solid #635D54;
	color: #FFF!important;
	display: inline-block;
	font-size: 0.8rem;
	padding: 10px 40px;
	margin: 0 auto;
	text-align:center;
	text-decoration: none;
}
.btn-IB:hover {
	background-color: inherit;
	color: #1F150E!important;
}
.btn-IB2 {
	background-color: #635D54;
	border: 1px solid #635D54;
	color: #FFF!important;
	display: inline-block;
	font-size: 0.8rem;
	padding: 10px 40px;
	margin: 0 auto;
	text-align:center;
	text-decoration: none;
}
.btn-IB2:hover {
	background-color: inherit;
	color: #F29C9F!important;
}
/* ==== color === */
.color-R { color: #FF3333!important; }
.color-O { color: orange!important; }
.color-B { color: #00557f!important; }
.color-BK { color: #333!important; }
.color-G { color: green!important; }
.color-WH { color: white!important; }
/* ==== clear === */
.clearfix:after {
	content:" ";
	display:block;
	clear:both;
}
.crr {
	font-size:0;
	line-height:0;
	padding:0;
	margin:0;
	clear:both;
}
/* ==== display === */
.pc-display-B { display: block; }
.pc-display-I { display: inline; }
.sp-display-N { display: none; }
br.pc-display{ }
/* ==== dl === */
dl.dl-B dd {
	padding-bottom: 5px;
	border-bottom: 1px dotted #CCC;
}
/* ==== float === */
.float-L { float: left!important; }
.float-R { float: right!important; }
/* ==== font === */
.font-S {
	font-size: 0.9em!important;
	line-height: 1.3em;
}
.font-XS {
	font-size: 0.8em!important;
	line-height: 1.3em;
}
.font-XXS {
	font-size: 0.7em!important;
	line-height: 1.3em;
}
.font-L {
	font-size: 1.2em!important;
	line-height: 1.3em;
}
.font-XL {
	font-size: 1.35em!important;
	line-height: 1.3em;
}
.font-XXL {
	font-size: 1.5em!important;
	line-height: 1.3em;
}
/* ==== img === */
.img-C {
	display: block;
	margin-bottom: 10px;
	margin-left: auto;
	margin-right: auto;
}
.img-L {
	float: left;
	margin-bottom: 10px;
	margin-right: 10px;
}
.img-R {
	float: right;
	margin-bottom: 10px;
	margin-left: 10px;
}
.img-L, .img-R { text-align: center; }
.img-B { border: 5px solid #FCF1C9; }
/* ==== margin === */
.margin-T0 { margin-top:0px!important; }
.margin-T5 { margin-top:5px!important; }
.margin-T10 { margin-top:10px!important; }
.margin-T15 { margin-top:15px!important; }
.margin-T20 { margin-top:20px!important; }
.margin-T30 { margin-top:30px!important; }
.margin-T40 { margin-top:40px!important; }
.margin-B0 { margin-bottom:0px!important; }
.margin-B5 { margin-bottom:5px!important; }
.margin-B10 { margin-bottom:10px!important; }
.margin-B15 { margin-bottom:15px!important; }
.margin-B20 { margin-bottom:20px!important; }
.margin-B30 { margin-bottom:30px!important; }
.margin-B40 { margin-bottom:40px!important; }
/* ==== smartphone === */
.sp-table-area { }
/* ==== table === */
table.table-B {
	border-top: 1px solid #FFF;
	border-left: 1px solid #FFF;
}
table.table-B td {
	border-right: 1px solid #FFF;
	border-bottom: 1px solid #FFF;
	background-color: #FBF7E8;
	padding: 5px;
}
table.table-B th {
	border-right: 1px solid #FFF;
	border-bottom: 1px solid #FFF;
	background-color: #FCF1C9;
	color: #604028;
	font-weight: bold;
	padding: 5px;
	text-align: center;
}
table.table-D { }
table.table-D td { border-bottom: 1px dotted #D7D7D7; }
table.table-D th {
	border-bottom: 1px dotted #D7D7D7;
	text-align: left;
	font-weight: bold;
}
/* ==== ul,ol === */
ul.ul-B { margin-left: 0!important; }
ul.ul-B li {
	border-bottom: 1px dotted #CCC;
	list-style: none;
	padding-bottom: 5px;
	padding-top: 5px
}
ul.ul-I { margin-left: 0; }
ul.ul-I li { display: inline-block; }
ol.ol-li {
	border-bottom: 1px dotted #CCC;
	padding-bottom: 5px;
	padding-top: 5px;
}
/* ==== width === */
.width-1 { width: 10%!important; }
.width-2 { width: 20%!important; }
.width-3 { width: 30%!important; }
.width-4 { width: 40%!important; }
.width-5 { width: 50%!important; }
.width-6 { width: 60%!important; }
.width-7 { width: 70%!important; }
.width-8 { width: 80%!important; }
.width-9 { width: 90%!important; }
.width-10 { width: 100%!important; }

/*----------------------------------------------------------------------------
******************************************************************************
max-width: 780px
******************************************************************************
----------------------------------------------------------------------------*/
@media screen and (max-width: 780px) {
/* ==== box === */
.box {
display: -webkit-flex;
display: -moz-flex;
display: -ms-flex;
display: -o-flex;
display: flex;
flex-wrap: wrap;
}
.box > div {
display: block;
width: auto;
padding: inherit;
margin-bottom: 0;
}

/* ==== img === */
.img-L, .img-R {
display: block;
float: none;
margin: 0 auto 10px;
}
}
/*----------------------------------------------------------------------------
******************************************************************************
max-width: 480px
******************************************************************************
----------------------------------------------------------------------------*/
@media screen and (max-width: 580px) {
/* ==== display === */
.pc-display-B {
display: none;
}
.pc-display-I {
display: none;
}
.sp-display-N {
display: block;
}
br.pc-display{ display: none; }
/* ==== float === */
.float-L {
float: none!important;
}
.float-R {
float: none!important;
}

/* ==== smartphone === */
.sp-table-area {
 box-shadow: -3px 0 5px rgba(0, 0, 0, 0.2) inset;
 margin-bottom: 20px;
 margin-top: 20px;
 overflow: auto;
}
.sp-table-area table {
 margin: 0!important;
 min-width: 580px;
}
/* ==== table === */
table.table-B {
	border-top: 1px solid #FFF;
	border-left: 1px solid #FFF;
	
}
table.table-B td,table.table-B th {
	display: block;
	padding: 5px!important;
}

/* ==== width === */
.width-1, .width-2, .width-3, .width-4, .width-5, .width-6, .width-7, .width-8, .width-9, .width-100 {
width: 100%!important;
}
}
