@charset "utf-8";

/*
 * Site Name: connetta WEB Smart5
 * File Name base_op.css
 * Description: Basic Style for Responsive
 * Version: 1.0
 * Author: DIS_ART_WORKS
 */


/*=========================================================================================
for 1001 -
=========================================================================================*/
@media screen and (min-width: 1001px){

	#content_wrapper{
		padding-top: 0 !important;
	}

	#navs{
		display: block !important;
	    right: auto !important;
	    left: auto !important;
	}

	#navs_wrapper_p{
		display: none;
	}
}

/*=========================================================================================
for 1001 - 1296px
=========================================================================================*/
@media screen and (min-width: 1001px) and (max-width: 1296px){

	#side_column {
		width: 22%;
	}

	#ex_nav ul{
		width: 100%;
	}

	ul#main_nav{
		width: 100%;
	}

	ul#main_nav ul.child_nav{
		left: auto;
		right: 2.2%;
	}

	ul#topicpath{
		width: 100%;
		padding: 6px 4%;
	}

	#main_images{
		height: auto;
	}

	#main_image p{
	    width: 100%;
	    padding: 0 4%;
	    box-sizing: border-box;
	}

	#main_image p:after{
		right: 4%;
	}

	#bottom_wrapper ul{
		width: 100%;
	}

	ul#footer_nav{
		width: 100%;
	}

}

@media screen and (min-width: 1101px) and (max-width: 1296px){

	ul#main_nav ul.child_nav{
		left: auto;
		right: 8.2%;
	}

}
/*=========================================================================================
for PC 1000以下
=========================================================================================*/
@media only screen and (max-width: 1000px){

			#side_column {
				width: 22%;
			}

			#header_wrapper{
				padding: 0;
				box-sizing: border-box;
			}

			#header{
				display: block;
			}

			#header_left{
				display: none;
			}

			#ex_nav{
				display: none;
			}

			#ex_nav.fixed{
				display: none;
			}

			#ex_nav ul{
				width: 100%;
			}

			#header_center{
				float: none;
				padding: 32px 0 0;
			    width: 100%;
			}

			#header #header_top_right{
				display: none;
			}

			ul#main_nav li a:before{
				display: none;
			}

			ul#main_nav li:nth-child(1) a span{
				display: none;
			}

			ul#main_nav li a:hover:before{
				display: none;
			}

			/* 現在地 追加*/
			ul#main_nav li.current a:before{
				display: none;
			}




			/* 開閉ナビ　ここから */
			#open_navs{
				display: none;
				position: absolute;
/*
				top: 24px;
				right: 2%;
*/
				top: 10px;
				right: 8px;
				width: 40px;
				height: 40px;
				margin: 0 !important;
				padding: 0 !important;
				z-index: 40;
				line-height: 1.4!important;
				font-size: 1.6em !important;
				background: none;
				color: #fff;
				width:50px\9;
				height:50px\9;
				padding: 0px\9;
			}

			#open_navs a{
				display: block;
				width: 40px;
				height: 40px;
				width: 50px\9;
				height: 50px\9;
				z-index: 41;
			}

			#open_navs a span{
				display: block;
				color: #fff;
				font-size: 10px;
				text-align: center;
			}

			#open_navs a:before{/* バーガーボタン */
				display: block;
				content: "";
				width: 24px;
				height: 28px;
				margin: 8px auto 0;
				background: -moz-linear-gradient   (top, #fff, #fff 50%, #8e2c2b 50%, #8e2c2b);
				background: -webkit-linear-gradient(top, #fff, #fff 50%, #8e2c2b 50%, #8e2c2b);
				background: linear-gradient        (top, #fff, #fff 50%, #8e2c2b 50%, #8e2c2b);
				background: -ms-linear-gradient(top, #fff, #fff 50%, #8e2c2b 50%, #8e2c2b);
				background-size: 20px 10px;
			}

			#open_navs.close_icon a:before{
				display: none;
			}

			#open_navs.close_icon a span{
				display: none;
			}

			#open_navs a:hover{
				text-decoration: none;
			}

			#header h2#open_navs {
				margin: 0;
			}
