@charset "UTF-8";
/* ===================================================================
CSS information

 file name  :reset.css
 style info :リセット用CSS
=================================================================== */

/*要素のフォントサイズやマージン・パディングをリセットしています*/
html, body, div, span, object, iframe,
h1, h2, h3, h4, h5, h6, p, blockquote, pre,
abbr, address, cite, code,
del, dfn, em, img, ins, kbd, q, samp,
small, strong, sub, sup, var,
b, i,
dl, dt, dd, ol, ul, li,
fieldset, form, label, legend,
table, caption, tbody, tfoot, thead, tr, th, td,
article, aside, canvas, details, figcaption, figure,
footer, header, hgroup, menu, nav, section, summary,
time, mark, audio, video {
    margin:0;
    padding:0;
    border:0;
    outline:0;
    font-size:100%;
    vertical-align:baseline;
    background:transparent;
}

/*新規追加要素のデフォルトはすべてインライン要素になっているので、section要素などをブロック要素へ変更しています*/
article,aside,details,figcaption,figure,
footer,header,hgroup,menu,nav,section.small {
    display:block;
}

/* --HTML-- */
html {
	background:#fff;
	color:#333;
}

/* --BODY-- */
body {
	
	margin:0;
	padding:0;
	line-height:1;
}

/* for IE7 */
*+html body {
	font-family:'メイリオ', 'ＭＳ Ｐゴシック';
	font-size:75%;
}

/* for IE6 */
* html body {
	font-family:'ＭＳ Ｐゴシック';
	font-size:75%;
}

/* --OTHER TAGS-- */
a img,img {
	border:0;
	vertical-align:bottom;
}

blockquote,dd,div,dl,dt,h1,h2,h3,h4,h5,h6,li,ol,p,pre,span,td,th,ul {
	margin:0;
	padding:0;
}

abbr,acronym {
	border:0;
}

address,caption,cite,code,dfn,em,th,strong,var {
	font-style:normal;
	font-weight:400;
}

caption,th {
	text-align:left;
}

code,kbd,pre,samp,tt {
	font-family:monospace;
	line-height:100%;
}

*+html code,kbd,pre,samp,tt {
	font-size:108%;
}

h1,h2,h3,h4,h5,h6 {
	font-size:100%;
	font-weight:400;
}

ol,ul {
	list-style:none;
}

q:before,q:after {
	content:'';
}

img {
	vertical-align: top;
	font-size:0;
	line-height: 0;
}

/* form */
button,fieldset,form,input,label,legend,select,textarea {
	font-family:inherit;
	font-size:100%;
	font-style:inherit;
	font-weight:inherit;
	vertical-align:baseline;
	margin:0;
	padding:0;
}

/* tables */
table {
	font-size:100%;
	line-height:1.5;
	border-collapse:collapse;
}

/*
---------------------------------------------
base
---------------------------------------------
*/

* {
  box-sizing: border-box;
  min-height: 0%;
}

*:focus {
  outline: none;
}

body {
  color: #000000;
  font-family: Verdana, sans-serif;
  font-size: 16px;
  line-height: 1.5;
}

a {
  text-decoration: none;
}

ol,ul,li {
  list-style: none;
}

/*
---------------------------------------------
helper
---------------------------------------------
*/

.main {
  display: block;
}

.flex {
  display: flex;
  flex-wrap: wrap;
}

.flex-nowrap {
	display: flex;
}

.flex-end {
  display: flex;
  justify-content: flex-end;
}

.flex-between {
	display: flex;
  justify-content: space-between;
	flex-wrap: wrap;
}

.flex-start {
	display: flex;
  justify-content: flex-start;
	flex-wrap: wrap;
}

.flex-reverse {
	display: flex;
  flex-direction: row-reverse;
	flex-wrap: wrap;
}

.flex-center {
	display: flex;
	justify-content: center;
	align-items: center;
}

.flex-stretch {
	display: flex;
	justify-content: stretch;
}

.flex-column {
	display: flex;
	justify-content: space-between;
	flex-direction: column;
}

.flex-col-center {
	display: flex;
	justify-content: space-between;
	align-items: center;
}

