@charset "utf-8";

/* -----------------------------------------------
1. Base(ベース)
2. Layout(レイアウト)
3. Page(ページ)
-------------------------------------------------- */

/* -----------------------------------------------
 [1. Base(ベース)]
-------------------------------------------------- */
@import url(https://fonts.googleapis.com/earlyaccess/notosansjapanese.css);
html,body {
	width: 100%;
	height: 100%;
}
html {
  font-size: 62.5%; /* sets the base font to 10px for easier math */
  -webkit-tap-highlight-color: rgba(0,0,0,0);
	-webkit-overflow-scrolling: touch;
}
body {
	/*
  font-family: -apple-system, BlinkMacSystemFont, "Noto Sans Japanese", "ヒラギノ角ゴ ProN W3", "游ゴシック体","Yu Gothic","YuGothic", "Hiragino Kaku Gothic ProN", "メイリオ", Meiryo, Verdana, Arial, sans-serif;
  */
	font-family: -apple-system, BlinkMacSystemFont, "Sawarabi Mincho";
  font-size: 1.6rem;   /* sets the default sizing to make sure nothing is actually 10px */
  line-height: 1.7;
  color: #231815;
  background-color: #fff;
  -webkit-font-smoothing: antialiased;
	-webkit-text-size-adjust: 100%;
}
* {
	-webkit-box-sizing: border-box; /* border-box ------------------------------ */
	-moz-box-sizing: border-box;
	-o-box-sizing: border-box;
	-ms-box-sizing: border-box;
	box-sizing: border-box;
}

*:before,
*:after  {
	-webkit-box-sizing: border-box; /* border-box ------------------------------ */
	-moz-box-sizing: border-box;
	-o-box-sizing: border-box;
	-ms-box-sizing: border-box;
	box-sizing: border-box;
}
h1,h2,h3,h4,h5,h6 {
	line-height: 1.2;
}
html,body,div,span,object,iframe,
h1,h2,h3,h4,h5,h6,p,blockquote,pre,
a,abbr,acronym,address,code,del,em,img,strong,
dl,dt,dd,ol,ul,li,
fieldset,form,label,
table,caption,tbody,tfoot,thead,tr,th,td{
	margin: 0;
	padding: 0;
	font-style: normal;
}
ul,ol,li {
	margin: 0;
	padding: 0;
	list-style-type: none;
}
dl, dl dd  {
  margin: 0;
}
img {
	vertical-align: bottom;
	line-height: 1.0;
}
input,
button,
select,
textarea {
  font-family: inherit;
  font-size: inherit;
  line-height: inherit;
	font-weight: inherit;
}
figure,
figcaption {
  margin: 0;
  font-size: inherit;
}

blockquote, q {
	quotes: none;
}
blockquote:before,
blockquote:after,
q:before,
q:after {
	content: '';
	content: none;
}

a {
  color: #231815;
  text-decoration: none;
}
a:hover,
a:focus {
  color: #231815;
  text-decoration: none;
}
a:focus {
  outline: thin dotted;
  outline: 5px auto -webkit-focus-ring-color;
  outline-offset: -2px;
}
canvas {
    image-rendering: optimizeQuality;
    image-rendering: -moz-crisp-edges;
    image-rendering: -webkit-optimize-contrast;
    image-rendering: optimize-contrast;
    -ms-interpolation-mode: nearest-neighbor;
}
button {
  border: 0;
  background: transparent;
  -moz-box-shadow: 0 0 0 0 transparent;
  -webkit-box-shadow: 0 0 0 0 transparent;
  box-shadow: 0 0 0 0 transparent;
}
.clearfix:after {
	display: block;
	clear: both;
	content: "";
}

/* float
-------------------------------------------------- */
/* LEFT */ .fl-left { float:left; }
/* RIGHT */ .fl-right { float:right; }
/* CLEAR */ .fl-clear { clear:both; float: none; }

/* text align
-------------------------------------------------- */
/* LEFT */ .te-center { text-align: center; }
/* RIGHT */ .te-left { text-align: left; }
/* CENTER */ .te-right { text-align: right; }

/* clear
-------------------------------------------------- */
.clear_b { clear: both; }
.clear_l { clear: left; }
.clear_r { clear: right; }

/* margin,padding
-------------------------------------------------- */
/* margin-top */
.mt-30	{ margin-top: -30px !important; }
.mt-20	{ margin-top: -20px !important; }
.mt-10	{ margin-top: -10px !important; }
.mt-5	{ margin-top: -5px !important; }
.mt0	{ margin-top:  0px !important; }
.mt5	{ margin-top:  5px !important; }
.mt10	{ margin-top: 10px !important; }
.mt15	{ margin-top: 15px !important; }
.mt20	{ margin-top: 20px !important; }
.mt25	{ margin-top: 25px !important; }
.mt30	{ margin-top: 30px !important; }
.mt35	{ margin-top: 35px !important; }
.mt40	{ margin-top: 40px !important; }
.mt45	{ margin-top: 45px !important; }
.mt50	{ margin-top: 50px !important; }
.mt55	{ margin-top: 55px !important; }
.mt60	{ margin-top: 60px !important; }
.mt70	{ margin-top: 70px !important; }
.mt80	{ margin-top: 80px !important; }
.mt90	{ margin-top: 90px !important; }
.mt100	{ margin-top:100px !important; }
/* margin-right */
.mr0	{ margin-right:  0px !important; }
.mr5	{ margin-right:  5px !important; }
.mr10	{ margin-right: 10px !important; }
.mr15	{ margin-right: 15px !important; }
.mr20	{ margin-right: 20px !important; }
.mr25	{ margin-right: 25px !important; }
.mr30	{ margin-right: 30px !important; }
.mr35	{ margin-right: 35px !important; }
.mr40	{ margin-right: 40px !important; }
.mr45	{ margin-right: 45px !important; }
.mr50	{ margin-right: 50px !important; }
.mr60	{ margin-right: 60px !important; }
.mr70	{ margin-right: 70px !important; }
.mr80	{ margin-right: 80px !important; }
.mr90	{ margin-right: 90px !important; }
.mr100	{ margin-right:100px !important; }
/* margin-bottom */
.mb0	{ margin-bottom:  0px !important; }
.mb5	{ margin-bottom:  5px !important; }
.mb10	{ margin-bottom: 10px !important; }
.mb15	{ margin-bottom: 15px !important; }
.mb20	{ margin-bottom: 20px !important; }
.mb25	{ margin-bottom: 25px !important; }
.mb30	{ margin-bottom: 30px !important; }
.mb35	{ margin-bottom: 35px !important; }
.mb40	{ margin-bottom: 40px !important; }
.mb45	{ margin-bottom: 45px !important; }
.mb50	{ margin-bottom: 50px !important; }
.mb60	{ margin-bottom: 60px !important; }
.mb70	{ margin-bottom: 70px !important; }
.mb80	{ margin-bottom: 80px !important; }
.mb90	{ margin-bottom: 90px !important; }
.mb100	{ margin-bottom:100px !important; }
/* margin-left */
.ml0	{ margin-left:  0px !important; }
.ml5	{ margin-left:  5px !important; }
.ml10	{ margin-left: 10px !important; }
.ml15	{ margin-left: 15px !important; }
.ml20	{ margin-left: 20px !important; }
.ml25	{ margin-left: 25px !important; }
.ml30	{ margin-left: 30px !important; }
.ml35	{ margin-left: 35px !important; }
.ml40	{ margin-left: 40px !important; }
.ml45	{ margin-left: 45px !important; }
.ml50	{ margin-left: 50px !important; }
.ml60	{ margin-left: 60px !important; }
.ml70	{ margin-left: 70px !important; }
.ml80	{ margin-left: 80px !important; }
.ml90	{ margin-left: 90px !important; }
.ml100	{ margin-left:100px !important; }
/* padding-top */
.pt0	{ padding-top:  0px !important; }
.pt5	{ padding-top:  5px !important; }
.pt10	{ padding-top: 10px !important; }
.pt15	{ padding-top: 15px !important; }
.pt20	{ padding-top: 20px !important; }
.pt25	{ padding-top: 25px !important; }
.pt30	{ padding-top: 30px !important; }
.pt35	{ padding-top: 35px !important; }
.pt40	{ padding-top: 40px !important; }
.pt45	{ padding-top: 45px !important; }
.pt50	{ padding-top: 50px !important; }
.pt60	{ padding-top: 60px !important; }
.pt70	{ padding-top: 70px !important; }
.pt80	{ padding-top: 80px !important; }
.pt90	{ padding-top: 90px !important; }
.pt100	{ padding-top:100px !important; }
/* padding-right */
.pr0	{ padding-right:  0px !important; }
.pr5	{ padding-right:  5px !important; }
.pr10	{ padding-right: 10px !important; }
.pr15	{ padding-right: 15px !important; }
.pr20	{ padding-right: 20px !important; }
.pr25	{ padding-right: 25px !important; }
.pr30	{ padding-right: 30px !important; }
.pr35	{ padding-right: 35px !important; }
.pr40	{ padding-right: 40px !important; }
.pr45	{ padding-right: 45px !important; }
.pr50	{ padding-right: 50px !important; }
.pr60	{ padding-right: 60px !important; }
.pr70	{ padding-right: 70px !important; }
.pr80	{ padding-right: 80px !important; }
.pr90	{ padding-right: 90px !important; }
.pr100	{ padding-right:100px !important; }
/* padding-bottom */
.pb0	{ padding-bottom:  0px !important; }
.pb5	{ padding-bottom:  5px !important; }
.pb10	{ padding-bottom: 10px !important; }
.pb15	{ padding-bottom: 15px !important; }
.pb20	{ padding-bottom: 20px !important; }
.pb25	{ padding-bottom: 25px !important; }
.pb30	{ padding-bottom: 30px !important; }
.pb35	{ padding-bottom: 35px !important; }
.pb40	{ padding-bottom: 40px !important; }
.pb45	{ padding-bottom: 45px !important; }
.pb50	{ padding-bottom: 50px !important; }
.pb60	{ padding-bottom: 60px !important; }
.pb70	{ padding-bottom: 70px !important; }
.pb80	{ padding-bottom: 80px !important; }
.pb90	{ padding-bottom: 90px !important; }
.pb100	{ padding-bottom:100px !important; }
/* padding-left */
.pl0	{ padding-left:  0px !important; }
.pl5	{ padding-left:  5px !important; }
.pl10	{ padding-left: 10px !important; }
.pl15	{ padding-left: 15px !important; }
.pl20	{ padding-left: 20px !important; }
.pl25	{ padding-left: 25px !important; }
.pl30	{ padding-left: 30px !important; }
.pl35	{ padding-left: 35px !important; }
.pl40	{ padding-left: 40px !important; }
.pl45	{ padding-left: 45px !important; }
.pl50	{ padding-left: 50px !important; }
.pl60	{ padding-left: 60px !important; }
.pl70	{ padding-left: 70px !important; }
.pl80	{ padding-left: 80px !important; }
.pl90	{ padding-left: 90px !important; }
.pl100	{ padding-left:100px !important; }