/*
			#navs{
				position: absolute;
				top: 0;
				right: 0;
				width: 100%;
				height: 100%;
				padding: 0;
				z-index: 100;
				background: none;
				display: none;
			}

			#navs_wrap{
				position: absolute;
				top: 0;
				right: -294px;
				width: 294px;
				height: 100%;
				padding: 64px 4%;
				z-index: 101;
				background: rgba(0, 0, 0, 0.8);
				overflow-y: scroll;
				transition-property: all;
				transition-duration: 1300ms;
				transition-delay: 1s;
				transition-timing-function: ease;
			}

			#navs.opened_menu{
				display: block;
			}

			#navs.opened_menu #navs_wrap{
				right: 0;
			}
*/
			body{
				position: relative;
				left: 0;
				overflow-x: hidden;
			}

			body.open{
/*
				left: -294px;
				transition-property: all;
				transition-duration: 200ms;
				transition-delay: 0s;
				transition-timing-function: ease;
*/
			}

			#navs{
				/*position: absolute;*/
				display: none;
				position: absolute;
				top: 0;
	    		right: -294px;
				width: 294px;
				height: 100%;
				padding: 64px 16px;
				z-index: 101;
				background: none;
				background: rgba(0, 0, 0, 0.8);
				transition-property: all;
				transition-duration: 200ms;
				transition-delay: 0s;
				transition-timing-function: ease;
				overflow-y: auto;
			}

			#navs.opened_menu{
/*
				right: 0;
				/*right: -294px;*/
				transition-property: all;
				transition-duration: 200ms;
				transition-delay: 0s;
				transition-timing-function: ease;
