/* CSS Document */
/* #### 全体の設定 ### */
@import url(https://fonts.googleapis.com/css?family=Lato:400,700);
@import url(https://fonts.googleapis.com/earlyaccess/notosansjp.css);

body {
    font-family: Lato, "Noto Sans JP", "游ゴシック Medium", "游ゴシック体", "Yu Gothic Medium", YuGothic, "ヒラギノ角ゴ ProN", "Hiragino Kaku Gothic ProN", "メイリオ", Meiryo, "ＭＳ Ｐゴシック", "MS PGothic", sans-serif;
	overflow-x: hidden;
	 margin: 0px;   
   padding: 0px; 
}


#wrap {
width:100%;
margin-top:50px;
}

/* #### 共通テキスト書式 ### */
h1 {
font-size:20px;
color:#000000;
margin:20px;
	font-weight: bolder;
	line-height: 28px;
	border-left: 20px solid #ff6633;
	border-bottom:solid 1px #999999;
	width: 95%;
	background:#FFFFFF;
	padding-left: 5px
}
/*
h2 {
font-size:14px;
font-weight:bold;
color:#000000;
background-color:#f1f1f1;
line-height:20px;
margin:5px;
padding-left:15px;
width: 95%;
}*/
h3 {
color:#000000;
font-weight:bold;
}
a { 
color:#3366FF; 
text-decoration:none;
font-weight:bold;
}
a:visited {
color:#3366FF; 
text-decoration:none;
font-weight:bold;
}
a:hover{ 
color:#FF6600;
text-decoration:underline; 
font-weight:bold;
}
.bb {
color:#000000;
font-weight:bold;
}
.texts {
font-size:11px;
line-height:13px;
}
/*
#head {
width:100%;
position: fixed;
z-index: 2;
top:0px;
text-align:left;
background-color:#FFFFFF;
border-bottom-style:solid;
border-bottom-width: 1px;
border-bottom-color:#CCCCCC;
margin:0 0 5px 0 ;
display:flex;
}
*/
#mimg {
width:100%;
max-height:40%;
}
#content {
/*width:100%;
position:absolute;
top:90%;
background-color: rgba(255,255,255,0.8);*/
}
#content2 {
width:100%;
background-color: rgba(255,255,255,0.8);
}
#footer {
 clear:both;
width:100%;
height:60px;
padding-top:25px;
text-align:center;
font-size:11px;
border-top-style:solid;
border-top-width: 1px;
border-top-color:#CCCCCC;
	
}

.logo {
float:left;
margin:2px 2px 2px 10px;
}
.menu {
float:right;
list-style: none; 
margin:3px 10px 3px 3px;
max-width:13%;
font-size:14px;

}
a:link img{
  border: 1px solid #FFFFFF;
}
a:hover img{
  border: 1px solid #ff4400;
}
a:visited img{
  border: 1px solid #FFFFFF;
}
.menu-img {
width:100%;
 border: 1px solid #ffffff;
}

.main_img {
max-width:100%;
}

.contmenu {
width:18%;
margin:2% 2.5% 2% 4%;
font-size:12px;
line-height:15px;
float:left;
}
.contentimg {
margin:5px;
border:0;
width:100%;
}
.title2 {
font-size:13px;
font-weight:bold;
color:#000000;
background:none;
padding:0px;
}
.menutext {
}
.topic {
width:98%;
border:1px solid #CCCCCC;
padding:5px;
text-align:left;
font-size:12px;
background-color:#f9f9f9;
margin: 0px auto;
margin-top:5px;
margin-bottom:5px;
}
/*
.snslinkt {
width:50%;
padding:0px;
height:45px;
text-align:right;
float:right;
}
*/
.snslink {
width:98%;
border:1px solid #CCCCCC;
padding:5px;
height:45px;
text-align:center;
margin: 0 auto;
margin-bottom:10px;

}
.bn_icon {
width:20px;
margin: 5px;
}

/* #### 内部ページ ### */


