﻿@charset "UTF-8";

/*-----------------------------------------------
reset
-----------------------------------------------*/
html, body, div, span, applet, object, h1, h2, h3, h4, h5, h6, 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, caption, tbody, tfoot, thead, article, aside, canvas, details, embed, figure, figcaption, footer, header, hgroup, menu, nav, output, ruby, section, summary, time, mark, audio, video {
	margin: 0;
	padding: 0;
	border: 0;
	font-size: 100%;
	font: inherit;
	vertical-align: baseline;
}
.movie-wrap {
  position: relative;
  width: 100%;
  padding-top: 56.25%;
}
 
.movie-wrap iframe {
  position: absolute;
  top: 0;
  right: 0;
  width: 100% !important;
  height: 100% !important;
}
.movie{
	max-width:516px;
	max-height:315px;
	overflow:hidden;
	margin:0 auto 20px auto;
}
table, tr, th, td {
	font-size: 100%;
	font: inherit;
	vertical-align: baseline;
}
/* HTML5 display-role reset for older browsers */
article, aside, details, figcaption, figure, footer, header, hgroup, menu, nav, section {
	display: block;
}
ol, ul {
	list-style: none;
}
blockquote, q {
	quotes: none;
}
blockquote:before, blockquote:after, q:before, q:after {
	content: '';
	content: none;
}
table {
	border-collapse: collapse;
	border-spacing: 0;
}

/*=======================================================*/
/* clearfix
/*=======================================================*/
.clearfix {
	zoom: 1;/*for IE 5.5-7*/
}
.clearfix:after {
	content: ".";
	display: block;
	height: 0;
	clear: both;
	visibility: hidden;
}
.clearfix {
	display: inline-table;
}
/* Hides from IE-mac \*/
* html .clearfix {
	height: 1%;
}
.clearfix {
	display: block;
}
/* End hide from IE-mac */

/*=======================================================*/
/*margin
/*=======================================================*/
.mt0 {
	margin-top: 0!important;
}
.mt5 {
	margin-top: 5px;
}
.mt10 {
	margin-top: 10px;
}
.mt20 {
	margin-top: 20px;
}
.mt30 {
	margin-top: 30px;
}
.mt40 {
	margin-top: 40px;
}
.mt50 {
	margin-top: 50px;
}
.mt100{
	margin-top:100px;
}
.mb5 {
	margin-bottom: 5px;
}
.mb10 {
	margin-bottom: 10px;
}
.mb20 {
	margin-bottom: 20px;
}
.mb30 {
	margin-bottom: 30px;
}
.mb40 {
	margin-bottom: 40px;
}
.mb50 {
	margin-bottom: 50px;
}
.mr5 {
	margin-right: 5px;
}
.mr10 {
	margin-right: 10px;
}
.mr15 {
	margin-right: 15px;
}
.mr20 {
	margin-right: 20px!important;
}
.mr30 {
	margin-right: 30px;
}
.mr40 {
	margin-right: 40px;
}
.mr45 {
	margin-right: 45px;
}
.mr50 {
	margin-right: 50px;
}
.ml5 {
	margin-left: 5px;
}
.ml10 {
	margin-left: 10px;
}
.ml20 {
	margin-left: 20px;
}
.ml30 {
	margin-left: 30px;
}
.ml40 {
	margin-left: 40px;
}
.ml45 {
	margin-left: 45px;
}
.ml50 {
	margin-left: 50px;
}

/*----- 横幅指定 -----*/
.wd1 {width: 1%;}
.wd5 {width: 5%;}
.wd10 {width: 10%;}
.wd13 {width: 13%;}
.wd15 {width: 15%;}
.wd20 {width: 20%;}
.wd25 {width: 25%;}
.wd30 {width: 30%;}
.wd35 {width: 35%;}
.wd37 {width: 37%;}
.wd40 {width: 40%;}
.wd44 {width: 44%;}
.wd45 {width: 45%;}
.wd50 {width: 50%;}
.wd60{width: 60%;}
.wd65 {width: 65%;}
.wd70 {width: 70%;}
.wd75 {width: 75%;}
.wd80 {width: 80%;}
.wd85 {width: 85%;}
.wd90 {width: 90%;}
.wd95 {width: 95%;}
.wd100 {width: 100%;}
/*-----------------------------------------------
body
-----------------------------------------------*/
body {
	font-family: "SF Pro JP","SF Pro Display","SF Pro Icons","Hiragino Kaku Gothic Pro","ヒラギノ角ゴ Pro W3","メイリオ",Meiryo,"ＭＳ Ｐゴシック","Helvetica Neue",Helvetica,Arial,sans-serif;
font-size: 15px;
line-height: 2;
	color: #4A4B50;
    margin-top: 36px;
}
a {
	color: #4A4B50;
}
.inner{
	max-width:1024px;
	margin:0 auto;
	width:100%;
	box-sizing: border-box;
}
input[name="image"]:hover {
	filter: alpha(opacity=70);
	opacity: 0.70;
}
img{
	-webkit-backface-visibility: hidden;
}
img a:hover {
	filter: alpha(opacity=70);
	opacity: 0.70;
}

