@charset "utf-8";

/*******************************************
base.css
********************************************/

/* body */
body {
	text-size-adjust: 100%;
	min-width:1024px;
	font-family:"ヒラギノ角ゴ Pro W3","Hiragino Kaku Gothic Pro", "メイリオ", Meiryo, sans-serif;
	font-size:15px;
	line-height:1.8;
    background-color:#fff;
    color: #333;
	letter-spacing: 0.1em;
	/*overflow:scroll;*/
-webkit-text-size-adjust: 100%;

}
/* div */
header,footer,main,div,span,ul,dl{
	box-sizing:border-box;
}
/* a */
a{
	text-decoration: none;
	color:#222;
}

.tags { position: relative; top: -102px; }
#tag-profile.tags { top: -30px; }

#sp_head { display: none; }
.disp_sp { display: none; }

@media screen and (min-width:481px) and (max-width:768px) {
/* タブレット */
	body { min-width:1px; font-size: 14px; }
    .disp_sp { display: block; }
}

@media screen and (min-width:0px) and (max-width: 480px) {
/* スマホ */
	body { min-width:1px; font-size: 12px; line-height: 1.8em; color: #333; -webkit-text-size-adjust: 100%; }
    #sp_head { display: block; }
    .w100 { width: 100%; }
.disp_pc { display: none; }
.disp_sp { display: block; }
.airplanegroup { width: 50px; height:48px; }
.airplanegroup img { width: 100%; height: 100%; }
.tags { position: relative; top: -60px; }
#tag-profile.tags { position: relative; top: 0; }
}

/*---------------------------------------------------------------------
container
---------------------------------------------------------------------*/
#container{
	width:100%;
	position:relative;
    text-align: center;
	overflow:hidden;
    background-color: #fff;
}
/*---------------------------------------------------------------------
header
---------------------------------------------------------------------*/
#header_wrap { top: -140px; }
#navibtn_wrap { top: -140px; }
#first-view { width: 100%; height: 700px; position:relative; overflow:hidden; }
#first-view #img_main {
    position:absolute;
    left:50%;
    width:1400px;
    height:700px;
    margin-left:-700px;
    opacity: 0;
}
#first-view #belt_wrap { width: 1400px; text-align: left; position: absolute; top: 222px; left: 50%; margin-left: -700px; padding-left: 100px; }
#first-view #belt_wrap img { vertical-align: bottom; margin-bottom: 5px; }
#first-view #belt_wrap #belt1 { position: relative; left: -1200px; }
#first-view #belt_wrap #belt2 { position: relative; left: -1200px; }
#first-view #belt_wrap #belt3 { position: relative; left: -1200px; }

#first-view #center_logo { width: 1400px; text-align: center; position: absolute; top: 250px; left: 50%; margin-left: -700px; opacity: 0; }
    
@media screen and (min-width:481px) and (max-width:768px) {
/* タブレット */
#header_wrap { top: -80px; }
#first-view { width: 100%; height: 560px; position:relative; overflow:hidden; }
#first-view #img_main {
    position:absolute;
    left:50%;
    width:1120px;
    height:560px;
    margin-left:-560px;
    opacity: 0;
}
#first-view #sp_center_logo { display: none; }
#first-view #belt_wrap { display: none; }
#first-view #sp_img_main { display: none; }
#first-view #sp_belt_wrap { display: none; }
#first-view #center_logo { width: 100%; text-align: center; position: absolute; top: 130px; left: 0%; margin-left: 0px; opacity: 0; }
#first-view #center_logo img { width: 400px; }
#first-view #catch_wrap { width: 100%; text-align: right; position: absolute; top: 100px; left: 0%; margin-left: 0; }
#first-view #catch_wrap img { vertical-align: bottom; margin-bottom: 16px; }
#first-view #catch_wrap #catch1 { margin-right: 114px; width: 206px; }
#first-view #catch_wrap #catch2 { margin-right: 10px; width: 402px; }
#first-view #catch_wrap #catch3 { margin-right: 101px; width: 217px; }
#first-view #tab_belt_wrap { width: 100%; text-align: right; position: absolute; top: 95px; left: 0%; margin-left: -0px; }
#first-view #tab_belt_wrap img { vertical-align: bottom; margin-bottom: 8px; }
#first-view #tab_belt_wrap #tab_belt1 { position: relative; right: -1000px; width: 476px; }
#first-view #tab_belt_wrap #tab_belt2 { position: relative; right: -1000px; width: 572px; }
#first-view #tab_belt_wrap #tab_belt3 { position: relative; right: -1000px; width: 476px; }
}
@media screen and (min-width:0px) and (max-width: 480px) {
/* スマホ */
#header_wrap { top: -80px; }
#first-view { width: 100%; height: auto; position:relative; overflow:hidden; }
#first-view #sp_img_main { width: 100%; opacity: 0; }
#first-view #belt_wrap { display: none; }
#first-view #tab_belt_wrap { display: none; }
#first-view #sp_belt_wrap { width: 100%; text-align: left; position: absolute; top: 180px; left: 0%; margin-left: 0; padding-left: 8px; }
#first-view #sp_belt_wrap img { vertical-align: bottom; margin-bottom: 4px; }
#first-view #sp_belt_wrap #sp_belt1 { position: relative; left: -1000px; width: 192px; }
#first-view #sp_belt_wrap #sp_belt2 { position: relative; left: -1000px; width: 246px; }
#first-view #sp_belt_wrap #sp_belt3 { position: relative; left: -1000px; width: 300px; }

#first_view.info #belt_wrap { width: 100%; text-align: left; position: absolute; top: 210px; left: 0%; margin-left: 0; }

#first_view.info #belt_wrap img { vertical-align: bottom; margin-bottom: 4px; }
#first_view.info #belt_wrap #belt1 { position: relative; left: -1300px; width: 340px; }
#first_view.info #belt_wrap #belt2 { position: relative; left: -1300px; width: 383px; }
#first_view.info #belt_wrap #belt3 { position: relative; left: -1300px; width: 430px; }


#first-view #catch_wrap { width: 100%; text-align: center; position: absolute; top: 250px; left: 0%; margin-left: 0; }
#first-view #catch_wrap img { vertical-align: bottom; margin-bottom: 16px; }
#first-view #catch_wrap #catch1 { margin-right: 0px; width: 147px; }
#first-view #catch_wrap #catch2 { margin-right: 0px; width: 288px; }
#first-view #catch_wrap #catch3 { margin-right: 0px; width: 155px; }
#first-view #sp_center_logo { width: 100%; text-align: center; position: absolute; top: 140px; left: 0%; margin-left: 0px; opacity: 0; }
#first-view #sp_center_logo img { width: 280px; }
}
/*---------------------------------------------------------------------
header
---------------------------------------------------------------------*/
#header_wrap { width: 100%; height: 67px; border-top: 2px solid #230da2; background-color: rgba(255,255,255,0.6); z-index: 100; position: fixed; padding-top: 10px; }
#header_wrap #header_inner { max-width: 1200px; height: 77px; margin: 0 auto; text-align: left; }
#header_wrap #header_inner p { width: 250px; float: left; }
#header_wrap #header_inner p img {width: 230px; text-shadow: 1px 1px 3px #fff; }
#header_wrap #header_inner p a { display: block; height: 88px; }
#header_wrap #header_inner h1 { width: 250px; float: left; font-size: 20px; font-weight: normal; padding: 8px 0 0 0; text-shadow: 1px 1px 3px #fff; }
#header_wrap #header_inner #head_contact { width: 400px; float: right; }


