/* =========================================
 *  0. 共通
 * ========================================= */

#bg { margin: 0; padding: 0 }

.under_line { border-bottom: 1px #ccc dotted; padding-bottom: 20px; }
.under_sline { border-bottom: 1px #ccc solid; padding-bottom: 30px; }
.head_line { border-top: 1px #ccc solid; padding-top: 20px; }


.clearfix:after {
	content: ".";
	display: block;
	height: 0;
	font-size:0;
	clear: both;
	visibility: hidden;
}

.clearfix { display: inline-table; }

/* Hides from IE-mac \*/
* html .clearfix { height: 1%; }
.clearfix { display: block; }
/* End hide from IE-mac */

img { margin:0; padding:0;}


/* =========================================
 *  1. レイアウト
 * ========================================= */

#container { margin: auto; width: 982px; }
#main { float: right; width: 716px; }
#main_c { float: right; width: 716px; padding-top : 20px; }
#side { float: left; width: 241px; }
#side_in { width: 241px; background: url(../../img_common/s_bg.gif) repeat-y; }

#main_out { margin: 0 20px; }
.w716 { width: 716px; }
.w696 { width: 696px; }
.w676 { width: 676px; }
.w667 { width: 667px; }
.w647 { width: 647px; }
.w627 { width: 627px; }

@media only screen and (max-width: 767px) {
	* {
		box-sizing: border-box;
	}
	#container {
		width: 100%;
		padding: 0 10px;
	}
	#main,
	#main_c,
	#side,
	#side_in {
		float: none;
		width: 100%;
	}

	.w716,
	.w696,
	.w676,
	.w667,
	.w647,
	.w627 { width: 100%; }
	.imgSPWidth100 {
		width: 100%;
		height: auto;
	}
	.wrapSPScroll {
		overflow-x: scroll;
	}
	.wrapSPScroll {
		overflow-x: scroll;
	}
}
/* =========================================
 *  2. HEADER
 * ========================================= */

#header_oo {
	background : url(../../img_common/bg.png) repeat-x;
}
#header_o {
	width:982px; margin:0 auto;
}
#header h1 {
	width: 982px; height: 27px;
	margin: 0px 0 0 10px;
	padding-top : 6px;
	padding-bottom : 0;
	font-size: 12px;
}
#header { height : 97px; }
#header img.logo { float: left; margin-left : 10px; }
#en { margin:24px 0 0 14px; }

#header_r {
	float: right;
	width: 400px;
	text-align: right;
	margin-top : 30px;
}
#header_r img { margin-top: 12px; }
#header_r2 {
	float: right; width: 400px;
	text-align: right;
	margin-top: -20px;
}
#header_r2 img { margin-top: 0; }
#g_menu { float: right; width: 300px; }
#g_menu img { margin: 0 0 0 1px; padding: 0;}


@media only screen and (max-width: 767px) {
	#header_oo {
		background: none;
	}
	#header_o,
	#header,
	#header h1 {
		width: auto;
		height: auto;
	}
	#header h1 {
		padding: 0 10px;
		margin: 0 0 10px;
	}
	#header img.logo {
		float: none;
		width: 60%;
		height: auto;
		vertical-align: bottom;
	}
	#en {
		margin: 0 0 0 14px;
	}
	#header_r2 {
		float: none;
		width: 100%;
		text-align: center;
		margin: 10px 0;
	}
}

/* =========================================
 *  4. GROBAL MENU
 * ========================================= */

#gmenu,
#gmenu_sub { clear : both; width : 100%; margin:0;padding:0; }
#gmenu ul,
#gmenu_sub ul { margin:0 0 0 -30px;padding:0; }
#gmenu li,
#gmenu_sub li { float : left;list-style-type: none;margin:0;padding:0; height: 44px;}
li#gmenu_c { float:right; margin-top : 9px; }
li#trans { float:right; margin-top:3px; }

@media only screen and (max-width: 767px) {
	#gmenu ul {
		display: flex;
		justify-content: space-between;
		align-items: flex-start;
		flex-wrap: wrap;
		margin: 0;
	}
	#gmenu li {
		float: none;
		width: 49%;
		margin: 0 0 10px 0;
	}
	#gmenu li a img {
		width: 100%;
		height: auto;
	}
	#gmenu_sub ul {
		margin: 0;
	}
}


/* =========================================
 *  3. SIDE
 * ========================================= */

#side {
	background:url(../../../img_common/s_bg.png) repeat-y;
}

#s_contact {
	width: 241px; height: 219px;
	background: url(../../img_common/s_contact.png) no-repeat;
}
#s_contact img { margin: 166px 0 0 26px; }


#s_submenu {
	background: url(../../img_common/bg_submenu.png); repeat-y;
	margin: 10px 0 0 0;
}
#s_submenu ul { padding: 10px 0; }
#s_submenu li {
	background: url(../../img_common/mark_sub.png) no-repeat 0 1px;
	padding-left: 40px;
	margin-top: 2px;
	font-size: 12px;
}
#s_space { width: 247px; margin-bottom: 100px; }

#s_banner { margin: 50px 0 0 8px; }
#s_banner img { margin-top: 8px; }
#s_banner p {
	font-size: 12px;
	margin: 2px 0 0 4px;
}
#s_banner a:link,
#s_banner a:visited { color: #444; text-decoration: underline; }
#s_banner a:hover,
#s_banner a:active { color: #910000; text-decoration: none; }

#s_sche {
	background:url(../../img_common/s_sche_bg2.jpg) no-repeat;
	width:241px;
	height:236px;
	margin-top:20px;
}

#s_sche_btn1 { padding-top:96px; margin:0px 0 0 23px; }
#s_sche_btn2 { margin:7px 0 0 23px; }


/* =========================================
 *  4. FOOTER
 * ========================================= */

#footer {
	margin: 50px auto 4px auto;
	width: 974px;
	clear:both;
}

#footer_l { float: left; padding: 14px 18px; }
#footer_l p { font-size: 12px; margin: 8px 0 0 2px; }
#footer_r { float: right; padding: 40px 0px 0; text-align: right; font-size: 12px; width : 600px; }
#footer_r a { color: #006699; }

p.footer_copy {
	margin: auto; width: 974px; text-align: right; font-size: 12px; }

img.s_end { margin: 0; padding:0; }
.left { float: left; }
#no_ad { margin-top:90px; }

#s_end { margin-top:100px; }

@media only screen and (max-width: 767px) {
	#footer,
	p.footer_copy {
		width: 100%;
	}
	#footer_l,
	#footer_r {
		float: none;
		width: 100%;
	}
}

/* =========================================
 *  5. Pun
 * ========================================= */

#pun {
	font-size: 11px; text-align: right;
	background: url(../../img_common/bg.gif) ;
	width: 716px; height: 26px;
	border-bottom: 1px #ccc solid; }

#pun p { padding: 4px 8px 0 4px; }
#pun img { margin: 5px 4px 0 0; }

#pun_s {
	font-size: 11px; text-align: right;
	background: url(../../img_common/bg.gif) ;
	width: 974px; height: 26px;
	border-bottom: 1px #ccc solid; }

#pun_s p { padding: 4px 8px 0 4px; }
#pun_s img { margin: 5px 4px 0 0; }



@media only screen and (max-width: 767px) {
	#pun {
		width: 100%;
		height: auto;
	}
}



.mg_t30 { margin-top:30px; }