@charset "utf-8";

/* ************************************************ 
*	Base, reset, normalize
* ************************************************ */

html,
body,
div,
span,
object,
iframe,
p,
blockquote,
pre,
a,
abbr,
acronym,
address,
big,
cite,
code,
del,
dfn,
em,
img,
ins,
kbd,
q,
s,
samp,
small,
strike,
strong,
sub,
sup,
tt,
var,
b,
u,
i,
center,
dl,
dt,
dd,
ol,
ul,
li,
fieldset,
form,
label,
legend,
table,
caption,
tbody,
tfoot,
thead,
tr,
th,
td,
article,
aside,
canvas,
details,
embed,
figure,
figcaption,
footer,
header,
hgroup,
menu,
nav,
output,
ruby,
section,
summary,
time,
mark,
audio,
video,
h1,
h2,
h3,
h4,
h5,
h6 {
  margin: 0;
  padding: 0;
  border: 0;
  outline: 0;
  font-size: 100%;
  vertical-align: baseline;
  background: transparent;
  font-style: normal;
  color:#000;
}

/* Structure tags */
article,
aside,
details,
figcaption,
figure,
footer,
header,
hgroup,
nav,
section {
  display: block;
}

/* Responsive images and other embedded objects */
img,
object,
embed,
video,
iframe {
  width: auto;
  max-width: 100%;
}

/* Responsive images aspeсt ratio */
img,
video,
iframe {
  height: auto;
}

/* To prevent some browsers from inserting quotes on q and p */
blockquote,
q {
  quotes: none;
}
blockquote p:before,
blockquote p:after,
q:before,
q:after {
  content: '';
  content: none;
}

/* Table reset */
table {
  border-collapse: collapse;
  border-spacing: 0;
}
caption,
th,
td {
  text-align: left;
  vertical-align: top;
  font-weight: normal;
}
thead th,
thead td {
  font-weight: bold;
  vertical-align: bottom;
}

/* Image inside */
a img,
th img,
td img {
  vertical-align: top;
}

/* Webkit browsers reset margin */
button,
input,
select,
textarea {
  margin: 0;
}
textarea {
  overflow: auto;
}

/* Normalize buttons in IE */
button {
  width: auto;
  overflow: visible;
}

/* Hand cursor on clickable controls */
input[type=button],
input[type=submit],
button {
  cursor: pointer;
}

/* Trick with vertical align for radio and checkbox  */
input[type="radio"],
input[type="checkbox"] {
  font-size: 110%;
}

/* Horizontal rule reset  */
hr {
  display: block;
  height: 1px;
  border: 0;
  border-top: 1px solid #000;
}

/* Clearfix */
.group:after {
  content: ".";
  display: block;
  height: 0;
  clear: both;
  visibility: hidden;
}

/* ************************************************ 
*	Typography
* ************************************************ */

body {
font: 13px arial,"ヒラギノ角ゴ Pro W3","Hiragino Kaku Gothic Pro","メイリオ","Meiryo",Osaka,"ＭＳ Ｐゴシック","MS PGothic",Sans-Serif;
  background: #ffffff;
  color: #000;
  line-height: 180%;
}
a {
  color: #336699;
}
a:hover {
  color: #19334d;
}
h1,
h2,
h3,
h4,
h5,
h6 {
  font-weight: bold;
}
h1 {
  font-size: 2.5714285714285716em;
  line-height: 1em;
}
h2 {
  font-size: 2.142857142857143em;
  line-height: 1.1em;
}
h3 {
  font-size: 1.7142857142857142em;
  line-height: 1.3em;
}
h4 {
  font-size: 1.2857142857142858em;
  line-height: 1.3em;
}
h5 {
  font-size: 1.1428571428571428em;
  line-height: 1.3em;
}
h6 {
  font-size: 1em;
  line-height: 1.3em;
  text-transform: uppercase;
}
hgroup h1,
hgroup h2,
hgroup h3,
hgroup h4 {
}
.subheader {
  font-size: 1.2em;
  font-weight: normal;
  color: #8f8f8f;
}
p,
ul,
ol,
dl,
dd,
dt,
blockquote,
td,
th {
  line-height: 1.5em;
}
ul,
ol,
ul ul,
ol ol,
ul ol,
ol ul {
  margin: 0 0 0 0;
  list-style:none;
}
ol ol li {
  list-style-type: lower-alpha;
}
ol ol ol li {
  list-style-type: lower-roman;
}
ul,
ol,
dl,
blockquote,
hr,
pre,
hgroup,
table,
form,
fieldset {
}
dl dt {
  font-weight: bold;
}
dd {
}
blockquote {
  border-left: 1px solid #ccc;
  color: #666;
}
blockquote small,
cite {
  color: #888;
  font-style: italic;
}
blockquote p {
  font-style: italic;
}
address {
  font-style: italic;
}
del {
  text-decoration: line-through;
}
abbr[title],
dfn[title] {
  border-bottom: 1px dotted #000;
  cursor: help;
}
strong,
b {
  font-weight: bold;
}
em,
i {
  font-style: italic;
}
sub,
sup {
  font-size: 0.7em;
  line-height: 0;
  position: relative;
}
sup {
  top: -0.5em;
}
sub {
  bottom: -0.25em;
}
figcaption {
  font-size: 0.85em;
  font-style: italic;
}
ins,
mark {
  background-color: transparent;
  color: #000000;
  text-decoration: none;
}