.flex-col-end {
	display: flex;
	align-items: flex-end;
}

.text-center{
	text-align:center;
}

.text-right {
	text-align: right;
}

.font-normal {
	font-weight: normal;
}

.font-bold {
	font-weight: bold;
}

.pc {
	display:block;
}

.sp {
	display:none;
}

br.sp,
img.sp,
span.sp {
	display:none;
}

br.pc,
img.pc,
span.pc {
	display:inline;
}

a,
a *{
  transition-duration: .5s;
}

a:hover {
  opacity: .8;
}
.strong,
.b{
	font-weight:bold;
}
@media screen and (max-width: 767px) {
	.sp-block {
		display: block;
	}

	.pc {
		display:none;
  }

	.sp {
		display:block;
	}

  br.sp,
  img.sp,
  span.sp {
		display:inline;
	}

  br.pc,
  img.pc,
  span.pc {
		display:none;
	}
}

/*
---------------------------------------------
common
---------------------------------------------
*/

.main {
  margin-top: 94px;


}
#home .main {
  margin-top: 0px;
}
.contents-inner {
  width: 1220px;
  min-width: 1220px;
  margin: auto;
}

@media screen and (max-width: 1240px) {
  .wrapper {
    width: 1220px;
    min-width: 1220px;
  }

  .contents-inner {
    padding: 0 15px;
  }
}

@media screen and (max-width: 767px) {
  .main {
    margin-top: 54px;
  }
	#home .main {
	    margin-top: 54px;
	}
  .wrapper {
    width: 100%;
    min-width: 100%;
  }

  .contents-inner {
    min-width: 100%;
    width: 100%;
    padding: 0 20px;
  }
}

/*
---------------------------------------------
hedaer
---------------------------------------------
*/

.header {
  padding: 24px 0 25px;
  position: fixed;
  z-index: 3;
  width: 100%;
  transition: .3s;
  background: #000;
  top: 0;
  color: white;
}

.header .inner {
  display: flex;
  justify-content: center;
  align-items: baseline;
  width: 1280px;
  margin: auto;
  position: relative;
  z-index: 101;
}

.header .logo-title {
  font-size: 30px;
  letter-spacing: 2px;
  text-align: center;
  margin-right:10px;
}
.header .logo-title a {
  color: #ffffff;
}

@media screen and (max-width: 1300px) {
  .header .inner {
    padding: 0 15px;
  }
}

@media screen and (max-width: 767px) {
  .header {
    padding: 14px 0 16px;
  }

  .header .inner {
    padding: 0 15px;
    width: 100%;
  }

  .header .inner .text-wrap {
    margin-top: 74px;
    width: 100%;
  }

  .header .inner .lead {
    font-size: 10px;
    text-align: center;
  }

  .header .logo-title {
    font-size: 16px;
    letter-spacing: 0;
  }
}

/* header-scroll */

.header.header-scroll {
  padding: 24px 0 25px;
}

.header.header-scroll .text-wrap {
  margin-top: -2px;
}

.header.header-scroll .inner .title {
  display: block;
  margin: 0;
}

.header.header-scroll .inner .logo-title {
}

.header.header-scroll .inner .logo {
  width: 122px;
}

.header.header-scroll .inner .logo img {
  width: 100%;
}

@media screen and (max-width: 767px) {
  .header.header-scroll {
    padding: 14px 0 16px;
  }

  .header.header-scroll .inner .text-wrap {
    margin-top: 0;
  }

  .header.header-scroll .inner .logo-title {
    display: block;
  }
}
/*
---------------------------------------------
footer
---------------------------------------------
*/

.footer {
  background: #EDEBEB;
  margin-top:100px;
  padding-top: 30px;
  padding-bottom: 30px;
}

.footer .inner {
  width: 1220px;
  margin: auto;
  display: flex;
}

.footer .copyright {
  margin-left: 51px;
}

@media screen and (max-width: 767px) {
  .footer {
    margin-top: 40px;
  }

  .footer .inner {
    width: 100%;
    display: block;
    padding: 0 20px;
  }

  .footer .copyright {
    font-size: 12px;
    display: block;
  }
}