.subarea{display:flex;flex-wrap: wrap;justify-content: space-between; width:94%; margin-left:auto; margin-right:auto;}
.a-block {
	width:48%;
    position: relative;
	color:#3366FF;
	margin-bottom:2em;
}
.a-block a {	
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
}

.a-block:hover,
a.txt-link:hover{
	color:#FF6600!important;text-decoration:underline; cursor:pointer; display:block;}

.spimage1 {
width:100%;
}

.subareatext {
margin-bottom:50px;
}
.spectable {
width: 100%;
border: 1px solid #000000;
white-space: nowrap;
overflow-x: scroll;
margin-bottom:30px;
}

.h1_sp {
   font-size:22px;
   font-weight:bold;
} 
.h2_sp {
   font-size:22px;
   font-weight:bold;
} 

.subimg {
float:left;
width:100%;
 border: 1px solid #ffffff;
margin:0 15px 5px 0;
}

.pegehedimg {
width:100%;
}
/* #### 問い合わせフォーム ### */
#input_table {
  border-collapse: collapse;
  border: 1px solid #444422;
  width: 80%;
  font-size:11px;
}
#input_table th {
  background-color: #f5f5dc;
  color: #555533;
  font-weight: normal;
  text-align: left;
  padding: 5px;
  border-top: none;
  border-bottom: 1px solid #444422;
  border-left:none;
  border-right: 1px solid #444422;
  width: 25%;
}
#input_table td {
  background-color: #f8f8ff;
  padding: 5px;
  border-top: none;
  border-bottom: 1px solid #444422;
  border-left:none;
  border-right: 1px solid #444422;
}
/* ------------------------------------- 
 *	youtube埋め込み
 * ------------------------------------- */	
.yt {
  width: 100%;
  position: relative;
  padding-bottom: 65%;
  height: 0;
  overflow: hidden;
}
.yt iframe {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
}

/*----------------------
* 02.TOP
----------------------*/
.video-wrap {
  height: 60%;
  height: 60vh;
  width: 100%;
  overflow: hidden;
  position: relative;
}
.video-wrap:before{
  content: '';
  position: absolute;
  top: 0;
  left: 0;
  display: block;
  width: 100%;
  height: 100%;
  background-color: rgba(0,0,0,0.4);
  z-index: 2;
}
#video {
  background:url(../images/photo_01.jpg) no-repeat;
  background-attachment: fixed;
  background-position: center center;
  background-size: cover;
  left: 0;
  min-height: 60%;
  min-height: 60vh;
  min-width: 100%;
  min-width: 100vw;
  position: absolute;
  top: 0;
  z-index: 1;
}
.catch {
  width: 100%;
  height: auto;
  z-index: 3;
  color: #fff;
  position:absolute;
  top: 50%;
  transform: translateY(-50%);
  overflow: hidden;
}
.catch > h2{
	color:#FFF;
	font-size:6em;
	text-align:center;
	}
@media screen and (max-width: 768px){	
.video-wrap {
  height: 60%;
  height: 60vh;
  width: 100%;
  overflow: hidden;
  position: relative;
}
.catch h2{
	color:#FFF;
	font-size:4em;
	text-align:center;
	}	
}
		
/* ------------------------------------- 
 *	レイアウト
 * ------------------------------------- */	
ul.header-in{ display:flex; height:50px;}
ul.header-in li{}
ul.header-in li:nth-child(2){display:flex; width:100%;justify-content: center;align-items: center;}
ul.header-in li:nth-child(2) div{align-self: center; margin-left:1em;}
ul.header-in li:nth-child(2) img{ height:30px;}

.dsp-no-pc {
	display: none;
	visibility: hidden;
}

header {
	position: fixed;
	top: 0;
	left: 0;
	width: 100%;
	background-color: #fff;
	z-index: 10;
	height: 50px;
	border-bottom-style: solid;
    border-bottom-width: 1px;
    border-bottom-color: #CCCCCC;
}
.logo-sp{ margin-left:10px;}
.logo-sp img{ 
	height: 38px;
	margin-top:5px;
	}
	
.code-num{ font-size:.8em; margin-left:10px;}
.center {
    text-align: center;
}		
/*----------------------
* 03.nav
----------------------*/