@media screen and (min-width:481px) and (max-width:768px) {
/* タブレット */
#head_contact { display: none; }
#header_wrap { height: 60px; }
#header_wrap #header_inner { width: 100%; height: auto; }
#header_wrap #header_inner p { width: 140px; float: left; }
#header_wrap #header_inner p img { width: 100%; }
#header_wrap #header_inner p a { display: block; height: auto; }
#header_wrap #header_inner h1 { width: 130px; padding: 8px 0 4px 4px; font-size: 9px; line-height: 1.5em; color: #000; letter-spacing: 0em; }
#header_wrap #header_inner #head_contact { width: 400px; float: right; }
#header_wrap #header_inner #sp_tel { width: 100%; text-align: right; padding: 5px 55px 0 0; }
}

@media screen and (min-width:0px) and (max-width: 480px) {
/* スマホ */
#header_wrap { height: 60px; }
#header_wrap #header_inner { width: 100%; height: auto; }
#header_wrap #header_inner p { width: 140px; float: left; padding-left: 8px; }
#header_wrap #header_inner p img { width: 100%; }
#header_wrap #header_inner p a { display: block; height: auto; }
#header_wrap #header_inner h1 { width: 140px; padding: 8px 0 4px 8px; font-size: 12px; line-height: 1.5em; color: #000; letter-spacing: 0em; }
#header_wrap #header_inner #head_contact { width: 400px; float: right; }
#header_wrap #header_inner #sp_tel { width: 100%; text-align: right; padding: 5px 55px 0 0; }
}
@media screen and (min-width:0px) and (max-width: 359px) {
/* 360px以下 */
#header_wrap #header_inner #sp_tel { display: none; }
}
#header_wrap.info { top: -140px; }
#gnavi_inner.info { top: -140px; }
#img_main.info,#sp_img_main.info { opacity: 0; }

/*---------------------------------------------------------------------
navi
---------------------------------------------------------------------*/
/* gnavi */
#gnavi_inner { width: 100%; height: 36px; clear: both; }
#gnavi_inner ul #navi01 { width: 63px; }
#gnavi_inner ul #navi02 { width: 198px; }
#gnavi_inner ul #navi03 { width: 166px; }
#gnavi_inner ul #navi04 { width: 102px; cursor: pointer; }
#gnavi_inner ul #navi05 { width: 166px; }
#gnavi_inner ul #navi06 { width: 182px; cursor: pointer; }
#gnavi_inner {
  position: fixed; z-index: 999; top: -102px;  background-color: rgba(255,255,255,0.2); transition: .2s;
   /* overflow: hidden; 下のulのcssでリスト全体を右に50%移動しているので、その分幅が広がってしまいスクロールバーが表示されてしまいます。それを防ぐ為の設定です。 */
}

#gnavi_inner ul {
  position: relative;
  left: 50%; /* リスト全体であるul要素を右に50%移動。つまり先頭を中央に持ってくる感じです。 */
  float: left;
}

#gnavi_inner ul li {
  position: relative;
  left: -50%; /* 各リスト項目になるli要素を左に50%移動。 */
  float: left; padding: 0 20px;
}
#gnavi_inner ul li .sub06 { width: 230px; background-color:rgba(255,255,255,0.7); left: 0; top: -9px; padding: 6px 0 0 5px; display: none; }
#gnavi_inner ul li .sub06 li { left: 0; padding: 3px 5px; float: none; text-align: left; }
#gnavi_inner ul li .sub06 li #info_text { font-size: 12px; color:#a20d99; }
#gnavi_inner ul li .sub06 a:hover { color: #a20d99; }

#gnavi_inner ul li .sub04 { width: 250px; background-color:rgba(255,255,255,0.7); left: 0; top: -9px; padding: 6px 0 0 5px; display: none; }
#gnavi_inner ul li .sub04 li { left: 0; padding: 3px 5px; float: none; text-align: left; }
#gnavi_inner ul li .sub04 li #info_text { font-size: 12px; color:#a20d99; }
#gnavi_inner ul li .sub04 a:hover { color: #a20d99; }