*/
			}

			#close_background{
				display: none;
				position: absolute;
				top: 0;
				width: 100%;
				height: 100%;
				background: rgba(0, 0, 0, 0.2);
				z-index: 100;
			}



			#navs_wrap > *:first-child{
				padding-top: 0px;
			}

			#header .opened_menu{
				transition: all 500ms;
				padding-bottom: 0;
				max-width: 5000px;
				z-index: 101;
			}

			#navs_wrapper.close_disp{
				display: block;
				width: 100%;
				background-color: #000;
				background: rgba(0 , 0 , 0 , 0.7);
				z-index: 50;
			}

			#navs_wrapper{
				/*display: none;*/
			}

			#header #language_select{
				display: none;
			}

			#header #header_right{
				display: none;
			}

			ul#main_ex_nav{
				display: none;
			}



			#open_navs.open_disp{
				display: block !important;
			}

			#open_navs.close_disp{
				display: none !important;
			}

			#navs_wrapper.close_disp #navs_wrapper_a span{
				display: none;
			    position: relative;
			    top: 28px;
			    text-align: center;
			    font-size: 10px;
			    color: #fff;
			    text-decoration: none;
			}

			ul#main_nav{
				margin: 7em 1% 1em;
				float: none;
				background: url(../common/background01.jpg) repeat;
			}

			ul#fcontents_nav{
				display: block;
			}

			ul#main_nav,
			ul#sub_nav,
			ul#fcontents_nav,
			#navs ul{
				display: block;
				text-align: center;
				position: static;
				width: 100%;
				margin: 0;

			}

			.header_side_menu{
				padding-top: 0em;
			}

			.header_side_menu{
				display: block;
				box-shadow: 0px 2px 0px #000;
			}

			#navs .header_side_menu ul{
				margin:0;
			}

			ul#main_nav li,
			ul#sub_nav li,
			ul#fcontents_nav li,
			#navs ul li {
				display: block;
				padding: 0;
				width: 100%;
				position: static;
				border-top: 1px solid #000;
				text-align: left;
				overflow: hidden;
			}

			ul#main_nav li:first-child{
				border-top: none;
			}

			ul#main_nav li a,
			ul#sub_nav li a,
			ul#fcontents_nav li a,
			#header_side_menu ul li a,
			#navs ul li a {
				width: 100%;
				display: block;
				line-height: 1.6;
				padding: 16px 4%;
				margin: 0;
				font-size: 88%;
				background: url(../common/background01.jpg) repeat;
				color:#fff !important;
				position: static;
				font-weight:bold !important;
				box-sizing: border-box;
				font-family: "メイリオ", Meiryo, "游ゴシック", YuGothic, "ヒラギノ角ゴ ProN W3", "Hiragino Kaku Gothic ProN", sans-serif;
			}

			ul#main_nav li a:hover,
			ul#sub_nav li a:hover,
			ul#fcontents_nav li a:hover,
			#header_side_menu ul li a:hover,
			#navs ul li a:hover {
				text-decoration: none;
			}

			ul#main_nav li a .en{
				display: none;
			}

			ul#main_nav li a{
				border-right: none;
			    position: relative;
			}

			ul#main_nav li a[target="_blank"]:after{
				display: none;
			}

			ul#main_nav li a:after{
			    position: absolute;
			    border-right: 2px solid #fff;
			    border-top: 2px solid #fff;
			    content: "";
			    width: 6px;
			    height: 6px;
			    right: 12px;
			    top: 50%;
			    margin-top: -4px;
			    transform: rotate(45deg);
			    -webkit-transform: rotate(45deg);
			}

			ul#main_nav li:nth-child(2) a.acbtn:after,
			ul#main_nav li:nth-child(3) a.acbtn:after,
			ul#main_nav li:nth-child(5) a.acbtn:after{
				content: "";
				display: block;
			    background: url(../common/menu_sp_close.png) no-repeat center right;
				width: 16px;
				height: 16px;
				background-size: cover;
			    border-right: none;
			    border-top: none;
			    right: 8px;
			    top: 35%;
			    margin-top: 0;
			    transform: rotate(0deg);
			    -webkit-transform: rotate(0deg);

			}

			ul#main_nav li:nth-child(2) a.acbtn.open:after,
			ul#main_nav li:nth-child(3) a.acbtn.open:after,
			ul#main_nav li:nth-child(5) a.acbtn.open:after{
				content: "";
				display: block;
			    background: url(../common/menu_sp_open.png) no-repeat center right;
				width: 16px;
				height: 16px;
				background-size: cover;
			    border-right: none;
			    border-top: none;
			    right: 8px;
			    top: 35%;
			    margin-top: 0;
			    transform: rotate(0deg);
			    -webkit-transform: rotate(0deg);
			}



			ul#main_nav li:nth-child(5) a:after{
			    display: none;
			}

			ul#main_nav li:first-child a{
				border-left: none;
			}

			ul#main_nav li:nth-child(1) a:before{
				display: none;
			}

			ul#main_nav li.current a,
			ul#sub_nav li.current a,
			ul#fcontents_nav li.current a,
			#navs ul li.current a {
				/*background-color: #002c5c;*/
			}

			ul#main_nav li a:hover{

			}

			#navs h2 a{
				color: #fff;
				display: block;
			}

			#navs.fixed{
				top: 0 !important;
				position: absolute;
			}

			#navs h2 a:hover{
				text-decoration: none;
			}

			.header_side_menu ul{
				overflow: hidden;
			}

			.header_side_menu ul.current{
				max-height: 5000px;
			}

			.header_side_menu h2{
				display: block;
				width: 100%;
				padding: 8px 0;
				font-size: 88%;
				margin: 0;
				background-color: #444b59;
				border-top: 1px solid #59493f;
			}

			.header_side_menu h2 a{
				display: block;
				padding: 0 4%;
			}

			ul#sub_nav{
				padding-left: 0;
			    padding-right: 0;
				display: none;
			}

			ul#sub_nav li{
				float: none;
			    margin-left: 0;
			}

			ul#sub_nav li:before{
				display: none;
			}

			ul#sub_nav li a{
				background: #68930b !important;
				text-indent: 0;
				height: auto;
			}

			ul#sub_nav li a:before{
				display: none;
			}

			ul#sub_nav li a:after{
				display: none;

			}
			ul#sub_nav li:first-child{
				display: block;
			}







			ul#topicpath{
				width: 100%;
				display: none;
			}

			#content_wrapper{
				width: 100%;
				padding: 8px 4% 0;
				box-sizing:border-box;
			}









			/* サイド固定
			----------------------------------------------------------- */
			#fix_wrap.fixed {
				position: static !important;
				bottom: auto !important;
			}

			#fix_wrap.fixed.bottom_stop {
				position: static !important;
				bottom: auto !important;
			}

			#fix_wrap.fixed_top{
			    position: static !important;
			    bottom: auto !important;
			}

			#fix_wrap.fixed_top.bottom_stop {
				position: static !important;
				bottom: auto !important;
			}



			#bottom_buttons{
				bottom: 0;
				right: 0;
				z-index: 1100;
			}

			.opened_bottombuttons{
				right: 400px;
			}

			#open_navs_b {
				display: none;
				position: absolute;
				top: 16px;
				right: 12px;
				z-index: 11000;
			}

			#open_navs_b.opened_icon {
				display: none !important;
				background: none;
				border: none;
			}

			#open_navs_b.opened_icon a{
				width: 40px;
				height: 40px;
				background: none;
				position:relative;
			}


			#navs_wrapper_p a{
				position: absolute !important;
				top: 10px;
			    right: 8px;
			    text-decoration: none;
				display: none;
			}

			.close_disp #navs_wrapper_p a{
				display: block;
				z-index: 999999;
			}

			#navs_wrapper_a{
				position: absolute;
				display: block;
				height: auto !important;
				right: 4%;
				top: 24px;
				height: 40px !important;
				width: 40px !important;
				z-index: 999999 !important;
			}

			/* メニュー×ボタン */
			/*
			#open_navs.close_icon:before,
			#open_navs.close_icon:after,
			*/
			#navs_wrapper_a:before,
			#navs_wrapper_a:after{
				content: "";
				position: absolute;
				top: 50%;
				left: 0;
				width: 24px;
				height: 4px;
				background: #fff;
				margin-top: -2px;
				margin-left: 8px;
				z-index: 9999999;
			}

			/*#open_navs.close_icon:before,*/
			#navs_wrapper_a:before{
				transform: rotate(-45deg);
				-webkit-transform: rotate(-45deg);
			}

			/*#open_navs.close_icon:after,*/
			#navs_wrapper_a:after{
				transform: rotate(-135deg);
				-webkit-transform: rotate(-135deg);
			}

			/* 開閉ナビ　ここまで */








			/* 追加 */
			ul#main_nav ul.child_nav{
				position: static;
				z-index: 99999;
				left: 0;
				margin-top: 0;
				padding: 0 !important;
			}

			ul#main_nav ul.child_nav li a{
				border: none;
				border-top: 1px solid #000;
			    padding: 16px 4%;
				text-align: left;
				height: 54px;
			    background: url(../common/menu_child_back.jpg);
			}

			ul#main_nav ul.child_nav li:first-child a{
				border-left: none;
			}

			ul#main_nav ul.child_nav li a:before{
				float: left;
			    width: 20%;
				text-align: center;
				margin-right: 16px;
				position: relative;
				top: -2px;
			}

			.child_nav_list_wrapper{
				position: static;
				width: auto;
				height: auto;
				left: 0;
			}

			.current .child_nav_list_wrapper,
			.current .child_nav{
				display: block !important;
			}

			body.rosemembers #menu_sp_banner > li:nth-child(1) .child_nav_list_wrapper,
			body.rosemembers #menu_sp_banner > li:nth-child(1) .child_nav{
				display: block !important;
			}

			/* 孫ナビ追加 */
			ul#main_nav ul.child_nav ul.children li a{
				/*
			    background-color: #DDDBD0 !important;
			    color: #333;
				*/
			    text-decoration: none;
			    padding: 6px 8px 6px 75px;
			    height: auto;
			}

			ul#main_nav ul.child_nav ul.children li a:before{
				display: none;
			}

			/* 特定のメニュー消す */
			ul#main_nav li:nth-child(4),
			ul#main_nav li:nth-child(6),
			ul#main_nav li:nth-child(7){
				display: none;
			}

			#menu_sp_banner{
				margin-top: 12px !important;
			}