/* ************************************************ 
*	Forms
* ************************************************ */
input[type="radio"],
input[type="checkbox"] {
  position: relative;
  top: -1px;
}
select,
input[type="text"],
input[type="password"],
input[type="email"],
input[type="tel"],
input[type="number"],
textarea {
  position: relative;
  z-index: 2;
font-family: TazuganeGothicStdN-Book;
font-size:14px;
  border: none;
  width: 95%;
  margin: 0;
  padding: 5px 5px;
  background-color: #fafafa;
  color: #000;
  line-height: 1;
  border-radius: 0px;
 /* box-shadow: 0 1px 2px rgba(0, 0, 0, 0.2) inset;
  -webkit-transition: border 0.3s ease-in;
  -moz-transition: border 0.3s ease-in;
  -ms-transition: border 0.3s ease-in;
  -o-transition: border 0.3s ease-in;
  transition: border 0.3s ease-in;*/
}
textarea {
  line-height: 1.4em;
}

/* Errors and Success */
.error,
.success {
  margin-left: 5px;
  font-weight: normal;
  font-size: 0.85em;
}
input.input-error,
textarea.input-error,
select.input-error,
.input-error {
  border-color: #da3e5a;
  box-shadow: 0 0 0 2px rgba(218, 62, 90, 0.3), 0 1px 2px rgba(0, 0, 0, 0.2) inset;
}
input.input-success,
textarea.input-success,
select.input-success,
.input-success {
  border-color: #18a011 ;
  box-shadow: 0 0 0 2px rgba(24, 160, 17, 0.3), 0 1px 2px rgba(0, 0, 0, 0.2) inset;
}
input.input-gray,
textarea.input-gray,
select.input-gray,
.input-gray {
  border-color: #ccc;
  box-shadow: 0 0 0 2px rgba(204, 204, 204, 0.3), 0 1px 2px rgba(0, 0, 0, 0.2) inset;
}
input:focus,
textarea:focus {
  outline: none;
  border-color: #5ca9e4;
  box-shadow: 0 0 0 2px rgba(70, 161, 231, 0.3), 0 1px 2px rgba(0, 0, 0, 0.2) inset;
}
input.input-search {
  padding-right: 10px;
  padding-left: 10px;
  margin-bottom: 0;
  border-radius: 15px;
}
.input-append,
.input-prepend {
  display: inline-block;
  background-color: #eee;
  height: 23px;
  border: 1px solid #ccc;
  margin: 0;
  padding: 1px 8px;
  color: #333;
  font-size: 14px;
  line-height: 23px;
}
.input-prepend {
  margin-right: -1px;
}
.input-append {
  position: relative;
  z-index: 1;
  margin-left: -1px;
}
.btn {
  position: relative;
  cursor: pointer;
  outline: none;
  display: inline-block;
  text-align: center;
  text-decoration: none;
font-family: TazuganeGothicStdN-Heavy;
  line-height: 1;
  font-size: 20px;
  font-weight: normal;
  padding: 6px 56px;
  /*border-radius: 4px;*/
  background-color: #fff;
  /*background-image: -moz-linear-gradient(top, #ffffff, #e1e1e1);
  background-image: -ms-linear-gradient(top, #ffffff, #e1e1e1);
  background-image: -webkit-gradient(linear, 0 0, 0 100%, from(#ffffff), to(#e1e1e1));
  background-image: -webkit-linear-gradient(top, #ffffff, #e1e1e1);
  background-image: -o-linear-gradient(top, #ffffff, #e1e1e1);
  background-image: linear-gradient(top, #ffffff, #e1e1e1);
  filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#ffffff', endColorstr='#e1e1e1', GradientType=0);*/
  border: 2px solid #000;
  /*border-left: 1px solid #d2d2d2;
  border-right: 1px solid #d2d2d2;
  border-bottom-color: #a9a9a9;
  box-shadow: 0 1px 0 rgba(0, 0, 0, 0.15), inset 0 1px 1px 0 rgba(255, 255, 255, 0.6);
  text-shadow: 0 1px 0px #ffffff;*/
}
.btn,
.btn:hover {
  color: #000;
}
.btn:hover {
  filter: none;
  background: none;
  background: #eee;
  text-shadow: 0 1px 0px rgba(255, 255, 255, 0.8);
  text-decoration: none;
  box-shadow: 0 1px 0 rgba(0, 0, 0, 0.15);
}