#gnavi_inner ul li .sub01 { width: 200px; background-color:rgba(255,255,255,0.7); left: 0; top: -9px; padding: 6px 0 0 5px; display: none; }
#gnavi_inner ul li .sub01 li { left: 0; padding: 3px 5px; float: none; text-align: left; }
#gnavi_inner ul li .sub01 li #info_text { font-size: 12px; color:#a20d99; }
#gnavi_inner ul li .sub01 a:hover { color: #a20d99; }

	/* PC */
		#navibtn_wrap.info { top: -140px; }
		#gnavi_wrap { display: none; }
		#gnavi_wrap_top { display: none; }
		#navibtn_wrap { display: block; }
		#navimenu_wrap { display: block; }
	#sp_head { width: 100%; height: 60px; padding-top: 15px; z-index: 999; position: fixed; }
	#sp_head table { width: 100%; }
	#sp_head table td { vertical-align: middle; }
	#sp_head table #sp_head_h1 { width: 65%; padding-left: 5px; text-align: left; }
	#sp_head table #sp_head_tel { width: 35%; padding-right: 70px; text-align: right; vertical-align: top; }
	#sp_head table #sp_head_tel img { width: 28px; opacity: .8; }
	#sp_navi_head { position :absolute; top: 13px; left: 25px; }
	#sp_navi_head #sp_navi_tel img { width: 83px;}
	#sp_navi_head #sp_navi_contact img { width: 140px;}
	#navibtn_wrap{
		position: fixed;
		top: 5px;
		right:5px;
		z-index:9999;
		width:50px;
		height:50px;
		padding:10px 11px;
		cursor:pointer;
		/*border:1px solid #f00;*/
		background:none;
		border-radius: 3px;
			-webkit-border-radius: 3px;
				-moz-border-radius: 3px;
		-moz-transition:		height .8s cubic-bezier(.645, .045, .355, 1);
		-webkit-transition:	height .8s cubic-bezier(.645, .045, .355, 1);
		-o-transition:			height .8s cubic-bezier(.645, .045, .355, 1);
		-ms-transition:			height .8s cubic-bezier(.645, .045, .355, 1);
	}
	.m_icon_line { opacity: 1; }
		#navibtn_wrap.active{
			height:43px;
			top: 5px;
		}
		#navibtn_menu{
			position:absolute;
			top:34px;
			left:11px;
			width:35px;
			height:9px;
		}
		#navibtn_menu img{
			height: 8px;
			display: block;
			position: absolute;
			top:0;
			-moz-transition:		all .8s cubic-bezier(.645, .045, .355, 1);
			-webkit-transition:	all .8s cubic-bezier(.645, .045, .355, 1);
			-o-transition:			all .8s cubic-bezier(.645, .045, .355, 1);
			-ms-transition:			all .8s cubic-bezier(.645, .045, .355, 1);
		}
		.m_icon_string1{
			left:0;
		}
			.m_icon_string1.active{
				-moz-transform:		translate(0, 58px) rotate(-45deg);
				-webkit-transform:	translate(0, 58px) rotate(-45deg);
				-o-transform:			translate(0, 58px) rotate(-45deg);
				-ms-transform:		translate(0, 58px) rotate(-45deg);
				opacity: 0;
			}
		.m_icon_string2{
			left:9px;
		}
			.m_icon_string2.active{
				-moz-transform:		translate(0, 68px) rotate(45deg);
				-webkit-transform:	translate(0, 68px) rotate(45deg);
				-o-transform:			translate(0, 68px) rotate(45deg);
				-ms-transform:		translate(0, 68px) rotate(45deg);
				opacity: 0;
			}
		.m_icon_string3{
			left:15px;
		}
			.m_icon_string3.active{
				-moz-transform:		translate(0, 48px) rotate(45deg);
				-webkit-transform:	translate(0, 48px) rotate(45deg);
				-o-transform:			translate(0, 48px) rotate(45deg);
				-ms-transform:		translate(0, 48px) rotate(45deg);
				opacity: 0;
			}
		.m_icon_string4{
			left:22px;
		}
			.m_icon_string4.active{
				-moz-transform:		translate(0, 58px) rotate(-45deg);
				-webkit-transform:	translate(0, 58px) rotate(-45deg);
				-o-transform:			translate(0, 58px) rotate(-45deg);
				-ms-transform:		translate(0, 58px) rotate(-45deg);
				opacity: 0;
			}
	
		/* opencloseボタン */
		#navibtn{
			position:relative;
			width:30px;
			height:28px;
			/*border:#FF6600 1px solid;*/
		}
		#navibtn .m_icon_line{
			width: 30px;
			height: 5px;
			display: block;
			/*background: #221815;*/
			position: absolute;
			left:0;
			-moz-transition:		all .8s cubic-bezier(.645, .045, .355, 1);
			-webkit-transition:	all .8s cubic-bezier(.645, .045, .355, 1);
			-o-transition:			all .8s cubic-bezier(.645, .045, .355, 1);
			-ms-transition:			all .8s cubic-bezier(.645, .045, .355, 1);
			-webkit-box-shadow: 0 10px 8px -6px #fff;
			-moz-box-shadow: 0 10px 8px -6px #fff;
			 box-shadow: 0 10px 8px -6px #fff
		}
		#m_icon_line1{
			top:0px;
		}
			#m_icon_line1.active{
				-moz-transform:		translate(0px, 8px) rotate(-45deg);
				-webkit-transform:	translate(0px, 8px) rotate(-45deg);
				-o-transform:			translate(0px, 8px) rotate(-45deg);
				-ms-transform:		translate(0px, 8px) rotate(-45deg);
			}
		#m_icon_line2{
			top:8px;
		}
			#m_icon_line2.active{
				-moz-transform:		translate(0px, 0px) rotate(45deg);
				-webkit-transform:	translate(0px, 0px) rotate(45deg);
				-o-transform:			translate(0px, 0px) rotate(45deg);
				-ms-transform:		translate(0px, 0px) rotate(45deg);
			}
		#m_icon_line3{
			top:16px;
		}
			#m_icon_line3.active{
				-moz-transform:		translate(0, 20px) rotate(-45deg);
				-webkit-transform:	translate(0, 20px) rotate(-45deg);
				-o-transform:			translate(0, 20px) rotate(-45deg);
				-ms-transform:		translate(0, 20px) rotate(-45deg);
				opacity: 0;
			}
	
	/* navimenu */
	#navimenu_wrap{
		font-size:12px;
		overflow: auto;
		position: fixed;
		top: 0;
		right:-330px;
		z-index:500;
		width:330px;
		height:100%;
		padding:50px 0 40px 0;
		background-color:rgba(51,51,51,.8);
		z-index: 1000;
	}
	
	#navimenu_wrap .social { width: 100%; text-align: center; padding-left: 15px; padding-top: 7px; }
	#navimenu_wrap .social a { margin-right: 18px; }
	#navimenu_wrap .social a img { width: 26px; }
	
	#navimenu_wrap a { text-decoration: none; }
	
		.inner_textbox{
			position:relative;
			border-bottom:solid #fff 1px;
			line-height: 1em;
			padding: 10px 0 5px 0;
			text-align: left;
		}
		.btn_naviopen{
			position:absolute;
			top:10px;
			right:25px;
			width:24px;
			height:17px;
			cursor:pointer;
		}
		.btn_naviclose{
			position:absolute;
			top:7px;
			right:27px;
			width:17px;
			height:24px;
			display:none;
			cursor:pointer;
		}
		.a_main{
			width:310px;
			font-size:16px;
			line-height: 1.3em;
			padding-left:25px;
			padding-bottom: 4px;
			color: #fff;
		}
		.a_sub{
			width:310px;
			font-size:14px;
			line-height: 1em;
			padding: 8px 0 0 44px;
			color: #fff;
			height: 33px;
		}
		.a_sub li { /* text-decoration: underline; */ }
		.a_sub li #info_text { font-size: 13px; color: #fff; }
		div.t_active { background: url("../images/icon_active3.png") no-repeat 12px 4px; background-size:7px 12px; }
		
		div.t_active.a_sub { background: url("../images/icon_active3.png") no-repeat 30px 9px; background-size:7px 12px; }
		
		#navimenu_wrap #navimenu_logo{
			position:absolute;
			top:14px;
			left:115px;
			width:50px;
			height:30px;
		}
		#navimenu_wrap #navimenu_logo img { width: 100%; }
		#navimenu_wrap ul#navimenu1{
			border-top:1px solid  #fff;
		}
		#navimenu_wrap ul#navimenu1 li.menu_main{
			border-bottom:1px solid  #fff;
		}
		#navimenu_wrap ul.navimenu_sub{
			padding-left:30px;
		}
	
		.menu_group{
		}
		.menu_group li.menu_main{
			padding-left:15px;
		}
			.menu_group sub_menu1{
				
			}
		.menu_group li a{
			display:inline;
			padding:2px 10px 2px 0;
			letter-spacing:1px;
			color:#ffffff;
			text-align: left;
		}
		.menu_group li a:hover{
			color:#ffffff;
		}
		.menu_group li.active a{
			color:#cccccc;
		}
		.navimenu_anime{
			-moz-transition:		all .35s cubic-bezier(.645, .045, .355, 1);
			-webkit-transition:	all .35s cubic-bezier(.645, .045, .355, 1);
			-o-transition:			all .35s cubic-bezier(.645, .045, .355, 1);
			-ms-transition:			all .35s cubic-bezier(.645, .045, .355, 1);
		}
		.navimenu_anime.active{
			-moz-transform:		translate(-320px, 0);
			-webkit-transform:	translate(-320px, 0);
			-o-transform:			translate(-320px, 0);
			-ms-transform:		translate(-320px, 0);
		}
		#navimenu1{
			margin-bottom:20px;
		}
		
		.menu_group span.sub{ font-size: 11px; line-height: 1.2em; padding-left: 10px; }
	
	