/*
			#menu_sp_banner li a{
				text-indent: -9999px;
			}
*/
			#menu_sp_banner > li > a{
				text-indent: -9999px;
			}

			#menu_sp_banner > li:nth-child(1) > a{
				background: url(../common/menu_sp_b1.jpg) no-repeat;
				background-size: cover;
			}

			#menu_sp_banner > li:nth-child(2) > a{
				background: url(../common/menu_sp_b2.jpg) no-repeat;
				background-size: cover;
			}

			#menu_sp_banner > li:nth-child(3) > a{
				background: url(../common/menu_sp_b3.jpg) no-repeat;
				background-size: cover;
			}


			#menu_sp_banner ul.child_nav{
				display: none;
			}

			ul#menu_sp_banner ul.child_nav li a{
				background: url(../common/menu_child_back.jpg);
			}


			ul#menu_sp_banner + h3{
				display: block;
			    color: #fff;
			    text-align: center;
				margin-top: 12px !important;
			    font-size: 88%;
			    font-weight: bold;
				border-bottom: none;
			}

			ul#menu_sp_other{
				margin-top: 4px !important;
			}

			ul#menu_sp_other li a{
			    position: relative;
			}

			ul#menu_sp_other li a:after{
			    position: absolute;
			    border-right: 2px solid #fff;
			    border-top: 2px solid #fff;
			    content: "";
			    width: 6px;
			    height: 6px;
			    right: 12px;
			    top: 50%;
			    margin-top: -4px;
			    transform: rotate(45deg);
			    -webkit-transform: rotate(45deg);
			}

			ul#menu_sp_other li.bunkakaikan a{
				background: url(../common/menu_sp_back_bunkakaikan.jpg) repeat;
			}

			ul#menu_sp_other li.gyotoku a{
				background: url(../common/menu_sp_back_gyotoku.jpg) repeat;
			}

			ul#menu_sp_other li.yoshizawa a{
				background: url(../common/menu_sp_back_yoshizawa.jpg) repeat;
			}

			ul#menu_sp_other li.kiuchi a{
				background: url(../common/menu_sp_back_kiuchi.jpg) repeat;
			}

			ul#menu_sp_other li.seikaen a{
				background: url(../common/menu_sp_back_seikaen.jpg) repeat;
			}

			ul#menu_sp_other li.kakumatsujaku a{
				background: url(../common/menu_sp_back_kakumatsujaku.jpg) repeat;
			}

			ul#menu_sp_other li.mizukitei a{
				background: url(../common/menu_sp_back_mizukitei.jpg) repeat;
			}

			ul#menu_sp_sub{
				margin-top: 12px !important;
				overflow: hidden;
			}

			ul#menu_sp_sub li{
				display: inline;
			}

			ul#menu_sp_sub li a{
				width: 33.333%;
			    float: left;
				border: 1px solid #fff;
				border-left: none;
				background: none;
			    font-size: 68%;
			    white-space: nowrap;
			    text-align: center;
			}

			ul#menu_sp_sub li:first-child a{
				margin-left: 0;
				border-left: 1px solid #fff;
			}

			#navs .google_search {
				display: block;
			    float: none;
			    width: 100%;
			    position: relative;
			    top: 16px;
			    left: 0px;
			}



			#main_image{
				display: none;
				margin-top: 0;
			}

			#main_image p:after{
				right: 4%;
			}



			/* 表示しないメニュー */
			ul#fcontents_nav,
			ul#sub_nav li:nth-child(2){
			}

			ul#footer_nav{
			    width: 100%;
			}

			ul#footer_nav:before{
				content: "";
				background: url(../common/ft_chara.png) no-repeat;
				width: 54px;
				height: 28px;
				background-size: cover;
				position: absolute;
				top: -2px;
				left: 0;
			}

			#footer_wrapper_top #footer_top {
			    width: 100%;
			    padding: 25px 4%;
			    overflow: hidden;
			    display: block;
			    box-sizing: border-box;
			}

			#footer_wrapper_top #footer_top #footer_top_left {
 				float: none;
			}

			#footer_wrapper_top #footer_top #footer_top_right {
 				float: none;
				clear: both;
			}

			ul#footer_nav li {
			    display: inline;
			    margin-left: 0;
			    margin-right: 1em;
			}

			#bottom_wrapper {
			    padding: 16px 8%;
			}

			#bottom_wrapper ul li a {
			    padding: 6px 6px 10px;
			    width: 112px;
			    margin: 0 2px;
			}

			#footer_wrapper p{
				padding-right: 4%;
				padding-left: 4%;
			}

			#footer_wrapper_bottom {
			    padding: 8px 4%;
			}

			#footer_wrapper_bottom #footer_bottom {
			    width: 100%;
			    margin: 0 auto;
			}

			#footer_wrapper_bottom #footer_bottom #footer_bottom_left {
			    float: none;
				text-align: center;
			}

			#footer ul#footer_nav {
			    width: 100%;
			    float: none;
			    margin: 0px auto;
			}

			#footer_wrapper_bottom #footer_bottom #footer_bottom_right {
			    float: none;
				text-align: center;
			}



}


