@charset "UTF-8";
@import url('https://fonts.googleapis.com/css?family=Fjalla+One|Oswald:400,600');
html,
body {
	height: 100%;
	box-sizing:border-box!important;
}

#wrapper{width:100%;min-height: calc(100% - 50px);}
footer{width:100%; background:#FFF;}
.pink_b{background:linear-gradient(transparent 55%, #ED86B3 0%) ;}
.yellow_b{background:linear-gradient(transparent 55%, #ffef00 0%) ;}
#loader-bg {
  display: none;
  position: fixed;
  width: 100%;
  height: 100%;
  top: 0px;
  left: 0px;
  background: #FFF;
  z-index: 10000;
}
#loader {
  display: none;
  position: fixed;
  top: 50%;
  left: 50%;
  width: 200px;
  height: 200px;
  margin-top: -100px;
  margin-left: -100px;
  text-align: center;
  color: #fff;
  z-index: 2;
}

#loader img{width:230px; margin-bottom:20px;}
#loader p{color: #333; font-size: 12px;}


.youtube {
  position: relative;
  width: 100%;
  padding-top: 56.25%;
}
.youtube iframe {
  position: absolute;
  top: 0;
  right: 0;
  width: 100%;
  height: 100%;
}

@media screen and (min-width: 1141px) {
#gNav{width:100%; border-bottom: #B8B8B8 1px solid;border-top: #B8B8B8 1px solid; }
#gNav nav{border-left: #B8B8B8 1px solid; width:1140px; margin: auto;  border-right: #B8B8B8 1px solid;}
#gNav nav ul{}
#gNav nav li{width:190px; height:114px; border-right: #B8B8B8 1px solid; float:left; margin-right: -1px!important;}
#gNav nav li a{text-decoration: none; color: #333333; transition: 0.3s;}
#gNav nav li a:hover{text-decoration:none; color: #333333; opacity:0.6;
}
}
@media screen and (max-width: 1140px) {
#headerContainer{width:100%; margin: auto;}
#gNav{width:100%; border-bottom: #B8B8B8 1px solid;border-top: #B8B8B8 1px solid; }
#gNav nav{border-left: #B8B8B8 1px solid; width:100%; border-right: #B8B8B8 1px solid;}
#gNav nav ul{}
#gNav nav li{width:16.66%; height: auto;  border-right: #B8B8B8 1px solid; float:left; margin-right: -1px!important;}
#gNav nav li a{text-decoration: none; color: #333333;}
#gNav nav li a:hover{text-decoration:none; color: #333333;
}	
}

.btn--orange,
a.btn--orange {
  color: #fff!important;
  background-color: #eb6100;
	padding: 10px;
border-radius: 7px;	
}
.btn--orange:hover,
a.btn--orange:hover {
  color: #fff!important;
  background: #f56500;
padding: 5px 10px;	
}

@media screen and (min-width: 769px) {
header{border-top: solid #036eb8 5px; width:100%; margin-bottom:10px;}	
#headerContainer{width: 1120px; margin: auto;}
.smp_button{display: none;}	
#seo{ font-size: 9px; margin-top: 8px; }
#logo{width: 300px; margin-top: 5px;}
.right_button{ margin-top: 15px;}
.right_button img{ width:265px!important;}	
.header_cont{ margin-top: 32px; margin-right:30px;}
.header_cont p{ font-size: 16px; font-weight: bold;}
.header_cont a{ text-decoration: none;}	
	
#gNav_smp{display: none;}
.smp_img{display:none;}		
	
#undermain_Wrap	{position: relative; width:100%; height: 240px; margin: auto; background: url(../img/common/top_img02.jpg);}
.under_ttl{width:1120px; margin: auto;padding-top:75px;}
.under_ttl h2{padding-top:12px; margin: auto; margin-bottom:10px; color: #fff;font-size: 24px; text-align: center; line-height: 20px;}
.under_ttl h2 span{font-size: 12px; }	
	
.pankuzuWrap{width:1120px;margin: auto;padding-top:20px;}
.pankuzuWrap li{font-size: 11px; float: left; padding-right:5px; }
.pankuzuWrap li a{text-decoration: none;}
		
#contact{width:100%; padding:10px 0; background:#036eb8;}
.contactWrap{width:1120px; margin: auto; margin-top:30px; margin-bottom:30px;}
.contactWrap h2{padding-top:20px; margin: auto; margin-bottom:10px; color: #fff; font-size: 24px; text-align: center; line-height: 20px;}
.contactWrap h2 span{font-size: 12px; }
.contact_icon{width: 32px; height: 21px; display: block; margin: auto; background:url(../img/common/icon_contact.svg) no-repeat;}
#contact p{text-align: center; font-size: 15px; line-height:1.6rem; color: #fff;}
#contact p img{margin: auto; margin-top:20px; width: 280px;transition: 0.4s;}	
#contact p img:hover{opacity:0.8; }	
	
#footerNav{width:100%; padding:5px 0; background:#f3f3f3;}
.fnav{width:1120px; margin: auto!important;}
.fnav ul{text-align: center;}
.fnav li{font-size:12px; display: inline; padding:0 10px;}
.fnav li a{text-decoration: none; color: #333;}

#footerWrap{width: 1120px; margin: auto; margin-top:20px; padding-bottom:80px!important;}
.f_left{float: left;}
.f_left h4{ width: 300px; padding-bottom:8px;}
.f_left p{ font-size:12px;}
.f_right{float: right;}
.f_line{width: 290px; padding-bottom:8px;}
.f_right p{font-size:10px; text-align: right;}
.pcnone{display: none;}		
	
#contact_footer{
  width: 180px;
  height: 60px;
  position: fixed;
  right: 0;
  bottom: -80px;
  background: #ea5415;
  opacity: 0.8;
}
#contact_footer a{
  position: relative;
  display: block;
  width: 180px;
  height: 60px;
  text-decoration: none;
}

#contact_footer a::after{
  content: 'お問い合わせ';
  font-size: 17px;
  color: #fff;
  font-weight: bold;
  position: absolute;
  top: 18px;
  bottom: 0;
  right: 0;
  left: 0;
  margin: auto;
  text-align: center;
}	
	
	
.youtubeWrap {
  width: 100%;
	max-width: 720px;
	margin: auto;
	margin-top: 40px;
}	
	
	
}

@media screen and (max-width: 768px) {
header{border-top: solid #036eb8 5px; width:100%; margin-bottom:10px; position: fixed; z-index: 1000;}	
#headerContainer{width:100%; margin: auto; position: fixed; padding:0 0 5px; z-index: 1000; background: #FFF repeat;}
#seo{display: none;}
#logo{width:250px; margin-top: 10px;margin-left:5px;}
.right_button{display: none;}
.smp_button{width:130px; float: right;margin-right:5px;}	
	
.header_cont{ display:none;}	
	
.pc_img{display:none;}	
	
#undermain_Wrap	{position: relative; width:100%; max-width:100%;  padding-top:60px;height: 180px; margin: auto; background: url(../img/common/top_img02.jpg);}
.under_ttl{width:95%;margin: auto;padding-top:46px;}
.under_ttl h2{padding-top:12px; margin: auto; margin-bottom:10px; color: #fff;font-size: 21px; text-align: center; line-height: 20px;}
.under_ttl h2 span{font-size: 11px; }	
	
#gNav{display: none;}
#gNav_smp{width:100%;border-top: #B8B8B8 1px solid; }
#gNav_smp nav{border-left: #B8B8B8 1px solid; width:100%; border-right: #B8B8B8 1px solid;}
#gNav_smp nav ul{}
#gNav_smp nav li{width:33.3%;padding-top:7px;border-right: #B8B8B8 1px solid;border-bottom: #B8B8B8 1px solid; float:left; margin-right: -1px!important;}
#gNav_smpnav li a{text-decoration: none; color: #333333;}
#gNav_smp nav li a:hover{text-decoration:none; color: #333333;}	
	
.pankuzuWrap{width:95%;margin: auto;padding-top:20px;}
.pankuzuWrap li{font-size: 10px; float: left; padding-right:5px; }
.pankuzuWrap li a{text-decoration: none;}	
	
#contact{width:100%; padding:10px 0; background:#036eb8;}
.contactWrap{max-width:95%; margin: auto; margin-top:30px; margin-bottom:30px;}
.contactWrap h2{padding-top:20px; margin: auto; margin-bottom:10px; color: #fff; font-size: 18px; text-align: center; line-height: 23px;}
.contactWrap h2 span{font-size: 12px; }
.contact_icon{width: 32px; height: 21px; display: block; margin: auto; background:url(../img/common/icon_contact.svg) no-repeat;}
#contact p{text-align: center; font-size: 13px; line-height:1.6rem; color: #fff;}	
#contact p img{margin: auto; margin-top:20px; width: 280px;transition: 0.4s;}	
#contact p img a:hover{opacity:0.8;}	
	
#footerNav{width:100%; padding:8px 0; background:#f3f3f3;}
.fnav{width:95%; margin: auto!important;}
.fnav ul{text-align: center;}
.fnav li{font-size:9px; display: inline; line-height: 12px;}
.fnav li a{text-decoration:underline; color: #333;}

#footerWrap{width:95%; margin: auto; margin-top:20px; padding-bottom:10px!important;}
.f_left{margin: auto; padding-bottom:10px; }	
.f_left h4{ max-width: 80%; padding-bottom:10px; margin: auto;}
.f_left p{ font-size:13px;text-align: center;}
.f_right{margin: auto;}	
.f_line{max-width: 65%; padding-bottom:5px; margin: auto;}
.f_right p{font-size:8px; text-align: center;}	
.spnone{display: none;}	
	
#contact_footer{
  display: none;
}
#contact_footer a{
  position: relative;
  display: block;
  width: 120px;
  height: 45px;
  text-decoration: none;
}

#contact_footer a::after{
  content: 'お問い合わせ';
  font-size: 15px;
  color: #fff;
  font-weight: bold;
  position: absolute;
  top: 11px;
  bottom: 0;
  right: 0;
  left: 0;
  margin: auto;
  text-align: center;
}	
	
	
.youtubeWrap {
  width: 90%;
	max-width: 768px;
	margin: auto;
	margin-top: 40px;
}	
		
	
	
}
@media screen and (max-width: 480px){
#logo{width:60%; margin-top: 10px;}
.smp_button{width:100px; float: right;}
.opening_button{ margin: auto; width:240px; margin-top:20px; transition: 0.4s;}
.opening_button:hover{opacity:0.8;}
#contact p img{margin: auto; margin-top:20px; width: 240px;transition: 0.4s;}	
#contact p img:hover{opacity:0.8;}		
.aboutWrap h2{padding-top:20px; margin: auto; display: block; width:260px; margin-bottom:10px;}	
	
}