@media screen and (min-width:0px) and (max-width: 480px) {
/* スマホ */
	#navibtn_wrap.info { top: -140px; }
	#gnavi_wrap { display: none; }
    #gnavi_wrap_top { display: none; }
    #navibtn_wrap { display: block; }
	#navimenu_wrap { display: block; }
#sp_head { width: 100%; height: 60px; padding-top: 15px; z-index: 999; position: fixed; }
#sp_head table { width: 100%; }
#sp_head table td { vertical-align: middle; }
#sp_head table #sp_head_h1 { width: 65%; padding-left: 5px; text-align: left; }
#sp_head table #sp_head_tel { width: 35%; padding-right: 70px; text-align: right; vertical-align: top; }
#sp_head table #sp_head_tel img { width: 28px; opacity: .8; }
#sp_navi_head { position :absolute; top: 13px; left: 25px; }
#sp_navi_head #sp_navi_tel img { width: 83px;}
#sp_navi_head #sp_navi_contact img { width: 140px;}
#navibtn_wrap{
	position: fixed;
	top: 5px;
	right:5px;
	z-index:9999;
	width:50px;
	height:50px;
	padding:10px 11px;
	cursor:pointer;
	/*border:1px solid #f00;*/
	background:none;
	border-radius: 3px;
		-webkit-border-radius: 3px;
			-moz-border-radius: 3px;
	-moz-transition:		height .8s cubic-bezier(.645, .045, .355, 1);
	-webkit-transition:	height .8s cubic-bezier(.645, .045, .355, 1);
	-o-transition:			height .8s cubic-bezier(.645, .045, .355, 1);
	-ms-transition:			height .8s cubic-bezier(.645, .045, .355, 1);
}
.m_icon_line { opacity: 1; }
	#navibtn_wrap.active{
		height:43px;
        top: 5px;
	}
	#navibtn_menu{
		position:absolute;
		top:34px;
		left:11px;
		width:35px;
		height:9px;
	}
	#navibtn_menu img{
		height: 8px;
		display: block;
		position: absolute;
		top:0;
		-moz-transition:		all .8s cubic-bezier(.645, .045, .355, 1);
		-webkit-transition:	all .8s cubic-bezier(.645, .045, .355, 1);
		-o-transition:			all .8s cubic-bezier(.645, .045, .355, 1);
		-ms-transition:			all .8s cubic-bezier(.645, .045, .355, 1);
	}
	.m_icon_string1{
		left:0;
	}
		.m_icon_string1.active{
			-moz-transform:		translate(0, 58px) rotate(-45deg);
			-webkit-transform:	translate(0, 58px) rotate(-45deg);
			-o-transform:			translate(0, 58px) rotate(-45deg);
			-ms-transform:		translate(0, 58px) rotate(-45deg);
			opacity: 0;
		}
	.m_icon_string2{
		left:9px;
	}
		.m_icon_string2.active{
			-moz-transform:		translate(0, 68px) rotate(45deg);
			-webkit-transform:	translate(0, 68px) rotate(45deg);
			-o-transform:			translate(0, 68px) rotate(45deg);
			-ms-transform:		translate(0, 68px) rotate(45deg);
			opacity: 0;
		}
	.m_icon_string3{
		left:15px;
	}
		.m_icon_string3.active{
			-moz-transform:		translate(0, 48px) rotate(45deg);
			-webkit-transform:	translate(0, 48px) rotate(45deg);
			-o-transform:			translate(0, 48px) rotate(45deg);
			-ms-transform:		translate(0, 48px) rotate(45deg);
			opacity: 0;
		}
	.m_icon_string4{
		left:22px;
	}
		.m_icon_string4.active{
			-moz-transform:		translate(0, 58px) rotate(-45deg);
			-webkit-transform:	translate(0, 58px) rotate(-45deg);
			-o-transform:			translate(0, 58px) rotate(-45deg);
			-ms-transform:		translate(0, 58px) rotate(-45deg);
			opacity: 0;
		}

	/* opencloseボタン */
	#navibtn{
		position:relative;
		width:30px;
		height:28px;
		/*border:#FF6600 1px solid;*/
	}
	#navibtn .m_icon_line{
		width: 30px;
        height: 5px;
        display: block;
		/*background: #221815;*/
        position: absolute;
        left:0;
		-moz-transition:		all .8s cubic-bezier(.645, .045, .355, 1);
		-webkit-transition:	all .8s cubic-bezier(.645, .045, .355, 1);
		-o-transition:			all .8s cubic-bezier(.645, .045, .355, 1);
		-ms-transition:			all .8s cubic-bezier(.645, .045, .355, 1);
        -webkit-box-shadow: 0 10px 8px -6px #fff;
	    -moz-box-shadow: 0 10px 8px -6px #fff;
	     box-shadow: 0 10px 8px -6px #fff
	}
	#m_icon_line1{
		top:0px;
	}
		#m_icon_line1.active{
			-moz-transform:		translate(0px, 8px) rotate(-45deg);
			-webkit-transform:	translate(0px, 8px) rotate(-45deg);
			-o-transform:			translate(0px, 8px) rotate(-45deg);
			-ms-transform:		translate(0px, 8px) rotate(-45deg);
		}
	#m_icon_line2{
		top:8px;
	}
		#m_icon_line2.active{
			-moz-transform:		translate(0px, 0px) rotate(45deg);
			-webkit-transform:	translate(0px, 0px) rotate(45deg);
			-o-transform:			translate(0px, 0px) rotate(45deg);
			-ms-transform:		translate(0px, 0px) rotate(45deg);
		}
	#m_icon_line3{
		top:16px;
	}
		#m_icon_line3.active{
			-moz-transform:		translate(0, 20px) rotate(-45deg);
			-webkit-transform:	translate(0, 20px) rotate(-45deg);
			-o-transform:			translate(0, 20px) rotate(-45deg);
			-ms-transform:		translate(0, 20px) rotate(-45deg);
			opacity: 0;
		}