/*=========================================================================================
for PC 768以下
=========================================================================================*/
@media only screen and (max-width: 768px){

		#main_column {
			float: none;
			width: 100%;
			padding: 0 0 16px;
		}

		#main_column > *{
			padding-left: 4%;
			padding-right: 4%;
		}

		#side_column{
			width: 100%;
			float: none;
			margin: 0 auto;
		}








		#side_column #menu{
			position: static;
		    /* top: 0; */
		    width: 100%;
		    /* left: 0; */
		}


		#side_column ul.children dd a,
		#side_column ul.children li a,
		#side_column ul li.children a{
			position: static;
			background: url(../common/menu_sp_back.jpg) repeat !important;
			color: #333;
			font-weight: bold;
		 	padding: 12px 16px 12px 44px;
			position: relative;
			z-index: 0;
		}

		#side_column ul.children dd a::before,
		#side_column ul.children li a::before,
		#side_column ul li.children a::before
		{
			top: 12px;
		}

		#side_column .menu ul.children li a{
		    padding: 8px 16px 8px 16px;
		    background: #fff !important;
		}

		#side_column .menu ul.children li a:after{
			display: none;
		}

		#side_column .menu dt,
		#side_column .menu h2{
			display: block;
		}

		#side_column .menu dd a:before,
		#side_column .menu li a:before{
			display: block;
		}

/*
		#side_column .menu dd a:after,
		#side_column .menu li a:after{
			content: "";
			display: block;
			background: url(../common/icon_menu_sp.jpg) no-repeat 0 0;
			width: 16px;
			height: 16px;
			background-size: cover;
		    position: absolute;
		    right: 16px;
			top: 32%;
		}
*/

}

/*=========================================================================================
for 1001 - 1200
=========================================================================================*/
@media screen and (min-width: 1001px) and (max-width: 1296px){

				#header h1,
				#header p#title{
					min-height: 0;
				}

				#header {
				    width: 100%;
					max-width: 100%;
					padding-right: 4%;
					padding-left: 4%;
					box-sizing: border-box;
				}




				ul#main_ex_nav{
					margin-right: 4%;
				}





				/* mainimage */
				.main_image{
					padding: 0 4%;
					max-width: 100%;
					box-sizing: border-box;
				}

				#content_wrapper {
				    position: relative;
				    width: 100%;
					max-width: 100%;
					padding: 0;
					padding-right: 4%;
					padding-left: 4%;
					box-sizing: border-box;
				}



				#bottom_banner_wrapper{
				    padding: 16px 4%;
					box-sizing: border-box;
				}



				#footer {
					padding: 0;
					box-sizing:border-box;
				}

				#footer_wrapper_top,
				#footer_wrapper_bottom{
				    padding-right: 4%;
				    padding-left: 4%;
				    width: 100%;
					box-sizing: border-box;
				}

				#footer .right,
				#footer .left{
				    float: none;
				}

				#footer_menu {
				    width: 100%;
				}


				#footer_wrapper_bottom #footer_bottom {
				    width: 100%;
					text-align: center;
				}

}