@media screen and (max-width:768px) {
.inner{
	width:85%;
	margin:0 auto;
	box-sizing: border-box;
}
img{
max-width: 100%;
height: auto;
width /***/:auto;　
}
}

/*-----------------------------------------------
header
-----------------------------------------------*/
.site-header{
    position: fixed;
    top: 0;
    transition: .5s;
    width: 100%;
    z-index: 99999999999;
    overflow: visible;
}
 
.site-header.hide{
    transform: translateY(-100%);
}
header{
    overflow: hidden;
    margin: 0 0 50px 0;
    width: 100%;
    padding:8px 16px;
    box-sizing: border-box;
    background-color: #FFF;
}
header h1{
    float: left;
    max-width: 157px;
}
header h1 img{
    width: 100%;
}
header nav .sp{display:none}
/*PCのスタイル*/
header nav {
    z-index: 100;
	float: right;
    margin: 16px 16px 0 0;
    font-size: 0.9rem
}
header nav ul{
	display: flex;
	align-items: center;
}
header nav ul li a{
	text-decoration: none;
	padding: 16px ;
}
#nav_toggle{
	display: none;
}
@media screen and (max-width:414px) {
header{
    padding:8px 16px;
}
header h1{
    max-width: 120px;
}
}
 
/*メニュー部分*/
@media screen and (max-width:960px){
	nav{
		display: none;
		position: absolute;
		top:55px;
		width: 100%;
		background: #fff;
		left: 0;
	}
	header nav ul{
		display: block;
		margin: 0 auto;
		width: 90%;
	}
	header nav ul li{
		margin: 0 auto;
		text-align: center;
		border-bottom: 1px solid #ccc;
	}
	header nav ul li:last-child{
		border: none;
	}
	header nav ul li a{
		display: block; 
	}
 
}
@media screen and (max-width:1100px) {
    header nav ul li a{
	padding:8px;
}
}
@media screen and (max-width:960px){
header nav .sp{display:block}
header nav .pc{display:none}
	/*開閉ボタン*/
	#nav_toggle{
		display: block;
		width: 40px;
		height: 40px;
		position: relative;
		top: 16px;
        right:0px;
        float: right;
		z-index: 99999;
	}
	#nav_toggle div {
		position: relative;
	}
	#nav_toggle span{
		display: block;
		height: 3px;
		background: #000;
		position:absolute;
		width: 100%;
		left: 0;
		-webkit-transition: 0.5s ease-in-out;
		-moz-transition: 0.5s ease-in-out;
		transition: 0.5s ease-in-out;	
	}
	#nav_toggle span:nth-child(1){
		top:0px;
	}
	#nav_toggle span:nth-child(2){
		top:12px;
	}
	#nav_toggle span:nth-child(3){
		top:24px;
	}
	/*開閉ボタンopen時*/
	.open #nav_toggle span:nth-child(1) {
			top: 12px;
		   -webkit-transform: rotate(135deg);
			-moz-transform: rotate(135deg);
			transform: rotate(135deg);
		}
		.open #nav_toggle span:nth-child(2) {
			width: 0;
			left: 50%;
		}
		.open #nav_toggle span:nth-child(3) {
			top: 12px;
			-webkit-transform: rotate(-135deg);
			-moz-transform: rotate(-135deg);
			transform: rotate(-135deg);
		}
}



/*-----------------------------------------------
見出し
-----------------------------------------------*/
h2 {
	text-align: center;
}
h2 img {
	height: 50px;
}

@media screen and (max-width:1024px) {
h2 {
	margin: 50px 0 30px 0;
	text-align: center;
}
h2 img {
	height: 50px;
}
}