/* navimenu */
#navimenu_wrap{
	font-size:12px;
	overflow: auto;
	position: fixed;
	top: 0;
	right:-330px;
	z-index:500;
	width:330px;
	height:100%;
	padding:50px 0 40px 0;
	background-color:rgba(51,51,51,.8);
    z-index: 1000;
}

#navimenu_wrap .social { width: 100%; text-align: center; padding-left: 15px; padding-top: 7px; }
#navimenu_wrap .social a { margin-right: 18px; }
#navimenu_wrap .social a img { width: 26px; }

#navimenu_wrap a { text-decoration: none; }

	.inner_textbox{
		position:relative;
		border-bottom:solid #fff 1px;
        line-height: 1em;
        padding: 10px 0 5px 0;
        text-align: left;
	}
	.btn_naviopen{
		position:absolute;
		top:10px;
		right:25px;
		width:24px;
		height:17px;
		cursor:pointer;
	}
	.btn_naviclose{
		position:absolute;
		top:7px;
		right:27px;
		width:17px;
		height:24px;
		display:none;
		cursor:pointer;
	}
	.a_main{
		width:310px;
		font-size:16px;
        line-height: 1.3em;
		padding-left:25px;
        padding-bottom: 4px;
        color: #fff;
	}
    .a_sub{
		width:310px;
		font-size:16px;
        line-height: 1em;
        padding: 8px 0 0 44px;
        color: #fff;
        height: 33px;
	}
    .a_sub li { /* text-decoration: underline; */ }
    .a_sub li #info_text { font-size: 13px; color: #fff; }
    div.t_active { background: url("../images/icon_active3.png") no-repeat 12px 4px; background-size:7px 12px; }
	
    div.t_active.a_sub { background: url("../images/icon_active3.png") no-repeat 30px 9px; background-size:7px 12px; }
    
    #navimenu_wrap #navimenu_logo{
		position:absolute;
		top:14px;
		left:115px;
		width:50px;
		height:30px;
	}
    #navimenu_wrap #navimenu_logo img { width: 100%; }
	#navimenu_wrap ul#navimenu1{
		border-top:1px solid  #fff;
	}
	#navimenu_wrap ul#navimenu1 li.menu_main{
		border-bottom:1px solid  #fff;
	}
	#navimenu_wrap ul.navimenu_sub{
		padding-left:30px;
	}

	.menu_group{
	}
	.menu_group li.menu_main{
		padding-left:15px;
	}
		.menu_group sub_menu1{
			
		}
	.menu_group li a{
		display:inline;
		padding:2px 10px 2px 0;
		letter-spacing:1px;
		color:#ffffff;
		text-align: left;
	}
	.menu_group li a:hover{
		color:#ffffff;
	}
	.menu_group li.active a{
		color:#cccccc;
	}
	.navimenu_anime{
		-moz-transition:		all .35s cubic-bezier(.645, .045, .355, 1);
		-webkit-transition:	all .35s cubic-bezier(.645, .045, .355, 1);
		-o-transition:			all .35s cubic-bezier(.645, .045, .355, 1);
		-ms-transition:			all .35s cubic-bezier(.645, .045, .355, 1);
	}
	.navimenu_anime.active{
		-moz-transform:		translate(-320px, 0);
		-webkit-transform:	translate(-320px, 0);
		-o-transform:			translate(-320px, 0);
		-ms-transform:		translate(-320px, 0);
	}
	#navimenu1{
		margin-bottom:20px;
	}
    
    .menu_group span.sub{ font-size: 11px; line-height: 1.2em; padding-left: 10px; }

}