/*=========================================================================================
for 769 - 1000
=========================================================================================*/
@media screen and (min-width: 769px) and (max-width: 1000px){

			#header{
				padding: 0;
				width: 100%;
				box-sizing: border-box;
			}

			/* header */
			#header #site_lead{
			    width: 50%;
				padding: 0.8em 4%;
				display: none;
			}

			#header h1,
			#header p#title{
				min-height: 0;
				padding: 0 4% 24px;
			}

			#header h1 img,
			#header p#title img{
				vertical-align: middle;
				width: 228px;
			}


			#header #header_right{
				margin-right: 4%;
			}

			#header #header_top_right #h_sub_menu{
				display: none;
			}

			#header #header_top_right .google_search{
				right: 4%;
			}







			#header #header_top_right ul#h_sub_menu_btn{
				display: none;
			}

			#header #header_top_right .google_search{
				display: none;
			}








			ul#main_nav li a {
			    border-bottom: none;
			}

			ul#main_nav li a:hover, ul#main_nav li.current a{
			    border-bottom: none;
			}




			body.one_column #content_wrapper{
				width: 100%;
			}

			#main_image{
				height: 120px;
			}




			ul#sub_nav{
				padding-right: 0;
			}

			#side_banner_ex img {
			    float: none;
			    margin-right: 8px;
			    margin-bottom: 8px;
			}

			#bottom_banner_wrapper{
			    padding: 16px 4%;
				box-sizing: border-box;
			}


			#footer_wrapper_top,
			#footer_wrapper_bottom{
			    padding-right: 4%;
			    padding-left: 4%;
				width: 100%;
				box-sizing: border-box;
			}

			#footer_menu {
			    width: 100%;
			}

			#footer .right,
			#footer .left{
			    float: none;
			}

			#footer ul#footer_nav {
			}

			#footer ul#footer_nav li {
			    float: none;
			    margin-left: 0;
			    text-align: left;
			}

			#footer ul#footer_nav li a {
			    padding: 8px 0 0;
			}

			#footer ul#footer_nav li:first-child a {
			    padding: 0;
			}

			#footer_wrapper_bottom #footer_bottom {
			    width: 100%;
				text-align: center;
			}

			#footer_wrapper_bottom #footer_bottom #footer_bottom_right {
			    margin-top: 0;
			}

}

/*=========================================================================================
for 481 - 768
=========================================================================================*/
@media screen and (min-width: 481px) and (max-width: 768px){

		#header{
			padding: 0;
			width: 100%;
			box-sizing: border-box;
		}

		#header h1,
		#header p#title{
			min-height: 0;
			padding: 0 4% 24px;
		}

		#header h1 img,
		#header p#title img{
			vertical-align: middle;
			width: 228px;
		}

		#content_wrapper{
			padding-bottom: 0;
		}



		ul#main_nav li a {
		    border-bottom: none;
		}

		ul#main_nav li a:hover, ul#main_nav li.current a{
		    border-bottom: none;
		}


		#main_column table{
			width: 100% !important;
			box-sizing: border-box;
		}

		ul#sub_nav{
			padding-right: 0;
		}




		#side_column .menu h2 a{
			display: block;
			height: 100%;
			color: #fff;
			text-align: left;
		}

		#side_column .menu h2 span{
			display: none;
		}

		#side_column .menu ul{
			transition: all 500ms;
			overflow: hidden;
			display: block;
		}


		#side_column .menu ul.opened_menu{
			transition: all 500ms;
			max-height: 500px;

		}


		#side_column .menu ul a{
			float: none;
			margin:0 auto 0;
		}

		ul#side_banner,
		ul#bottom_banner{
			margin: 0;
			width: 100%;
		}






		#header #site_lead{
			display: none;
		}

		#header #header_top_right .google_search{
			display: none;
		}


		#open_navs{
