@charset "utf-8";

/* ----- charset & import */
@import url(https://fonts.googleapis.com/css?family=Roboto);

/* ----- dom */
html {
	color: #222;
	font-size: 100%;
	-ms-text-size-adjust: 100%;
	-webkit-text-size-adjust: 100%;
	word-break: break-all;}
body {
	font-family: Roboto,'Lucida Grande','Helvetica Neue','Hiragino Kaku Gothic ProN',"メイリオ",meiryo,sans-serif;
	background: url('../images/bg.jpg') 0 0 no-repeat;
	background-size:cover;
  line-height: 1.8;
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;}

/* ----- size */
.fullsize {width: 100%;}
.mainsize {width: 1000px;margin: 0 auto;}
.column2 {width: 48%;}
.column3 {width: 32.5%;}
.column4 {width: 24%;margin: 0;padding: 0;}
.areaside {
	width: 200px;
	font-size: 90%;
	float: left;}
.areamain {
  width: 900px;
	margin: 0 auto;}

/* ----- typography */
.txt-xl {font-size: 180%;}
.txt-ml {font-size: 140%;}
.txt-l {font-size: 120%;}
.txt-s {font-size: 85%;}
.txt-xs {font-size: 75%;}
.lhreset {line-height: 1.2;}

/* ----- spacing */
.mblock {margin: 1.25rem 0!important;}
.pblock {padding: 1.25rem 0!important;}

.mreset {margin: 0;}
.mt10 {margin-top: 0.625rem!important;}
.mt20 {margin-top: 1.25rem!important;}
.mt30 {margin-top: 1.875rem!important;}
.mb10 {margin-bottom: 0.625rem!important;}
.mb20 {margin-bottom: 1.25rem!important;}
.mb30 {margin-bottom: 1.875rem!important;}

.preset {padding: 0;}
.pt10 {padding-top: 0.625rem!important;}
.pt20 {padding-top: 1.25rem!important;}
.pt30 {padding-top: 1.875rem!important;}
.pb10 {padding-bottom: 0.625rem!important;}
.pb20 {padding-bottom: 1.25rem!important;}
.pb30 {padding-bottom: 1.875rem!important;}

/* ----- position */
.va-top {vertical-align: top;}
.va-mid {vertical-align: middle;}
.va-bot {vertical-align: bottom;}
.flo-l {float: left;}
.fix {margin: 0 auto;}
.flo-r {float: right;}
.p-rel {position: relative;}
.p-abs {position: absolute;}
.ta-l {text-align: left;}
.ta-c {text-align: center;}
.ta-r {text-align: right;}
.vis-v {visibility: visible;}
.vis-h {visibility: hidden;}

/* ----- image */
.imgicon {margin: -3px 0 0 0;padding: 0 2px 0 2px;vertical-align: middle;}
.imgleft {margin: 0 8px 8px 0;float: left;}
.imgright {margin: 0 0 8px 8px;float: right;}
.imgb {vertical-align: bottom;}
.imgbox {padding: 3px;border: 1px solid #ccc;}
.imgframe {max-width: 50%;padding: 3px;border: 1px solid #ccc;}

/*.addcursol a:after {
	content: "";
	top:40%;
	right: 10px;
	width: 6px;
	height: 6px;
	border-top: 2px solid #fff;
	border-right: 2px solid #fff;
	-webkit-transform: rotate(45deg);
	transform: rotate(45deg);
	-ms-transform: rotate(45deg);
	position: absolute;}*/

/* ----- clear */
.txt-indent-clear {
	text-indent: -9999px;
	white-space: nowrap;
	overflow: hidden;}

.clearfix:before, .clearfix:after {
	content: " ";
	display: table;}
.clearfix:after {
	clear: both;}
.clearfix {
	*zoom: 1;}

.pcview {display: block;}
.pcview-inline {display: inline-block;}
.spview {display: none;}
@media screen and (max-width:668px) {
	.pcview,.pcview-inline {display: none;}
	.spview {display: block;}

	.mainsize {width: 96%;}
	.areamain {width: 100%;margin: 6rem 0 0 0;}
	.areamain img {width: 100%;}

	.keyv {width: 100%;margin: 6rem 0 0 0;}

	.bannerimg {width: 60%;}
}