@media screen and (min-width:481px) and (max-width:768px) {
/* タブレット */
	#gnavi_inner { display: none; }
	#gnavi_wrap { display: none; }
    #gnavi_wrap_top { display: none; }
    #navibtn_wrap { display: block; }
	#navimenu_wrap { display: block; }
#sp_head { width: 100%; height: 60px; padding-top: 15px; display: block; z-index: 999; position: fixed; top: 0; }
#sp_head table { width: 100%; }
#sp_head table td { vertical-align: middle; }
#sp_head table #sp_head_h1 { width: 30%; padding-left: 5px; text-align: left; }
#sp_head table #sp_head_tel { width: 35%; padding-right: 70px; text-align: right; vertical-align: top; }
#sp_head table #sp_head_tel img { width: 28px; opacity: .8; }
#sp_navi_head { position :absolute; top: 14px; left: 25px; }
#sp_navi_head #sp_navi_tel img { width: 83px;}
#sp_navi_head #sp_navi_contact img { width: 140px;}
.a_sub li #info_text { font-size: 13px; color: #fff; }
#navibtn_wrap{
	position: fixed;
	top: 5px;
	right:5px;
	z-index:9999;
	width:50px;
	height:50px;
	padding:10px 11px;
	cursor:pointer;
	/*border:1px solid #f00;*/
	background:none;
	border-radius: 3px;
		-webkit-border-radius: 3px;
			-moz-border-radius: 3px;
	-moz-transition:		height .8s cubic-bezier(.645, .045, .355, 1);
	-webkit-transition:	height .8s cubic-bezier(.645, .045, .355, 1);
	-o-transition:			height .8s cubic-bezier(.645, .045, .355, 1);
	-ms-transition:			height .8s cubic-bezier(.645, .045, .355, 1);
}
	#navibtn_wrap.active{
		height:43px;
	}
	#navibtn_menu{
		position:absolute;
		top:34px;
		left:11px;
		width:35px;
		height:8px;
	}
	#navibtn_menu img{
		height: 8px;
		display: block;
		position: absolute;
		top:0;
		-moz-transition:		all .8s cubic-bezier(.645, .045, .355, 1);
		-webkit-transition:	all .8s cubic-bezier(.645, .045, .355, 1);
		-o-transition:			all .8s cubic-bezier(.645, .045, .355, 1);
		-ms-transition:			all .8s cubic-bezier(.645, .045, .355, 1);
	}
	.m_icon_string1{
		left:0;
	}
		.m_icon_string1.active{
			-moz-transform:		translate(0, 58px) rotate(-45deg);
			-webkit-transform:	translate(0, 58px) rotate(-45deg);
			-o-transform:			translate(0, 58px) rotate(-45deg);
			-ms-transform:		translate(0, 58px) rotate(-45deg);
			opacity: 0;
		}
	.m_icon_string2{
		left:9px;
	}
		.m_icon_string2.active{
			-moz-transform:		translate(0, 68px) rotate(45deg);
			-webkit-transform:	translate(0, 68px) rotate(45deg);
			-o-transform:			translate(0, 68px) rotate(45deg);
			-ms-transform:		translate(0, 68px) rotate(45deg);
			opacity: 0;
		}
	.m_icon_string3{
		left:15px;
	}
		.m_icon_string3.active{
			-moz-transform:		translate(0, 48px) rotate(45deg);
			-webkit-transform:	translate(0, 48px) rotate(45deg);
			-o-transform:			translate(0, 48px) rotate(45deg);
			-ms-transform:		translate(0, 48px) rotate(45deg);
			opacity: 0;
		}
	.m_icon_string4{
		left:22px;
	}
		.m_icon_string4.active{
			-moz-transform:		translate(0, 58px) rotate(-45deg);
			-webkit-transform:	translate(0, 58px) rotate(-45deg);
			-o-transform:			translate(0, 58px) rotate(-45deg);
			-ms-transform:		translate(0, 58px) rotate(-45deg);
			opacity: 0;
		}

	/* opencloseボタン */
	#navibtn{
		position:relative;
		width:30px;
		height:25px;
		/*border:#FF6600 1px solid;*/
	}
	#navibtn .m_icon_line{
		width: 30px;
        height: 5px;
        display: block;
		/*background: #221815;*/
        position: absolute;
        left:0;
		-moz-transition:		all .8s cubic-bezier(.645, .045, .355, 1);
		-webkit-transition:	all .8s cubic-bezier(.645, .045, .355, 1);
		-o-transition:			all .8s cubic-bezier(.645, .045, .355, 1);
		-ms-transition:			all .8s cubic-bezier(.645, .045, .355, 1);
	}
	#m_icon_line1{
		top:0px;
	}
		#m_icon_line1.active{
			-moz-transform:		translate(0px, 8px) rotate(-45deg);
			-webkit-transform:	translate(0px, 8px) rotate(-45deg);
			-o-transform:			translate(0px, 8px) rotate(-45deg);
			-ms-transform:		translate(0px, 8px) rotate(-45deg);
		}
	#m_icon_line2{
		top:8px;
	}
		#m_icon_line2.active{
			-moz-transform:		translate(0px, 0px) rotate(45deg);
			-webkit-transform:	translate(0px, 0px) rotate(45deg);
			-o-transform:			translate(0px, 0px) rotate(45deg);
			-ms-transform:		translate(0px, 0px) rotate(45deg);
		}
	#m_icon_line3{
		top:16px;
	}
		#m_icon_line3.active{
			-moz-transform:		translate(0, 20px) rotate(-45deg);
			-webkit-transform:	translate(0, 20px) rotate(-45deg);
			-o-transform:			translate(0, 20px) rotate(-45deg);
			-ms-transform:		translate(0, 20px) rotate(-45deg);
			opacity: 0;
		}