@media screen and (max-width:768px) {
h2 {
	margin-bottom: 20px;
	text-align: center;
}
h2 img {
	height: 50px;
}
}

/*-----------------------------------------------
footer
-----------------------------------------------*/
footer{
    background-color: #4A4B50;
    color: #ccc;
    display: table;
    width: 100%;
    padding-top: 36px;
}
footer .inner{
    max-width: 1300px;
    width: 100%;
}
footer .inner h2{
    text-align:left;
    margin-bottom: 8px;
}
footer .nav{
    display: table-cell;
    width: 33%;
}
footer .linkbnr{
    display: table-cell;
    width: 40%;
    font-size: 90%
}
footer .linkbnr img{
    width: 200px;
    margin-top: 8px;
}
footer .address{
    display: table-cell;
    width: 34%;
}
footer .copyright {
    padding: 24px 0;
    border-top: #484848 1px solid;
    text-align: left;
    font-size: 0.8rem;
    margin-top: 24px;
}
footer a{
    color: #ccc!important;
}
@media screen and (max-width:1024px) {
footer .inner{
    width: 90%;
}
}
@media screen and (max-width:414px) {
footer{
    padding-top: 16px;
}
footer .inner{
    width: 90%;
}
footer .inner h2{
    text-align:left;
    margin-bottom: 8px;
}
footer .nav{
    display:none;
}
footer .linkbnr{
    display:block;
    width: 100%;
    font-size: 90%
}
footer .linkbnr img{
    width: 150px;
}
footer .address{
    display:block;
    width: 100%;
}
footer .copyright {
    font-size: 0.6rem;
}
}

/*-----------------------------------------------
#footer-und-mobile
-----------------------------------------------*/

/*-----------------------------------------------
マーカー
-----------------------------------------------*/
.marker{
	background-color: #FFFFBF;
    font-weight: bold;
}

/*=======================================================*/
/*  画像位置
/*=======================================================*/
.img_l {
  float: left;
  margin-right: 30px;
  margin-bottom: 10px;
  text-align: left;
}
.img_r {
  float: right;
  margin-left: 30px;
  margin-bottom: 10px;
  text-align: left;
}

@media screen and (max-width:768px) {
.img_l {
	float: left;
	margin-right: 10px;
	margin-bottom: 5px;
	text-align: left;
}
.img_r {
	float: right;
	margin-left: 10px;
	margin-bottom: 5px;
	text-align: left;
}
}

/*=======================================================*/
/*  indent
/*=======================================================*/
.indent-1 {
	text-indent: -1em;
	margin-left: 1em;
}

/*-----------------------------------------------
テキスト
-----------------------------------------------*/
.t-center {
	text-align: center;
}
.t-right {
	text-align: right;
}
.t-left {
	text-align: left;
    line-height: 1.6em;
}
.f-l{
    font-size: 120%;
}
/*-----------------------------------------------
スマホで見えない
-----------------------------------------------*/
.pchi {
	display: none;
}

@media screen and (max-width:768px) {
.hi {
	display: none;
}
.pchi {
	display:block;
}
}

@media screen and (max-width:1366px) {
.hi2 {
	display: none;
}
}

/*=======================================================*/
/* ボタン
/*=======================================================*/
.button01 a{
background-color: #EB7900;
color: #fff;
-moz-border-radius: 33px;
-webkit-border-radius: 33px;
border-radius: 33px;
display: block;
text-align: center;
padding: 16px;
text-decoration: none;
max-width: 300px;
width: 100%;
margin: 36px 0 0 0;
box-sizing: border-box;
}
.button01 a:hover{
	background-color: #333;
}

.button02 a{
	background-color:#EB7900;
	color: #fff;
	-moz-border-radius:33px;
	-webkit-border-radius:33px;
	border-radius:33px;
	display:block;
	text-align: center;
	padding:16px;
	text-decoration:none;
	max-width:200px;
	width: 100%;
	margin:36px auto;
	box-sizing: border-box;
}
.button02 a:hover{
	background-color: #333;
}


/*-----------------------------------------------
お問い合わせ
-----------------------------------------------*/
.footcontact{
    position: fixed;
    bottom:10px;
    right: 10px;
}
.footcontact img{
        width: 165px;
    height:60px;
}
@media screen and (max-width:768px) {
.footcontact{
    position: fixed;
    bottom:10px;
    right: 10px;
}
.footcontact img{
        width: 60px;
    height:60px;
}
}