.global-nav {
	position: fixed;
	right: -310px;
	top:0;
	/* 隠す */
	width: 300px;
	height: 100vh;
	padding-top: 46px;
	background-color: #fbfbfb;
	/*Mandarin*/
	transition: all .6s;
	z-index:250;
	overflow-y: auto;
	/* メニューが多くなったらスクロールできるように */
}
.global-nav > .name{
    position: absolute;
    top: 15px;
    left:10px;
		}
		
.global-nav > .name img{ width:55%; }		
		
.hamburger {
	position: absolute;
	right: 10px;
	top: 2px;
	width: 30px;
	/* 幅指定 */
	height: 34px;
	/* 高さ指定 */
	cursor: pointer;
	z-index: 300;
}

ul.global-nav__list,
ul.inner-ac{
	margin: 0;
	padding: 0;
	list-style: none;
	display:flex!important;
	flex-wrap: wrap;
	justify-content:space-between;
	align-content: space-between;
}

ul.global-nav__list li,
ul.inner-ac li{
	width:50%;
	border-right: 1px solid #ddd;
	border-bottom: 1px solid #ddd;
	display: flex;
	align-items: center;
}

ul.global-nav__list li a,
ul.inner-ac li a{
	text-decoration: none;
	color: #434343;
	font-family: 'Noto Sans JP', sans-serif;
	line-height:1.2;
	display:block;
	padding: 1em 10px;
	width: 100%;
}

ul.global-nav__list li a>div,
ul.inner-ac li a>div
 {
	color: #020452;
	font-size: .8em;
	font-family: 'Open Sans', sans-serif;
}

.hamburger__line {
	position: absolute;
	left: 0px;
	width: 100%;
	height: 4px;
	background-color: #452e23;
	/*Navy*/
	transition: all .6s;
}

.hamburger__line--1 {
	top: 10px;
}

.hamburger__line--2 {
	top: 20px;
}

.hamburger__line--3 {
	top: 30px;
}

.black-bg {
	position: fixed;
	left: 0;
	top: 0;
	width: 100vw;
	height: 100vh;
	z-index: 100;
	background:rgba(67,67,67,0.4);
	visibility: hidden;
	transition: all .6s;
	cursor: pointer;
}


/* 表示された時用のCSS */

.nav-open .global-nav {
	right: 0;
}

.nav-open .black-bg {
	opacity: .2;
	visibility: visible;
}

.nav-open .hamburger__line--1 {
	transform: rotate(45deg);
	top: 18px;
	background-color: #452e23;
}

.nav-open .hamburger__line--2 {
	width: 0;
	left: 50%;
}

.nav-open .hamburger__line--3 {
	transform: rotate(-45deg);
	top: 18px;
	background-color: #452e23;
}

.snslinkt{ display:flex;justify-content:center; margin-top:10px;}

.snslinkt img{ margin-left:10px; margin-right:10px;}



/*----------------------
 * 10.アコーディオン
----------------------*/
.accordion1{ margin-top:4px;}
.accordion1 .inner {display: none;}


.global-nav h2{ font-size:1em;
	background-color:#452e23;
	padding:1em 10px;
	line-height:1;
	color:#FFF;
	position: relative;
}
.global-nav h2 a{  color:#FFF; display:block; text-decoration:none;}
ul.accordion1 li{ position:relative;border-bottom: 1px #d9d9d9 solid;}
ul.accordion1 li:last-of-type{border-bottom: none;}
ul.accordion1 li > h2.ac-down:before{
  content: "";
  position: absolute;
  right: 20px;
  top: 30%;
  transition: all 0.2s ease-in-out;
  display: block;
  width: 8px;
  height: 8px;
  border-top: solid 3px #fff;
  border-right: solid 3px #fff;
  -webkit-transform: rotate(135deg);
  transform: rotate(135deg);
}

ul.accordion1 li.active>h2.ac-down:before{
  -webkit-transform: rotate(-45deg);
  transform: rotate(-45deg);
  top: 40%;
	
	}