/* navimenu */
#navimenu_wrap{
	font-size:12px;
	overflow: auto;
	position: fixed;
	top: 0;
	right:-330px;
	z-index:500;
	width:330px;
	height:100%;
	padding:50px 0 40px 0;
	background-color:rgba(51,51,51,.8);
    z-index: 1000;
}

#navimenu_wrap .social { width: 100%; text-align: left; padding-left: 25px; }
#navimenu_wrap .social a { margin-right: 18px; }
#navimenu_wrap .social a img { width: 30px; }

#navimenu_wrap a { text-decoration: none; }

	.inner_textbox{
		position:relative;
		border-bottom:solid #fff 1px;
        line-height: 1em;
        padding: 10px 0 5px 0;
        text-align: left;
	}
	.btn_naviopen{
		position:absolute;
		top:10px;
		right:25px;
		width:24px;
		height:17px;
		cursor:pointer;
	}
	.btn_naviclose{
		position:absolute;
		top:7px;
		right:27px;
		width:17px;
		height:24px;
		display:none;
		cursor:pointer;
	}
    .a_main{
		width:310px;
		font-size:16px;
        line-height: 1.3em;
		padding-left:25px;
        padding-bottom: 4px;
        color: #fff;
	}
    .a_sub{
		width:310px;
		font-size:16px;
        line-height: 1em;
        padding: 8px 0 0 44px;
        color: #fff;
        height: 33px;
	}

    div.t_active { background: url("../images/icon_active3.png") no-repeat 12px 4px; background-size:7px 12px; }
    div.t_active.a_sub { background: url("../images/icon_active3.png") no-repeat 30px 9px; background-size:7px 12px; }

	#navimenu_wrap #navimenu_logo{
		position:absolute;
		top:14px;
		left:115px;
		width:50px;
		height:30px;
	}
    #navimenu_wrap #navimenu_logo img { width: 100%; }
	#navimenu_wrap ul#navimenu1{
		border-top:1px solid  #fff;
	}
	#navimenu_wrap ul#navimenu1 li.menu_main{
		border-bottom:1px solid  #fff;
	}
	#navimenu_wrap ul.navimenu_sub{
		padding-left:30px;
	}

	.menu_group{
	}
	.menu_group li.menu_main{
		padding-left:15px;
	}
		.menu_group sub_menu1{
			
		}
	.menu_group li a{
		display:inline;
		padding:2px 10px 2px 0;
		letter-spacing:1px;
		color:#ffffff;
		text-align: left;
	}
	.menu_group li a:hover{
		color:#ffffff;
	}
	.menu_group li.active a{
		color:#cccccc;
	}
	.navimenu_anime{
		-moz-transition:		all .35s cubic-bezier(.645, .045, .355, 1);
		-webkit-transition:	all .35s cubic-bezier(.645, .045, .355, 1);
		-o-transition:			all .35s cubic-bezier(.645, .045, .355, 1);
		-ms-transition:			all .35s cubic-bezier(.645, .045, .355, 1);
	}
	.navimenu_anime.active{
		-moz-transform:		translate(-320px, 0);
		-webkit-transform:	translate(-320px, 0);
		-o-transform:			translate(-320px, 0);
		-ms-transform:		translate(-320px, 0);
	}
	#navimenu1{
		margin-bottom:20px;
	}
    
    .menu_group span.sub{ font-size: 11px; line-height: 1.2em; padding-left: 10px; }



}

/*---------------------------------------------------------------------
content
---------------------------------------------------------------------*/
/* content */
#content_wrap{
	position:relative;
	width:100%;
	z-index:2;
}

/*---------------------------------------------------------------------
bottom_link
---------------------------------------------------------------------*/
#bottom_link { width: 100%; text-align: center; }
#bottom_link a { margin: 0 15px; }
#bottom_link a.btn_fb img,
#bottom_link a.btn_tw img,
#bottom_link a.btn_in img { width: 36px; }
#bottom_link #tel_contact { width: 100%; margin: 50px 0 50px 0; }
#bottom_link #tel_contact table { width: 460px; margin: 0 auto; }
#bottom_link #tel_contact table a { margin: 0; }
#bottom_link #tel_contact table img { margin: 0 15px; width: 200px; }

@media screen and (min-width:0px) and (max-width: 480px) {
/* スマホ */
#bottom_link a { margin: 0 10px; }
#bottom_link a .btn_fb,
#bottom_link a .btn_tw { width: 32px; }
#bottom_link a.btn_fb img,
#bottom_link a.btn_tw img,
#bottom_link a.btn_in img { width: 28px; }
#bottom_link #tel_contact { width: 100%; margin: 30px 0 50px 0; }
#bottom_link #tel_contact table { width: 100%; margin: 0 auto; }
#bottom_link #tel_contact table,
#bottom_link #tel_contact tbody,
#bottom_link #tel_contact tr,
#bottom_link #tel_contact th,
#bottom_link #tel_contact td { display: block; }
#bottom_link #tel_contact table img { width: 50%; }
}

/*---------------------------------------------------------------------
footer
---------------------------------------------------------------------*/
#footer{ width:100%; padding-top: 60px; background: url("../images/bg_footer.png") no-repeat top; background-size: cover; }
#footer #footer_logo { width: 100%; padding-bottom: 30px; }
#footer #footer_inner { width: 100%; margin-bottom: 60px; }
#footer #footer_inner ul { text-align: center; }
#footer .footer_link { background: url("../images/h_line.png") no-repeat; background-position: left top 4px; }
#footer .footer_link a { color: #fff; float: left; text-shadow: 0px 0px 3px #000; font-size: 13px; padding: 0 10px; font-weight: bold; letter-spacing: 0; }