/*
			top: 24px;
			right: 4%;
*/
			top: 10px;
			right: 16px;
		}





		#navs_wrapper_p a{
			position: absolute !important;
			top: 10px;
			right: 16px;
		}




		#internal_link, .paragraph{
			margin-left: 0px;
			margin-right: 0px;
		}


		#go_to_top a{
			position: static;
			bottom: 12px;
			right: 12px;
			z-index: 10;
		}


		.header_side_menu ul.open_menu{
			max-height: 50000px;
		}

		#footer_nav_wrapper li:first-child{
			border-left:none;
		}

		#footer #footer_copyright{
			padding: 8px 4%;
		}

		#footer #footer_lead{
			padding: 8px 4% 0;
		}

		#footer_wrapper_bottom #footer_bottom #footer_bottom_right {
		    margin-top: 0;
		}



		#main_image p{
			font-size: 200%;
		}

		ul#side_banner li{
			display: inline-block;
			margin: 1em 0 0px 2%;
			padding: 0;
			width: 31%;
		}

		#bottom_banner_wrapper{
			padding: 1em 4% 0;
			overflow: hidden;
			box-sizing: border-box;
		}

		ul#bottom_banner li{
			float: left;
			margin: 0 0 16px 2%;
			padding: 0;
			width: 32%;
		}

		ul#bottom_banner li:nth-child(3n+1){
			margin: 0 0 16px 0;
		}

		ul#side_banner {
		    display: block;
		    margin: 0 auto;
		}

		ul#side_banner li{
			width: 200px !important;
		}

		ul#side_banner li:nth-child(odd){
			margin-left: 0 !important;
		}

		ul#side_banner li:nth-child(even){
			margin-left: 16px !important;
		}

		#side_column .menu .parent a:hover{
			background-color: #fff !important;
		}

		#side_column ul.children dd a:before,
		#side_column ul.children li a:before{
			display: none;
		}



		.go_to_top{
			bottom: 2%;
			right: 2%;
			width: 56px;
		}

		.go_to_top a{
			width: auto;
		}

		.go_to_top a img{
			width: 100%;
		}

		#footer_wrapper #footer_top{
			width: 100%;
		}


		div#footer_menu{
			width: 100%;
		    margin: 0px auto 8px;
		    padding-bottom: 0;
		}

		div#footer_menu .menu:nth-child(odd) {
		    float: left;
		    width: 48%;
		    margin-left: 0;
		}

		div#footer_menu .menu:nth-child(even) {
		    float: right;
		    width: 48%;
		    margin-left: 8px;
		}

		div#footer_menu .menu h2:first-child,
		div#footer_menu .menu h3:first-child{
			margin-top: 16px;
		}

		#footer_wrapper_top {
		    padding: 8px 4%;
		}

		#footer ul#footer_nav {
		    width: 100%;
		    float: none;
		    margin: 0px auto;
		}

		#footer ul#footer_nav li {
		    float: none;
		    margin-left: 0;
		    text-align: center;
		}

		#footer ul#footer_nav li a {
		    padding: 8px 0 0;
		}

		#footer ul#footer_nav li:first-child a {
		    padding: 0;
		}


		#footer_wrapper_bottom #footer_bottom {
		    width: 100%;
			text-align: center;
		}

		#footer .right,
		#footer .left{
		    float: none;
		}

		ul#footer_nav li {
		    white-space: nowrap;
		}

}



@media only screen and (min-width: 1001px){
	#navs_wrapper_a span{
		display: none !important;
	}
}

/*=========================================================================================
for Smart Phone 480以下
=========================================================================================*/
@media only screen and (max-width: 480px){

	#header_wrapper{
		padding: 0;
	}

	#site_lead{
		display: none;
	}

	#header{
		padding: 0;
		width: 100%;
		box-sizing: border-box;
	}

	#header #site_lead{
	    padding: 0 4%;
		width: 56%;
	}

	#header h1,
	#header p#title{
		padding: 0 4% 24px;
		width: 100%;
	}

	#header h1 img#logo_sub,
	#header p#title img#logo_sub{
		margin-top: 4px;
		margin-left: 0;
	}

	#header h1 img,
	#header p#title img{
		vertical-align: middle;
		width: 168px;
	}



	#header #header_top_right{
		display: none;
	}

	#header #header_right{
		display: none;
	}


	#open_navs{
		top: 8px;
	}

	#navs_wrapper_p a{
		top: 8px;
	}

	#open_navs_b {
		top: 0px;
	}

	ul#main_ex_nav{
		display: none;
	}

	ul#main_nav li a {
	    border-bottom: none;
	}

	ul#main_nav li a:hover, ul#main_nav li.current a{
	    border-bottom: none;
	}

	body.one_column #content_wrapper{
		width: 100%;
	}



	#main_image p{
		font-size: 200%;
	}

	#main_column h1 + * {
	    margin-top: 24px;
	}

	#main_column h1{
		padding: 24px 4% 0;
		font-size: 144%;
	}

	#main_column h2{
	    padding: 16px 4%;
	    border-top: 24px solid #f5f2e9;
	    margin: 24px 0px;
	}

	ul#side_banner,
	ul#bottom_banner {
	    margin: 0 auto;
	    width: 80%;
	}

	ul#side_banner li,
	ul#bottom_banner li{
		line-height: 1;
		margin: 8px 0 0;
		padding: 0;
		width: 48%;
	}

	ul#side_banner li:first-child,
	ul#bottom_banner li:first-child{
		margin: 0;
	}