/* FF fix */
@-moz-document url-prefix("http://") {
  input[type=submit].btn::-moz-focus-inner,
  button.btn::-moz-focus-inner {
    border: 0;
    padding: 0;
  }
}

/* ************************************************ 
*	Grid
* ************************************************ */

.row {
  margin-bottom: 1.5em;
}
.container.row {
  margin-bottom: 0;
}
.container:after,
.row:after {
  content: ".";
  display: block;
  height: 0;
  clear: both;
  visibility: hidden;
}
.half,
.third,
.quarter,
.twothird,
.threequarter {
  margin-left: 3.1914893617021276%;
  float: left;
  min-height: 1px;
}
.half:first-child,
.third:first-child,
.quarter:first-child,
.twothird:first-child,
.threequarter:first-child {
  margin-left: 0;
}
.quarter {
  width: 22.606382978723403%;
}
.third {
  width: 31.205673758865245%;
}
.half {
  width: 48.40425531914894%;
}
.threequarter {
  width: 74.20212765957446%;
}
.twothird {
  width: 65.60283687943262%;
}
.split .half,
.split .third,
.split .quarter,
.split .fifth,
.split .twothird,
.split .threequarter {
  margin-left: 0;
}
.split .half {
  width: 50%;
}
.split .threequarter {
  width: 75%;
}
.split .quarter {
  width: 25%;
}
.split .third {
  width: 33.3%;
}
.split .twothird {
  width: 66.6%;
}

/* ************************************************ 
*	Blocks
* ************************************************ */

.block-two,
.block-four {
  list-style: none;
  margin-left: 0;
  margin-left: -3.1914893617021276%;
  margin-bottom: 2.5em;
}
.block-two:after,
.block-four:after {
  content: ".";
  display: block;
  height: 0;
  clear: both;
  visibility: hidden;
}
.block-two > li,
.block-four > li {
  height: auto;
  /*float: left;*/
  /*margin-bottom: 2.5em;*/
  margin-left: 0;
  margin-left: 3.1914893617021276%;
  
  display:inline-block;
  vertical-align:top;
}
.block-two > li {
  width: 432px;
}
.block-four > li {
  /*width: 21.80851063829787%;*/
  width: 192px;
}
/*@media only screen and (max-width: 1079px) {

  .block-two > li,
  .block-four > li {
    float: none;
	display:inline-block;
	vertical-align: top;

  }
}*/
@media only screen and (max-width: 767px) {
	.block-two,
	.block-four {
	  list-style: none;
	  margin-left: 0;
	}
	.block-two > li {
	  width: 46.4vw;/*168+左右マージン3の174px*/
	}
	.block-four > li{
	  width: 56.53vw;
	  margin-left: 0;
	}

}
/*@media only screen and (max-width: 576px) {

  .block-four{
    margin-left: 0;
  }
  .block-four > li{
    float: none;
    margin: 0;
    width: 100%;
  }
}


/* ************************************************ 
*	Responsive Mobile (Portrait)
* ************************************************ */

@media only screen and (max-width: 767px) {
  .row .half,
  .row .quarter,
  .row .threequarter {
    margin-left: 0;
    width: 100%;
  }
}