#footer #footer_inner {
  position: relative; 
  overflow: hidden; /* 下のulのcssでリスト全体を右に50%移動しているので、その分幅が広がってしまいスクロールバーが表示されてしまいます。それを防ぐ為の設定です。 */
}

#footer #footer_inner ul {
  position: relative;
  left: 50%; /* リスト全体であるul要素を右に50%移動。つまり先頭を中央に持ってくる感じです。 */
  float: left;
}

#footer #footer_inner ul li {
  position: relative;
  left: -50%; /* 各リスト項目になるli要素を左に50%移動。 */
  float: left;
  list-style: none; /* 項目にぼっちを出したくない場合はこれを設定（今回はあんまり関係ないですが） */
}
#footer #footer_inner ul li img { width: 160px; }

#footer #copy { clear: both; width: 100%; text-shadow: 0px 0px 3px #000; padding-bottom: 15px; text-align: center; color: #fff; font-size: 12px; }

@media screen and (min-width:481px) and (max-width:768px) {
/* タブレット */
}
@media screen and (min-width:0px) and (max-width: 480px) {
/* スマホ */
#footer #footer_inner { width: 100%; margin-bottom: 40px; }
#footer #footer_inner ul { text-align: center; }
#footer .footer_link { background: none; }
#footer .footer_link a { color: #fff; float: none; text-shadow: 0px 0px 3px #000; font-size: 15px; padding: 0 10px; font-weight: bold; letter-spacing: 0; }

#footer #footer_inner {
  position: relative; 
  overflow: hidden; /* 下のulのcssでリスト全体を右に50%移動しているので、その分幅が広がってしまいスクロールバーが表示されてしまいます。それを防ぐ為の設定です。 */
}

#footer #footer_inner ul {
  position: relative;
  left: 0%; /* リスト全体であるul要素を右に50%移動。つまり先頭を中央に持ってくる感じです。 */
  float: none;
}

#footer #footer_inner ul li {
  position: relative;
  left: 0%; /* 各リスト項目になるli要素を左に50%移動。 */
  float: none; line-height: 2.5em;
}
#footer #footer_inner ul li img { width: 160px; }


}

/*---------------------------------------------------------------------
common
---------------------------------------------------------------------*/

/* gopagetop */
.gopagetop_wrap{
	width:100%;
text-align: right;
margin: 80px 0; padding-right: 80px;
}


	/* debug */
	.debug_border{
		border:1px solid #f00;
	}
    
@media screen and (min-width:481px) and (max-width:768px) {
/* タブレット */
.gopagetop_wrap{ width: 100%; }
}

@media screen and (min-width:0px) and (max-width: 480px) {
/* スマホ */
.gopagetop_wrap{
	width:100%;
text-align: right;
margin: 30px 0; padding-right: 10px;
}
.gopagetop_wrap img { width: 70px; }
}

	
@media screen and (min-width:481px) and (max-width:768px) {
/* タブレット */
	.w100 { width: 100%; }
}

#sp_head h1 img { width: 60px; padding-left: 10px; }

/* tag */
.tag{
	height:0;
}

.target_disp{
	opacity:0;
	-moz-transition: all 1.8s cubic-bezier(0.165, 0.84, 0.44, 1) .3s;
	-webkit-transition: all 1.8s cubic-bezier(0.165, 0.84, 0.44, 1) .3s;
	-o-transition: all 1.8s cubic-bezier(0.165, 0.84, 0.44, 1) .3s;
	-ms-transition: all 1.8s cubic-bezier(0.165, 0.84, 0.44, 1) .3s;
}
.target_disp.active{
	opacity:1;
}

/* textanimation action */
.text_act{
	letter-spacing:0;
	display: inline-block;
	opacity:0;
	-moz-transition: .5s cubic-bezier(0.165, 0.84, 0.44, 1);
	-webkit-transition: .5s cubic-bezier(0.165, 0.84, 0.44, 1);
	-o-transition: .5s cubic-bezier(0.165, 0.84, 0.44, 1);
	-ms-transition: .5s cubic-bezier(0.165, 0.84, 0.44, 1);
}
.d_type1{ transform: translate(50px,10px);transition-delay:.5s;}
.d_type2{ transform: translate(55px,20px);transition-delay:.6s;}
.d_type3{	transform: translate(60px,20px);transition-delay:.7s;}
.d_type4{	transform: translate(65px,30px);transition-delay:.8s;}
.d_type5{	transform: translate(70px,30px);transition-delay:.9s;}
.d_type6{	transform: translate(75px,30px);transition-delay:1.0s;}
.d_type7{	transform: translate(80px,-10px);transition-delay:1.1s;}
.d_type8{	transform: translate(85px,30px);transition-delay:1.2s;}
.d_type9{	transform: translate(90px,-20px);transition-delay:1.3s;}
.d_type10{	transform: translate(95px,10px);transition-delay:1.4s;}
.d_type11{	transform: translate(100px,-30px);transition-delay:1.5s;}
.d_type12{	transform: translate(105px,30px);transition-delay:1.6s;}
.d_type13{	transform: translate(110px,20px);transition-delay:1.7s;}
.d_type14{	transform: translate(115px,-20px);transition-delay:1.8s;}
.d_type15{	transform: translate(120px,40px);transition-delay:1.9s;}
.d_type16{	transform: translate(125px,-30px);transition-delay:2.0s;}
.d_type17{	transform: translate(130px,-30px);transition-delay:2.1s;}
.d_type18{	transform: translate(135px,-30px);transition-delay:2.2s;}
.d_type19{	transform: translate(140px,-30px);transition-delay:2.3s;}
.d_type20{	transform: translate(145px,-30px);transition-delay:2.4s;}
.d_type21{	transform: translate(150px,-30px);transition-delay:2.5s;}
.d_type22{	transform: translate(155px,-30px);transition-delay:2.6s;}
.d_type23{	transform: translate(160px,-30px);transition-delay:2.7s;}
.text_act.active{
	opacity:1;
	transform: translate(0px,0px)
}