/*
	#side_column .menu dd a:before,
	#side_column .menu li a:before{
		top: 1.6em;
		left: 12px;
	}
*/

	#page_nav .end{
		display: none;
	}

	.go_to_top{
		bottom: 2%;
		right: 2%;
		width: 40px;
	}

	.go_to_top a{
		width: auto;
	}

	.go_to_top a img{
		width: 100%;
	}

	ul#side_banner li,
	ul#side_banner li:first-child{
		text-align: center;
		width: 100%;
	}

	ul#bottom_banner{
		max-width: 232px !important;
	}

	ul#bottom_banner li{
		text-align: center;
		width: 100%;
		margin-top: 8px !important;
	}

	ul#bottom_banner li:first-child{
		margin-top: 0 !important;
	}




	#side_column .menu .parent a:hover{
		background-color: #fff !important;
	}

	#side_column ul.children dd a:before,
	#side_column ul.children li a:before{
		display: none;
	}

	#side_banner_ex img {
	    float: none;
	    display: block;
	    margin-right: 0;
		max-width: 100% !important;
	}

	#side_banner_ex .title {
	    display: block;
	    margin-top: 8px;
	    clear: both;
	}


	#footer_wrapper_top {
	    padding: 8px 4%;
		text-align: left;
	}

	#footer_wrapper_top #footer_top {
	    width: 100%;
	    padding: 25px 4%;
	    text-align: center;
		box-sizing: border-box;
	}

	#footer_wrapper_top #footer_top #footer_top_left{
		float: none;
	}

	#footer_wrapper_top #footer_top #logo_footer {
	    float: none;
	    margin-right: 0;
	}

	ul#footer_tel {
	    float: none;
		position: static;
		margin-top: 14px;
		line-height: 1.6;
	}

	#footer_wrapper_bottom #footer_bottom #footer_bottom_right {
	    margin-top: 0;
	}

	#footer_wrapper_top #footer_top #footer_top_right {
	    float: none;
	}

	ul#footer_nav{
		position: relative;
		text-indent: 5em;
		line-height: 2;
	}

	ul#footer_nav li{
		display: inline;
		margin-right: 0;
	}

	#footer ul#footer_nav li:before{
		display: none;
	}

	ul#footer_nav li a{
		text-decoration: underline;
	}

	ul#footer_nav li a:hover{
		text-decoration: none;
	}

	div#footer_menu{
		width: 100%;
	    margin: 0px auto 8px;
	    padding-bottom: 0;
	}

	div#footer_menu .menu {
	    float: none;
	    width: 100%;
	    margin-left: 0;
	}

	div#footer_menu .menu h2:first-child,
	div#footer_menu .menu h3:first-child{
		margin-top: 16px;
	}

	ul#footer_nav:before{
		content: "";
		background: url(../common/ft_chara.png) no-repeat;
		width: 54px;
		height: 28px;
		background-size: cover;
		position: absolute;
		top: -2px;
		left: 0;
	}

	ul#footer_nav li {
	    white-space: nowrap;
	}

	#footer ul#footer_nav {
	    width: 100%;
	    float: none;
	    margin: 0px auto 4px;
	}

	#footer ul#footer_nav li {
	    float: none;
	    margin-left: 0;
	    text-align: center;
	}

	#footer ul#footer_nav li a {
	    padding: 8px 0 0;
	}

	#footer ul#footer_nav li:first-child a {
	    padding: 0;
	}

	#footer_wrapper_middle {
	    padding: 16px 4%;
	}

	#footer_wrapper_bottom {
	    padding: 8px 4%;
	}

	#footer_wrapper_bottom #footer_bottom {
	    width: 100%;
	    font-size: 84%;
	}

	#footer_wrapper_bottom #footer_bottom #footer_bottom_left{
	    text-align: left;
	}

	#footer_wrapper_bottom #footer_bottom #footer_bottom_left dt {
	    margin-bottom: 8px;
	    font-weight: bold;
	}

	#footer_wrapper_bottom #footer_bottom #footer_bottom_left dd .address1{
		display: block;
	}

	#footer_wrapper_bottom #footer_bottom #footer_bottom_right {
	    float: none;
	}

	#footer .right,
	#footer .left{
	    float: none;
	}

	#page_lead{
		margin-top: 0px;
	}

	#page h2 {
	    font-size: 1.1em;
	}

  #page h3 {
    font-size: 1.1em;
    padding: 4px 0px;
    margin-left: 0;
    margin-right: 0;
  }


}