@charset "utf-8";

/* Basic Structure ============================================================= */
html,body{ min-height: 100%; height:100%; }
img{max-width: 100%; height: auto; width: auto\9; /* ie8 */}
p{ margin: 0 0 1em 0; }
a,
a:active,
a:visited{ color: #F29600; }
a:hover{ color: #D1312C; }

/* Font ======================================================== */
/* rem based fontsize <Firefox3.6+, Chrome, Safari5, IE9+ >*/
/* IE7/8対策のために最初にpx指定してからrem指定する  */
html{ font-size: 62.5%; }
body { font-size: 14px; font-size: 1.4rem; }
h1{ font-size: 48px; font-size: 4.8rem; font-weight: bold; margin: 0; padding: 0; }
h2{ font-size: 20px; font-size: 2.0rem; font-weight: bold; margin: 0; padding: 0; }
h3{ font-size: 18px; font-size: 1.8rem; font-weight: bold; margin: 0; padding: 0; }
h4{ font-size: 16px; font-size: 1.6rem; font-weight: bold; margin: 0; padding: 0; }
h5{ font-size: 14px; font-size: 1.4rem; font-weight: bold; margin: 0; padding: 0; }
h6{ font-size: 12px; font-size: 1.2rem; font-weight: bold; margin: 0; padding: 0; }
.xsmall { font-size: 10px; font-size: 1.0rem; }
.small { font-size: 11px; font-size: 1.1rem; }
.medium { font-size: 12px; font-size: 1.2rem; }
.regular { font-size: 14px; font-size: 1.4rem; }
.large { font-size: 16px; font-size: 1.6rem; }
.xlargel { font-size: 18px; font-size: 1.8rem; }
.xxlargel { font-size: 24px; font-size: 2.4rem; }
.clearsize{}
/* font-face */
body, textarea { font-family: "メイリオ", "ＭＳ Ｐゴシック", sans-serif; }
input, select { font-family: Arial, "ＭＳ Ｐゴシック", sans-serif; }
/* font-color */
body{ color: #53412F; }
.red{ color: #D1312C; }
.pink{ color: #FA88D5; }
.orange{ color: #F29600; }
.lorange{ color: #FFA64D; }
.blue{ color: #5CBDD1; }
.lblue{ color: #AFDAC3; }
.brown{ color: #AFDAC3; }
.lbrown{ color: #DBC7A8; }


/* Reusable classes ========================================================= */
/* slide */
ul.slide_image{ list-style-type: none; padding: 0; }
/* frame */
.frame1{ border: #F9F5EA solid 4px; padding: 2%; }
.frame_dotted1{ border: #C4B1AA dotted 1px; }
/* table */
.table1{ border-collapse: collapse; border: #666 solid 1px;}
.table1 tr{}
.table1 th,
.table1 td{ padding: 5px;}
.table1 th{ font-weight: bold; border-bottom: #666 solid 1px; text-align: left; white-space: nowrap;}
.table1 td{ border-left: #666 dotted 1px;border-bottom: #666 solid 1px;}

.table2{border: #DBC7A8 dotted 1px; margin-bottom: 1em;}
.table2 th{ padding: 0.5em 0.4em; border-bottom: #DBC7A8 dotted 1px;  border-right: #DBC7A8 dotted 1px; white-space: nowrap; }
.table2 td{ padding: 0.5em 0.4em; border-bottom: #DBC7A8 dotted 1px; }
/* IE hack < http://www.positioniseverything.net/articles/cc-plus.html > */
#ltie8{}/*IE8未満*/
#ltie7{}/*IE7未満*/
/**** .clm inline blockによる横並びカラム構成のテンプレート。 ****/
ul.clm{ letter-spacing:-1em;}
ul.clm li{ width:100px; display:inline-block; display:-moz-inline-box; /display:inline; /zoom:1; letter-spacing:normal;}
ul.clm li > div{ width:100px; display:block;}

/* Utility classes ============================================================ */
/* Left & Right alignment */
.left{ float: left; }
.right{ float: right; }
.pcLeft{ float: left; }
.pcRight{ float: right; }
/* margin */
.l10{margin-left:10px;}
.r10{margin-right:10px;}
.t10{margin-top:10px;}
.b10{margin-bottom:10px;}
/* The fraction classes are useful for column lists */
.half, .third, .quarter, .fifth, .sixth{ width: 100%; display: block; list-style-type: none; padding: 0; margin: 0; }
.half li, .third li, .quarter li, .fifth li, .sixth li{ display: block; padding: 0; margin: 0; float: left; }
.half li{ padding-right: 1%; width: 49% }
.third li{ padding-right: 1%; width: 32.3% }
.quarter li{ padding-right: 1%; width: 24% }
.fifth li{ padding-right: 1%; width: 19% }

.pcHalf{ display: block; list-style-type: none; margin: 0; padding: 0; /zoom:1;}
.pcHalf:after{content: ""; display: block; clear: both;}
.pcHalf li { width:49%; margin: 0; padding: 0.5%; display:block; float: left; }

.pcFullblock{ width:98%; margin: 0; padding: 1%; display:inline-block; /display:inline; /zoom:1; letter-spacing:normal;}
.pcHalfblock{ width:47%; margin: 0; padding: 1%; display:inline-block; vertical-align: top; /display:inline; /zoom:1; letter-spacing:normal;}

.pcTable{}
.pcTable th{ white-space: nowrap; }
.pcTable th, .pcTable td{ text-align: left; vertical-align: top;}
/* For when a <br /> just ain't enough */
.separator{clear: both;float: left;height: 1px;width: 100%; }
/*.clearFix (NN,IE6未満非対応) */
.clearfix {/zoom:1;}
.clearfix:after{content: ""; display: block; clear: both;}
.inside {/zoom:1;}
.inside:after{content: ""; display: block; clear: both;}
.clearb{ clear: both; }

hr.dot{ border-color: #222; border-width: 1px 0px 0px 0px; border-style: dashed; height: 1px; /* 高さ(IE) */}
/* Smartphone(Landscape) ============================================================== */
@media screen and (max-width: 480px) {
.pcLeft{ float: none; }
.pcRight{ float: none; }
.pcHalf li { width:98%; float: none; }
.pcHalfblock{ width:98%; }
.pcTable{ display: block;}
.pcTable tr,
.pcTable th,
.pcTable td{ display: block;}
}